Commit 5dfd8f36 authored by 李维's avatar 李维

dev commit

parent 8ce2c61f
...@@ -141,6 +141,8 @@ export class MySprite extends Sprite { ...@@ -141,6 +141,8 @@ export class MySprite extends Sprite {
const index = this.children.indexOf(child); const index = this.children.indexOf(child);
if (index !== -1) { if (index !== -1) {
this.children.splice(index, 1); this.children.splice(index, 1);
}else{
console.warn("Can not delete child!")
} }
} }
......
...@@ -56,15 +56,8 @@ const zIndexMap = { ...@@ -56,15 +56,8 @@ const zIndexMap = {
startButton: 120, startButton: 120,
drum: 30, drum: 30,
hand: 35, hand: 35,
answerCard: 45,
questionCard: 50,
mainQuestionImage: 35,
imageContainer:35,
imageBackground: 36,
shortAudio: 40,
animation: 80, animation: 80,
popUp: 90, EndPatal: 90
buttons: 100
} }
@Component({ @Component({
...@@ -119,7 +112,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -119,7 +112,7 @@ export class PlayComponent implements OnInit, OnDestroy {
m_mapMoveArray = [] //移动事件处理队列 m_mapMoveArray = [] //移动事件处理队列
m_mapMoveObject = [] m_mapMoveObject = []
m_endPageArr; m_endPageArr = []; // 花瓣
m_showPetalFlag; m_showPetalFlag;
m_elementPetalArr; m_elementPetalArr;
m_showElementPetalFlag; m_showElementPetalFlag;
...@@ -130,6 +123,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -130,6 +123,7 @@ export class PlayComponent implements OnInit, OnDestroy {
m_setTimeoutIDs = []; m_setTimeoutIDs = [];
m_setIntervalIDs = []; m_setIntervalIDs = [];
m_moveAsstantIntervalId = null; m_moveAsstantIntervalId = null;
m_frontCurtainArr = []; // 前置幕布
// ------------------------------------ // ------------------------------------
...@@ -216,7 +210,6 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -216,7 +210,6 @@ export class PlayComponent implements OnInit, OnDestroy {
cleanGameVar(){ cleanGameVar(){
this.m_startGame = false; this.m_startGame = false;
this.m_allDrums = []
} }
startGame(){ startGame(){
...@@ -225,17 +218,15 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -225,17 +218,15 @@ export class PlayComponent implements OnInit, OnDestroy {
restartGame(){ restartGame(){
this.cleanGameVar(); this.cleanGameVar();
this.stopEndPatal();
this.startGame(); this.startGame();
this.initDrum(); this.randomAllDrum();
} }
endGame(){ endGame(){
this.showEndPatal()
this.g_enableMapDown = false; this.g_enableMapDown = false;
this.curtainContral(false, ()=>{ this.g_cartoon.getCartoonElement("restart-button").in()
this.g_cartoon.getCartoonElement("restart-button").in()
this.g_cartoon.getCartoonElement("boy").reset()
this.g_enableMapDown = true;
})
} }
initBackground(){ initBackground(){
...@@ -324,15 +315,14 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -324,15 +315,14 @@ export class PlayComponent implements OnInit, OnDestroy {
this.render(element.play, zIndexMap.boy) this.render(element.play, zIndexMap.boy)
element.startReadyAni = ()=>{ element.startReadyAni = ()=>{
console.log("Start ready ani")
element.play.play() element.play.play()
element.ref.visible = false element.ref.visible = false
element.play.visible = true element.play.visible = true
element.isPlay = true; element.isPlay = true;
element.firstClick = true;
} }
element.endReadyAni = ()=>{ element.endReadyAni = ()=>{
console.log("End ready ani")
element.play.stop() element.play.stop()
element.ref.visible = true element.ref.visible = true
element.play.visible = false element.play.visible = false
...@@ -485,9 +475,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -485,9 +475,8 @@ export class PlayComponent implements OnInit, OnDestroy {
}else{ }else{
element.currentSide = "left" element.currentSide = "left"
} }
element.updateHandPos(); element.updateHandPos();
element.currentSide = element.currentSide? element.currentSide: "left" element.currentSide = element.currentSide? element.currentSide: "left"
if(element.firstClick){ if(element.firstClick){
element.endReadyAni() element.endReadyAni()
...@@ -514,6 +503,12 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -514,6 +503,12 @@ export class PlayComponent implements OnInit, OnDestroy {
element.beatAnimate.play() element.beatAnimate.play()
} }
element.backToReady = () => {
element.ref.x = standPos[this.g_formData.dataArray.length][0].x
element.currentPosition = 0;
element.updateHandPos();
}
element.beatReset = (callback) => { element.beatReset = (callback) => {
element.beatAnimate.visible = false; element.beatAnimate.visible = false;
this.deleteElementInRender(element.beatAnimate.id) this.deleteElementInRender(element.beatAnimate.id)
...@@ -545,7 +540,6 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -545,7 +540,6 @@ export class PlayComponent implements OnInit, OnDestroy {
y: this.g_canvasHeight / 2 y: this.g_canvasHeight / 2
} }
}) })
this.render(A.ref, zIndexMap.Curtain_A)
A.open = ()=>{ A.open = ()=>{
this.m_setTimeoutIDs.push(setTimeout(() => { this.m_setTimeoutIDs.push(setTimeout(() => {
tweenChange(A.ref, {x: (-357 / 2 + 100) * this.g_mapScale}, 3) tweenChange(A.ref, {x: (-357 / 2 + 100) * this.g_mapScale}, 3)
...@@ -554,8 +548,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -554,8 +548,8 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
A.close = ()=>{ A.close = ()=>{
this.m_setTimeoutIDs.push(setTimeout(() => { this.m_setTimeoutIDs.push(setTimeout(() => {
tweenChange(A.ref, {x: A.initX}, 3) tweenChange(A.ref, {x: A.initX}, 2.5)
}, 3000)) }, 1500))
} }
let B = this.g_cartoon.createCartoonElementImageFunc("Curtain-B", "lianzil", (w ,h)=>{ let B = this.g_cartoon.createCartoonElementImageFunc("Curtain-B", "lianzil", (w ,h)=>{
...@@ -569,7 +563,6 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -569,7 +563,6 @@ export class PlayComponent implements OnInit, OnDestroy {
y: this.g_canvasHeight / 2 y: this.g_canvasHeight / 2
} }
}) })
this.render(B.ref, zIndexMap.Curtain_B)
B.open = ()=>{ B.open = ()=>{
this.m_setTimeoutIDs.push(setTimeout(() => { this.m_setTimeoutIDs.push(setTimeout(() => {
tweenChange(B.ref, {x: this.g_canvasWidth + (357 / 2 - 100) * this.g_mapScale}, 3) tweenChange(B.ref, {x: this.g_canvasWidth + (357 / 2 - 100) * this.g_mapScale}, 3)
...@@ -577,8 +570,8 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -577,8 +570,8 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
B.close = ()=>{ B.close = ()=>{
this.m_setTimeoutIDs.push(setTimeout(() => { this.m_setTimeoutIDs.push(setTimeout(() => {
tweenChange(B.ref, {x: B.initX}, 3) tweenChange(B.ref, {x: B.initX}, 2.5)
}, 3000)) }, 1500))
} }
let C = this.g_cartoon.createCartoonElementImageFunc("Curtain-C", "lianzi4", (w ,h)=>{ let C = this.g_cartoon.createCartoonElementImageFunc("Curtain-C", "lianzi4", (w ,h)=>{
...@@ -592,12 +585,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -592,12 +585,11 @@ export class PlayComponent implements OnInit, OnDestroy {
y: this.g_canvasHeight / 2 y: this.g_canvasHeight / 2
} }
}) })
this.render(C.ref, zIndexMap.Curtain_C)
C.open = ()=>{ C.open = ()=>{
tweenChange(C.ref, {x: -this.g_canvasWidth / 4}, 7) tweenChange(C.ref, {x: -this.g_canvasWidth / 4}, 7)
} }
C.close = ()=>{ C.close = ()=>{
tweenChange(C.ref, {x: C.initX}, 7) tweenChange(C.ref, {x: C.initX}, 4)
} }
let D = this.g_cartoon.createCartoonElementImageFunc("Curtain-D", "lianzi3", (w ,h)=>{ let D = this.g_cartoon.createCartoonElementImageFunc("Curtain-D", "lianzi3", (w ,h)=>{
...@@ -611,12 +603,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -611,12 +603,11 @@ export class PlayComponent implements OnInit, OnDestroy {
y: this.g_canvasHeight / 2 y: this.g_canvasHeight / 2
} }
}) })
this.render(D.ref, zIndexMap.Curtain_D)
D.open = ()=>{ D.open = ()=>{
tweenChange(D.ref, {x: this.g_canvasWidth + this.g_canvasWidth / 4}, 7) tweenChange(D.ref, {x: this.g_canvasWidth + this.g_canvasWidth / 4}, 7)
} }
D.close = ()=>{ D.close = ()=>{
tweenChange(D.ref, {x: D.initX}, 7) tweenChange(D.ref, {x: D.initX}, 4)
} }
let E = this.g_cartoon.createCartoonElementImageFunc("Curtain-E", "lianzi0", (w ,h)=>{ let E = this.g_cartoon.createCartoonElementImageFunc("Curtain-E", "lianzi0", (w ,h)=>{
...@@ -630,24 +621,35 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -630,24 +621,35 @@ export class PlayComponent implements OnInit, OnDestroy {
y: (95 / 2) * this.g_mapScale y: (95 / 2) * this.g_mapScale
} }
}) })
this.render(E.ref, zIndexMap.Curtain_E)
this.m_frontCurtainArr.push(C.ref)
this.m_frontCurtainArr.push(D.ref)
this.m_frontCurtainArr.push(A.ref)
this.m_frontCurtainArr.push(B.ref)
this.m_frontCurtainArr.push(E.ref)
} }
curtainContral(status, callback?){ curtainContral(status, callback?){
let all = ["Curtain-A", "Curtain-B", "Curtain-C", "Curtain-D"] let all = ["Curtain-A", "Curtain-B", "Curtain-C", "Curtain-D"]
this.g_cartoon.playAudio("tongshenghuanhu")
this.m_setTimeoutIDs.push(setTimeout(() => {
this.g_cartoon.playAudio("gusheng_kaitou")
}, 2000))
if(status){ if(status){
all.forEach(item=>{ all.forEach(item=>{
this.g_cartoon.getCartoonElement(item).open() this.g_cartoon.getCartoonElement(item).open()
}) })
this.m_setTimeoutIDs.push(setTimeout(()=>{
callback && callback()
}, 7000))
}else{ }else{
all.forEach(item=>{ all.forEach(item=>{
this.g_cartoon.getCartoonElement(item).close() this.g_cartoon.getCartoonElement(item).close()
}) })
this.m_setTimeoutIDs.push(setTimeout(()=>{
callback && callback()
}, 4000))
} }
this.m_setTimeoutIDs.push(setTimeout(()=>{
callback && callback()
}, 7000))
} }
initStartButton(){ initStartButton(){
...@@ -662,9 +664,10 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -662,9 +664,10 @@ export class PlayComponent implements OnInit, OnDestroy {
y: this.g_canvasHeight / 2 + 250 * this.g_mapScale y: this.g_canvasHeight / 2 + 250 * this.g_mapScale
} }
}) })
this.render(element.ref, zIndexMap.startButton)
this.m_frontCurtainArr.push(element.ref)
this.subscribeMapDownEvent(element.id, ()=>{ this.subscribeMapDownEvent(element.id, ()=>{
this.g_cartoon.playAudio("dianji")
this.showJellyAnimation(element.id, ()=>{ this.showJellyAnimation(element.id, ()=>{
tweenChange(element.ref, {x: this.g_canvasWidth + 331 * this.g_mapScale}, 0.5) tweenChange(element.ref, {x: this.g_canvasWidth + 331 * this.g_mapScale}, 0.5)
}) })
...@@ -686,11 +689,11 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -686,11 +689,11 @@ export class PlayComponent implements OnInit, OnDestroy {
}, (w, h)=>{ }, (w, h)=>{
return { return {
x: this.g_canvasWidth / 2 + 450 * this.g_mapScale, x: this.g_canvasWidth / 2 + 450 * this.g_mapScale,
y: this.g_canvasHeight / 2 + 250 * this.g_mapScale y: this.g_canvasHeight / 2
} }
}) })
element.ref.x = this.g_canvasWidth + 331 * this.g_mapScale element.ref.x = this.g_canvasWidth + 331 * this.g_mapScale
this.render(element.ref, zIndexMap.startButton) this.m_frontCurtainArr.push(element.ref)
element.in = (callback?)=>{ element.in = (callback?)=>{
tweenChange(element.ref, {x: element.initX}, 0.5, ()=>{ tweenChange(element.ref, {x: element.initX}, 0.5, ()=>{
...@@ -708,15 +711,25 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -708,15 +711,25 @@ export class PlayComponent implements OnInit, OnDestroy {
this.showJellyAnimation(element.id, ()=>{ this.showJellyAnimation(element.id, ()=>{
element.out() element.out()
}) })
this.restartGame() this.g_cartoon.playAudio("jiazigu_changgusheng")
this.g_cartoon.getCartoonElement("boy").startReadyAni() this.m_setTimeoutIDs.push(setTimeout(() => {
this.curtainContral(true, ()=>{ this.g_cartoon.playAudio("guzhang")
this.g_enableMapDown = true; }, 1000))
this.curtainContral(false, ()=>{
this.g_cartoon.getCartoonElement("boy").reset()
this.g_cartoon.getCartoonElement("boy").startReadyAni()
this.restartGame()
this.curtainContral(true, ()=>{
this.g_enableMapDown = true;
})
}) })
})
return true
}, 100)
} }
initDrum(){ initDrum(){
console.log("initDrum")
if(this.g_formData.dataArray.length == 0){ if(this.g_formData.dataArray.length == 0){
return return
} }
...@@ -772,58 +785,73 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -772,58 +785,73 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
element.content = null; element.content = null;
if(data.type == "Image"){ element.imageContainer = null;
element.imageContainer = this.g_cartoon.createImage("card_bg", (w, h)=>{ element.textContainer = null;
return { element.resetContent = (contentData)=>{
sx: 261 / w, element.isOpen = false;
sy: 178 / h if(contentData.type == "Image"){
} if(element.content){
}, (w, h)=>{ element.ref.removeChild(element.content)
return {
x: 0,
y: 60
}
})
element.imageContainer.visible = false;
element.imageContainer.setScaleXY(0)
element.content = element.imageContainer
element.ref.addChild(element.imageContainer)
element.image = this.g_cartoon.createImage(data.image_url, (w, h)=>{
let sx = 261 / w
let sy = 178 / w
let s = Math.min(sx, sy)
return {
sx: s,
sy: s
}
}, (w, h)=>{
return {
x: 0,
y: 0
}
})
element.imageContainer.addChild(element.image)
}else{
element.textContainer = this.g_cartoon.createImage("card_bg", (w, h)=>{
return {
sx: 261 / w,
sy: 178 / h
}
}, (w, h)=>{
return {
x: 0,
y: 60
} }
}) element.imageContainer = this.g_cartoon.createImage("card_bg", (w, h)=>{
element.textContainer.visible = false; return {
element.textContainer.setScaleXY(0) sx: 261 / w,
element.content = element.textContainer sy: 178 / h
element.ref.addChild(element.textContainer) }
}, (w, h)=>{
return {
x: 0,
y: 60
}
})
element.imageContainer.visible = false;
element.imageContainer.setScaleXY(0)
element.content = element.imageContainer
element.image = this.g_cartoon.createImage(contentData.image_url, (w, h)=>{
let sx = 261 / w
let sy = 178 / w
let s = Math.min(sx, sy)
return {
sx: s,
sy: s
}
}, (w, h)=>{
return {
x: 0,
y: 0
}
})
element.text = this.g_cartoon.createLabel(data.text, "GOTHICB_1", "#FF0", 32) element.ref.addChild(element.imageContainer)
element.textContainer.addChild(element.text) element.imageContainer.addChild(element.image)
}else{
if(element.content){
element.ref.removeChild(element.content)
}
element.textContainer = this.g_cartoon.createImage("card_bg", (w, h)=>{
return {
sx: 261 / w,
sy: 178 / h
}
}, (w, h)=>{
return {
x: 0,
y: 60
}
})
element.textContainer.alpha = 0;
element.textContainer.visible = false;
element.textContainer.setScaleXY(0)
element.content = element.textContainer
element.text = this.g_cartoon.createLabel(contentData.text, "BerlinSansFBDemi-Bold", "#b94918", 84)
element.text.outline = 15;
element.ref.addChild(element.textContainer)
element.textContainer.addChild(element.text)
}
} }
element.resetContent(data, true)
element.highlight = () => { element.highlight = () => {
...@@ -833,6 +861,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -833,6 +861,7 @@ export class PlayComponent implements OnInit, OnDestroy {
element.light.ref.visible = false; element.light.ref.visible = false;
this.setRenderZIndex(element.ref, zIndexMap.drum) this.setRenderZIndex(element.ref, zIndexMap.drum)
this.checkAllOpen() this.checkAllOpen()
this.g_cartoon.getCartoonElement("boy").backToReady()
this.g_enableMapDown = true; this.g_enableMapDown = true;
}) })
}, 2000)) }, 2000))
...@@ -844,8 +873,9 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -844,8 +873,9 @@ export class PlayComponent implements OnInit, OnDestroy {
this.g_enableMapDown = true; this.g_enableMapDown = true;
return return
} }
this.g_cartoon.playAudio(`gusheng_${index+1}`)
this.setRenderZIndex(element.ref, zIndexMap.drum + 1) this.setRenderZIndex(element.ref, zIndexMap.drum + 1)
tweenChange(element.ref, {scaleX: element.initScaleX * 1.2, scaleY: element.initScaleY * 1.2}, 0.2, ()=>{ tweenChange(element.ref, {scaleX: element.initScaleX * 1.1, scaleY: element.initScaleY * 1.1}, 0.2, ()=>{
if(element.content){ if(element.content){
element.content.visible = true; element.content.visible = true;
tweenChange(element.content, {scaleX: element.content.initScaleX, scaleY: element.content.initScaleY}, 0.2) tweenChange(element.content, {scaleX: element.content.initScaleX, scaleY: element.content.initScaleY}, 0.2)
...@@ -856,11 +886,21 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -856,11 +886,21 @@ export class PlayComponent implements OnInit, OnDestroy {
element.highlight() element.highlight()
}) })
}) })
}) })
return element return element
} }
randomAllDrum(){
let drum = null;
this.m_dataArrayNew = this.randomArray_shuffle(this.g_formData.dataArray)
let _this = this
this.m_allDrums.forEach(function(item, index){
drum = _this.g_cartoon.getCartoonElement(item)
drum.resetContent(_this.m_dataArrayNew[index])
})
console.log(this.g_cartoon.getAllCartoonElement())
}
checkAllOpen(){ checkAllOpen(){
let endGame = true let endGame = true
for(let index = 0; index<this.m_allDrums.length; index++){ for(let index = 0; index<this.m_allDrums.length; index++){
...@@ -1030,12 +1070,12 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1030,12 +1070,12 @@ export class PlayComponent implements OnInit, OnDestroy {
if (!this.g_enableMapDown) { if (!this.g_enableMapDown) {
return; return;
} }
console.log("All click event subscribers:", this.m_mapDownArray) // console.log("All click event subscribers:", this.m_mapDownArray)
this.m_mapDownArray.forEach((item)=>{ this.m_mapDownArray.forEach((item)=>{
if(!myStopPropagation){ if(!myStopPropagation){
if (this.checkClickTarget(this.g_cartoon.getCartoonElementRef(item.id))) { if (this.checkClickTarget(this.g_cartoon.getCartoonElementRef(item.id))) {
this.g_enableMapDown = false; this.g_enableMapDown = false;
console.log("Click event - target id:["+item.id+"]") // console.log("Click event - target id:["+item.id+"]")
if(item.callback()){ if(item.callback()){
myStopPropagation = true; myStopPropagation = true;
} }
...@@ -1097,6 +1137,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1097,6 +1137,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this.updateArr(this.m_renderArr); this.updateArr(this.m_renderArr);
this.updateArr(this.m_endPageArr); this.updateArr(this.m_endPageArr);
this.updateArr(this.m_elementPetalArr); this.updateArr(this.m_elementPetalArr);
this.updateArr(this.m_frontCurtainArr)
} }
...@@ -1347,6 +1388,7 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1347,6 +1388,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this.m_renderArr = []; this.m_renderArr = [];
this.m_renderObject = []; this.m_renderObject = [];
this.m_frontCurtainArr = [];
this.g_enableMapDown = true; this.g_enableMapDown = true;
this.g_ctx = this.canvas.nativeElement.getContext("2d"); this.g_ctx = this.canvas.nativeElement.getContext("2d");
...@@ -1391,20 +1433,6 @@ export class PlayComponent implements OnInit, OnDestroy { ...@@ -1391,20 +1433,6 @@ export class PlayComponent implements OnInit, OnDestroy {
} }
render(ele, zIndex?:number){ render(ele, zIndex?:number){
// let exist = false;
// let index = 0
// this.m_renderObject.forEach((item, i) => {
// if(item.element.id == ele.id){
// console.warn("Exist in render array!")
// exist = true
// index = i
// }
// });
// if(exist){
// this.m_renderObject.splice(index, 1)
// }
this.m_renderObject.push({element:ele, zIndex:zIndex?zIndex:1}) this.m_renderObject.push({element:ele, zIndex:zIndex?zIndex:1})
this.m_renderObject.sort((a,b)=>{ this.m_renderObject.sort((a,b)=>{
return a.zIndex - b.zIndex return a.zIndex - b.zIndex
......
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