Commit 1a210fbe authored by limingzhe's avatar limingzhe

fix: 开始点击骰子报错

parent a25f89b0
......@@ -66,6 +66,7 @@ export class PlayComponent implements OnInit, OnDestroy {
canTouch =true;
curPic;
private isStart: boolean;
@HostListener('window:resize', ['$event'])
onResize(event) {
......@@ -98,7 +99,7 @@ export class PlayComponent implements OnInit, OnDestroy {
console.log("canvasdefout+"+this.canvas);
this.initAudio();
this.initImg();
}, this.saveKey);
......@@ -127,7 +128,7 @@ export class PlayComponent implements OnInit, OnDestroy {
this.initCtx();
this.initData();
this.initView();
this.initView();
}
......@@ -436,37 +437,37 @@ export class PlayComponent implements OnInit, OnDestroy {
//将图片一一传到卡片上
const picArr = this.data.contentObj.picArr;
const picArr = this.data.contentObj.picArr;
if (!picArr || picArr.length == 0) {
const picArr = [];
picArr.push({
pic_url:'', audio_url: "assets/play/music/card.mp3", title: "1"
pic_url:'', audio_url: "assets/play/music/card.mp3", title: "1"
});
picArr.push({
pic_url:'', audio_url: "assets/play/music/card.mp3", title: "2"
pic_url:'', audio_url: "assets/play/music/card.mp3", title: "2"
});
picArr.push({
pic_url:'', audio_url: "assets/play/music/card.mp3", title: "3"
pic_url:'', audio_url: "assets/play/music/card.mp3", title: "3"
});
picArr.push({
pic_url:'', audio_url:"assets/play/music/card.mp3", title: "4"
pic_url:'', audio_url:"assets/play/music/card.mp3", title: "4"
});
picArr.push({
pic_url:'', audio_url:"assets/play/music/card.mp3", title: "5"
pic_url:'', audio_url:"assets/play/music/card.mp3", title: "5"
});
picArr.push({
pic_url:'', audio_url:"assets/play/music/card.mp3", title: "6"
pic_url:'', audio_url:"assets/play/music/card.mp3", title: "6"
});
this.data.sideB=1;
this.data.contentObj.picArr = picArr;
}
......@@ -484,7 +485,7 @@ initAudio() {
const addUrlToAudioObj = (audioUrl) => {
if (audioUrl) {
// console.log('audioUrl:', audioUrl);
const audio = new Audio();
audio.src = audioUrl;
......@@ -528,11 +529,11 @@ initAudio() {
// addOneAudio('sm-back', this.rawAudios.get('sm-back'), 1);
// addOneAudio('sm-display', this.rawAudios.get('sm-display'), 1);
//addOneAudio('sm-wrong', this.rawAudios.get('sm-wrong'), 1);
// addOneAudio('sm-win', this.rawAudios.get('sm-win'), 1);
// addOneAudio('sm-in', this.rawAudios.get('sm-in'), 1);
addOneAudio('touzi', this.rawAudios.get('touzi'), 1);
addOneAudio('card', this.rawAudios.get('card'), 1);
addOneAudio('start', this.rawAudios.get('start'), 1);
// addOneAudio('sm-win', this.rawAudios.get('sm-win'), 1);
// addOneAudio('sm-in', this.rawAudios.get('sm-in'), 1);
addOneAudio('touzi', this.rawAudios.get('touzi'), 1);
addOneAudio('card', this.rawAudios.get('card'), 1);
addOneAudio('start', this.rawAudios.get('start'), 1);
// this.successAudio.onended = () => {
// // this.showSuccessAudio();
......@@ -556,11 +557,11 @@ initImg() {
const arr = this.data.contentObj.picArr;
if (arr) {
for (let i = 0; i < arr.length; i++) {
addPicUrl( arr[i].pic_url);
}
}
......@@ -568,7 +569,7 @@ initImg() {
// 预加载资源
this.loadResources().then(() => {
this.loadResources().then(() => {
window["air"].hideAirClassLoading("ball",this.data);
// this.setfontData();
this.init();
......@@ -604,9 +605,9 @@ initImg() {
// this.mapScale = this.canvasWidth / this.canvasBaseW;
// this.mapScale = this.canvasHeight / this.canvasBaseH;
this.renderArr = [];
this.isStart = false;
if (!this.data.contentObj.picArr) {
......@@ -624,7 +625,7 @@ initImg() {
/**
* 初始化试图
*/
initView() {
initView() {
//加背景
this.initBg();
//加流星
......@@ -640,25 +641,25 @@ initImg() {
a
big(){
const tween=tweenChange(this.tz, {scaleX: 1.1, scaleY: 1.1}, 1 , ()=>{
this.small();
const tween=tweenChange(this.tz, {scaleX: 1.1, scaleY: 1.1}, 1 , ()=>{
this.small();
});
this.a=tween;
}
w
small(){
const tween=tweenChange(this.tz, {scaleX: 1, scaleY: 1}, 1 , ()=>{
this.big();
const tween=tweenChange(this.tz, {scaleX: 1, scaleY: 1}, 1 , ()=>{
this.big();
});
this.w=tween;
}
......@@ -667,19 +668,19 @@ small(){
stouzi(){
//声明骰子
this.tz=new MySprite();
this.t= new MySprite();
this.t= new MySprite();
this.tz.addChild(this.t);
this.t.init(this.images.get("t1"));
// this.startBorder.addChild(this.tz);
this.tz.setScaleXY(this.mapScale/1.2);
this.tz.y=this.canvasHeight/2.5;
this.tz.x=this.canvasWidth/2;
this.renderArr.push(this.tz);
this.renderArr.push(this.tz);
}
Btn
......@@ -687,7 +688,7 @@ stn
retn
startBtn(){
const allwidth=((this.cardArr.length/2)*280+(this.cardArr.length/2-1)*56)*this.mapScale;
this.Btn= new MySprite();
......@@ -702,7 +703,7 @@ startBtn(){
// this.startBorder.addChild(this.Btn);
this.stn.visible=true;
this.retn.visible=false;
this.Btn.setScaleXY(this.mapScale/1.5);
this.b=0;
this.Btn.y=this.canvasHeight/1.2;
......@@ -711,9 +712,9 @@ startBtn(){
}
s1
Animation(){
......@@ -726,7 +727,7 @@ Animation(){
this.s1.y=-1.2*this.canvasHeight;
this.startBorder.addChild(this.s1);
const randomT = 9;
this.s1['time'] = randomT;
moveItem(this.s1, -(this.canvasWidth + this.s1.width * this.s1.scaleX), this.canvasHeight + this.s1.height * this.s1.scaleY, this.s1['time'], () => {
......@@ -735,7 +736,7 @@ Animation(){
setTimeout(() => {
this.Animation();
},2000);
......@@ -791,166 +792,171 @@ getPetal() {
bg
startBorder
bgLayer
count=0;
active=1;
last
mapDown(event) {
mapDown(event) {
if (!this.canTouch) {
return;
}
}
//点击开始按钮,骰子竖直跳下来,卡片弹出来
if (this.checkClickTarget(this.stn)&&(this.b==0)) {
this.canTouch=false;
this.big();
this.startGame();
setTimeout(() => {
this.canTouch=true;
}, 1600);
if (!this.isStart) {
if (this.checkClickTarget(this.stn)&&(this.b==0)) {
this.canTouch=false;
this.big();
this.startGame();
setTimeout(() => {
this.canTouch=true;
}, 1600);
// return;
this.isStart = true;
}
return;
}
//点击重新开始按钮
if (this.checkClickTarget(this.retn)&&(this.b==1)) {
this.canTouch=false;
if (this.checkClickTarget(this.retn)&&(this.b==1)) {
this.canTouch=false;
for(let i=0;i<this.cardArr.length;i++){
tweenChange(this.cardArr[i], {scaleX: 0, scaleY: 0}, 0.3, ()=>{
});
}
this.tz.visible=true;
this.tz.setScaleXY(this.mapScale/1.5);
this.tz.y=-50;
// this.big();
this.startGame();
this.startGame();
setTimeout(() => {
this.canTouch=true;
}, 1600);
}, 1600);
}
//点击骰子,随机选卡]
if (this.checkClickTarget( this.t)) {
this.canTouch=false;
this.a.stop();
this.w.stop();
this.starttouzi();
setTimeout(() => {
this.canTouch=true;
}, 1900);
}, 1900);
return;
}
//点击图片正面的动作
//点击图片正面的动作
for(let i=0;i<this.cardArr.length;i++){
let card = this.cardArr[i];
let cardBg = card.children[1];
console.log("i"+i);
if (this.checkClickTarget(cardBg)&&(this.bs[i]==1)){
if (this.checkClickTarget(cardBg)&&(this.bs[i]==1)){
console.log("contc"+this.countc);
this.countc++;
let lcard;
lcard=this.cardArr[this.x];
if(this.countc==1){
if(this.countc==1){
}
else{
const audio = this.audioObj[lcard["audio_url"]];
audio.pause();
audio.currentTime = 0;
}
this.playAudio(card["audio_url"]);
this.playAudio(card["audio_url"]);
this.x=i;
console.log("i-"+i);
this.playAudio(card["audio_url"]);
this.playAudio(card["audio_url"]);
return;
}
}
}
countc=0;
x
starttouzi(){
this.count++;
//骰子转动,给一个随机数
this.canTouch = false;
this.canTouch = false;
this.tAnimation();
if(this.count!=1){
hideItem(this.faguang[this.last]);
}
if(this.count==6){
this.canTouch = false;
this.canTouch = false;
this.count=0;
setTimeout(() => {
//骰子消失
// hideItem(this.tz);
this.tz.visible=false;
//重新开始按钮
//重新开始按钮
this.stn.visible=false;
this.retn.visible=true;
this.b=1;
setTimeout(() => {
tweenChange(this.Btn, {scaleX: 1, scaleY: 1}, 0.3 , ()=>{
});
}, 180);
}, 1300);
tweenChange(this.Btn, {scaleX: 1, scaleY: 1}, 0.3 , ()=>{
});
}, 180);
}, 1300);
}
}
b
btnIn1(item){
......@@ -964,74 +970,74 @@ bgLayer
}
//开始游戏
startGame(){
this.canTouch = false;
this.canTouch = false;
this.playAudio("start");
//生成随机数组
if(this.count==0){
this.randomtz();
}
//按钮消失
tweenChange(this.Btn, {scaleX: 1.2, scaleY: 1.2}, 0.3 , ()=>{
tweenChange(this.Btn, {scaleX: 1.2, scaleY: 1.2}, 0.3 , ()=>{
});
setTimeout(() => {
tweenChange(this.Btn, {scaleX: 0, scaleY: 0}, 0.3 , ()=>{
});
}, 180);
tweenChange(this.Btn, {scaleX: 0, scaleY: 0}, 0.3 , ()=>{
});
}, 180);
//卡片弹出来
setTimeout(() => {
this.initCard();
}, 180);
this.initCard();
}, 180);
//骰子掉下来
setTimeout(() => {
this.touzi();
}, 300);
}, 300);
}
tz
t;
randomt
touzi(){
//骰子掉下来
this.btnIn1(this.tz);
}
fancard(){
this.overCard(this.cardArr[this.randomt],()=>{
});
}
tAnimation(){
this.randomt = this.newball[0];
this.playAudio("touzi");
console.log("this.a"+this.a);
const animation=new MyAnimation();
for(let j=0;j<2;j++){
for(let i=0;i<6;i++){
const imgobj=this.images.get('touzi'+i);
animation. addFrameByImg(imgobj);
}
}
animation.delayPerUnit=0.09;
//骰子旋转
animation.play();
animation.playEnd=() => {
if(this.data.sideA==1)
{
......@@ -1041,51 +1047,51 @@ bgLayer
if(this.data.sideB==1){
this.bs[ this.randomt]=1;
}
animation.stop();
animation.stop();
let x=3;
// this.t.init(this.images.get("t"+x));
this.t.init(this.images.get("t"+(this.randomt+1)));
alphaItem(this.faguang[this.randomt],1);
this.last=this.randomt;
this.overCard(this.cardArr[this.randomt],()=>{
//发光特效
//this.cardArr[this.randomt].faguang.visible=true;
// this.cardArr[this.randomt].children[]
let rect = this.cardArr[this.randomt].getBoundingBox();
rect.x=this.cardArr[this.randomt].x-120;
rect.y=this.cardArr[this.randomt].y-140;
rect.width=250;
rect.height=250;
showBlingBling(this.images.get('ss'), rect, this.bgLayer, this.mapScale*1.5, 1, 0.05, 1.5);
});
this.newball.splice(0,1);
this.a.start();
this.w.start();
};
};
this.tz.addChild(animation);
}
ss1
ss2
ss3
ss4
oldball
newball
randomtz(){
......@@ -1095,12 +1101,12 @@ bgLayer
}
endPageArr;
showPetalFlag;
initCard(){
this.randomItemCard();
// this.cardArr = randomSortByArr(this.cardArr); //重新排序卡片组
// this.cardArr = randomSortByArr(this.cardArr); //重新排序卡片组
this.initItemCard();//设定卡片的位置
//卡片恢复之前的状态
for(let i=0;i<this.cardArr.length;i++){
let card = this.cardArr[i];
......@@ -1110,47 +1116,47 @@ bgLayer
this.StartAnimation(this.cardArr);
}
initItemCard(){
const picLength = this.cardArr.length;
const top = (120)*this.mapScale;//卡片第一排距离头顶的距离
const top2 = (212+160)*this.mapScale;//卡片第二排距离头顶的距离
const allWidth = ((picLength/2)*280+(picLength/2-1)*80)*this.mapScale;//卡片总宽
const drawItem = (index)=>{
const drawItem = (index)=>{
//设置卡片间距
let itemBack = this.cardArr[index];
if(index<3){
itemBack.y = top;
let itemBack = this.cardArr[index];
if(index<3){
itemBack.y = top;
itemBack.x = (this.canvasWidth-allWidth)/2+(((index)*(253+55))+200)*this.mapScale;//剩余的宽加
}else{
itemBack.y = top2;
itemBack.y = top2;
itemBack.x = (this.canvasWidth-allWidth)/2+(((index-3)*(253+55))+200)*this.mapScale;//剩余的宽加
}
itemBack.setScaleXY(this.mapScale);
this.renderArr.push(itemBack);
this.renderArr.push(itemBack);
};
for(let i=0;i<6;i++){
drawItem(i);
drawItem(i);
}
}
StartAnimation(cardArr){
StartAnimation(cardArr){
//卡片渐进显示
/*for(let i=0;i<cardArr.length;i++){
tweenChange(cardArr[i], {alpha: 1}, 0.3, ()=>{
......@@ -1159,24 +1165,24 @@ bgLayer
this.overCard(cardArr[i],()=>{
this.canTouch = true;
});
}, 1000);
});
}*/
for(let i=0;i<cardArr.length;i++){
tweenChange(cardArr[i], {scaleX: 0, scaleY: 0}, 0, ()=>{
});
setTimeout(() => {
tweenChange(cardArr[i], {scaleX: 0.5, scaleY: 0.5}, 0.3);
}, 1000);
}
}
overCard(item , callback?: any){
overCard(item , callback?: any){
let w = item.scaleX;
this.playAudio("card");
tweenChange(item, {scaleX: 0}, 0.3,()=>{
......@@ -1191,97 +1197,97 @@ bgLayer
back=[]
bs=[];
faguang=[]
randomItemCard(){
randomItemCard(){
this.cardArr = [];
for(let i=0;i<6;i++){
let item = this.picArr[i];
let pic = new MySprite();
//初始化设置为隐藏
pic.alpha = 1;
pic.childDepandAlpha = true;
//声明正反面的对象
this.back[i] = new MySprite();
this.back[i] = new MySprite();
this.front[i] = new MySprite();
this.faguang[i]=new MySprite();
this.faguang[i].alpha=0;
//设置索引
pic["index"] = i;
pic["index"] = i;
this.faguang[i].init(this.images.get("发光"));
let bgRect = new ShapeRect();
bgRect.setSize(390, 390);
bgRect.init();
bgRect.fillColor = '#ff83fa';
this.front[i].addChild(bgRect, -1);
this.q=bgRect;
//把设置好的正反面变量放到卡片组里
if(this.data.sideA==1){
//如果选择默认是正面,bs=0
for(let i=0;i<this.picArr.length;i++){
this.bs[i]=1;
}
pic.addChild(this.back[i]);
pic.addChild(this.front[i]);
}
else if(this.data.sideB==1){
for(let i=0;i<this.picArr.length;i++){
this.bs[i]=0;
}
pic.addChild(this.front[i]);
pic.addChild(this.back[i]);
}
//音频路径做属性保存,方便点击卡片播放
if(item.audio_url){
pic["audio_url"] = item.audio_url;
console.log(item.audio_url+"pic-audio");
console.log(item.audio_url+"pic-audio");
}
const maxLen = 400;
if(item.pic_url){
let pic = new MySprite();
pic.init(this.images.get(item.pic_url));
//如果是横图设置图片填充卡片正面的比例
pic.init(this.images.get(item.pic_url));
//如果是横图设置图片填充卡片正面的比例
if(pic.width>pic.height){
pic.setScaleXY(getMinScale(pic, maxLen));
pic.x=2;
this.front[i].addChild(pic);
}
}
//如果是竖图设置图片填充卡片正面的比例
if(pic.width<=pic.height&&(pic.width+40)>=pic.height){
pic.setScaleXY(getMinScale(pic, maxLen-80));
pic.x=0;
pic.y=-3;
}
//如果是正方图设置图片填充卡片正面的比例
if(pic.width<=pic.height&&(pic.width+40)<pic.height){
pic.setScaleXY(getMinScale(pic, maxLen-60));
pic.x=-5;
pic.y=-6;
}
}
this.front[i].addChild(pic);
}else{
const label = new Label();
label.text = item.title;
......@@ -1289,18 +1295,18 @@ bgLayer
label.fontColor = '#ed3a33';
label.fontSize = 200;
label.textAlign = 'center';
label.setMaxSize((bgRect.width - 20)+10);
console.log(bgRect.width - 20+"卡片文字位置");
this.front[i].addChild(label);
}
}
this.front[i].addChild(this.faguang[i],-1);
this.back[i].addChild(this.faguang[i],-1);
this.cardArr.push(pic);
this.cardArr.push(pic);
this.cardArr[i].alpha=1;
}
}
this.back[0].init(this.images.get("back0"));
this.back[4].init(this.images.get("back0"));
this.back[1].init(this.images.get("back1"));
......@@ -1313,19 +1319,19 @@ bgLayer
this.front[5].init(this.images.get("front1"));
this.front[3].init(this.images.get("front2"));
this.front[2].init(this.images.get("front2"));
}
initBg() {
initBg() {
this.bgLayer = new MySprite();
this.renderArr.push(this.bgLayer);
this.renderArr.push(this.bgLayer);
const bg = new ShapeRect();
bg.fillColor = '#75d100';
bg.setSize(this.canvasWidth, this.canvasHeight);
this.renderArr.push(bg);
this.renderArr.push(bg);
this.bg = bg;
//把图片填充入背景,全覆盖
this.startBorder = new MySprite();
this.startBorder.init(this.images.get('BG'));
......@@ -1336,13 +1342,13 @@ bgLayer
const s=Math.max(sx,sy);
console.log(s+"s");
this.startBorder.setScaleXY(s);
this.renderArr.push(this.startBorder);
this.renderArr.push(this.startBorder);
}
mapMove(event) {
}
......@@ -1373,4 +1379,4 @@ bgLayer
}
\ No newline at end of file
}
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