Commit fd8e983a authored by 李维's avatar 李维

dev commit

parent aae59198
......@@ -47,7 +47,9 @@ export class PlayComponent implements OnInit, OnDestroy {
// ------------ 全局数据 ------------
g_stage; //中心舞台
g_enableTouch = true; // 触摸使能
g_enableMapDown = true; // 触摸使能
g_enableMapUp = true; // 抬起使能
g_enableMapMove = true; // 移动ss使能
g_canvasLeft;
g_canvasTop;
g_animationId: any;
......@@ -68,7 +70,9 @@ export class PlayComponent implements OnInit, OnDestroy {
// ------------------------------------
// ------------ 私有数据 ------------
m_clickQueue = {} //点击事件处理队列
m_mapDownQueue = {} //按下事件处理队列
m_mapUpQueue = {} //抬起事件处理队列
m_mapMoveQueue = {} //移动事件处理队列
m_endPageArr;
m_showPetalFlag;
m_elementPetalArr;
......@@ -121,13 +125,10 @@ export class PlayComponent implements OnInit, OnDestroy {
initGame(){
this.initAnswerSheet()
this.showAnswer()
this.initPuzzles()
}
initAnswerSheet(){
let element = this.g_cartoon.createCartoonElement("AnswerSheet", "MySprite")
element.ref.init(this.g_cartoon.images.get("answer-sheet"))
......@@ -135,41 +136,124 @@ export class PlayComponent implements OnInit, OnDestroy {
element.ref.y = this.g_canvasHeight / 2
element.ref.setScaleXY(this.g_mapScale)
let quertionImage = this.g_cartoon.createCartoonElement("quertion-image-container", "MySprite")
quertionImage.ref.init(this.g_cartoon.images.get(this.g_formData.bgItem.url))
if( (200 / quertionImage.ref.width) < (300 / quertionImage.ref.height) ){
quertionImage.contentScale = 200 / quertionImage.ref.width
quertionImage.originX = 0
quertionImage.originY = quertionImage.ref.height / 2 - (quertionImage.ref.height/2) * quertionImage.contentScale
}else{
quertionImage.originX = quertionImage.ref.width / 2
quertionImage.originY = 0
quertionImage.contentScale = 200 / quertionImage.ref.width
}
quertionImage.ref.setScaleXY( quertionImage.contentScale )
element.ref.addChild(quertionImage.ref)
let element_t = this.g_cartoon.createCartoonElement("quertion-image-container", "MySprite")
element_t.ref.init(this.g_cartoon.images.get(this.g_formData.bgItem.url))
element_t.contentScale = Math.min((200 / element_t.ref.width), (300 / element_t.ref.height))
element_t.originX = -(element_t.ref.width)/2
element_t.originY = -(element_t.ref.height)/2
element_t.ref.x = 0 //this.g_canvasWidth / 2
element_t.ref.y = 0 //this.g_canvasHeight / 2
element_t.ref.setScaleXY( element_t.contentScale )
// this.subscribeMapDownEvent("quertion-image-container", ()=>{
// this.checkHotArray(this.g_clickX, this.g_clickY)
// this.g_enableMapDown = true;
// })
element.ref.addChild(element_t.ref)
this.render(element.ref)
}
showAnswer(){
let hotZoneItemArr = this.g_formData.hotZoneItemArr
let parent = this.g_cartoon.getCartoonElement("quertion-image-container")
let originX = -(parent.ref.width)/2
let originY = -(parent.ref.height)/2
hotZoneItemArr.forEach( (item,index) => {
console.log(item)
let element = this.g_cartoon.createCartoonElement("quertion-image-puzzle-"+index, "MySprite")
element.ref.init(this.g_cartoon.images.get(item.rect.src))
element.ref.scaleX = item.rect.width / (element.ref.width*parent.contentScale)
element.ref.scaleY = item.rect.height / (element.ref.height*parent.contentScale)
element.ref.x = originX + item.rect.x/parent.contentScale + (element.ref.width*element.ref.scaleX)/2
element.ref.y = originY + item.rect.y/parent.contentScale + (element.ref.height*element.ref.scaleY/2)
element.ref.x = parent.originX + item.rect.x/parent.contentScale + (element.ref.width*element.ref.scaleX)/2
element.ref.y = parent.originY + item.rect.y/parent.contentScale + (element.ref.height*element.ref.scaleY/2)
this.g_cartoon.getCartoonElement("quertion-image-container").ref.addChild(element.ref)
element.ref.alpha = 0;
element.show = ()=>{
tweenChange(element.ref, { alpha:1 } , 0.1)
}
this.subscribeMapUpEvent("quertion-image-puzzle-"+index, ()=>{
let rect = element.ref.getBoundingBox()
element.show()
this.g_cartoon.getCartoonElement("puzzle-card-"+0).enableMove = false;
this.g_cartoon.getCartoonElement("puzzle-card-"+0).moveTo(rect.x + rect.width/2, rect.y + rect.height/2)
this.g_cartoon.getCartoonElement("puzzle-card-"+0).hide()
this.g_enableMapUp = true;
})
});
}
initPuzzles(){
let hotZoneItemArr = this.g_formData.hotZoneItemArr
let parent = this.g_cartoon.getCartoonElement("quertion-image-container")
// hotZoneItemArr.forEach( (item,index) => {
// console.log(item)
// let element = this.g_cartoon.createCartoonElement("quertion-image-puzzle-"+index, "MySprite")
// element.ref.init(this.g_cartoon.images.get(item.rect.src))
// element.ref.scaleX = item.rect.width / (element.ref.width*parent.contentScale)
// element.ref.scaleY = item.rect.height / (element.ref.height*parent.contentScale)
// element.ref.x = parent.originX + item.rect.x/parent.contentScale + (element.ref.width*element.ref.scaleX)/2
// element.ref.y = parent.originY + item.rect.y/parent.contentScale + (element.ref.height*element.ref.scaleY/2)
// this.g_cartoon.getCartoonElement("quertion-image-container").ref.addChild(element.ref)
// element.ref.alpha = 0;
// element.show = ()=>{
// tweenChange(element.ref, { alpha:1 } , 0.1)
// }
// this.subscribeMapUpEvent("quertion-image-puzzle-"+index, ()=>{
// console.log("Up")
// element.show()
// this.g_enableMapUp = true;
// })
// });
let element = this.g_cartoon.createCartoonElement("puzzle-card-"+0, "MySprite")
element.ref.init(this.g_cartoon.images.get(hotZoneItemArr[0].rect.src))
element.ref.scaleX = 100 / element.ref.width
element.ref.scaleY = 100 / element.ref.height
element.ref.x = this.g_cartoon.getOrigin().x + 200
element.ref.y = this.g_cartoon.getOrigin().y + 200
element.enableMove = false;
element.ref.alpha = 1;
element.show = ()=>{
tweenChange(element.ref, { alpha:1 } , 0.1)
}
element.hide = ()=>{
tweenChange(element.ref, { alpha:0 } , 0.1)
}
element.moveTo = (x, y)=>{
tweenChange(element.ref, { x:x, y:y } , 0.1)
}
this.subscribeMapDownEvent("puzzle-card-"+0, ()=>{
element.enableMove= true;
this.g_enableMapDown = true;
})
this.subscribeMapMoveEvent("puzzle-card-"+0, ()=>{
if(element.enableMove){
element.ref.x = this.g_clickX
element.ref.y = this.g_clickY
}
this.g_enableMapMove = true;
})
this.subscribeMapUpEvent("puzzle-card-"+0, ()=>{
element.enableMove= false;
this.g_enableMapUp = true;
})
this.render(element.ref)
}
......@@ -318,24 +402,42 @@ export class PlayComponent implements OnInit, OnDestroy {
}
}
mapDown(event) {
if (!this.g_enableTouch) {
if (!this.g_enableMapDown) {
return;
}
for(let cartoonID in this.m_clickQueue){
for(let cartoonID in this.m_mapDownQueue){
if (this.checkClickTarget(this.g_cartoon.getCartoonElementRef(cartoonID))) {
this.g_enableTouch = false;
this.m_clickQueue[cartoonID]();
return;
this.g_enableMapDown = false;
this.m_mapDownQueue[cartoonID]();
}
}
}
mapMove(event) {
if (!this.g_enableMapMove) {
return;
}
for(let cartoonID in this.m_mapMoveQueue){
if (this.checkClickTarget(this.g_cartoon.getCartoonElementRef(cartoonID))) {
this.g_enableMapMove = false;
this.m_mapMoveQueue[cartoonID]();
}
}
}
mapMove(event) {}
mapUp(event) {}
mapUp(event) {
if (!this.g_enableMapUp) {
return;
}
for(let cartoonID in this.m_mapUpQueue){
if (this.checkClickTarget(this.g_cartoon.getCartoonElementRef(cartoonID))) {
this.g_enableMapUp = false;
this.m_mapUpQueue[cartoonID]();
}
}
}
update() {
......@@ -525,8 +627,16 @@ export class PlayComponent implements OnInit, OnDestroy {
}
subscribeClickEvent(id,callback){
this.m_clickQueue[id] = callback
subscribeMapDownEvent(id,callback){
this.m_mapDownQueue[id] = callback
}
subscribeMapUpEvent(id,callback){
this.m_mapUpQueue[id] = callback
}
subscribeMapMoveEvent(id,callback){
this.m_mapMoveQueue[id] = callback
}
......@@ -546,7 +656,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this.g_cartoon.clientHeight = this.wrap.nativeElement.clientHeight;
this.m_renderArr = [];
this.g_enableTouch = true;
this.g_enableMapDown = true;
this.g_ctx = this.canvas.nativeElement.getContext("2d");
this.canvas.nativeElement.width = this.g_canvasWidth;
......
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