From 3732f6e4939630c16a348fa51e608780dff00006 Mon Sep 17 00:00:00 2001 From: oc Date: Tue, 8 Jan 2019 23:55:59 +0800 Subject: [PATCH] globalAnimate --- libs/control.js | 61 +++++++++++++++++++------------------------------ libs/core.js | 27 +++++++++++----------- libs/maps.js | 42 ++++++++++++++-------------------- 3 files changed, 53 insertions(+), 77 deletions(-) diff --git a/libs/control.js b/libs/control.js index 54def0a3..090478bb 100644 --- a/libs/control.js +++ b/libs/control.js @@ -48,15 +48,6 @@ control.prototype.setRequestAnimationFrame = function () { var draw = function(timestamp) { - core.animateFrame.globalTime = core.animateFrame.globalTime||timestamp; - core.animateFrame.boxTime = core.animateFrame.boxTime||timestamp; - core.animateFrame.selectorTime = core.animateFrame.selectorTime||timestamp; - core.animateFrame.animateTime = core.animateFrame.animateTime||timestamp; - core.animateFrame.moveTime = core.animateFrame.moveTime||timestamp; - core.animateFrame.lastLegTime = core.animateFrame.lastLegTime||timestamp; - core.animateFrame.weather.time = core.animateFrame.weather.time||timestamp; - core.saves.autosave.time = core.saves.autosave.time||timestamp; - // move time if (core.isPlaying() && core.isset(core.status) && core.isset(core.status.hero) && core.isset(core.status.hero.statistics)) { @@ -66,41 +57,35 @@ control.prototype.setRequestAnimationFrame = function () { } // Global Animate - if (core.animateFrame.globalAnimate && core.isPlaying() && core.isset(core.status.floorId)) { + if (timestamp - core.animateFrame.globalTime > core.animateFrame.speed && core.isPlaying()) { + + core.status.globalAnimateStatus++; - if (timestamp-core.animateFrame.globalTime>core.animateFrame.speed && core.isset(core.status.globalAnimateObjs)) { + if (core.animateFrame.globalAnimate && core.isset(core.status.floorId)) { + // Global Animate + core.status.globalAnimateObjs.forEach(function (block) { + core.drawBlock(block, core.status.globalAnimateStatus % (block.event.animate||1)); + }); - for (var a = 0; a < core.status.globalAnimateObjs.length; a++) { - var obj = core.status.globalAnimateObjs[a]; - obj.status = (obj.status+1)%(obj.event.animate||1); - core.drawBlock(obj, obj.status); - } - - if ((core.status.autotileAnimateObjs.blocks||[]).length>0) { - core.status.autotileAnimateObjs.status++; - core.status.autotileAnimateObjs.blocks.forEach(function (block) { - var cv = core.isset(block.name)?core.canvas[block.name]:core.canvas.event; - cv.clearRect(block.x * 32, block.y * 32, 32, 32); - if (core.isset(block.name)) { - if (block.name == 'bg') { - core.drawImage('bg', core.material.groundCanvas.canvas, block.x * 32, block.y * 32); - } - core.drawAutotile(cv, core.status.autotileAnimateObjs[block.name+"map"], block, 32, 0, 0, core.status.autotileAnimateObjs.status); + // Global Autotile Animate + core.status.autotileAnimateObjs.blocks.forEach(function (block) { + var cv = core.isset(block.name)?core.canvas[block.name]:core.canvas.event; + cv.clearRect(block.x * 32, block.y * 32, 32, 32); + if (core.isset(block.name)) { + if (block.name == 'bg') { + core.drawImage('bg', core.material.groundCanvas.canvas, block.x * 32, block.y * 32); } - else { - core.drawAutotile(cv, core.status.autotileAnimateObjs.map, block, 32, 0, 0, core.status.autotileAnimateObjs.status); - } - }) - } - - core.animateFrame.globalTime = timestamp; + core.drawAutotile(cv, core.status.autotileAnimateObjs[block.name+"map"], block, 32, 0, 0, core.status.globalAnimateStatus); + } + else { + core.drawAutotile(cv, core.status.autotileAnimateObjs.map, block, 32, 0, 0, core.status.globalAnimateStatus); + } + }); } - } - // Box - if (timestamp-core.animateFrame.boxTime>core.animateFrame.speed && core.isset(core.status.boxAnimateObjs) && core.status.boxAnimateObjs.length>0) { + // Box animate core.drawBoxAnimate(); - core.animateFrame.boxTime = timestamp; + core.animateFrame.globalTime = timestamp; } // AutosaveTime diff --git a/libs/core.js b/libs/core.js index ac88bc7e..f3738968 100644 --- a/libs/core.js +++ b/libs/core.js @@ -29,17 +29,16 @@ function core() { } this.animateFrame = { 'globalAnimate': false, - 'globalTime': null, - 'boxTime': null, - 'selectorTime': null, + 'globalTime': 0, + 'selectorTime': 0, 'selectorUp': true, - 'animateTime': null, - 'moveTime': null, - 'lastLegTime': null, + 'animateTime': 0, + 'moveTime': 0, + 'lastLegTime': 0, 'leftLeg': true, 'speed': null, 'weather': { - 'time': null, + 'time': 0, 'type': null, 'level': 0, 'nodes': [], @@ -98,7 +97,7 @@ function core() { "ids": {}, "autosave": { "data": null, - "time": null, + "time": 0, "updated": false, } } @@ -196,7 +195,8 @@ function core() { // 动画 'globalAnimateObjs': [], 'boxAnimateObjs': [], - 'autotileAnimateObjs': {"status": 0, "blocks": [], "map": null, "bgmap": null, "fgmap": null}, + 'autotileAnimateObjs': {"blocks": [], "map": null, "bgmap": null, "fgmap": null}, + "globalAnimateStatus": 0, 'animateObjs': [], }; this.status = {}; @@ -883,6 +883,10 @@ core.prototype.addGlobalAnimate = function (block) { core.maps.addGlobalAnimate(block); } +core.prototype.addAutotileGlobalAnimate = function (block) { + core.maps.addAutotileGlobalAnimate(block); +} + ////// 删除一个或所有全局动画 ////// core.prototype.removeGlobalAnimate = function (x, y, all) { core.maps.removeGlobalAnimate(x, y, all); @@ -893,11 +897,6 @@ core.prototype.setGlobalAnimate = function (speed) { core.maps.setGlobalAnimate(speed); } -////// 同步所有的全局动画效果 ////// -core.prototype.syncGlobalAnimate = function () { - core.maps.syncGlobalAnimate(); -} - ////// 绘制UI层的box动画 ////// core.prototype.drawBoxAnimate = function () { core.maps.drawBoxAnimate(); diff --git a/libs/maps.js b/libs/maps.js index 3e9e86d9..fa4ab346 100644 --- a/libs/maps.js +++ b/libs/maps.js @@ -436,7 +436,7 @@ maps.prototype.drawBgFgMap = function (floorId, canvas, name, animate) { if (cls == 'autotile') { core.drawAutotile(canvas, arr, block, 32, 0, 0); if (animate) - core.status.autotileAnimateObjs.blocks.push(core.clone(block)); + core.addAutotileGlobalAnimate(block); } else if (cls == 'tileset') { var offset = core.icons.getTilesetOffset(id); @@ -571,7 +571,7 @@ maps.prototype.drawMap = function (floorId, callback) { if (core.isset(block.event) && !block.disable) { if (block.event.cls == 'autotile') { core.drawAutotile(core.canvas.event, mapArray, block, 32, 0, 0); - core.status.autotileAnimateObjs.blocks.push(core.clone(block)); + core.addAutotileGlobalAnimate(block); } else { core.drawBlock(block); @@ -1182,7 +1182,6 @@ maps.prototype.showBlock = function(x, y, floorId) { if (floorId == core.status.floorId && core.isset(block.event)) { core.drawBlock(block); core.addGlobalAnimate(block); - core.syncGlobalAnimate(); } core.updateStatusBar(); } @@ -1304,7 +1303,6 @@ maps.prototype.setBlock = function (number, x, y, floorId) { if (floorId==core.status.floorId && !block.disable) { core.drawBlock(block); core.addGlobalAnimate(block); - core.syncGlobalAnimate(); core.updateStatusBar(); } } @@ -1329,11 +1327,16 @@ maps.prototype.setBgFgBlock = function (name, number, x, y, floorId) { maps.prototype.addGlobalAnimate = function (b) { if (main.mode=='editor' && main.editor.disableGlobalAnimate) return; if (!core.isset(b.event) || !core.isset(b.event.animate) || b.event.animate==1) return; + core.status.globalAnimateObjs.push(b); +} - var block = core.clone(b); - block.status = 0; - - core.status.globalAnimateObjs.push(block); +////// 添加一个Autotile全局动画 ////// +maps.prototype.addAutotileGlobalAnimate = function (b) { + if (main.mode=='editor' && main.editor.disableGlobalAnimate) return; + if (!core.isset(b.event) || b.event.cls!='autotile') return; + var id = b.event.id, img = core.material.images.autotile[id]; + if (!core.isset(img) || img.width==96) return; + core.status.autotileAnimateObjs.blocks.push(b); } ////// 删除一个或所有全局动画 ////// @@ -1341,8 +1344,9 @@ maps.prototype.removeGlobalAnimate = function (x, y, all, name) { if (main.mode=='editor' && main.editor.disableGlobalAnimate) return; if (all) { + core.status.globalAnimateStatus = 0; core.status.globalAnimateObjs = []; - core.status.autotileAnimateObjs = {"status": 0, "blocks": [], "map": null, "bgmap": null, "fgmap": null}; + core.status.autotileAnimateObjs = {"blocks": [], "map": null, "bgmap": null, "fgmap": null}; return; } @@ -1359,31 +1363,19 @@ maps.prototype.removeGlobalAnimate = function (x, y, all, name) { ////// 设置全局动画的显示效果 ////// maps.prototype.setGlobalAnimate = function (speed) { if (main.mode=='editor' && main.editor.disableGlobalAnimate) return; - core.syncGlobalAnimate(); + core.status.globalAnimateStatus = 0; core.animateFrame.speed = speed; core.animateFrame.globalAnimate = true; } -////// 同步所有的全局动画效果 ////// -maps.prototype.syncGlobalAnimate = function () { - core.status.globalAnimateObjs.forEach(function (t) { - t.status=0; - }) - if (core.isset(core.status.autotileAnimateObjs.status)) { - core.status.autotileAnimateObjs.status = 0; - } -} - ////// 绘制UI层的box动画 ////// maps.prototype.drawBoxAnimate = function () { - for (var a = 0; a < core.status.boxAnimateObjs.length; a++) { - var obj = core.status.boxAnimateObjs[a]; - obj.status = ((obj.status||0)+1)%obj.animate; + core.status.boxAnimateObjs.forEach(function (obj) { core.clearMap('ui', obj.bgx, obj.bgy, obj.bgWidth, obj.bgHeight); core.fillRect('ui', obj.bgx, obj.bgy, obj.bgWidth, obj.bgHeight, core.material.groundPattern); - core.drawImage('ui', obj.image, obj.status * 32, obj.pos, + core.drawImage('ui', obj.image, core.status.globalAnimateStatus % obj.animate * 32, obj.pos, 32, obj.height, obj.x, obj.y, 32, obj.height); - } + }); } ////// 绘制动画的某一帧 //////