1import { Asset } from 'expo-asset';
2import { Audio } from 'expo-av';
3import React from 'react';
4import { PixelRatio, ScrollView, StyleSheet } from 'react-native';
5
6import HeadingText from '../../components/HeadingText';
7import ListButton from '../../components/ListButton';
8import AudioModeSelector from './AudioModeSelector';
9import Player from './AudioPlayer';
10
11export default class AudioScreen extends React.Component {
12  static navigationOptions = {
13    title: 'Audio',
14  };
15
16  _setAudioActive = (active: boolean) => () => Audio.setIsEnabledAsync(active);
17
18  render() {
19    return (
20      <ScrollView contentContainerStyle={styles.contentContainer}>
21        <HeadingText>Audio state</HeadingText>
22        <ListButton title="Activate Audio" onPress={this._setAudioActive(true)} />
23        <ListButton title="Deactivate Audio" onPress={this._setAudioActive(false)} />
24        <HeadingText>Audio mode</HeadingText>
25        <AudioModeSelector />
26        <HeadingText>HTTP player</HeadingText>
27        <Player
28          source={{
29            uri:
30              // tslint:disable-next-line: max-line-length
31              'https://p.scdn.co/mp3-preview/f7a8ab9c5768009b65a30e9162555e8f21046f46?cid=162b7dc01f3a4a2ca32ed3cec83d1e02',
32          }}
33          style={styles.player}
34        />
35        <HeadingText>Local asset player</HeadingText>
36        <Player
37          source={Asset.fromModule(require('../../../assets/sounds/polonez.mp3'))}
38          style={styles.player}
39        />
40      </ScrollView>
41    );
42  }
43}
44
45const styles = StyleSheet.create({
46  contentContainer: {
47    padding: 10,
48  },
49  player: {
50    borderBottomWidth: 1.0 / PixelRatio.get(),
51    borderBottomColor: '#cccccc',
52  },
53});
54