308 lines
10 KiB
TypeScript
308 lines
10 KiB
TypeScript
//此页面为引导页面，后续更新成模板，暂时偷懒复制主游戏场景代码进来
|
||
|
||
const {ccclass, property} = cc._decorator;
|
||
@ccclass
|
||
export default class NewClass extends cc.Component {
|
||
// LIFE-CYCLE CALLBACKS:
|
||
@property(cc.Node)
|
||
dialog: cc.Node = null;
|
||
@property(cc.Node)
|
||
ball: cc.Node = null;
|
||
@property(cc.Prefab)
|
||
qiu1: cc.Prefab = null;
|
||
@property(cc.Prefab)
|
||
linePrefab: cc.Prefab = null;
|
||
clickNow:number;
|
||
custom: number;
|
||
Pos_Array: any;
|
||
ball_Array: any;
|
||
begin: boolean;
|
||
tip: cc.Node;
|
||
// onLoad () {}
|
||
|
||
start () {
|
||
cc.fx.GameConfig.GM_INFO.custom = 0;
|
||
this.init();
|
||
this.startGuide(0);
|
||
}
|
||
//初始化数据
|
||
init(){
|
||
this.custom = 1;
|
||
this.ball.zIndex = 100;
|
||
this.Pos_Array = [];
|
||
this.ball_Array = [];
|
||
this.begin = false;
|
||
this.clickNow = 0;
|
||
this.tip = null;
|
||
}
|
||
//开始引导方法
|
||
startGuide(type){
|
||
let num = this.custom;
|
||
let time = 0.5;
|
||
let name = "tip" + num;
|
||
if(type!=0){
|
||
cc.tween(this.node)
|
||
.to(time,{opacity:255})
|
||
.call(() =>{
|
||
this.custom += 1;
|
||
if(type != 0) this.custom = 2;
|
||
if( this.custom == 2) this.createSun(true);
|
||
else if( this.custom == 3) this.createSun(false);
|
||
else if( this.custom == 4) this.begin = true;
|
||
else if( this.custom == 5) cc.director.loadScene("GameScene");
|
||
})
|
||
.start();
|
||
}
|
||
else{
|
||
this.tip = this.dialog.getChildByName(name);
|
||
this.tip.active = true; this.tip.opacity = 0;
|
||
cc.tween(this.tip)
|
||
.to(time,{opacity:255})
|
||
.start();
|
||
}
|
||
}
|
||
//清除所有太阳
|
||
beginClick(){
|
||
for(let i=0; i<this.ball_Array.length; i++){
|
||
this.ball_Array[i].getComponent("Sun").move = false;
|
||
}
|
||
}
|
||
//点击开始游戏，或者点击跳过引导
|
||
clickBtn(){
|
||
cc.director.loadScene("GameScene");
|
||
}
|
||
//点击下一步按钮
|
||
next(){
|
||
let time = 0.5;
|
||
cc.tween(this.tip)
|
||
.to(time,{opacity:0})
|
||
.call(() =>{
|
||
this.custom += 1;
|
||
if( this.custom == 2) this.createSun(true);
|
||
else if( this.custom == 3) this.createSun(false);
|
||
else if( this.custom == 4) this.begin = true;
|
||
else if( this.custom == 5) cc.director.loadScene("GameScene");
|
||
|
||
})
|
||
.start();
|
||
}
|
||
//创建太阳
|
||
createSun(type){
|
||
if(type == true){
|
||
this.ball_Array = [];
|
||
this.Pos_Array.push(cc.v2(-250,-216),cc.v2(200,-115),cc.v2(-35,-500));
|
||
let time1 = this.calculateDistance(this.ball.x,this.ball.y,this.Pos_Array[0].x,this.Pos_Array[0].y)
|
||
this.ball.opacity = 0;
|
||
cc.tween(this.ball)
|
||
.to(time1,{position:this.Pos_Array[0]})
|
||
.call(() =>{
|
||
this.createBall(0,0,0,false);
|
||
})
|
||
.delay(1)
|
||
.call(() =>{
|
||
this.startGuide(0);
|
||
})
|
||
.start();
|
||
}
|
||
else{
|
||
let time2 = this.calculateDistance(this.Pos_Array[0].x,this.Pos_Array[0].y,this.Pos_Array[1].x,this.Pos_Array[1].y)
|
||
let time3 = this.calculateDistance(this.Pos_Array[1].x,this.Pos_Array[1].y,this.Pos_Array[2].x,this.Pos_Array[2].y)
|
||
this.ball.opacity = 255;
|
||
this.createLine(cc.v2(this.ball.x,this.ball.y),cc.v2(this.Pos_Array[1].x,this.Pos_Array[1].y),
|
||
0.5);
|
||
cc.tween(this.ball)
|
||
.to(time2,{position:this.Pos_Array[1]})
|
||
.call(() =>{
|
||
this.createBall(1,0,0,false);
|
||
})
|
||
.delay(0.5)
|
||
.call(() =>{
|
||
this.createLine(cc.v2(this.ball.x,this.ball.y),cc.v2(this.Pos_Array[2].x,this.Pos_Array[2].y),
|
||
0.5);
|
||
})
|
||
.to(time3,{position:this.Pos_Array[2]})
|
||
.call(() =>{
|
||
this.createBall(2,0,0,false);
|
||
this.ball.opacity = 0;
|
||
})
|
||
.delay(0.2)
|
||
.call(() =>{
|
||
this.destroyLine();
|
||
this.startGuide(0);
|
||
})
|
||
.start();
|
||
}
|
||
|
||
}
|
||
//创建太阳
|
||
createBall(number,color,speed,repeat){
|
||
let ball = null;
|
||
ball = cc.instantiate(this.qiu1);
|
||
ball.parent = this.node.getChildByName("Sun");
|
||
ball.zIndex = this.Pos_Array.length - number;
|
||
ball.setPosition(this.ball.x,this.ball.y);
|
||
ball.getComponent("Sun").init(number,color,speed,repeat);
|
||
ball.getComponent("Sun").move = true;
|
||
this.ball_Array.push(ball);
|
||
}
|
||
//获取两点之间角度创建连线用
|
||
calculateDistance(x1, y1, x2, y2) {
|
||
const dx = x2 - x1;
|
||
const dy = y2 - y1;
|
||
var distance = Math.sqrt(dx*dx + dy*dy);
|
||
if(distance > 800) distance = 800;
|
||
const time = distance/800 * 0.8;
|
||
return time;
|
||
}
|
||
|
||
//引导成功
|
||
passLevel(){
|
||
let win = this.node.getChildByName("Win");
|
||
win.active = true; win.setScale(0);
|
||
cc.tween(win)
|
||
.delay(0.4)
|
||
.to(0.01,{scale:2.5})
|
||
.to(0.35,{scale:1})
|
||
.delay(0.6)
|
||
.call(() =>{
|
||
win.active = false;
|
||
setTimeout(() => {
|
||
this.destroyLine();
|
||
let timeArray = [];
|
||
let timeCount = 0;
|
||
let ball = this.ball_Array[0];
|
||
for(let i=1; i< this.ball_Array.length; i++){
|
||
let time = this.calculateDistance(this.ball_Array[i].x,this.ball_Array[i].y,
|
||
this.ball_Array[i-1].x,this.ball_Array[i-1].y);
|
||
timeArray.push(time);
|
||
}
|
||
for(let k=1; k< this.ball_Array.length; k++){
|
||
setTimeout(() => {
|
||
cc.tween(ball)
|
||
.to(timeArray[k-1],{x:this.ball_Array[k].x,y:this.ball_Array[k].y})
|
||
.call(() =>{
|
||
this.ball_Array[k].active = false;
|
||
if(k == this.ball_Array.length-1){
|
||
setTimeout(() => {
|
||
this.ball.opacity = 255;
|
||
this.ball.position = cc.v3(ball.x,ball.y,0);
|
||
this.ball.active = false;
|
||
this.startGuide(0);
|
||
}, 200);
|
||
}
|
||
})
|
||
.start();
|
||
}, timeCount*1000);
|
||
timeCount += (timeArray[k-1]+0.1);
|
||
}
|
||
}, 400);
|
||
})
|
||
.start();
|
||
}
|
||
//点击太阳执行方法
|
||
clickSun(data){
|
||
if(this.begin == true){
|
||
if(data == this.clickNow){
|
||
cc.fx.AudioManager._instance.playAudioButton();
|
||
if(this.clickNow > 0){
|
||
this.createLine(cc.v2(this.ball_Array[this.clickNow-1].x,this.ball_Array[this.clickNow-1].y),
|
||
cc.v2(this.ball_Array[this.clickNow].x,this.ball_Array[this.clickNow].y),
|
||
0.2);
|
||
}
|
||
this.clickNow += 1;
|
||
cc.fx.GameConfig.GM_INFO.total += 1;
|
||
setTimeout(() => {
|
||
if(this.ball_Array[this.clickNow-1])
|
||
this.ball_Array[this.clickNow-1].getChildByName("guang").active = false;
|
||
}, 200);
|
||
if(this.clickNow == 3){
|
||
this.passLevel();
|
||
}
|
||
}
|
||
else{
|
||
this.loseLevel();
|
||
}
|
||
}
|
||
}
|
||
//失败事件
|
||
loseLevel(){
|
||
this.begin = false;
|
||
cc.fx.AudioManager._instance.playWarning();
|
||
this.destroyLine();
|
||
let ball = this.ball_Array[0];
|
||
for(let k=1; k< this.ball_Array.length; k++){
|
||
cc.tween(this.ball_Array[k])
|
||
.to(0.6,{x:ball.x,y:ball.y})
|
||
.call(() =>{
|
||
this.ball_Array[k].active = false;
|
||
if(k == this.ball_Array.length-1){
|
||
this.ball.opacity = 0;
|
||
this.ball.position = cc.v3(ball.x,ball.y,0);
|
||
this.clearSun();
|
||
this.custom = 1;
|
||
this.startGuide(1);
|
||
}
|
||
})
|
||
.start()
|
||
}
|
||
//结束页面动画
|
||
let over = this.node.getChildByName("Over");
|
||
cc.tween(over)
|
||
.to(0.25,{opacity:255})
|
||
.delay(0.1)
|
||
.to(0.2,{opacity:0})
|
||
.delay(0.1)
|
||
.to(0.15,{opacity:255})
|
||
.delay(0.1)
|
||
.to(0.1,{opacity:0})
|
||
.start();
|
||
}
|
||
//点击太阳事件
|
||
clearSun(){
|
||
for(let k=0; k< this.ball_Array.length; k++){
|
||
this.ball_Array[k].removeFromParent();
|
||
this.ball_Array[k] = null;
|
||
}
|
||
this.ball_Array = [];
|
||
}
|
||
|
||
//创造连线，参数起点，终点，连线时间
|
||
createLine(start,end,time){
|
||
let line = cc.instantiate(this.linePrefab);
|
||
line.parent = this.node.getChildByName("Line");
|
||
line.setPosition(start.x,start.y);
|
||
|
||
const dx = end.x - start.x;
|
||
const dy = end.y - start.y;
|
||
var distance = Math.sqrt(dx*dx + dy*dy);
|
||
line.height = distance;
|
||
line.getComponent(cc.Sprite).fillRange = 0;
|
||
line.angle = -this.calculateAngle(start.x,start.y,end.x,end.y);
|
||
cc.tween(line.getComponent(cc.Sprite))
|
||
.to(time,{fillRange:1})
|
||
.start();
|
||
}
|
||
//摧毁连线
|
||
destroyLine() {
|
||
for(let i =0; i< this.node.getChildByName("Line").children.length;i++){
|
||
if(this.node.getChildByName("Line").children[i]){
|
||
this.node.getChildByName("Line").children[i].removeFromParent();
|
||
this.node.getChildByName("Line").children[i] = null;
|
||
}
|
||
}
|
||
this.node.getChildByName("Line").removeAllChildren();
|
||
}
|
||
//获取两个点之间的角度 用于写连线 确定连线方向
|
||
calculateAngle(x1, y1, x2, y2) {
|
||
var angle = Math.atan2(y2-y1,x2-x1)*180 / Math.PI - 90;
|
||
return -angle;
|
||
}
|
||
onEnable () {
|
||
cc.fx.Notifications.on("clickSun", this.clickSun, this);
|
||
}
|
||
onDisable () {
|
||
cc.fx.Notifications.off("clickSun", this.clickSun);
|
||
}
|
||
|
||
}
|