From 33f96d8ce5e9816912b352f53a66773482779fea Mon Sep 17 00:00:00 2001 From: libccy Date: Mon, 28 Dec 2015 17:08:52 +0800 Subject: [PATCH] snow --- card/hearth.js | 2 +- game/game.js | 4 + layout/default/layout.css | 1 + play/coin.js | 243 +++++++++++++++++++++++++++++++++++++- 4 files changed, 246 insertions(+), 4 deletions(-) diff --git a/card/hearth.js b/card/hearth.js index 42aad4c18..617d7f3e7 100644 --- a/card/hearth.js +++ b/card/hearth.js @@ -16,7 +16,7 @@ card.hearth={ }, ai:{ basic:{ - order:2, + order:1.8, value:[6,1], useful:2, }, diff --git a/game/game.js b/game/game.js index 90f46723a..75cafce05 100755 --- a/game/game.js +++ b/game/game.js @@ -1279,6 +1279,10 @@ } } }, + coin_free_playpackconfig:{ + name:'仅在空闲时显示特效', + init:false, + }, update:function(config,map){ for(var i in map){ if(i.indexOf('_playpackconfig')!=-1){ diff --git a/layout/default/layout.css b/layout/default/layout.css index 31461b8b7..fe5552211 100755 --- a/layout/default/layout.css +++ b/layout/default/layout.css @@ -1281,6 +1281,7 @@ div[data-color="unknownm"]{ padding-right: 5px; height: auto; font-size: 24px; + box-shadow: rgba(0, 0, 0, 0.3) 0 0 0 1px, rgba(0, 0, 0, 0.3) 0 0 5px !important } .coin_menu .content>.caption>.coin_buy>.menubutton.disabled{ opacity: 0.5; diff --git a/play/coin.js b/play/coin.js index 348634493..37b842c73 100644 --- a/play/coin.js +++ b/play/coin.js @@ -26,9 +26,9 @@ play.coin={ uiintro.listen(function(e){ e.stopPropagation(); }); - uiintro.add('
放烟花
100金
'); + uiintro.add('
烟花
100金
'); var buyfirework=uiintro.content.lastChild.lastChild.lastChild; - if(lib.config.coin<100){ + if(lib.config.coin<100&&!_status.fireworkbought){ buyfirework.classList.add('disabled'); } if(_status.fireworkbought){ @@ -59,6 +59,39 @@ play.coin={ ui.click.window(); }); + uiintro.add('
下雪
100金
'); + var buysnow=uiintro.content.lastChild.lastChild.lastChild; + if(lib.config.coin<100&&!_status.snowbought){ + buysnow.classList.add('disabled'); + } + if(_status.snowbought){ + if(_status.snowRunning){ + buysnow.innerHTML='停止'; + } + else{ + buysnow.innerHTML='开始'; + } + } + buysnow.listen(function(){ + if(this.innerHTML=='100金'){ + if(lib.config.coin>=100){ + _status.snowbought=true; + game.changeCoin(-100); + game.haveFun.snow(); + } + else{ + return; + } + } + else if(this.innerHTML=='停止'){ + game.haveFun.snowStop(); + } + else if(this.innerHTML=='开始'){ + game.haveFun.snow(); + } + ui.click.window(); + }); + uiintro.classList.add('noleave'); return uiintro; },220,400); @@ -79,6 +112,204 @@ play.coin={ } }, haveFun:{ + snow:function(){ + _status.snowRunning=true; + if(game.haveFun.snowStart){ + game.haveFun.snowStart(); + } + else{ + /* + * 自由下雪 snowFall + * author：xuanfeng + * time: 2014-01-11 + */ + // 控制下雪 + var canvas; + function snowFall(snow) { + // 可配置属性 + snow = snow || {}; + this.maxFlake = snow.maxFlake || 200; //最多片数 + this.flakeSize = snow.flakeSize || 10; //雪花形状 + this.fallSpeed = snow.fallSpeed || 2; //坠落速度 + this.status = 0; //0-初始化、1-开始下雪、2-停止下雪、3-暂停下雪、4-继续下雪 + } + + // 兼容写法 + requestAnimationFrame = window.requestAnimationFrame || + window.mozRequestAnimationFrame || + window.webkitRequestAnimationFrame || + window.msRequestAnimationFrame || + window.oRequestAnimationFrame || + function(callback) { setTimeout(callback, 1000 / 60); }; + cancelAnimationFrame = window.cancelAnimationFrame || + window.mozCancelAnimationFrame || + window.webkitCancelAnimationFrame || + window.msCancelAnimationFrame || + window.oCancelAnimationFrame; + + // 开始下雪 + snowFall.prototype.start = function(){ + if(this.status == 1 || this.status == 4){ + // 已经在下雪则不作处理 + return false; + } + this.status = 1; + + // 创建画布 + snowCanvas.apply(this); + // 创建雪花形状 + createFlakes.apply(this); + // 画雪 + drawSnow.apply(this) + } + + // 停止下雪 + snowFall.prototype.stop = function(){ + if(this.status == 2 || this.status == 0 || !this.canvas){ + return false; + } + // 停止动画循环 + this.pause(); + this.status = 2; + // 删除画布 + this.canvas.parentNode.removeChild(this.canvas); + this.canvas = null; + } + + // 暂停下雪 + snowFall.prototype.pause = function(){ + if(this.status == 3){ + return false; + } + this.status = 3; + cancelAnimationFrame(this.loop) + }; + // 继续下雪 + snowFall.prototype.resume = function(){ + if(this.status == 3 && this.canvas){ + this.status = 4; + // 动画的计时控制 + this.loop = requestAnimationFrame(function() { + drawSnow.apply(that) + }); + } + }; + + // 创建画布 + function snowCanvas() { + // 添加Dom结点 + var snowcanvas = document.createElement("canvas"); + snowcanvas.classList.add('fun'); + snowcanvas.id = "snowfall"; + ui.window.appendChild(snowcanvas); + canvas=snowcanvas; + this.canvas = snowcanvas; + this.ctx = snowcanvas.getContext("2d"); + // 窗口大小改变的处理 + lib.onresize.push(function() { + snowcanvas.width = ui.window.offsetWidth; + snowcanvas.height = ui.window.offsetHeight + }); + snowcanvas.width = ui.window.offsetWidth; + snowcanvas.height = ui.window.offsetHeight; + } + + // 雪运动对象 + function flakeMove(canvasWidth, canvasHeight, flakeSize, fallSpeed) { + this.x = Math.floor(Math.random() * canvasWidth); //x坐标 + this.y = Math.floor(Math.random() * canvasHeight); //y坐标 + this.size = Math.random() * flakeSize + 2; //形状 + this.maxSize = flakeSize; //最大形状 + this.speed = Math.random() * 1 + fallSpeed; //坠落速度 + this.fallSpeed = fallSpeed; //坠落速度 + this.velY = this.speed; //Y方向速度 + this.velX = 0; //X方向速度 + this.stepSize = Math.random() / 30; //步长 + this.step = 0 //步数 + } + + flakeMove.prototype.update = function() { + var x = this.x, + y = this.y; + + // 左右摆动(余弦) + this.velX *= 0.98; + if (this.velY <= this.speed) { + this.velY = this.speed + } + this.velX += Math.cos(this.step += .05) * this.stepSize; + + this.y += this.velY; + this.x += this.velX; + // 飞出边界的处理 + if (this.x >= canvas.width || this.x <= 0 || this.y >= canvas.height || this.y <= 0) { + this.reset(canvas.width, canvas.height) + } + }; + + // 飞出边界-放置最顶端继续坠落 + flakeMove.prototype.reset = function(width, height) { + this.x = Math.floor(Math.random() * width); + this.y = 0; + this.size = Math.random() * this.maxSize + 2; + this.speed = Math.random() * 1 + this.fallSpeed; + this.velY = this.speed; + this.velX = 0; + }; + + // 渲染雪花-随机形状 + flakeMove.prototype.render = function(ctx) { + var snowFlake = ctx.createRadialGradient(this.x, this.y, 0, this.x, this.y, this.size); + snowFlake.addColorStop(0, "rgba(255, 255, 255, 0.9)"); + snowFlake.addColorStop(.5, "rgba(255, 255, 255, 0.5)"); + snowFlake.addColorStop(1, "rgba(255, 255, 255, 0)"); + ctx.save(); + ctx.fillStyle = snowFlake; + ctx.beginPath(); + ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2); + ctx.fill(); + ctx.restore(); + }; + + // 创建雪花-定义形状 + function createFlakes() { + var maxFlake = this.maxFlake, + flakes = this.flakes = [], + canvas = this.canvas; + for (var i = 0; i < maxFlake; i++) { + flakes.push(new flakeMove(canvas.width, canvas.height, this.flakeSize, this.fallSpeed)) + } + } + + // 画雪 + function drawSnow() { + var maxFlake = this.maxFlake, + flakes = this.flakes; + var ctx = this.ctx, canvas = this.canvas, that = this; + // 清空雪花 + ctx.clearRect(0, 0, canvas.width, canvas.height); + for (var e = 0; e < maxFlake; e++) { + flakes[e].update(); + flakes[e].render(ctx); + } + // 一帧一帧的画 + this.loop = requestAnimationFrame(function() { + drawSnow.apply(that); + }); + } + + // 调用及控制方法 + var snow = new snowFall({maxFlake:200}); + game.haveFun.snowStart=function(){ + snow.start(); + } + game.haveFun.snowStop=function(){ + _status.snowRunning=false; + snow.stop(); + } + snow.start(); + } + }, fireworkStop:function(){ _status.fireworkRunning=false; }, @@ -91,7 +322,7 @@ play.coin={ else{ // when animating on canvas, it is best to use requestAnimationFrame instead of setTimeout or setInterval // not supported in all browsers though and sometimes needs a prefix, so we need a shim - window.requestAnimFrame = ( function() { + var requestAnimFrame = ( function() { return window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || @@ -295,6 +526,12 @@ play.coin={ // main demo loop function loop() { + if(lib.config.coin_free_playpackconfig&&!_status.imchoosing){ + canvas.style.display='none'; + } + else{ + canvas.style.display=''; + } // this function will run endlessly with requestAnimationFrame if(!_status.fireworkRunning){ canvas.width=cw;