Commit c1ea66b7 authored by 李维's avatar 李维

fix feedback

parent f25469e7
...@@ -499,6 +499,7 @@ export class HotZoneImageItem extends MySprite { ...@@ -499,6 +499,7 @@ export class HotZoneImageItem extends MySprite {
image_url: String; image_url: String;
labelBox: MySprite; labelBox: MySprite;
audio_url: String; audio_url: String;
card_audio_url: String
scale scale
text; text;
......
...@@ -21,15 +21,20 @@ ...@@ -21,15 +21,20 @@
<div style="float: left; width: 70%"> <div style="float: left; width: 70%">
<div nzAlign="middle"> <div nzAlign="middle">
<div class="img-box clearfix" *ngFor="let it of hotZoneArr; let i = index" style="border-bottom: 1px solid #DDD; padding-bottom: 10px;" > <div class="img-box clearfix" *ngFor="let it of hotZoneArr; let i = index" style="border-bottom: 1px solid #DDD; padding-bottom: 10px;" >
<div style="float: left; height: 115px; position: relative; width: 250px; "> <div style="float: left; height: 115px; position: relative; width: 250px; ">
<h3> 第-{{ i + 1 }}-题 </h3> <h3> 第-{{ i + 1 }}-题 </h3>
<div style="position: absolute; bottom: 0;"> <div style="position: absolute; bottom: 0;">
<app-audio-recorder [audioUrl]="it.audio_url ? it.audio_url : null" (audioUploaded)="onAudioUploadSuccess($event, it)" ></app-audio-recorder> <h5> 题目音频 </h5>
<app-audio-recorder [audioUrl]="it.audio_url ? it.audio_url : null" (audioUploaded)="onAudioUploadSuccess($event, it, false)" ></app-audio-recorder>
</div>
</div>
<div style="float: left; height: 115px; position: relative; width: 250px; ">
<div style="position: absolute; bottom: 0;">
<h5> 卡片音频 </h5>
<app-audio-recorder [audioUrl]="it.card_audio_url ? it.card_audio_url : null" (audioUploaded)="onAudioUploadSuccess($event, it, true)" ></app-audio-recorder>
</div> </div>
</div> </div>
<div style="float: left;"> <div style="float: left;">
<div style="width:200px"> <div style="width:200px">
<app-upload-image-with-preview [picUrl]="it.image_url" (imageUploaded)="onImgUploadSuccessByImg($event, it)" ></app-upload-image-with-preview> <app-upload-image-with-preview [picUrl]="it.image_url" (imageUploaded)="onImgUploadSuccessByImg($event, it)" ></app-upload-image-with-preview>
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 0.5rem; border-radius: 0.5rem;
min-width: 850px; min-width: 1000px;
border: 2px solid #ddd; border: 2px solid #ddd;
.preview-box { .preview-box {
......
...@@ -171,8 +171,12 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -171,8 +171,12 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
this.refreshImage (item); this.refreshImage (item);
} }
onAudioUploadSuccess(e, item) { onAudioUploadSuccess(e, item, isCardAudio) {
item.audio_url = e.url; if(isCardAudio){
item.card_audio_url = e.url;
}else{
item.audio_url = e.url;
}
} }
refreshImage(img) { refreshImage(img) {
...@@ -217,6 +221,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -217,6 +221,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
} }
}); });
item.audio_url = saveData.media.audio_url item.audio_url = saveData.media.audio_url
item.card_audio_url = saveData.media.card_audio_url
}else{ }else{
item.init("assets/default/bg_200_200.png" , ()=>{ item.init("assets/default/bg_200_200.png" , ()=>{
item.image_url = "assets/default/bg_200_200.png" item.image_url = "assets/default/bg_200_200.png"
...@@ -658,6 +663,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges { ...@@ -658,6 +663,7 @@ export class CustomHotZoneComponent implements OnInit, OnDestroy, OnChanges {
hotZoneItem['rect'].height = Math.round( (hotZoneItem['rect'].height) * 100) / 100; hotZoneItem['rect'].height = Math.round( (hotZoneItem['rect'].height) * 100) / 100;
hotZoneItem['media'].image_url = hotZoneArr[i].image_url hotZoneItem['media'].image_url = hotZoneArr[i].image_url
hotZoneItem['media'].audio_url = hotZoneArr[i].audio_url?hotZoneArr[i].audio_url:"" hotZoneItem['media'].audio_url = hotZoneArr[i].audio_url?hotZoneArr[i].audio_url:""
hotZoneItem['media'].card_audio_url = hotZoneArr[i].card_audio_url?hotZoneArr[i].card_audio_url:""
hotZoneItemArr.push(hotZoneItem); hotZoneItemArr.push(hotZoneItem);
} }
this.save.emit({bgItem, hotZoneItemArr}); this.save.emit({bgItem, hotZoneItemArr});
......
...@@ -94,9 +94,13 @@ export class Cartoon { ...@@ -94,9 +94,13 @@ export class Cartoon {
} }
stopAllAudio(){ stopAllAudio(){
this._playingNow.forEach(audio=>{ this._playingNow.forEach(audio=>{
audio.onended && audio.onended() try{
audio.pause(); audio.onended && audio.onended()
audio.currentTime = 0; audio.pause();
audio.currentTime = 0;
}catch(err){
console.log(err)
}
}) })
this._playingNow = [] this._playingNow = []
} }
......
...@@ -45,7 +45,8 @@ const defauleFormData = { ...@@ -45,7 +45,8 @@ const defauleFormData = {
}, },
media:{ media:{
image_url:"default-header", image_url:"default-header",
audio_url:"demo-audio" audio_url:"demo-audio",
card_audio_url:"demo-audio"
} }
} }
] ]
...@@ -106,6 +107,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -106,6 +107,8 @@ export class PlayComponent implements OnInit, OnDestroy {
m_currentQuestionIndex = 0; m_currentQuestionIndex = 0;
m_currentMovedCardIndex = -1; m_currentMovedCardIndex = -1;
m_totalQusetion = 0; m_totalQusetion = 0;
m_subscribeMouseFolling = [];
m_isGameStart = false;
// ------------------------------------ // ------------------------------------
...@@ -122,7 +125,6 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -122,7 +125,6 @@ export class PlayComponent implements OnInit, OnDestroy {
// 当数据加载完毕后,执行 // 当数据加载完毕后,执行
systemReady(){ systemReady(){
this.initGame() this.initGame()
this.switchAnswerSheetButton("start") this.switchAnswerSheetButton("start")
} }
...@@ -155,6 +157,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -155,6 +157,7 @@ export class PlayComponent implements OnInit, OnDestroy {
hotZoneItemArr.forEach(item => { hotZoneItemArr.forEach(item => {
if(item.media.audio_url){ if(item.media.audio_url){
array.push(item.media.audio_url) array.push(item.media.audio_url)
array.push(item.media.card_audio_url)
} }
}); });
} }
...@@ -199,6 +202,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -199,6 +202,7 @@ export class PlayComponent implements OnInit, OnDestroy {
setTimeout(()=>{ setTimeout(()=>{
this.g_cartoon.getCartoonElement("speaker").playAudio() this.g_cartoon.getCartoonElement("speaker").playAudio()
},100) },100)
this.m_isGameStart = true;
}) })
} }
...@@ -235,6 +239,20 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -235,6 +239,20 @@ export class PlayComponent implements OnInit, OnDestroy {
element.ref.scaleY = this.g_canvasHeight / element.ref.height element.ref.scaleY = this.g_canvasHeight / element.ref.height
element.ref.x = (element.ref.width*element.ref.scaleX)/2; element.ref.x = (element.ref.width*element.ref.scaleX)/2;
element.ref.y = (element.ref.height*element.ref.scaleY)/2; element.ref.y = (element.ref.height*element.ref.scaleY)/2;
this.subscribeMapMoveEvent("background",()=>{
this.m_subscribeMouseFolling.forEach(id => {
let element = this.g_cartoon.getCartoonElement(id)
if(element.enableMoveL1){
let dis = this.calculateDistance(element.basicX, element.basicY, this.g_clickX, this.g_clickY)
if(element.enableMoveL2 || dis>(50*this.g_mapScale)){
element.enableMoveL2 = true;
element.ref.x = this.g_clickX
element.ref.y = this.g_clickY
}
}
});
this.g_enableMapMove = true;
})
this.render(element.ref) this.render(element.ref)
} }
...@@ -411,7 +429,6 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -411,7 +429,6 @@ export class PlayComponent implements OnInit, OnDestroy {
this.subscribeMapDownEvent("restart-button", ()=>{ this.subscribeMapDownEvent("restart-button", ()=>{
element.click(()=>{ element.click(()=>{
this.restartGame() this.restartGame()
this.startGame(); this.startGame();
}) })
...@@ -433,13 +450,37 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -433,13 +450,37 @@ export class PlayComponent implements OnInit, OnDestroy {
this.g_cartoon.getCartoonElement("quertion-image-container").ref.addChild(element.ref) this.g_cartoon.getCartoonElement("quertion-image-container").ref.addChild(element.ref)
element.cardIndex = index; element.cardIndex = index;
element.ref.alpha = 0; element.ref.alpha = 0;
element.card_audio = item.media.card_audio_url
element.currentClick = false;
element.show = ()=>{ element.show = ()=>{
tweenChange(element.ref, { alpha:1 } , 0.1) tweenChange(element.ref, { alpha:1 } , 0.1)
} }
element.click = ()=>{
if(element.card_audio){
this.g_cartoon.stopAllAudio()
this.g_cartoon.playAudio(element.card_audio)
}
element.currentClick = true;
setTimeout(()=>{
element.currentClick = false;
},500)
}
this.subscribeMapDownEvent("quertion-image-puzzle-"+index, ()=>{
element.click()
this.g_enableMapDown = true;
})
this.subscribeMapUpEvent("quertion-image-puzzle-"+index, ()=>{ this.subscribeMapUpEvent("quertion-image-puzzle-"+index, ()=>{
if(this.m_currentMovedCardIndex == -1){ if(this.m_currentMovedCardIndex == -1){
element.currentClick = false;
this.g_enableMapUp = true;
return;
}
if(element.currentClick){
element.currentClick = false;
this.g_enableMapUp = true;
return; return;
} }
if(this.checkSelectedZone(index)){ if(this.checkSelectedZone(index)){
...@@ -448,7 +489,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -448,7 +489,8 @@ export class PlayComponent implements OnInit, OnDestroy {
this.g_cartoon.stopAllAudio() this.g_cartoon.stopAllAudio()
this.g_cartoon.playAudio("sm-choice-correct") this.g_cartoon.playAudio("sm-choice-correct")
this.showCorrectPatal("AnswerSheet",1500) this.showCorrectPatal("AnswerSheet",1500)
this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).enableMove = false; this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).enableMoveL1 = false;
this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).enableMoveL2 = false;
this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).isPlaced = true; this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).isPlaced = true;
this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).moveTo(rect.x + rect.width/2, rect.y + rect.height/2) this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).moveTo(rect.x + rect.width/2, rect.y + rect.height/2)
this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).hide() this.g_cartoon.getCartoonElement(`puzzle-card-${index}-container`).hide()
...@@ -489,7 +531,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -489,7 +531,7 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
createPuzzleCard(index:number, x:number, y:number, size:string, content={media:{image_url:""}}){ createPuzzleCard(index:number, x:number, y:number, size:string, content={media:{image_url:"", card_audio_url:""}}){
let containerSize_Width = 0; let containerSize_Width = 0;
let containerSize_Height = 0; let containerSize_Height = 0;
let cardSize_Width = 0; let cardSize_Width = 0;
...@@ -532,6 +574,9 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -532,6 +574,9 @@ export class PlayComponent implements OnInit, OnDestroy {
container.ref.y = container_y container.ref.y = container_y
container.cardIndex = index; container.cardIndex = index;
container.isPlaced = false; container.isPlaced = false;
container.basicX = container_x
container.basicY = container_y
container.card_audio = content.media.card_audio_url
let element = this.g_cartoon.createCartoonElement(`puzzle-card-${index}`, "MySprite") let element = this.g_cartoon.createCartoonElement(`puzzle-card-${index}`, "MySprite")
element.ref.init(this.g_cartoon.images.get(content.media.image_url)) element.ref.init(this.g_cartoon.images.get(content.media.image_url))
...@@ -542,8 +587,10 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -542,8 +587,10 @@ export class PlayComponent implements OnInit, OnDestroy {
element.ref.y = 0; element.ref.y = 0;
container.ref.addChild(element.ref); container.ref.addChild(element.ref);
container.enableMove = false; container.enableMoveL1 = false;
container.enableMoveL2 = false;
container.ref.alpha = 1; container.ref.alpha = 1;
this.subscribeMouseFollingAssit(`puzzle-card-${index}-container`)
container.show = (delay:number)=>{ container.show = (delay:number)=>{
setTimeout(() => { setTimeout(() => {
...@@ -553,6 +600,13 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -553,6 +600,13 @@ export class PlayComponent implements OnInit, OnDestroy {
}, delay); }, delay);
} }
container.click = ()=>{
if(container.card_audio){
this.g_cartoon.stopAllAudio()
this.g_cartoon.playAudio(container.card_audio)
}
}
container.back = ()=>{ container.back = ()=>{
tweenChange(container.ref, { x:container_x, y:container_y } , 0.1) tweenChange(container.ref, { x:container_x, y:container_y } , 0.1)
} }
...@@ -574,27 +628,31 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -574,27 +628,31 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
this.subscribeMapDownEvent(`puzzle-card-${index}-container`, ()=>{ this.subscribeMapDownEvent(`puzzle-card-${index}-container`, ()=>{
if(container.isPlaced){
this.g_enableMapDown = true;
return
}
this.m_currentMovedCardIndex = container.cardIndex this.m_currentMovedCardIndex = container.cardIndex
this.g_cartoon.playAudio("sm-click") // this.g_cartoon.playAudio("sm-click")
container.enableMove= true; container.enableMoveL1= true;
container.activite() container.activite()
container.click()
this.g_enableMapDown = true; this.g_enableMapDown = true;
}) })
this.subscribeMapMoveEvent(`puzzle-card-${index}-container`, ()=>{ this.subscribeMapMoveEvent(`puzzle-card-${index}-container`, ()=>{
if(container.enableMove){
container.ref.x = this.g_clickX
container.ref.y = this.g_clickY
}
this.g_enableMapMove = true; this.g_enableMapMove = true;
}) })
this.subscribeMapUpEvent(`puzzle-card-${index}-container`, ()=>{ this.subscribeMapUpEvent(`puzzle-card-${index}-container`, ()=>{
this.m_currentMovedCardIndex = -1; this.m_currentMovedCardIndex = -1;
container.enableMove= false;
this.g_enableMapUp = true; this.g_enableMapUp = true;
container.incativite() container.incativite()
if(!container.isPlaced){ if(!container.isPlaced){
this.g_cartoon.stopAllAudio() if(container.enableMoveL2){
this.g_cartoon.playAudio("sm-choice-incorrect") this.g_cartoon.stopAllAudio()
this.g_cartoon.playAudio("sm-choice-incorrect")
}
container.enableMoveL1= false;
container.enableMoveL2= false;
setTimeout(()=>{ setTimeout(()=>{
container.back(); container.back();
},300) },300)
...@@ -636,9 +694,39 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -636,9 +694,39 @@ export class PlayComponent implements OnInit, OnDestroy {
this.m_totalQusetion = 0; this.m_totalQusetion = 0;
this.m_currentQuestionIndex = 0; this.m_currentQuestionIndex = 0;
this.g_cartoon.getCartoonElement("speaker").audio_url = ""; this.g_cartoon.getCartoonElement("speaker").audio_url = "";
this.m_subscribeMouseFolling.length = 0;
} }
subscribeMouseFollingAssit(id){
this.m_subscribeMouseFolling.push(id)
}
calculateDistance(x,y,dis_x,dis_y){
let a = Math.abs(dis_x - x)
let b = Math.abs(dis_y - y)
let dis = Math.sqrt(a*a + b*b)
return Math.floor(dis)
}
...@@ -1106,7 +1194,6 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1106,7 +1194,6 @@ export class PlayComponent implements OnInit, OnDestroy {
return input; return input;
} }
paginationArray(pageNo, pageSize, array) { paginationArray(pageNo, pageSize, array) {
var offset = (pageNo - 1) * pageSize; var offset = (pageNo - 1) * pageSize;
return (offset + pageSize >= array.length) ? array.slice(offset, array.length) : array.slice(offset, offset + pageSize); return (offset + pageSize >= array.length) ? array.slice(offset, array.length) : array.slice(offset, offset + pageSize);
...@@ -1126,6 +1213,13 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1126,6 +1213,13 @@ export class PlayComponent implements OnInit, OnDestroy {
......
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