Skip to content

P
pianoApp
Commit b7d7b291 authored by norhalimah's avatar norhalimah
Browse files
Options

updating

parent b5a7e7dd
Hide whitespace changes
Inline Side-by-side
Showing with 17 additions and 83 deletions
screens/listening.js
View file @ b7d7b291
...@@ -205,6 +205,7 @@ class Listen extends React.Component { ...@@ -205,6 +205,7 @@ class Listen extends React.Component {
if (success) { if (success) {
// console.log('successfully finished playing'); // console.log('successfully finished playing');
this.setState({showMusic: false}); this.setState({showMusic: false});
playSound.release();
} else { } else {
// console.log('playback failed due to audio decoding errors'); // console.log('playback failed due to audio decoding errors');
playSound.release(); playSound.release();
......
screens/metronome.js
View file @ b7d7b291
...@@ -175,48 +175,31 @@ class MetronomeSkill extends React.Component { ...@@ -175,48 +175,31 @@ class MetronomeSkill extends React.Component {
color:'#DB3236', color:'#DB3236',
tempoBar: barTempo, tempoBar: barTempo,
}; };
} }
/*toggleKeyword = (keyword) => {
// console.log(keyword);
};
onSubmit = () => {
console.log('Submit');
}; */
homeExit = async () => { homeExit = async () => {
this.props.navigation.navigate('1'); this.props.navigation.navigate('1');
}; };
backAction = () => { backAction = () => {
//this.setState({showDone: false, showQuit: false}); this.props.navigation.navigate('1');
this.props.navigation.navigate('1'); Orientation.lockToPortrait();
Orientation.lockToPortrait();
}; };
componentDidMount() { componentDidMount() {
//this.animate(); this.removeArray();
this.removeArray(); BackHandler.addEventListener('hardwareBackPress', this.homeExit);
BackHandler.addEventListener('hardwareBackPress', this.homeExit);
Orientation.lockToPortrait(); Orientation.lockToPortrait();
// this.displayData();
} }
componentWillUnmount() { componentWillUnmount() {
// this.removeArray();
BackHandler.removeEventListener('hardwareBackPress', this.homeExit); BackHandler.removeEventListener('hardwareBackPress', this.homeExit);
//clearInterval(this.interval);
// Orientation.lockToLandscape();
} }
';'; ';';
//reset //reset
removeArray = () => { removeArray = () => {
let index = -1; let index = -1;
// console.log(barTempo.length);
// console.log(this.state.beat);
if (this.state.tempoBar.length < 4) { if (this.state.tempoBar.length < 4) {
for (var j = this.state.tempoBar.length; j < 4; j++) { for (var j = this.state.tempoBar.length; j < 4; j++) {
this.state.tempoBar.push({name :this.state.tempoBar.length + 1, active:true, color: '#4885ED', play:sound1}); this.state.tempoBar.push({name :this.state.tempoBar.length + 1, active:true, color: '#4885ED', play:sound1});
...@@ -240,8 +223,6 @@ class MetronomeSkill extends React.Component { ...@@ -240,8 +223,6 @@ class MetronomeSkill extends React.Component {
//beat //beat
beatDown = async () => { beatDown = async () => {
// console.log(this.state.beat);
// var find = {name: this.state.beat};
let index = -1; let index = -1;
if (this.state.beat === 1) { if (this.state.beat === 1) {
this.setState({beat: 1}); this.setState({beat: 1});
...@@ -249,7 +230,6 @@ class MetronomeSkill extends React.Component { ...@@ -249,7 +230,6 @@ class MetronomeSkill extends React.Component {
this.state.tempoBar.splice(-index, 1); this.state.tempoBar.splice(-index, 1);
miniBar.splice(-index, 1); miniBar.splice(-index, 1);
} }
// find = {name: 1};
} }
else { else {
this.setState({beat: this.state.beat - 1}); this.setState({beat: this.state.beat - 1});
...@@ -259,8 +239,6 @@ class MetronomeSkill extends React.Component { ...@@ -259,8 +239,6 @@ class MetronomeSkill extends React.Component {
miniBar.splice(-index, 1); miniBar.splice(-index, 1);
} }
} }
// console.log(this.state.beat);
// console.log(barTempo);
}; };
beatUp = async () => { beatUp = async () => {
...@@ -271,7 +249,6 @@ class MetronomeSkill extends React.Component { ...@@ -271,7 +249,6 @@ class MetronomeSkill extends React.Component {
this.setState({beat: this.state.beat + 1}); this.setState({beat: this.state.beat + 1});
this.state.tempoBar.push({name :this.state.beat + 1,active:true, color: '#4885ED', play:sound1}); this.state.tempoBar.push({name :this.state.beat + 1,active:true, color: '#4885ED', play:sound1});
miniBar.push({image:this.state.image}); miniBar.push({image:this.state.image});
// console.log(barTempo);
} }
}; };
...@@ -478,14 +455,12 @@ class MetronomeSkill extends React.Component { ...@@ -478,14 +455,12 @@ class MetronomeSkill extends React.Component {
clearInterval(this.timer); clearInterval(this.timer);
this.setState({ this.setState({
playing: false, playing: false,
// num:0,
}); });
this.state.tempoBar.map((item,id) => { this.state.tempoBar.map((item,id) => {
item.active = true; item.active = true;
}); });
} else { } else {
this.animate(); this.animate();
// console.log('count stop:', this.state.count);
this.timer = setInterval( this.timer = setInterval(
this.playClick, this.playClick,
(60 / this.state.tempo) * 1000 (60 / this.state.tempo) * 1000
...@@ -494,7 +469,6 @@ class MetronomeSkill extends React.Component { ...@@ -494,7 +469,6 @@ class MetronomeSkill extends React.Component {
{ {
count: 0, count: 0,
playing: true, playing: true,
// num:0,
}, },
this.playClick this.playClick
); );
...@@ -502,46 +476,33 @@ class MetronomeSkill extends React.Component { ...@@ -502,46 +476,33 @@ class MetronomeSkill extends React.Component {
} }
playClick = async () => { playClick = async () => {
var num = 0; var pol = '';
// const { count} = this.state;
this.state.tempoBar.map((item,id) => { this.setState({
var pol = 'play'.concat(num); count: (this.state.count) % this.state.beat,
// console.log(pol.concat(num)); });
console.log(pol); this.state.tempoBar.map((item,id) => {
pol = new Sound(item.play, (error) => { if (id === this.state.count) {
item.active = false;
pol = new Sound(item.play, (error) => {
if (error) { if (error) {
console.log('failed to load the sound', error); console.log('failed to load the sound', error);
return; return;
} }
// console.log('duration in seconds: ' + play1.getDuration() + 'number of channels: ' + play1.getNumberOfChannels());
// loaded successfully // loaded successfully
pol.play((success) => { pol.play((success) => {
if (success) { if (success) {
console.log('successfully finished playing'); console.log('successfully finished playing');
pol.release();
} else { } else {
console.log('playback failed due to audio decoding errors'); console.log('playback failed due to audio decoding errors');
pol.release(); pol.release();
} }
}); });
}); });
pol.release();
num = num + 1;
});
this.setState({
count: (this.state.count) % this.state.beat,
});
// console.log('count before:', this.state.count);
this.state.tempoBar.map((item,id) => {
if (id === this.state.count) {
item.active = false;
// console.log('count:', this.state.count);
// console.log(id);
} }
else {item.active = true;} else {item.active = true;}
}); });
// this.setState({num : this.state.num + 1});
//console.log('count after:', this.state.count);
this.setState({ this.setState({
count: this.state.count + 1, count: this.state.count + 1,
}); });
...@@ -549,7 +510,6 @@ class MetronomeSkill extends React.Component { ...@@ -549,7 +510,6 @@ class MetronomeSkill extends React.Component {
keepTap = async () => { keepTap = async () => {
randomTempo = Math.floor(Math.random() * 400) + 10; randomTempo = Math.floor(Math.random() * 400) + 10;
//console.log(randomTempo);
this.setState({tempo:randomTempo}); this.setState({tempo:randomTempo});
if (this.state.tempo > 10 && this.state.tempo <= 19){ if (this.state.tempo > 10 && this.state.tempo <= 19){
this.setState({tempoName:'Larghissimo'}); this.setState({tempoName:'Larghissimo'});
...@@ -612,7 +572,6 @@ class MetronomeSkill extends React.Component { ...@@ -612,7 +572,6 @@ class MetronomeSkill extends React.Component {
//note //note
toneDown = () => { toneDown = () => {
// console.log('Down');
if (this.state.toneSound <= 0) { if (this.state.toneSound <= 0) {
this.setState({toneSound: 0, soundName: nosound}); this.setState({toneSound: 0, soundName: nosound});
this.state.tempoBar.map((item,id) => {item.play = nosound; item.color = '#BDBDBD';}); this.state.tempoBar.map((item,id) => {item.play = nosound; item.color = '#BDBDBD';});
...@@ -667,9 +626,6 @@ class MetronomeSkill extends React.Component { ...@@ -667,9 +626,6 @@ class MetronomeSkill extends React.Component {
let list = barTempo; let list = barTempo;
let index = list.indexOf(name); let index = list.indexOf(name);
// console.log(index);
// list[index] = {name :index + 1,active:true, play:sound1};
// console.log(list[index].play);
if (list[index].play === sound1) { if (list[index].play === sound1) {
list[index] = {name :index + 1,active:true, color: '#6188df', play:sound2}; list[index] = {name :index + 1,active:true, color: '#6188df', play:sound2};
console.log('sound2'); console.log('sound2');
...@@ -695,7 +651,6 @@ class MetronomeSkill extends React.Component { ...@@ -695,7 +651,6 @@ class MetronomeSkill extends React.Component {
console.log('sound1'); console.log('sound1');
} }
this.setState({tempoBar: list}); this.setState({tempoBar: list});
// console.log(this.state.tempoBar);
} }
animate () { animate () {
...@@ -722,8 +677,6 @@ getRotationAnimation = () => { ...@@ -722,8 +677,6 @@ getRotationAnimation = () => {
money = async() =>{ money = async() =>{
let index = -1; let index = -1;
// console.log('money');
//console.log(barTempo);
this.setState({tempo:126}); this.setState({tempo:126});
this.setState({tempoName:'Allegro'}); this.setState({tempoName:'Allegro'});
this.setState({note:4}); this.setState({note:4});
...@@ -734,10 +687,8 @@ getRotationAnimation = () => { ...@@ -734,10 +687,8 @@ getRotationAnimation = () => {
this.state.tempoBar.push({name :this.state.tempoBar.length + 1, active:true, color: '#4885ED',play:sound1}); this.state.tempoBar.push({name :this.state.tempoBar.length + 1, active:true, color: '#4885ED',play:sound1});
miniBar.push({image:this.state.image}); miniBar.push({image:this.state.image});
} }
// this.setState({beat: barTempo.length});
} }
if (this.state.tempoBar.length > 7){ if (this.state.tempoBar.length > 7){
//console.log(barTempo);
for (var j = this.state.tempoBar.length; j > 7; j--) { for (var j = this.state.tempoBar.length; j > 7; j--) {
if ((index = this.state.tempoBar.map(item => item.name).indexOf(j) !== -1)) { if ((index = this.state.tempoBar.map(item => item.name).indexOf(j) !== -1)) {
this.state.tempoBar.splice(-index, 1); this.state.tempoBar.splice(-index, 1);
...@@ -746,12 +697,9 @@ getRotationAnimation = () => { ...@@ -746,12 +697,9 @@ getRotationAnimation = () => {
} }
} }
this.setState({beat: 7}); this.setState({beat: 7});
// console.log(barTempo);
}; };
jude = async() =>{ jude = async() =>{
// console.log('hey jude');
// console.log(barTempo);
this.setState({tempo:74}); this.setState({tempo:74});
this.setState({tempoName:'Andante'}); this.setState({tempoName:'Andante'});
this.setState({note:4}); this.setState({note:4});
...@@ -763,10 +711,8 @@ getRotationAnimation = () => { ...@@ -763,10 +711,8 @@ getRotationAnimation = () => {
this.state.tempoBar.push({name :this.state.tempoBar.length + 1, active:true, color: '#4885ED',play:sound1}); this.state.tempoBar.push({name :this.state.tempoBar.length + 1, active:true, color: '#4885ED',play:sound1});
miniBar.push({image:this.state.image}); miniBar.push({image:this.state.image});
} }
//this.setState({beat: barTempo.length});
} }
if (this.state.tempoBar.length > 4){ if (this.state.tempoBar.length > 4){
// console.log(barTempo.length);
for (var j = this.state.tempoBar.length; j > 4; j--) { for (var j = this.state.tempoBar.length; j > 4; j--) {
if ((index = this.state.tempoBar.map(item => item.name).indexOf(j) !== -1)) { if ((index = this.state.tempoBar.map(item => item.name).indexOf(j) !== -1)) {
this.state.tempoBar.splice(-index, 1); this.state.tempoBar.splice(-index, 1);
...@@ -775,12 +721,9 @@ getRotationAnimation = () => { ...@@ -775,12 +721,9 @@ getRotationAnimation = () => {
} }
} }
this.setState({beat: 4}); this.setState({beat: 4});
// console.log(barTempo);
}; };
cajon = async () =>{ cajon = async () =>{
//console.log('cajon rhythm');
//console.log(barTempo);
this.setState({tempo:300}); this.setState({tempo:300});
this.setState({tempoName:'Prestissimo'}); this.setState({tempoName:'Prestissimo'});
this.setState({note:4}); this.setState({note:4});
...@@ -792,10 +735,8 @@ getRotationAnimation = () => { ...@@ -792,10 +735,8 @@ getRotationAnimation = () => {
this.state.tempoBar.push({name :this.state.tempoBar.length + 1, active :true,color: '#4885ED',play:sound1}); this.state.tempoBar.push({name :this.state.tempoBar.length + 1, active :true,color: '#4885ED',play:sound1});
miniBar.push({image:this.state.image}); miniBar.push({image:this.state.image});
} }
// this.setState({beat: barTempo.length});
} }
if (this.state.tempoBar.length > 8){ if (this.state.tempoBar.length > 8){
// console.log(barTempo.length);
for (var j = this.state.tempoBar.length; j > 8; j--) { for (var j = this.state.tempoBar.length; j > 8; j--) {
if ((index = this.state.tempoBar.map(item => item.name).indexOf(j) !== -1)) { if ((index = this.state.tempoBar.map(item => item.name).indexOf(j) !== -1)) {
this.state.tempoBar.splice(-index, 1); this.state.tempoBar.splice(-index, 1);
...@@ -804,12 +745,9 @@ getRotationAnimation = () => { ...@@ -804,12 +745,9 @@ getRotationAnimation = () => {
} }
} }
this.setState({beat: 8}); this.setState({beat: 8});
// console.log(barTempo);
}; };
setTempoText(textT){ setTempoText(textT){
// console.log(textT.toString());
// console.log(this.state.tempoText.length);
if (this.state.tempoText.length === 3) { if (this.state.tempoText.length === 3) {
console.log('Limit 3'); console.log('Limit 3');
} }
...@@ -821,12 +759,10 @@ getRotationAnimation = () => { ...@@ -821,12 +759,10 @@ getRotationAnimation = () => {
this.setState({tempoText: this.state.tempoText.toString().concat(textT.toString())}); this.setState({tempoText: this.state.tempoText.toString().concat(textT.toString())});
} }
} }
//console.log(this.state.tempo);
} }
setTempo(tempoT) { setTempo(tempoT) {
tempoT = parseInt(tempoT, 10); tempoT = parseInt(tempoT, 10);
// console.log(tempoT);
if (tempoT < 10) { if (tempoT < 10) {
this.setState({tempo:10, tempoText:10}); this.setState({tempo:10, tempoText:10});
this.setState({tempoName:'Larghissimo'}); this.setState({tempoName:'Larghissimo'});
...@@ -934,10 +870,6 @@ getRotationAnimation = () => { ...@@ -934,10 +870,6 @@ getRotationAnimation = () => {
render() { render() {
var imgSource = this.state.showImg ? playIcon : stopIcon; var imgSource = this.state.showImg ? playIcon : stopIcon;
/* const movingMargin = this.animatedValue.interpolate({
inputRange: [0, 0.5, 1],
outputRange: [0, 300, 1],
}); */
return ( return (
<View style={{flex: 1}}> <View style={{flex: 1}}>
......
screens/quiz.js
View file @ b7d7b291
...@@ -98,6 +98,7 @@ class Quiz extends React.Component { ...@@ -98,6 +98,7 @@ class Quiz extends React.Component {
sound.play((success) => { sound.play((success) => {
if (success) { if (success) {
// console.log('successfully finished playing'); // console.log('successfully finished playing');
sound.release();
} else { } else {
// console.log('playback failed due to audio decoding errors'); // console.log('playback failed due to audio decoding errors');
sound.release(); sound.release();
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment