From c4c42796cfd0f6ed10c5d0fdea01e146d9750af3 Mon Sep 17 00:00:00 2001 From: Rintim Date: Tue, 16 Apr 2024 00:50:54 +0800 Subject: [PATCH] pref: format @/extension. --- extension/boss/extension.js | 211 ++-- extension/cardpile/extension.js | 160 +-- extension/coin/extension.js | 1963 ++++++++++++++++++------------- extension/wuxing/extension.js | 555 +++++---- 4 files changed, 1670 insertions(+), 1219 deletions(-) diff --git a/extension/boss/extension.js b/extension/boss/extension.js index 3c9e80721..ae63473b0 100644 --- a/extension/boss/extension.js +++ b/extension/boss/extension.js @@ -1,136 +1,161 @@ -import { lib, game, ui, get, ai, _status } from '../../noname.js'; -game.import('play', function () { +import { lib, game, ui, get, ai, _status } from "../../noname.js"; +game.import("play", function () { return { - name:'boss', - init:function(){ - if(get.mode()=='tafang') return; - var storage=localStorage.getItem('boss_storage_playpackconfig'); - try{ - storage=JSON.parse(storage)||{}; + name: "boss", + init: function () { + if (get.mode() == "tafang") return; + var storage = localStorage.getItem("boss_storage_playpackconfig"); + try { + storage = JSON.parse(storage) || {}; + } catch (e) { + storage = {}; } - catch(e){ - storage={}; - } - if(get.mode()!='boss'){ - lib.characterPack.mode_extension_boss=storage.boss||{}; - for(var i in lib.characterPack.mode_extension_boss){ - lib.characterPack.mode_extension_boss[i][4].push('mode:boss'); - lib.character[i]=lib.characterPack.mode_extension_boss[i]; - if(typeof lib.character[i][2]!='number'&&(typeof lib.character[i][2]!='string'||lib.character[i][2].indexOf('/')==-1)){ - lib.character[i][2]=Infinity; + if (get.mode() != "boss") { + lib.characterPack.mode_extension_boss = storage.boss || {}; + for (var i in lib.characterPack.mode_extension_boss) { + lib.characterPack.mode_extension_boss[i][4].push( + "mode:boss" + ); + lib.character[i] = lib.characterPack.mode_extension_boss[i]; + if ( + typeof lib.character[i][2] != "number" && + (typeof lib.character[i][2] != "string" || + lib.character[i][2].indexOf("/") == -1) + ) { + lib.character[i][2] = Infinity; } - if(!lib.config.boss_enableai_playpackconfig){ + if (!lib.config.boss_enableai_playpackconfig) { lib.config.forbidai.push(i); } } } - var list2=storage.versus||{}; - if(get.mode()!='versus'||get.config('versus_mode')!='jiange'){ - lib.characterPack.mode_extension_jiange=list2; - for(var i in list2){ - lib.characterPack.mode_extension_jiange[i]=list2[i]; - lib.characterPack.mode_extension_jiange[i][4].push('mode:versus'); - lib.character[i]=list2[i]; - if(typeof lib.character[i][2]!='number'){ - lib.character[i][2]=Infinity; + var list2 = storage.versus || {}; + if ( + get.mode() != "versus" || + get.config("versus_mode") != "jiange" + ) { + lib.characterPack.mode_extension_jiange = list2; + for (var i in list2) { + lib.characterPack.mode_extension_jiange[i] = list2[i]; + lib.characterPack.mode_extension_jiange[i][4].push( + "mode:versus" + ); + lib.character[i] = list2[i]; + if (typeof lib.character[i][2] != "number") { + lib.character[i][2] = Infinity; } - if(!lib.config.boss_enableai_playpackconfig){ + if (!lib.config.boss_enableai_playpackconfig) { lib.config.forbidai.push(i); } } - lib.characterIntro.boss_liedixuande=lib.characterIntro.liubei; - lib.characterIntro.boss_gongshenyueying=lib.characterIntro.huangyueying; - lib.characterIntro.boss_tianhoukongming=lib.characterIntro.shen_zhugeliang; - lib.characterIntro.boss_yuhuoshiyuan=lib.characterIntro.pangtong; - lib.characterIntro.boss_qiaokuijunyi=lib.characterIntro.zhanghe; - lib.characterIntro.boss_jiarenzidan=lib.characterIntro.caozhen; - lib.characterIntro.boss_duanyuzhongda=lib.characterIntro.simayi; - lib.characterIntro.boss_juechenmiaocai=lib.characterIntro.xiahouyuan; - } - else if(_status.mode!='jiange'){ - for(var i in list2){ - lib.character[i]=list2[i]; - if(!lib.config.boss_enableai_playpackconfig){ + lib.characterIntro.boss_liedixuande = lib.characterIntro.liubei; + lib.characterIntro.boss_gongshenyueying = + lib.characterIntro.huangyueying; + lib.characterIntro.boss_tianhoukongming = + lib.characterIntro.shen_zhugeliang; + lib.characterIntro.boss_yuhuoshiyuan = + lib.characterIntro.pangtong; + lib.characterIntro.boss_qiaokuijunyi = + lib.characterIntro.zhanghe; + lib.characterIntro.boss_jiarenzidan = + lib.characterIntro.caozhen; + lib.characterIntro.boss_duanyuzhongda = + lib.characterIntro.simayi; + lib.characterIntro.boss_juechenmiaocai = + lib.characterIntro.xiahouyuan; + } else if (_status.mode != "jiange") { + for (var i in list2) { + lib.character[i] = list2[i]; + if (!lib.config.boss_enableai_playpackconfig) { lib.config.forbidai.push(i); } } } - var list=storage.translate||{}; - list.mode_extension_boss_character_config='挑战武将'; - list.mode_extension_jiange_character_config='剑阁武将'; + var list = storage.translate || {}; + list.mode_extension_boss_character_config = "挑战武将"; + list.mode_extension_jiange_character_config = "剑阁武将"; - for(var i in list){ - lib.translate[i]=lib.translate[i]||list[i]; + for (var i in list) { + lib.translate[i] = lib.translate[i] || list[i]; } }, - arenaReady:function(){ - if(get.mode()=='tafang') return; - var storage=localStorage.getItem('boss_storage_playpackconfig'); - try{ - storage=JSON.parse(storage)||{}; + arenaReady: function () { + if (get.mode() == "tafang") return; + var storage = localStorage.getItem("boss_storage_playpackconfig"); + try { + storage = JSON.parse(storage) || {}; + } catch (e) { + storage = {}; } - catch(e){ - storage={}; + if (!storage.translate) { + storage.translate = {}; } - if(!storage.translate){ - storage.translate={}; - } - var loadversus=function(){ - if(get.mode()!='versus'){ - game.loadModeAsync('versus',function(mode){ - for(var i in mode.translate){ - lib.translate[i]=lib.translate[i]||mode.translate[i]; - storage.translate[i]=mode.translate[i]; + var loadversus = function () { + if (get.mode() != "versus") { + game.loadModeAsync("versus", function (mode) { + for (var i in mode.translate) { + lib.translate[i] = + lib.translate[i] || mode.translate[i]; + storage.translate[i] = mode.translate[i]; } - for(var i in mode.skill){ - if(lib.skill[i]) console.log(i); - if(i!='versus_ladder'){ - lib.skill[i]=mode.skill[i]; + for (var i in mode.skill) { + if (lib.skill[i]) console.log(i); + if (i != "versus_ladder") { + lib.skill[i] = mode.skill[i]; } } - for(var ii in mode.skill){ - if(ii!='versus_ladder'){ + for (var ii in mode.skill) { + if (ii != "versus_ladder") { game.finishSkill(ii); } } - storage.versus={}; - for(var i in mode.jiangeboss){ - if(mode.jiangeboss[i][4].includes('bossallowed')){ - storage.versus[i]=mode.jiangeboss[i]; + storage.versus = {}; + for (var i in mode.jiangeboss) { + if (mode.jiangeboss[i][4].includes("bossallowed")) { + storage.versus[i] = mode.jiangeboss[i]; } } - localStorage.setItem('boss_storage_playpackconfig',JSON.stringify(storage)); + localStorage.setItem( + "boss_storage_playpackconfig", + JSON.stringify(storage) + ); }); - } - else{ - localStorage.setItem('boss_storage_playpackconfig',JSON.stringify(storage)); + } else { + localStorage.setItem( + "boss_storage_playpackconfig", + JSON.stringify(storage) + ); } }; - if(get.mode()!='boss'){ - game.loadModeAsync('boss',function(mode){ - for(var i in mode.translate){ - lib.translate[i]=lib.translate[i]||mode.translate[i]; - storage.translate[i]=mode.translate[i]; + if (get.mode() != "boss") { + game.loadModeAsync("boss", function (mode) { + for (var i in mode.translate) { + lib.translate[i] = + lib.translate[i] || mode.translate[i]; + storage.translate[i] = mode.translate[i]; } - for(var i in mode.skill){ - if(lib.skill[i]) console.log(i); - lib.skill[i]=mode.skill[i]; + for (var i in mode.skill) { + if (lib.skill[i]) console.log(i); + lib.skill[i] = mode.skill[i]; } - for(var ii in mode.skill){ - if(ii!='versus_ladder'){ + for (var ii in mode.skill) { + if (ii != "versus_ladder") { game.finishSkill(ii); } } - storage.boss={}; - for(var i in mode.characterPack.mode_boss){ - if(mode.characterPack.mode_boss[i][4].includes('bossallowed')){ - storage.boss[i]=mode.characterPack.mode_boss[i]; + storage.boss = {}; + for (var i in mode.characterPack.mode_boss) { + if ( + mode.characterPack.mode_boss[i][4].includes( + "bossallowed" + ) + ) { + storage.boss[i] = mode.characterPack.mode_boss[i]; } } loadversus(); }); - } - else{ + } else { loadversus(); } }, diff --git a/extension/cardpile/extension.js b/extension/cardpile/extension.js index 91df778d6..f8606250c 100644 --- a/extension/cardpile/extension.js +++ b/extension/cardpile/extension.js @@ -1,92 +1,102 @@ -import { lib, game, ui, get, ai, _status } from '../../noname.js'; -game.import('play', function () { +import { lib, game, ui, get, ai, _status } from "../../noname.js"; +game.import("play", function () { return { - name:'cardpile', - arenaReady:function(){ - var data={ - total:160, - sha:{ - diamond:6, - club:14, - heart:3, - spade:7, + name: "cardpile", + arenaReady: function () { + var data = { + total: 160, + sha: { + diamond: 6, + club: 14, + heart: 3, + spade: 7, }, - huosha:{ - diamond:2, - heart:3 + huosha: { + diamond: 2, + heart: 3, }, - leisha:{ - spade:5, - club:4 + leisha: { + spade: 5, + club: 4, }, - shan:{ - heart:6, - diamond:18 + shan: { + heart: 6, + diamond: 18, }, - jiu:{ - diamond:1, - spade:2, - club:2 + jiu: { + diamond: 1, + spade: 2, + club: 2, }, - tao:{ - heart:9, - diamond:3, + tao: { + heart: 9, + diamond: 3, }, - wanjian:{ - heart:1, + wanjian: { + heart: 1, }, - nanman:{ - spade:2, - club:1, + nanman: { + spade: 2, + club: 1, }, - guohe:{ - spade:3, - club:2, - heart:1 + guohe: { + spade: 3, + club: 2, + heart: 1, }, - shunshou:{ - spade:3, - diamond:2 + shunshou: { + spade: 3, + diamond: 2, }, - wuxie:{ - heart:2, - diamond:1, - spade:2, - club:2 + wuxie: { + heart: 2, + diamond: 1, + spade: 2, + club: 2, }, - tiesuo:{ - spade:2, - club:4 + tiesuo: { + spade: 2, + club: 4, + }, + }; + var rand = function () { + return Math.ceil(Math.random() * 13); + }; + var getn = function (i, j) { + return Math.round( + data[i][j] * + parseFloat( + lib.config["cardpile_" + i + "_playpackconfig"] + ) + ); + }; + var num = 0; + for (var i in data) { + for (var j in data[i]) { + num += getn(i, j); } } - var rand=function(){ - return Math.ceil(Math.random()*13); - }; - var getn=function(i,j){ - return Math.round(data[i][j]*parseFloat(lib.config['cardpile_'+i+'_playpackconfig'])); - }; - var num=0; - for(var i in data){ - for(var j in data[i]){ - num+=getn(i,j); - } - } - var dn=num*(lib.card.list.length-data.total)/(data.total-num); - if(dn>1000) dn=1000; - if(dn>0){ - var p=0; - for(var i in data){ - for(var j in data[i]){ - var n=Math.round(dn*getn(i,j)/num); - while(n--){ - if(i=='huosha'){ - lib.card.list.push([j,rand(),'sha','fire']); - } - else if(i=='leisha'){ - lib.card.list.push([j,rand(),'sha','thunder']); - } - else{ - lib.card.list.push([j,rand(),i]); + var dn = + (num * (lib.card.list.length - data.total)) / + (data.total - num); + if (dn > 1000) dn = 1000; + if (dn > 0) { + var p = 0; + for (var i in data) { + for (var j in data[i]) { + var n = Math.round((dn * getn(i, j)) / num); + while (n--) { + if (i == "huosha") { + lib.card.list.push([j, rand(), "sha", "fire"]); + } else if (i == "leisha") { + lib.card.list.push([ + j, + rand(), + "sha", + "thunder", + ]); + } else { + lib.card.list.push([j, rand(), i]); } } } diff --git a/extension/coin/extension.js b/extension/coin/extension.js index f2f2ca365..0e59440fe 100644 --- a/extension/coin/extension.js +++ b/extension/coin/extension.js @@ -1,180 +1,208 @@ -import { lib, game, ui, get, ai, _status } from '../../noname.js'; -game.import('play', function () { +import { lib, game, ui, get, ai, _status } from "../../noname.js"; +game.import("play", function () { return { - name:'coin', - init:function(){ - if(lib.config.mode!='chess'||get.config('chess_mode')!='leader'){ - _status.coin=0; + name: "coin", + init: function () { + if ( + lib.config.mode != "chess" || + get.config("chess_mode") != "leader" + ) { + _status.coin = 0; } }, - arenaReady:function(){ - if(_status.video||_status.connectMode) return; - if(lib.config.mode!='chess'||get.config('chess_mode')!='leader'){ + arenaReady: function () { + if (_status.video || _status.connectMode) return; + if ( + lib.config.mode != "chess" || + get.config("chess_mode") != "leader" + ) { var str; - if(lib.config.coin_display_playpackconfig=='text'){ - str=''+lib.config.coin+'金' + if (lib.config.coin_display_playpackconfig == "text") { + str = "" + lib.config.coin + "金"; + } else { + str = + '㉤' + + lib.config.coin + + ""; } - else{ - str='㉤'+lib.config.coin+''; + if (lib.config.coin_canvas_playpackconfig) { + ui.window.classList.add("canvas_top"); } - if(lib.config.coin_canvas_playpackconfig){ - ui.window.classList.add('canvas_top'); - } - ui.coin=ui.create.system(str,null,true); - if(lib.config.snowFall){ - game.haveFun.list.snow.bought=true; - setTimeout(function(){ + ui.coin = ui.create.system(str, null, true); + if (lib.config.snowFall) { + game.haveFun.list.snow.bought = true; + setTimeout(function () { game.haveFun.snow(); - },500); + }, 500); } - lib.setPopped(ui.coin,function(){ - var uiintro=ui.create.dialog('hidden'); - uiintro.classList.add('coin_menu') - uiintro.add('商店'); - uiintro.listen(function(e){ - e.stopPropagation(); - }); - var clickBuy=function(){ - if(this.innerHTML=='停止'){ - game.haveFun[this.name+'Stop'](); - } - else if(this.innerHTML=='开始'){ - game.haveFun[this.name](); - } - else if(this.innerHTML.indexOf('金')!=-1){ - if(lib.config.coin>=this.content.cost){ - this.content.bought=true; - game.changeCoin(-this.content.cost); - game.haveFun[this.name](); - if(this.content.onbuy){ - this.content.onbuy.call(this); - } - } - else{ - return; - } - } - ui.click.window(); - }; - for(var i in game.haveFun.list){ - var item=game.haveFun.list[i]; - uiintro.add('
'+item.name+'
'+item.cost+'金
'); - var buy=uiintro.content.lastChild.lastChild.lastChild; - if(lib.config.coin本局获胜
20金
'); - var bet=uiintro.content.lastChild.lastChild.lastChild; - bet.listen(function(){ - if(_status.betWin) return; - _status.betWin=true; - game.changeCoin(-20); - this.innerHTML='已下注'; + lib.setPopped( + ui.coin, + function () { + var uiintro = ui.create.dialog("hidden"); + uiintro.classList.add("coin_menu"); + uiintro.add("商店"); + uiintro.listen(function (e) { + e.stopPropagation(); }); - if(_status.betWin){ - bet.innerHTML='已下注'; + var clickBuy = function () { + if (this.innerHTML == "停止") { + game.haveFun[this.name + "Stop"](); + } else if (this.innerHTML == "开始") { + game.haveFun[this.name](); + } else if (this.innerHTML.indexOf("金") != -1) { + if (lib.config.coin >= this.content.cost) { + this.content.bought = true; + game.changeCoin(-this.content.cost); + game.haveFun[this.name](); + if (this.content.onbuy) { + this.content.onbuy.call(this); + } + } else { + return; + } + } + ui.click.window(); + }; + for (var i in game.haveFun.list) { + var item = game.haveFun.list[i]; + uiintro.add( + '
' + + item.name + + '
' + + item.cost + + "金
" + ); + var buy = + uiintro.content.lastChild.lastChild.lastChild; + if (lib.config.coin < item.cost && !item.bought) { + buy.classList.add("disabled"); + } + if (item.bought) { + if (item.running) { + buy.innerHTML = "停止"; + if (item.control) { + var node = item.control(); + if (node) { + buy.parentNode.appendChild( + node, + buy + ); + } + } + } else { + buy.innerHTML = "开始"; + } + } + buy.name = i; + buy.content = item; + buy.listen(clickBuy); } - } - else if(_status.betWin){ - uiintro.add('下注'); - uiintro.add('
本局获胜
已下注
'); - } - uiintro.classList.add('noleave'); + if (!game.phaseNumber && !game.online) { + uiintro.add("下注"); + uiintro.add( + '
本局获胜
20金
' + ); + var bet = + uiintro.content.lastChild.lastChild.lastChild; + bet.listen(function () { + if (_status.betWin) return; + _status.betWin = true; + game.changeCoin(-20); + this.innerHTML = "已下注"; + }); + if (_status.betWin) { + bet.innerHTML = "已下注"; + } + } else if (_status.betWin) { + uiintro.add("下注"); + uiintro.add( + '
本局获胜
已下注
' + ); + } - return uiintro; - },220,400); + uiintro.classList.add("noleave"); + + return uiintro; + }, + 220, + 400 + ); } }, - game:{ - changeCoin:function(num){ - if(typeof num=='number'&&ui.coin){ - game.saveConfig('coin',lib.config.coin+num); + game: { + changeCoin: function (num) { + if (typeof num == "number" && ui.coin) { + game.saveConfig("coin", lib.config.coin + num); var str; - if(lib.config.coin_display_playpackconfig=='text'){ - str=''+lib.config.coin+'金' + if (lib.config.coin_display_playpackconfig == "text") { + str = + "" + + lib.config.coin + + "金"; + } else { + str = + '㉤' + + lib.config.coin + + ""; } - else{ - str='㉤'+lib.config.coin+''; - } - ui.coin.innerHTML=str; + ui.coin.innerHTML = str; } }, - haveFun:{ - list:{ - firework:{ - name:'烟花', - cost:50, + haveFun: { + list: { + firework: { + name: "烟花", + cost: 50, }, - snow:{ - name:'下雪', - cost:20, - size:'large', - control:function(){ - var size=ui.create.div('.menubutton'); - if(game.haveFun.list.snow.size=='small'){ - size.innerHTML='大雪'; - } - else{ - size.innerHTML='小雪'; + snow: { + name: "下雪", + cost: 20, + size: "large", + control: function () { + var size = ui.create.div(".menubutton"); + if (game.haveFun.list.snow.size == "small") { + size.innerHTML = "大雪"; + } else { + size.innerHTML = "小雪"; } size.listen(game.haveFun.snowSize); return size; - } + }, }, - star:{ - name:'星云', - cost:10 + star: { + name: "星云", + cost: 10, + }, + blink: { + name: "闪烁", + cost: 10, }, - blink:{ - name:'闪烁', - cost:10 - } }, - alwaysSnow:function(){ - game.saveConfig('snowFall',!lib.config.snowFall); + alwaysSnow: function () { + game.saveConfig("snowFall", !lib.config.snowFall); game.reload(); }, - blink:function(){ - if(game.haveFun.list.blink.running) return; - game.haveFun.list.blink.running=true; - if(game.haveFun.blinkLoop){ + blink: function () { + if (game.haveFun.list.blink.running) return; + game.haveFun.list.blink.running = true; + if (game.haveFun.blinkLoop) { game.haveFun.blinkLoop(); - } - else{ + } else { var canvas = document.createElement("canvas"); ui.window.appendChild(canvas); - canvas.classList.add('fun'); - canvas.style.zIndex=20; + canvas.classList.add("fun"); + canvas.style.zIndex = 20; var ctx = canvas.getContext("2d"); //Make the canvas occupy the full page - var W = ui.window.offsetWidth, H = ui.window.offsetHeight; + var W = ui.window.offsetWidth, + H = ui.window.offsetHeight; canvas.width = W; canvas.height = H; - lib.onresize.push(function(){ - var W = ui.window.offsetWidth, H = ui.window.offsetHeight; + lib.onresize.push(function () { + var W = ui.window.offsetWidth, + H = ui.window.offsetHeight; canvas.width = W; canvas.height = H; }); @@ -185,61 +213,56 @@ game.import('play', function () { //Lets create some particles now var particle_count = 25; - //finally some mouse tracking - ui.window.addEventListener('mousemove', function(e) - { + ui.window.addEventListener("mousemove", function (e) { //since the canvas = full page the position of the mouse //relative to the document will suffice - mouse.x = e.pageX/game.documentZoom; - mouse.y = e.pageY/game.documentZoom; + mouse.x = e.pageX / game.documentZoom; + mouse.y = e.pageY / game.documentZoom; }); - ui.window.addEventListener('touchmove',function(e){ - mouse.x = e.touches[0].clientX/game.documentZoom; - mouse.y = e.touches[0].clientY/game.documentZoom; + ui.window.addEventListener("touchmove", function (e) { + mouse.x = e.touches[0].clientX / game.documentZoom; + mouse.y = e.touches[0].clientY / game.documentZoom; }); - var particle=function() - { + var particle = function () { //speed, life, location, life, colors //speed.x range = -2.5 to 2.5 //speed.y range = -15 to -5 to make it move upwards //lets change the Y speed to make it look like a flame - this.speed = {x: -2.5+Math.random()*5, y: -5+Math.random()*10}; - this.speed.x/=4; - this.speed.y/=4; + this.speed = { + x: -2.5 + Math.random() * 5, + y: -5 + Math.random() * 10, + }; + this.speed.x /= 4; + this.speed.y /= 4; //location = mouse coordinates //Now the flame follows the mouse coordinates - if(mouse.x && mouse.y) - { - this.location = {x: mouse.x, y: mouse.y}; - } - else - { - this.location = {x: W/2, y: H/2}; + if (mouse.x && mouse.y) { + this.location = { x: mouse.x, y: mouse.y }; + } else { + this.location = { x: W / 2, y: H / 2 }; } //radius range = 10-30 - this.radius = 10+Math.random()*20; + this.radius = 10 + Math.random() * 20; //life range = 20-30 - this.radius/=4; - this.life = 20+Math.random()*10; - this.life*=4; + this.radius /= 4; + this.life = 20 + Math.random() * 10; + this.life *= 4; this.remaining_life = this.life; //colors - this.r = Math.round(Math.random()*255); - this.g = Math.round(Math.random()*255); - this.b = Math.round(Math.random()*255); - } - for(var i = 0; i < particle_count; i++) - { + this.r = Math.round(Math.random() * 255); + this.g = Math.round(Math.random() * 255); + this.b = Math.round(Math.random() * 255); + }; + for (var i = 0; i < particle_count; i++) { particles.push(new particle()); } - var draw=function() - { - if(!game.haveFun.list.blink.running){ - canvas.width=W; - canvas.height=H; + var draw = function () { + if (!game.haveFun.list.blink.running) { + canvas.width = W; + canvas.height = H; return; } ctx.clearRect(0, 0, W, H); @@ -250,52 +273,96 @@ game.import('play', function () { //previous frame ctx.globalCompositeOperation = "lighter"; - for(var i = 0; i < particles.length; i++) - { + for (var i = 0; i < particles.length; i++) { var p = particles[i]; ctx.beginPath(); //changing opacity according to the life. //opacity goes to 0 at the end of life of a particle - p.opacity = Math.round(p.remaining_life/p.life*100)/100 + p.opacity = + Math.round( + (p.remaining_life / p.life) * 100 + ) / 100; //a gradient instead of white fill - var gradient = ctx.createRadialGradient(p.location.x, p.location.y, 0, p.location.x, p.location.y, p.radius); - gradient.addColorStop(0, "rgba("+p.r+", "+p.g+", "+p.b+", "+p.opacity+")"); - gradient.addColorStop(0.5, "rgba("+p.r+", "+p.g+", "+p.b+", "+p.opacity+")"); - gradient.addColorStop(1, "rgba("+p.r+", "+p.g+", "+p.b+", 0)"); + var gradient = ctx.createRadialGradient( + p.location.x, + p.location.y, + 0, + p.location.x, + p.location.y, + p.radius + ); + gradient.addColorStop( + 0, + "rgba(" + + p.r + + ", " + + p.g + + ", " + + p.b + + ", " + + p.opacity + + ")" + ); + gradient.addColorStop( + 0.5, + "rgba(" + + p.r + + ", " + + p.g + + ", " + + p.b + + ", " + + p.opacity + + ")" + ); + gradient.addColorStop( + 1, + "rgba(" + + p.r + + ", " + + p.g + + ", " + + p.b + + ", 0)" + ); ctx.fillStyle = gradient; - ctx.arc(p.location.x, p.location.y, p.radius, Math.PI*2, false); + ctx.arc( + p.location.x, + p.location.y, + p.radius, + Math.PI * 2, + false + ); ctx.fill(); //lets move the particles p.remaining_life--; - p.radius-=0.2; + p.radius -= 0.2; p.location.x += p.speed.x; p.location.y += p.speed.y; //regenerate particles - if(p.remaining_life < 0 || p.radius < 0) - { + if (p.remaining_life < 0 || p.radius < 0) { //a brand new particle replacing the dead one particles[i] = new particle(); } } requestAnimationFrame(draw); - } + }; draw(); - game.haveFun.blinkLoop=draw; - game.haveFun.blinkStop=function(){ - game.haveFun.list.blink.running=false; - } + game.haveFun.blinkLoop = draw; + game.haveFun.blinkStop = function () { + game.haveFun.list.blink.running = false; + }; } }, - star:function(){ - if(game.haveFun.list.star.running) return; - game.haveFun.list.star.running=true; - if(game.haveFun.starLoop){ + star: function () { + if (game.haveFun.list.star.running) return; + game.haveFun.list.star.running = true; + if (game.haveFun.starLoop) { game.haveFun.starLoop(); - } - else{ + } else { //****************************************************** // Yet Another Particle Engine var cos = Math.cos, @@ -306,11 +373,13 @@ game.import('play', function () { log = Math.log, random = Math.random, PI = Math.PI, - sqr = function(v){return v*v;}, + sqr = function (v) { + return v * v; + }, particles = [], drawScale = 1, emitters = [], - forces = [], + forces = [], collidedMass = 0, maxParticles = 100, emissionRate = 1, @@ -318,238 +387,285 @@ game.import('play', function () { //------------------------------------------------------- // Vectors, and not the kind you put stuff in - var Vector=function(x, y, z) { - this.x = x || 0; - this.y = y || 0; - this.z = z || 0; - } + var Vector = function (x, y, z) { + this.x = x || 0; + this.y = y || 0; + this.z = z || 0; + }; Vector.prototype = { - add : function(vector) { - this.x += vector.x; - this.y += vector.y; - this.z += vector.z; - return this; - }, - subtract : function(vector) { - this.x -= vector.x; - this.y -= vector.y; - this.z -= vector.z; - return this; - }, - multiply : function(another) { - this.x /= another.x; - this.y /= another.y; - this.z /= another.z; - return this; - }, - divide : function(another) { - this.x /= another.x; - this.y /= another.y; - this.z /= another.z; - return this; - }, - scale : function(factor) { - this.x *= factor; - this.y *= factor; - this.z *= factor; - return this; - }, - magnitude : function () { - return sqrt(sqr(this.x + this.y)); - }, - distance : function (another) { - return abs(sqrt(sqr(this.x - another.x) + sqr(this.y - another.y))); - }, - angle : function (angle, magnitude) { - if(angle && magnitude) - return Vector.fromAngle(angle, magnitude); - return atan2(this.y, this.x); - }, - clone : function() { - return new Vector(this.x, this.y, this.z); - }, - equals : function(another) { - return this.x === another.x&& - this.y === another.y&& - this.z === another.z; - }, - random : function(r) { - this.x += (random() * r * 2) - r; - this.y += (random() * r * 2) - r; - return this; - } + add: function (vector) { + this.x += vector.x; + this.y += vector.y; + this.z += vector.z; + return this; + }, + subtract: function (vector) { + this.x -= vector.x; + this.y -= vector.y; + this.z -= vector.z; + return this; + }, + multiply: function (another) { + this.x /= another.x; + this.y /= another.y; + this.z /= another.z; + return this; + }, + divide: function (another) { + this.x /= another.x; + this.y /= another.y; + this.z /= another.z; + return this; + }, + scale: function (factor) { + this.x *= factor; + this.y *= factor; + this.z *= factor; + return this; + }, + magnitude: function () { + return sqrt(sqr(this.x + this.y)); + }, + distance: function (another) { + return abs( + sqrt( + sqr(this.x - another.x) + + sqr(this.y - another.y) + ) + ); + }, + angle: function (angle, magnitude) { + if (angle && magnitude) + return Vector.fromAngle(angle, magnitude); + return atan2(this.y, this.x); + }, + clone: function () { + return new Vector(this.x, this.y, this.z); + }, + equals: function (another) { + return ( + this.x === another.x && + this.y === another.y && + this.z === another.z + ); + }, + random: function (r) { + this.x += random() * r * 2 - r; + this.y += random() * r * 2 - r; + return this; + }, }; Vector.fromAngle = function (angle, magnitude) { - return new Vector( - magnitude * cos(angle), - magnitude * sin(angle), - magnitude * sin(angle)); + return new Vector( + magnitude * cos(angle), + magnitude * sin(angle), + magnitude * sin(angle) + ); }; //****************************************************** // A thing with mass, position, and velocity - like your mom - var Particle=function(pt, vc, ac, mass) { - this.pos = pt || new Vector(0, 0); - this.vc = vc || new Vector(0, 0); - this.ac = ac || new Vector(0, 0); - this.mass = mass || 1; - this.alive = true; - } + var Particle = function (pt, vc, ac, mass) { + this.pos = pt || new Vector(0, 0); + this.vc = vc || new Vector(0, 0); + this.ac = ac || new Vector(0, 0); + this.mass = mass || 1; + this.alive = true; + }; Particle.prototype.move = function () { - this.vc.add(this.ac); - this.pos.add(this.vc); + this.vc.add(this.ac); + this.pos.add(this.vc); }; Particle.prototype.reactToForces = function (fields) { - var totalAccelerationX = 0; - var totalAccelerationY = 0; + var totalAccelerationX = 0; + var totalAccelerationY = 0; - for (var i = 0; i < fields.length; i++) { - var field = fields[i]; - var vectorX = field.pos.x - this.pos.x; - var vectorY = field.pos.y - this.pos.y; - var distance = this.pos.distance(field.pos); - if(distance < 1) field.grow(this); - if(distance < 100) this.doubleSize = true; - var force = G(this.forceBetween(field, distance)); - totalAccelerationX += vectorX * force; - totalAccelerationY += vectorY * force; - } - this.ac = new Vector(totalAccelerationX, totalAccelerationY); - - totalAccelerationX = 0; - totalAccelerationY = 0; - for (var i = 0; i < particles.length; i++) { - var field = particles[i]; - if(field === this || !field.alive) continue; - var vectorX = field.pos.x - this.pos.x; - var vectorY = field.pos.y - this.pos.y; - var distance = this.pos.distance(field.pos); - if(distance < 1) { - if(this.mass >= field.mass) { - var massRatio = this.mass / field.mass; - if(particles.length <= maxParticles && this.mass>40) { - this.alive = false; - this.nova = true; - collidedMass += this.mass; - } else this.grow(field); - } else this.alive = false; + for (var i = 0; i < fields.length; i++) { + var field = fields[i]; + var vectorX = field.pos.x - this.pos.x; + var vectorY = field.pos.y - this.pos.y; + var distance = this.pos.distance(field.pos); + if (distance < 1) field.grow(this); + if (distance < 100) this.doubleSize = true; + var force = G( + this.forceBetween(field, distance) + ); + totalAccelerationX += vectorX * force; + totalAccelerationY += vectorY * force; } - if(this.alive) { - var force = G(this.forceBetween(field, distance)); - totalAccelerationX += vectorX * G(force); - totalAccelerationY += vectorY * G(force); + this.ac = new Vector( + totalAccelerationX, + totalAccelerationY + ); + + totalAccelerationX = 0; + totalAccelerationY = 0; + for (var i = 0; i < particles.length; i++) { + var field = particles[i]; + if (field === this || !field.alive) continue; + var vectorX = field.pos.x - this.pos.x; + var vectorY = field.pos.y - this.pos.y; + var distance = this.pos.distance(field.pos); + if (distance < 1) { + if (this.mass >= field.mass) { + var massRatio = this.mass / field.mass; + if ( + particles.length <= maxParticles && + this.mass > 40 + ) { + this.alive = false; + this.nova = true; + collidedMass += this.mass; + } else this.grow(field); + } else this.alive = false; + } + if (this.alive) { + var force = G( + this.forceBetween(field, distance) + ); + totalAccelerationX += vectorX * G(force); + totalAccelerationY += vectorY * G(force); + } } - } - var travelDist = this.pos.distance(this.lastPos ? this.lastPos : this.pos); - this.velocity = travelDist - (this.lastDistance ? this.lastDistance : travelDist); - this.lastDistance = travelDist; - this.lastPos = this.pos.clone(); + var travelDist = this.pos.distance( + this.lastPos ? this.lastPos : this.pos + ); + this.velocity = + travelDist - + (this.lastDistance + ? this.lastDistance + : travelDist); + this.lastDistance = travelDist; + this.lastPos = this.pos.clone(); - this.ac.add(new Vector(totalAccelerationX, totalAccelerationY)); - this.lastPos = this.pos.clone(); - // if(this.mass > 20) { - // var chance = 1 / (this.mass - 20); - // if(Math.random()>chance) { - // this.supernova = true; - // this.supernovaDur = 10; - // this.alive = false; - // if(particles.length <= maxParticles) collidedMass += this.mass; - // delete this.size; - // } - // } + this.ac.add( + new Vector( + totalAccelerationX, + totalAccelerationY + ) + ); + this.lastPos = this.pos.clone(); + // if(this.mass > 20) { + // var chance = 1 / (this.mass - 20); + // if(Math.random()>chance) { + // this.supernova = true; + // this.supernovaDur = 10; + // this.alive = false; + // if(particles.length <= maxParticles) collidedMass += this.mass; + // delete this.size; + // } + // } }; Particle.prototype.grow = function (another) { - this.mass += another.mass; - this.nova = true; - another.alive = false; - delete this.size; + this.mass += another.mass; + this.nova = true; + another.alive = false; + delete this.size; }; - Particle.prototype.breakApart = function(minMass, maxParts) { - if(!minMass) minMass = 1; - if(!maxParts) maxParts = 2; - var remainingMass = this.mass; - var num = 0; - while(remainingMass > 0) { - var np = new Particle(this.pos.clone().random(this.mass), new Vector(0,0)); - np.mass = 1 + Math.random() * (remainingMass - 1); - if(num>=maxParts-1) np.mass = remainingMass; - np.mass = np.mass < minMass ? minMass : np.mass; - remainingMass -= np.mass; - num++; - } - this.nova = true; - delete this.size; - this.alive = false; + Particle.prototype.breakApart = function ( + minMass, + maxParts + ) { + if (!minMass) minMass = 1; + if (!maxParts) maxParts = 2; + var remainingMass = this.mass; + var num = 0; + while (remainingMass > 0) { + var np = new Particle( + this.pos.clone().random(this.mass), + new Vector(0, 0) + ); + np.mass = + 1 + Math.random() * (remainingMass - 1); + if (num >= maxParts - 1) + np.mass = remainingMass; + np.mass = np.mass < minMass ? minMass : np.mass; + remainingMass -= np.mass; + num++; + } + this.nova = true; + delete this.size; + this.alive = false; }; - Particle.prototype.forceBetween = function(another, distance) { - var distance = distance? distance : this.pos.distance(another.pos); - return (this.mass * another.mass) / sqr(distance); + Particle.prototype.forceBetween = function ( + another, + distance + ) { + var distance = distance + ? distance + : this.pos.distance(another.pos); + return (this.mass * another.mass) / sqr(distance); }; //****************************************************** //This certainly doesn't *sub*mit to particles, that's for sure - var ParticleEmitter=function(pos, vc, ang) { - // to do config options for emitter - random, static, show emitter, emitter color, etc - this.pos = pos; - this.vc = vc; - this.ang = ang || 0.09; - this.color = "#999"; - } - ParticleEmitter.prototype.emit = function() { - var angle = this.vc.angle() + - this.ang - (Math.random() * this.ang * 2); - var magnitude = this.vc.magnitude(); - var position = this.pos.clone(); - position.add( + var ParticleEmitter = function (pos, vc, ang) { + // to do config options for emitter - random, static, show emitter, emitter color, etc + this.pos = pos; + this.vc = vc; + this.ang = ang || 0.09; + this.color = "#999"; + }; + ParticleEmitter.prototype.emit = function () { + var angle = + this.vc.angle() + + this.ang - + Math.random() * this.ang * 2; + var magnitude = this.vc.magnitude(); + var position = this.pos.clone(); + position.add( new Vector( - ~~((Math.random() * 100) - 50) * drawScale, - ~~((Math.random() * 100) - 50) * drawScale - )); - var velocity = Vector.fromAngle(angle, magnitude); - return new Particle(position,velocity); + ~~(Math.random() * 100 - 50) * drawScale, + ~~(Math.random() * 100 - 50) * drawScale + ) + ); + var velocity = Vector.fromAngle(angle, magnitude); + return new Particle(position, velocity); }; //****************************************************** // Use it, Luke // to do collapse functionality into particle - var Force=function(pos, m) { - this.pos = pos; - this.mass = m || 100; - } + var Force = function (pos, m) { + this.pos = pos; + this.mass = m || 100; + }; Force.prototype.grow = function (another) { - this.mass += another.mass; - this.burp = true; - another.alive = false; + this.mass += another.mass; + this.burp = true; + another.alive = false; }; - - - var G=function(data) { - return 0.00674 * data; - } + var G = function (data) { + return 0.00674 * data; + }; //****************************************************** - var canvas = document.createElement('canvas'); - canvas.classList.add('fun'); + var canvas = document.createElement("canvas"); + canvas.classList.add("fun"); ui.window.appendChild(canvas); - var ctx = canvas.getContext('2d'); + var ctx = canvas.getContext("2d"); canvas.width = ui.window.offsetWidth; canvas.height = ui.window.offsetHeight; var canvasWidth = canvas.width; var canvasHeight = canvas.height; - lib.onresize.push(function() { + lib.onresize.push(function () { canvas.width = ui.window.offsetWidth; canvas.height = ui.window.offsetHeight; canvasWidth = canvas.width; canvasHeight = canvas.height; }); - var renderToCanvas = function (width, height, renderFunction) { - var buffer = document.createElement('canvas'); + var renderToCanvas = function ( + width, + height, + renderFunction + ) { + var buffer = document.createElement("canvas"); buffer.width = width; buffer.height = height; - renderFunction(buffer.getContext('2d')); + renderFunction(buffer.getContext("2d")); return buffer; }; @@ -558,174 +674,183 @@ game.import('play', function () { drawScale = 1.3; minParticleSize = 2; emitters = [ - //br - new ParticleEmitter( - new Vector( - canvasWidth / 2 * drawScale + 400, - canvasHeight / 2 * drawScale - ), - Vector.fromAngle(2, 5), - 1 - ), - // // bl - // new ParticleEmitter( - // new Vector( - // canvasWidth / 2 * drawScale - 400, - // canvasHeight / 2 * drawScale + 400 - // ), - // Vector.fromAngle(1.5, 1), - // 1 - // ), + //br + new ParticleEmitter( + new Vector( + (canvasWidth / 2) * drawScale + 400, + (canvasHeight / 2) * drawScale + ), + Vector.fromAngle(2, 5), + 1 + ), + // // bl + // new ParticleEmitter( + // new Vector( + // canvasWidth / 2 * drawScale - 400, + // canvasHeight / 2 * drawScale + 400 + // ), + // Vector.fromAngle(1.5, 1), + // 1 + // ), // tl - new ParticleEmitter( - new Vector( - canvasWidth / 2 * drawScale - 400, - canvasHeight / 2 * drawScale - ), - Vector.fromAngle(5, 5), - 1 - ), - // // tr - // new ParticleEmitter( - // new Vector( - // canvasWidth / 2 * drawScale + 400, - // canvasHeight / 2 * drawScale - 400 - // ), - // Vector.fromAngle(4.5, 1), - // 1 - // ) + new ParticleEmitter( + new Vector( + (canvasWidth / 2) * drawScale - 400, + (canvasHeight / 2) * drawScale + ), + Vector.fromAngle(5, 5), + 1 + ), + // // tr + // new ParticleEmitter( + // new Vector( + // canvasWidth / 2 * drawScale + 400, + // canvasHeight / 2 * drawScale - 400 + // ), + // Vector.fromAngle(4.5, 1), + // 1 + // ) ]; - forces = [ - new Force( - new Vector((canvasWidth / 2 * drawScale) , - (canvasHeight / 2 * drawScale)), 1800) + forces = [ + new Force( + new Vector( + (canvasWidth / 2) * drawScale, + (canvasHeight / 2) * drawScale + ), + 1800 + ), ]; - var loop=function() { - if(!game.haveFun.list.star.running){ - canvas.width=ui.window.offsetWidth; - canvas.height=ui.window.offsetHeight; + var loop = function () { + if (!game.haveFun.list.star.running) { + canvas.width = ui.window.offsetWidth; + canvas.height = ui.window.offsetHeight; return; } clear(); update(); draw(); queue(); - } - game.haveFun.starLoop=loop; - game.haveFun.starStop=function(){ - game.haveFun.list.star.running=false; + }; + game.haveFun.starLoop = loop; + game.haveFun.starStop = function () { + game.haveFun.list.star.running = false; }; - - var clear=function() { - ctx.clearRect(0, 0, canvas.width, canvas.height); - } + var clear = function () { + ctx.clearRect(0, 0, canvas.width, canvas.height); + }; var ctr = 0; var c = [ - 'rgba(255,255,255,', - 'rgba(0,150,255,', - 'rgba(255,255,128,', - 'rgba(255,255,255,' + "rgba(255,255,255,", + "rgba(0,150,255,", + "rgba(255,255,128,", + "rgba(255,255,255,", ]; - var rndc=function() { - return c[~~(Math.random() * c.length-1)]; - } - var c2 = 'rgba(255,64,32,'; - var addNewParticles=function() { - var _emit = function() { - var ret = 0; - for (var i = 0; i < emitters.length; i++) { - for (var j = 0; j < emissionRate; j++) { - var p = emitters[i].emit(); - p.color = ( ctr % 10 === 0 )? - ( Math.random() * 5 <= 1 ? c2 : rndc() ) - : rndc(); - p.mass = ~~(Math.random() * 5); - particles.push(p); - ret += p.mass; - ctr++; - } + var rndc = function () { + return c[~~(Math.random() * c.length - 1)]; + }; + var c2 = "rgba(255,64,32,"; + var addNewParticles = function () { + var _emit = function () { + var ret = 0; + for (var i = 0; i < emitters.length; i++) { + for (var j = 0; j < emissionRate; j++) { + var p = emitters[i].emit(); + p.color = + ctr % 10 === 0 + ? Math.random() * 5 <= 1 + ? c2 + : rndc() + : rndc(); + p.mass = ~~(Math.random() * 5); + particles.push(p); + ret += p.mass; + ctr++; + } + } + return ret; + }; + if (collidedMass !== 0) { + while (collidedMass !== 0) { + collidedMass -= _emit(); + collidedMass = + collidedMass < 0 ? 0 : collidedMass; + } } - return ret; - }; - if(collidedMass !== 0) { - while(collidedMass !== 0) { - collidedMass -= _emit(); - collidedMass = collidedMass<0 ? 0 :collidedMass; - } - } - if (particles.length > maxParticles) - return; - _emit(); - } + if (particles.length > maxParticles) return; + _emit(); + }; var CLIPOFFSCREEN = 1, BUFFEROFFSCREEN = 2, LOOPSCREEN = 3; - var isPositionAliveAndAdjust=function(particle,check) { - return true; - // var pos = particle.pos; - // if(!check) check = BUFFEROFFSCREEN; - // if(check === CLIPOFFSCREEN) { - // return !(!particle.alive || - // pos.x < 0 || - // (pos.x / drawScale) > boundsX || - // pos.y < 0 || - // (pos.y / drawScale) > boundsY); - // } else if(check === BUFFEROFFSCREEN) { - // return !(!particle.alive || - // pos.x < -boundsX * drawScale || - // pos.x > 2 * boundsX * drawScale || - // pos.y < -boundsY * drawScale || - // pos.y > 2 * boundsY * drawScale); - // } else if(check === LOOPSCREEN) { - // if (pos.x < 0) pos.x = boundsX * drawScale; - // if ((pos.x / drawScale) > boundsX) pos.x = 0; - // if (pos.y < 0) pos.y = boundsY * drawScale; - // if ((pos.y / drawScale) > boundsY) pos.y = 0; - // return true; - // } - } + var isPositionAliveAndAdjust = function ( + particle, + check + ) { + return true; + // var pos = particle.pos; + // if(!check) check = BUFFEROFFSCREEN; + // if(check === CLIPOFFSCREEN) { + // return !(!particle.alive || + // pos.x < 0 || + // (pos.x / drawScale) > boundsX || + // pos.y < 0 || + // (pos.y / drawScale) > boundsY); + // } else if(check === BUFFEROFFSCREEN) { + // return !(!particle.alive || + // pos.x < -boundsX * drawScale || + // pos.x > 2 * boundsX * drawScale || + // pos.y < -boundsY * drawScale || + // pos.y > 2 * boundsY * drawScale); + // } else if(check === LOOPSCREEN) { + // if (pos.x < 0) pos.x = boundsX * drawScale; + // if ((pos.x / drawScale) > boundsX) pos.x = 0; + // if (pos.y < 0) pos.y = boundsY * drawScale; + // if ((pos.y / drawScale) > boundsY) pos.y = 0; + // return true; + // } + }; - var plotParticles=function(boundsX, boundsY) { - var currentParticles = []; - for (var i = 0; i < particles.length; i++) { - var particle = particles[i]; - particle.reactToForces(forces); - if(!isPositionAliveAndAdjust(particle)) - continue; - particle.move(); - currentParticles.push(particle); - } - } + var plotParticles = function (boundsX, boundsY) { + var currentParticles = []; + for (var i = 0; i < particles.length; i++) { + var particle = particles[i]; + particle.reactToForces(forces); + if (!isPositionAliveAndAdjust(particle)) + continue; + particle.move(); + currentParticles.push(particle); + } + }; var offscreenCache = {}; - var renderParticle=function(p) { + var renderParticle = function (p) { var position = p.pos; - if(!p.size) p.size = Math.floor(p.mass / 100); + if (!p.size) p.size = Math.floor(p.mass / 100); - - if(!p.opacity) p.opacity = 0.05; - if(p.velocity > 0) { - if(p.opacity<=0.18) - p.opacity += 0.04; + if (!p.opacity) p.opacity = 0.05; + if (p.velocity > 0) { + if (p.opacity <= 0.18) p.opacity += 0.04; } - if(p.opacity>0.08) - p.opacity -= 0.02; + if (p.opacity > 0.08) p.opacity -= 0.02; var actualSize = p.size / drawScale; - actualSize = actualSize < minParticleSize ? minParticleSize : actualSize; - if(p.mass>8) actualSize *= 2; - if(p.nova) { - actualSize *= 4; - p.nova = false; + actualSize = + actualSize < minParticleSize + ? minParticleSize + : actualSize; + if (p.mass > 8) actualSize *= 2; + if (p.nova) { + actualSize *= 4; + p.nova = false; } - if(p.doubleSize) { - p.doubleSize = false; - actualSize *= 2; + if (p.doubleSize) { + p.doubleSize = false; + actualSize *= 2; } // if(p.supernova) { // actualSize *= 6; @@ -734,124 +859,155 @@ game.import('play', function () { // if(p.supernovaDur === 0) // p.supernova = false; // } - var cacheKey = actualSize + '_' + p.opacity + '_' + p.color; + var cacheKey = + actualSize + "_" + p.opacity + "_" + p.color; var cacheValue = offscreenCache[cacheKey]; - if(!cacheValue) { - cacheValue = renderToCanvas(actualSize * 32, actualSize * 32, function(ofsContext) { - var opacity = p.opacity; - var fills = [ - {size:actualSize/2, opacity:1}, - {size:actualSize, opacity:opacity}, - {size:actualSize * 2, opacity:opacity / 2}, - {size:actualSize * 4, opacity:opacity / 3}, - {size:actualSize * 8, opacity:opacity / 5}, - {size:actualSize * 16, opacity:opacity / 16} - ]; - ofsContext.beginPath(); - for(var f in fills) { - f = fills[f]; - ofsContext.fillStyle = p.color + f.opacity + ')'; - ofsContext.arc( - actualSize * 16, - actualSize * 16, - f.size , 0, Math.PI*2, true); - ofsContext.fill(); - } - ofsContext.closePath(); - }); - offscreenCache[cacheKey] = cacheValue; + if (!cacheValue) { + cacheValue = renderToCanvas( + actualSize * 32, + actualSize * 32, + function (ofsContext) { + var opacity = p.opacity; + var fills = [ + { + size: actualSize / 2, + opacity: 1, + }, + { + size: actualSize, + opacity: opacity, + }, + { + size: actualSize * 2, + opacity: opacity / 2, + }, + { + size: actualSize * 4, + opacity: opacity / 3, + }, + { + size: actualSize * 8, + opacity: opacity / 5, + }, + { + size: actualSize * 16, + opacity: opacity / 16, + }, + ]; + ofsContext.beginPath(); + for (var f in fills) { + f = fills[f]; + ofsContext.fillStyle = + p.color + f.opacity + ")"; + ofsContext.arc( + actualSize * 16, + actualSize * 16, + f.size, + 0, + Math.PI * 2, + true + ); + ofsContext.fill(); + } + ofsContext.closePath(); + } + ); + offscreenCache[cacheKey] = cacheValue; } - var posX = p.pos.x / drawScale; + var posX = p.pos.x / drawScale; var posY = p.pos.y / drawScale; ctx.drawImage(cacheValue, posX, posY); - } + }; var fills = [ - {size:15,opacity:1 }, - {size:25,opacity:0.3}, - {size:50,opacity:0.1} ]; + { size: 15, opacity: 1 }, + { size: 25, opacity: 0.3 }, + { size: 50, opacity: 0.1 }, + ]; - var renderScene=function(ofsContext) { - for (var i = 0; i < forces.length; i++) { - var p = forces[i]; - var position = p.pos; - var opacity = 1; + var renderScene = function (ofsContext) { + for (var i = 0; i < forces.length; i++) { + var p = forces[i]; + var position = p.pos; + var opacity = 1; - ofsContext.beginPath(); - for(var f in fills) { - f = fills[f]; - var o = p.burp === true ? 1 : f.opacity; - p.burp = false; - // ofsContext.fillStyle = 'rgba(255,255,255,' + o + ')'; - // ofsContext.arc(position.x / drawScale, - // position.y / drawScale, - // f.size / drawScale, 0, Math.PI*2, true); - // ofsContext.fill(); + ofsContext.beginPath(); + for (var f in fills) { + f = fills[f]; + var o = p.burp === true ? 1 : f.opacity; + p.burp = false; + // ofsContext.fillStyle = 'rgba(255,255,255,' + o + ')'; + // ofsContext.arc(position.x / drawScale, + // position.y / drawScale, + // f.size / drawScale, 0, Math.PI*2, true); + // ofsContext.fill(); + } + ofsContext.closePath(); } - ofsContext.closePath(); - } - for (var i = 0; i < particles.length; i++) { - var p = particles[i]; - renderParticle(p); - } - } + for (var i = 0; i < particles.length; i++) { + var p = particles[i]; + renderParticle(p); + } + }; - var draw=function() { - renderScene(ctx); - } + var draw = function () { + renderScene(ctx); + }; - var update=function() { - addNewParticles(); - plotParticles(canvas.width, canvas.height); - } + var update = function () { + addNewParticles(); + plotParticles(canvas.width, canvas.height); + }; - var queue=function() { - window.requestAnimationFrame(loop); - } + var queue = function () { + window.requestAnimationFrame(loop); + }; loop(); - } }, - snow:function(){ - game.haveFun.list.snow.running=true; - if(game.haveFun.snowStart){ + snow: function () { + game.haveFun.list.snow.running = true; + if (game.haveFun.snowStart) { game.haveFun.snowStart(); - } - else{ + } else { /* - * 自由下雪 snowFall - * author：xuanfeng - * time: 2014-01-11 - */ + * 自由下雪 snowFall + * author：xuanfeng + * time: 2014-01-11 + */ // 控制下雪 var canvas; - var snowFall=function(snow) { + var snowFall = function (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-继续下雪 - } + this.maxFlake = snow.maxFlake || 200; //最多片数 + this.flakeSize = snow.flakeSize || 10; //雪花形状 + this.fallSpeed = snow.fallSpeed || 2; //坠落速度 + this.status = 0; //0-初始化、1-开始下雪、2-停止下雪、3-暂停下雪、4-继续下雪 + }; // 兼容写法 - var requestAnimationFrame = window.requestAnimationFrame || - window.mozRequestAnimationFrame || - window.webkitRequestAnimationFrame || - window.msRequestAnimationFrame || - window.oRequestAnimationFrame || - function(callback) { setTimeout(callback, 1000 / 60); }; - var cancelAnimationFrame = window.cancelAnimationFrame || - window.mozCancelAnimationFrame || - window.webkitCancelAnimationFrame || - window.msCancelAnimationFrame || - window.oCancelAnimationFrame; + var requestAnimationFrame = + window.requestAnimationFrame || + window.mozRequestAnimationFrame || + window.webkitRequestAnimationFrame || + window.msRequestAnimationFrame || + window.oRequestAnimationFrame || + function (callback) { + setTimeout(callback, 1000 / 60); + }; + var cancelAnimationFrame = + window.cancelAnimationFrame || + window.mozCancelAnimationFrame || + window.webkitCancelAnimationFrame || + window.msCancelAnimationFrame || + window.oCancelAnimationFrame; // 开始下雪 - snowFall.prototype.start = function(){ - if(this.status == 1 || this.status == 4){ + snowFall.prototype.start = function () { + if (this.status == 1 || this.status == 4) { // 已经在下雪则不作处理 return false; } @@ -862,12 +1018,16 @@ game.import('play', function () { // 创建雪花形状 createFlakes.apply(this); // 画雪 - drawSnow.apply(this) - } + drawSnow.apply(this); + }; // 停止下雪 - snowFall.prototype.stop = function(){ - if(this.status == 2 || this.status == 0 || !this.canvas){ + snowFall.prototype.stop = function () { + if ( + this.status == 2 || + this.status == 0 || + !this.canvas + ) { return false; } // 停止动画循环 @@ -876,82 +1036,93 @@ game.import('play', function () { // 删除画布 this.canvas.parentNode.removeChild(this.canvas); this.canvas = null; - } + }; // 暂停下雪 - snowFall.prototype.pause = function(){ - if(this.status == 3){ + snowFall.prototype.pause = function () { + if (this.status == 3) { return false; } this.status = 3; - cancelAnimationFrame(this.loop) + cancelAnimationFrame(this.loop); }; // 继续下雪 - snowFall.prototype.resume = function(){ - if(this.status == 3 && this.canvas){ + snowFall.prototype.resume = function () { + if (this.status == 3 && this.canvas) { this.status = 4; // 动画的计时控制 - var that=this; - this.loop = requestAnimationFrame(function() { - drawSnow.apply(that) + var that = this; + this.loop = requestAnimationFrame(function () { + drawSnow.apply(that); }); } }; // 创建画布 - var snowCanvas=function() { + var snowCanvas = function () { // 添加Dom结点 var snowcanvas = document.createElement("canvas"); - snowcanvas.classList.add('fun'); + snowcanvas.classList.add("fun"); snowcanvas.id = "snowfall"; ui.window.appendChild(snowcanvas); - canvas=snowcanvas; + canvas = snowcanvas; this.canvas = snowcanvas; this.ctx = snowcanvas.getContext("2d"); // 窗口大小改变的处理 - lib.onresize.push(function() { + lib.onresize.push(function () { snowcanvas.width = ui.window.offsetWidth; - snowcanvas.height = ui.window.offsetHeight + snowcanvas.height = ui.window.offsetHeight; }); snowcanvas.width = ui.window.offsetWidth; snowcanvas.height = ui.window.offsetHeight; - } + }; // 雪运动对象 - var flakeMove=function(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 //步数 - } + var flakeMove = function ( + 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() { + 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.velY = this.speed; } - this.velX += Math.cos(this.step += 0.05) * this.stepSize; + this.velX += + Math.cos((this.step += 0.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) + 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) { + flakeMove.prototype.reset = function (width, height) { this.x = Math.floor(Math.random() * width); this.y = 0; this.size = Math.random() * snow.flakeSize + 2; @@ -961,10 +1132,23 @@ game.import('play', function () { }; // 渲染雪花-随机形状 - 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(0.5, "rgba(255, 255, 255, 0.5)"); + 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( + 0.5, + "rgba(255, 255, 255, 0.5)" + ); snowFlake.addColorStop(1, "rgba(255, 255, 255, 0)"); ctx.save(); ctx.fillStyle = snowFlake; @@ -975,20 +1159,29 @@ game.import('play', function () { }; // 创建雪花-定义形状 - var createFlakes=function() { + var createFlakes = function () { var maxFlake = this.maxFlake, - flakes = this.flakes = [], + flakes = (this.flakes = []), canvas = this.canvas; for (var i = 0; i < 200; i++) { - flakes.push(new flakeMove(canvas.width, canvas.height, this.flakeSize, this.fallSpeed)) + flakes.push( + new flakeMove( + canvas.width, + canvas.height, + this.flakeSize, + this.fallSpeed + ) + ); } - } + }; // 画雪 - var drawSnow=function() { + var drawSnow = function () { var maxFlake = this.maxFlake, flakes = this.flakes; - var ctx = this.ctx, canvas = this.canvas, that = this; + var ctx = this.ctx, + canvas = this.canvas, + that = this; // 清空雪花 ctx.clearRect(0, 0, canvas.width, canvas.height); for (var e = 0; e < maxFlake; e++) { @@ -996,98 +1189,98 @@ game.import('play', function () { flakes[e].render(ctx); } // 一帧一帧的画 - this.loop = requestAnimationFrame(function() { + this.loop = requestAnimationFrame(function () { drawSnow.apply(that); }); - } + }; // 调用及控制方法 var snow = new snowFall(); - game.haveFun.snowStart=function(){ + game.haveFun.snowStart = function () { snow.start(); - } - game.haveFun.snowStop=function(){ - game.haveFun.list.snow.running=false; + }; + game.haveFun.snowStop = function () { + game.haveFun.list.snow.running = false; snow.stop(); - } - game.haveFun.snowSize=function(){ - if(game.haveFun.list.snow.size=='large'){ - game.haveFun.list.snow.size='small'; - snow.maxFlake=80; - snow.flakeSize=3; - snow.fallSpeed=1; - if(this&&this.innerHTML){ - this.innerHTML='大雪'; + }; + game.haveFun.snowSize = function () { + if (game.haveFun.list.snow.size == "large") { + game.haveFun.list.snow.size = "small"; + snow.maxFlake = 80; + snow.flakeSize = 3; + snow.fallSpeed = 1; + if (this && this.innerHTML) { + this.innerHTML = "大雪"; } - game.saveConfig('coinSnowSize',true); - } - else{ - game.haveFun.list.snow.size='large'; - snow.maxFlake=200; - snow.flakeSize=10; - snow.fallSpeed=2; - if(this&&this.innerHTML){ - this.innerHTML='小雪'; + game.saveConfig("coinSnowSize", true); + } else { + game.haveFun.list.snow.size = "large"; + snow.maxFlake = 200; + snow.flakeSize = 10; + snow.fallSpeed = 2; + if (this && this.innerHTML) { + this.innerHTML = "小雪"; } - game.saveConfig('coinSnowSize',false); + game.saveConfig("coinSnowSize", false); } - } - if(lib.config.coinSnowSize){ + }; + if (lib.config.coinSnowSize) { game.haveFun.snowSize(); } snow.start(); } }, - firework:function(){ - if(game.haveFun.list.firework.running) return; - game.haveFun.list.firework.running=true; - if(game.haveFun.fireworkLoop){ + firework: function () { + if (game.haveFun.list.firework.running) return; + game.haveFun.list.firework.running = true; + if (game.haveFun.fireworkLoop) { game.haveFun.fireworkLoop(); - } - else{ + } 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 - var requestAnimFrame = ( function() { - return window.requestAnimationFrame || - window.webkitRequestAnimationFrame || - window.mozRequestAnimationFrame || - function( callback ) { - window.setTimeout( callback, 1000 / 60 ); - }; + var requestAnimFrame = (function () { + return ( + window.requestAnimationFrame || + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + function (callback) { + window.setTimeout(callback, 1000 / 60); + } + ); })(); // now we will setup our basic variables for the demo - var canvas = document.createElement( 'canvas' ), - ctx = canvas.getContext( '2d' ), - // full screen dimensions - cw = ui.window.offsetWidth, - ch = ui.window.offsetHeight, - // firework collection - fireworks = [], - // particle collection - particles = [], - // starting hue - hue = 120, - // when launching fireworks with a click, too many get launched at once without a limiter, one launch per 5 loop ticks - limiterTotal = 5, - limiterTick = 0, - // this will time the auto launches of fireworks, one launch per 80 loop ticks - timerTotal = 80, - timerTick = 0, - mousedown = false, - // mouse x coordinate, - mx, - // mouse y coordinate - my; + var canvas = document.createElement("canvas"), + ctx = canvas.getContext("2d"), + // full screen dimensions + cw = ui.window.offsetWidth, + ch = ui.window.offsetHeight, + // firework collection + fireworks = [], + // particle collection + particles = [], + // starting hue + hue = 120, + // when launching fireworks with a click, too many get launched at once without a limiter, one launch per 5 loop ticks + limiterTotal = 5, + limiterTick = 0, + // this will time the auto launches of fireworks, one launch per 80 loop ticks + timerTotal = 80, + timerTick = 0, + mousedown = false, + // mouse x coordinate, + mx, + // mouse y coordinate + my; // set canvas dimensions canvas.width = cw; canvas.height = ch; ui.window.appendChild(canvas); - canvas.classList.add('fun'); - lib.onresize.push(function(){ - cw=ui.window.offsetWidth; - ch=ui.window.offsetHeight; + canvas.classList.add("fun"); + lib.onresize.push(function () { + cw = ui.window.offsetWidth; + ch = ui.window.offsetHeight; canvas.width = cw; canvas.height = ch; }); @@ -1095,19 +1288,21 @@ game.import('play', function () { // now we are going to setup our function placeholders for the entire demo // get a random number within a range - var random=function( min, max ) { - return Math.random() * ( max - min ) + min; - } + var random = function (min, max) { + return Math.random() * (max - min) + min; + }; // calculate the distance between two points - var calculateDistance=function( p1x, p1y, p2x, p2y ) { + var calculateDistance = function (p1x, p1y, p2x, p2y) { var xDistance = p1x - p2x, - yDistance = p1y - p2y; - return Math.sqrt( Math.pow( xDistance, 2 ) + Math.pow( yDistance, 2 ) ); - } + yDistance = p1y - p2y; + return Math.sqrt( + Math.pow(xDistance, 2) + Math.pow(yDistance, 2) + ); + }; // create firework - var Firework=function( sx, sy, tx, ty ) { + var Firework = function (sx, sy, tx, ty) { // actual coordinates this.x = sx; this.y = sy; @@ -1118,32 +1313,37 @@ game.import('play', function () { this.tx = tx; this.ty = ty; // distance from starting point to target - this.distanceToTarget = calculateDistance( sx, sy, tx, ty ); + this.distanceToTarget = calculateDistance( + sx, + sy, + tx, + ty + ); this.distanceTraveled = 0; // track the past coordinates of each firework to create a trail effect, increase the coordinate count to create more prominent trails this.coordinates = []; this.coordinateCount = 3; // populate initial coordinate collection with the current coordinates - while( this.coordinateCount-- ) { - this.coordinates.push( [ this.x, this.y ] ); + while (this.coordinateCount--) { + this.coordinates.push([this.x, this.y]); } - this.angle = Math.atan2( ty - sy, tx - sx ); + this.angle = Math.atan2(ty - sy, tx - sx); this.speed = 2; this.acceleration = 1.05; - this.brightness = random( 50, 70 ); + this.brightness = random(50, 70); // circle target indicator radius this.targetRadius = 1; - } + }; // update firework - Firework.prototype.update = function( index ) { + Firework.prototype.update = function (index) { // remove last item in coordinates array this.coordinates.pop(); // add current coordinates to the start of the array - this.coordinates.unshift( [ this.x, this.y ] ); + this.coordinates.unshift([this.x, this.y]); // cycle the circle target indicator radius - if( this.targetRadius < 8 ) { + if (this.targetRadius < 8) { this.targetRadius += 0.3; } else { this.targetRadius = 1; @@ -1153,104 +1353,141 @@ game.import('play', function () { this.speed *= this.acceleration; // get the current velocities based on angle and speed - var vx = Math.cos( this.angle ) * this.speed, - vy = Math.sin( this.angle ) * this.speed; + var vx = Math.cos(this.angle) * this.speed, + vy = Math.sin(this.angle) * this.speed; // how far will the firework have traveled with velocities applied? - this.distanceTraveled = calculateDistance( this.sx, this.sy, this.x + vx, this.y + vy ); + this.distanceTraveled = calculateDistance( + this.sx, + this.sy, + this.x + vx, + this.y + vy + ); // if the distance traveled, including velocities, is greater than the initial distance to the target, then the target has been reached - if( this.distanceTraveled >= this.distanceToTarget ) { - createParticles( this.tx, this.ty ); + if ( + this.distanceTraveled >= this.distanceToTarget + ) { + createParticles(this.tx, this.ty); // remove the firework, use the index passed into the update function to determine which to remove - fireworks.splice( index, 1 ); + fireworks.splice(index, 1); } else { // target not reached, keep traveling this.x += vx; this.y += vy; } - } + }; // draw firework - Firework.prototype.draw = function() { + Firework.prototype.draw = function () { ctx.beginPath(); // move to the last tracked coordinate in the set, then draw a line to the current x and y - ctx.moveTo( this.coordinates[ this.coordinates.length - 1][ 0 ], this.coordinates[ this.coordinates.length - 1][ 1 ] ); - ctx.lineTo( this.x, this.y ); - ctx.strokeStyle = 'hsl(' + hue + ', 100%, ' + this.brightness + '%)'; + ctx.moveTo( + this.coordinates[ + this.coordinates.length - 1 + ][0], + this.coordinates[this.coordinates.length - 1][1] + ); + ctx.lineTo(this.x, this.y); + ctx.strokeStyle = + "hsl(" + + hue + + ", 100%, " + + this.brightness + + "%)"; ctx.stroke(); ctx.beginPath(); // draw the target for this firework with a pulsing circle - ctx.arc( this.tx, this.ty, this.targetRadius, 0, Math.PI * 2 ); + ctx.arc( + this.tx, + this.ty, + this.targetRadius, + 0, + Math.PI * 2 + ); ctx.stroke(); - } + }; // create particle - var Particle=function( x, y ) { + var Particle = function (x, y) { this.x = x; this.y = y; // track the past coordinates of each particle to create a trail effect, increase the coordinate count to create more prominent trails this.coordinates = []; this.coordinateCount = 5; - while( this.coordinateCount-- ) { - this.coordinates.push( [ this.x, this.y ] ); + while (this.coordinateCount--) { + this.coordinates.push([this.x, this.y]); } // set a random angle in all possible directions, in radians - this.angle = random( 0, Math.PI * 2 ); - this.speed = random( 1, 10 ); + this.angle = random(0, Math.PI * 2); + this.speed = random(1, 10); // friction will slow the particle down this.friction = 0.95; // gravity will be applied and pull the particle down this.gravity = 1; // set the hue to a random number +-20 of the overall hue variable - this.hue = random( hue - 20, hue + 20 ); - this.brightness = random( 50, 80 ); + this.hue = random(hue - 20, hue + 20); + this.brightness = random(50, 80); this.alpha = 1; // set how fast the particle fades out - this.decay = random( 0.015, 0.03 ); - } + this.decay = random(0.015, 0.03); + }; // update particle - Particle.prototype.update = function( index ) { + Particle.prototype.update = function (index) { // remove last item in coordinates array this.coordinates.pop(); // add current coordinates to the start of the array - this.coordinates.unshift( [ this.x, this.y ] ); + this.coordinates.unshift([this.x, this.y]); // slow down the particle this.speed *= this.friction; // apply velocity - this.x += Math.cos( this.angle ) * this.speed; - this.y += Math.sin( this.angle ) * this.speed + this.gravity; + this.x += Math.cos(this.angle) * this.speed; + this.y += + Math.sin(this.angle) * this.speed + + this.gravity; // fade out the particle this.alpha -= this.decay; // remove the particle once the alpha is low enough, based on the passed in index - if( this.alpha <= this.decay ) { - particles.splice( index, 1 ); + if (this.alpha <= this.decay) { + particles.splice(index, 1); } - } + }; // draw particle - Particle.prototype.draw = function() { - ctx. beginPath(); + Particle.prototype.draw = function () { + ctx.beginPath(); // move to the last tracked coordinates in the set, then draw a line to the current x and y - ctx.moveTo( this.coordinates[ this.coordinates.length - 1 ][ 0 ], this.coordinates[ this.coordinates.length - 1 ][ 1 ] ); - ctx.lineTo( this.x, this.y ); - ctx.strokeStyle = 'hsla(' + this.hue + ', 100%, ' + this.brightness + '%, ' + this.alpha + ')'; + ctx.moveTo( + this.coordinates[ + this.coordinates.length - 1 + ][0], + this.coordinates[this.coordinates.length - 1][1] + ); + ctx.lineTo(this.x, this.y); + ctx.strokeStyle = + "hsla(" + + this.hue + + ", 100%, " + + this.brightness + + "%, " + + this.alpha + + ")"; ctx.stroke(); - } + }; // create particle group/explosion - var createParticles=function( x, y ) { + var createParticles = function (x, y) { // increase the particle count for a bigger explosion, beware of the canvas performance hit with the increased particles though var particleCount = 30; - while( particleCount-- ) { - particles.push( new Particle( x, y ) ); + while (particleCount--) { + particles.push(new Particle(x, y)); } - } + }; // main demo loop - var loop=function() { + var loop = function () { // if(lib.config.coin_free_playpackconfig&&!_status.imchoosing){ // canvas.style.display='none'; // } @@ -1258,13 +1495,12 @@ game.import('play', function () { // canvas.style.display=''; // } // this function will run endlessly with requestAnimationFrame - if(!game.haveFun.list.firework.running){ - canvas.width=cw; - canvas.height=ch; + if (!game.haveFun.list.firework.running) { + canvas.width = cw; + canvas.height = ch; return; - } - else{ - requestAnimFrame( loop ); + } else { + requestAnimFrame(loop); } // increase the hue to get different colored fireworks over time @@ -1273,33 +1509,40 @@ game.import('play', function () { // normally, clearRect() would be used to clear the canvas // we want to create a trailing effect though // setting the composite operation to destination-out will allow us to clear the canvas at a specific opacity, rather than wiping it entirely - ctx.globalCompositeOperation = 'destination-out'; + ctx.globalCompositeOperation = "destination-out"; // decrease the alpha property to create more prominent trails - ctx.fillStyle = 'rgba(0, 0, 0, 0.5)'; - ctx.fillRect( 0, 0, cw, ch ); + ctx.fillStyle = "rgba(0, 0, 0, 0.5)"; + ctx.fillRect(0, 0, cw, ch); // change the composite operation back to our main mode // lighter creates bright highlight points as the fireworks and particles overlap each other - ctx.globalCompositeOperation = 'lighter'; + ctx.globalCompositeOperation = "lighter"; // loop over each firework, draw it, update it var i = fireworks.length; - while( i-- ) { - fireworks[ i ].draw(); - fireworks[ i ].update( i ); + while (i--) { + fireworks[i].draw(); + fireworks[i].update(i); } // loop over each particle, draw it, update it var i = particles.length; - while( i-- ) { - particles[ i ].draw(); - particles[ i ].update( i ); + while (i--) { + particles[i].draw(); + particles[i].update(i); } // launch fireworks automatically to random coordinates, when the mouse isn't down - if( timerTick >= timerTotal ) { - if( !mousedown ) { + if (timerTick >= timerTotal) { + if (!mousedown) { // start the firework at the bottom middle of the screen, then set the random target coordinates, the random y coordinates will be set within the range of the top half of the screen - fireworks.push( new Firework( cw / 2, ch, random( 0, cw ), random( 0, ch / 2 ) ) ); + fireworks.push( + new Firework( + cw / 2, + ch, + random(0, cw), + random(0, ch / 2) + ) + ); timerTick = 0; } } else { @@ -1307,69 +1550,95 @@ game.import('play', function () { } // limit the rate at which fireworks get launched when mouse is down - if( limiterTick >= limiterTotal ) { - if( mousedown ) { + if (limiterTick >= limiterTotal) { + if (mousedown) { // start the firework at the bottom middle of the screen, then set the current mouse coordinates as the target - fireworks.push( new Firework( cw / 2, ch, mx, my ) ); + fireworks.push( + new Firework(cw / 2, ch, mx, my) + ); limiterTick = 0; } } else { limiterTick++; } - } + }; - - if(lib.config.touchscreen){ - ui.window.addEventListener( 'touchmove', function( e ) { - mx = e.touches[0].clientX/game.documentZoom - canvas.offsetLeft; - my = e.touches[0].clientY/game.documentZoom - canvas.offsetTop; - }); - ui.window.addEventListener( 'touchstart', function( e ) { - mousedown = true; - }); - ui.window.addEventListener( 'touchend', function( e ) { - mousedown = false; - }); - } - else{ + if (lib.config.touchscreen) { + ui.window.addEventListener( + "touchmove", + function (e) { + mx = + e.touches[0].clientX / + game.documentZoom - + canvas.offsetLeft; + my = + e.touches[0].clientY / + game.documentZoom - + canvas.offsetTop; + } + ); + ui.window.addEventListener( + "touchstart", + function (e) { + mousedown = true; + } + ); + ui.window.addEventListener( + "touchend", + function (e) { + mousedown = false; + } + ); + } else { // mouse event bindings // update the mouse coordinates on mousemove - ui.window.addEventListener( 'mousemove', function( e ) { - mx = e.pageX/game.documentZoom - canvas.offsetLeft; - my = e.pageY/game.documentZoom - canvas.offsetTop; - }); + ui.window.addEventListener( + "mousemove", + function (e) { + mx = + e.pageX / game.documentZoom - + canvas.offsetLeft; + my = + e.pageY / game.documentZoom - + canvas.offsetTop; + } + ); // toggle mousedown state and prevent canvas from being selected - ui.window.addEventListener( 'mousedown', function( e ) { - e.preventDefault(); - mousedown = true; - }); + ui.window.addEventListener( + "mousedown", + function (e) { + e.preventDefault(); + mousedown = true; + } + ); - ui.window.addEventListener( 'mouseup', function( e ) { + ui.window.addEventListener("mouseup", function (e) { e.preventDefault(); mousedown = false; }); } // once the window loads, we are ready for some fireworks! - game.haveFun.fireworkLoop=loop; - game.haveFun.fireworkStop=function(){ - game.haveFun.list.firework.running=false; - }, - loop(); + game.haveFun.fireworkLoop = loop; + (game.haveFun.fireworkStop = function () { + game.haveFun.list.firework.running = false; + }), + loop(); } - } - } + }, + }, + }, + help: { + 富甲天下: + "