Commit 04dfe0dd authored by Seaborn Lee's avatar Seaborn Lee

fix: 标题,句子,总音频交叉点击问题

parent 08138e40
import {Component, ElementRef, ViewChild, OnInit, Input, OnDestroy, HostListener} from '@angular/core'; import {Component, ElementRef, HostListener, OnDestroy, OnInit, ViewChild} from '@angular/core';
import {res, resAudio} from './resources'; import {res, resAudio} from './resources';
import {Subject} from 'rxjs'; import {Subject} from 'rxjs';
import {debounceTime, ignoreElements} from 'rxjs/operators'; import {debounceTime} from 'rxjs/operators';
import TWEEN from '@tweenjs/tween.js'; import TWEEN from '@tweenjs/tween.js';
import { import {getMinScale, Label, MySprite, ShapeRect,} from './Unit';
Label,
MySprite,
tweenChange,
MyAnimation,
randomSortByArr,
ShapeRect,
getMinScale,
showPopParticle,
moveItem,
removeItemFromArr,
rotateItem,
showStar,
showItem,
alphaItem,
endShow,
hideItem,
} from './Unit';
@Component({ @Component({
...@@ -82,7 +64,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -82,7 +64,7 @@ export class PlayComponent implements OnInit, OnDestroy {
juziBg: MySprite; juziBg: MySprite;
t1Bg: MySprite; t1Bg: MySprite;
Btn Btn
sBtn playButton
juzi_bg: ShapeRect; juzi_bg: ShapeRect;
guide_bg: ShapeRect; guide_bg: ShapeRect;
guide: MySprite; guide: MySprite;
...@@ -95,12 +77,10 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -95,12 +77,10 @@ export class PlayComponent implements OnInit, OnDestroy {
title1 title1
title2 title2
bgRect bgRect
tBtn pauseButton
bs isFullAudioPlaying = false;
countc = 0; lastClickedSentenceIndex
start = 0; isSentencePlaying = false;
x
firstjuzi = 0;
@HostListener('window:resize', ['$event']) @HostListener('window:resize', ['$event'])
onResize(event) { onResize(event) {
...@@ -908,7 +888,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -908,7 +888,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this.juziBg = new MySprite(); this.juziBg = new MySprite();
this.juziBg.init(this.images.get('juzi')); this.juziBg.init(this.images.get('juzi'));
// this.juziBg.x = this.canvasWidth / 2.8; // this.juziBg.lastClickedSentenceIndex = this.canvasWidth / 2.8;
// this.juziBg.y = this.canvasHeight / 2 ; // this.juziBg.y = this.canvasHeight / 2 ;
const jx = sx / 1.8; const jx = sx / 1.8;
...@@ -940,23 +920,19 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -940,23 +920,19 @@ export class PlayComponent implements OnInit, OnDestroy {
this.Btn = new MySprite(); this.Btn = new MySprite();
this.tBtn = new MySprite(); this.pauseButton = new MySprite();
this.sBtn = new MySprite(); this.playButton = new MySprite();
this.tBtn.init(this.images.get('stop')); this.pauseButton.init(this.images.get('stop'));
this.sBtn.init(this.images.get('start')); this.playButton.init(this.images.get('start'));
this.Btn.addChild(this.sBtn); this.Btn.addChild(this.playButton);
this.Btn.addChild(this.tBtn); this.Btn.addChild(this.pauseButton);
this.juziBg.addChild(this.Btn); this.juziBg.addChild(this.Btn);
this.sBtn.setScaleXY(this.mapScale); this.playButton.setScaleXY(this.mapScale);
this.tBtn.setScaleXY(this.mapScale); this.pauseButton.setScaleXY(this.mapScale);
this.Btn.x = 650; this.Btn.x = 650;
this.Btn.y = 240; this.Btn.y = 240;
// this.tBtn.x= this.sBtn.x; this.hide(this.pauseButton);
// this.tBtn.y=this.sBtn.y;
this.tBtn.alpha = 0;
this.bs = 1;
if (this.data.wordArr.length > 4) { if (this.data.wordArr.length > 4) {
//加滚动条 //加滚动条
...@@ -1003,136 +979,87 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1003,136 +979,87 @@ export class PlayComponent implements OnInit, OnDestroy {
return; return;
} }
if (this.checkClickTarget(this.sBtn) && this.bs == 1) {//播放键 if (this.checkClickTarget(this.playButton) && !this.isFullAudioPlaying) {//播放键
this.pauseSentenceAudio();
this.pauseTitleAudio();
this.sBtn.alpha = 0;
this.tBtn.alpha = 1;
this.bs = 0;
//播放所有音乐
const audio1 = this.audioObj[this.musicArr[0]];
audio1.pause();
audio1.currentTime = 0;
if (this.firstjuzi == 1) {
console.log("上一次点的" + this.x);
const audio1 = this.audioObj[this.musicArr[this.x]];
audio1.pause();
audio1.currentTime = 0;
}
console.log("pic-audio" + this.musicArr[1]);
this.playAudio(this.musicArr[1]);
this.start = 1;
this.hide(this.playButton);
this.show(this.pauseButton);
this.isFullAudioPlaying = true;
this.playAudio(this.musicArr[1], false, () => {
this.isFullAudioPlaying = false;
this.hide(this.pauseButton);
this.show(this.playButton);
});
return; return;
} }
if (this.checkClickTarget(this.bgRect)) {//标题音 if (this.checkClickTarget(this.bgRect)) {//标题音
this.pauseFullAudio();
if (this.start == 1) { this.pauseSentenceAudio();
//跳转暂停
this.sBtn.alpha = 1;
this.tBtn.alpha = 0;
this.start = 0;
const audio1 = this.audioObj[this.musicArr[1]];
audio1.pause();
audio1.currentTime = 0;
}
if (this.firstjuzi == 1) {
console.log("上一次点的" + this.x);
const audio1 = this.audioObj[this.musicArr[this.x]];
audio1.pause();
audio1.currentTime = 0;
}
this.playAudio(this.musicArr[0]); this.playAudio(this.musicArr[0]);
return; return;
} }
if (this.checkClickTarget(this.tBtn) && this.bs == 0) {//暂停键 if (this.checkClickTarget(this.pauseButton) && this.isFullAudioPlaying) {//暂停键
this.sBtn.alpha = 1;
this.tBtn.alpha = 0;
this.bs = 1;
/*
const audio = this.audioObj[this.musicArr[1]];
audio.pause();
audio.currentTime = 0;*/
this.pauseAudio(this.musicArr[1]); this.pauseAudio(this.musicArr[1]);
this.isFullAudioPlaying = false;
console.log("结束"); this.show(this.playButton);
this.hide(this.pauseButton);
return; return;
} }
for (let i = 0; i < this.data.wordArr.length; i++) {//句子音 for (let i = 0; i < this.data.wordArr.length; i++) {//句子音
if (this.checkClickTarget(this.word_bg_groups[i])) { if (this.checkClickTarget(this.word_bg_groups[i])) {
this.pauseFullAudio();
this.firstjuzi = 1; this.pauseTitleAudio();
this.pauseSentenceAudio();
this.countc++;
if (this.start == 1) { this.isSentencePlaying = true;
//跳转暂停 this.lastClickedSentenceIndex = i + 2;
this.sBtn.alpha = 1; this.playAudio(this.musicArr[this.lastClickedSentenceIndex], true, () => {
this.tBtn.alpha = 0; this.isSentencePlaying = false;
this.start = 0; });
const audio1 = this.audioObj[this.musicArr[1]]; return;
audio1.pause();
audio1.currentTime = 0;
} }
console.log("contc" + this.countc);
console.log("第一次"); }
const audio1 = this.audioObj[this.musicArr[0]];
audio1.pause();
audio1.currentTime = 0;
const audio2 = this.audioObj[this.musicArr[1]];
audio2.pause();
audio2.currentTime = 0;
/*
if(this.checkClickTarget(this.juzi_bg)){
//滚动区域
this.shapePosY = event.clientY;
}
*/
if (this.countc == 1) {
}
} else { private pauseSentenceAudio() {
console.log("this.x" + this.x); if (this.isSentencePlaying) {
const audio = this.audioObj[this.musicArr[this.x]]; const audio = this.audioObj[this.musicArr[this.lastClickedSentenceIndex]];
audio.pause(); audio.pause();
audio.currentTime = 0; audio.currentTime = 0;
} }
this.playAudio(this.musicArr[i + 2]);
this.x = i + 2;
console.log("能点击" + this.data.wordArr[i].audio_url);
this.canTouch = true;
return;
} }
private pauseFullAudio() {
if (this.isFullAudioPlaying) {
this.show(this.playButton);
this.hide(this.pauseButton);
this.isFullAudioPlaying = false;
const audio = this.audioObj[this.musicArr[1]];
audio.pause();
} }
/*
if(this.checkClickTarget(this.juzi_bg)){
//滚动区域
this.shapePosY = event.clientY;
} }
*/
private show(button) {
button.alpha = 1;
} }
//音乐暂停 //音乐暂停
pauseAudio(key, callback = null) { pauseAudio(key, callback = null) {
const audio = this.audioObj[key]; const audio = this.audioObj[key];
...@@ -1259,4 +1186,13 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1259,4 +1186,13 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
private hide(button: any) {
button.alpha = 0;
}
private pauseTitleAudio() {
const audio = this.audioObj[this.musicArr[0]];
audio.pause();
audio.currentTime = 0;
}
} }
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