From 21553a772874dd7c4b92e6d57fda2a3706dbffc6 Mon Sep 17 00:00:00 2001 From: oc Date: Tue, 16 Oct 2018 22:52:45 +0800 Subject: [PATCH] Damage in ViewMaps & Keep in animateImage --- _server/blockly/MotaAction.g4 | 33 +++++++------- docs/event.md | 12 ++--- libs/actions.js | 10 +++++ libs/control.js | 82 ++++++++++++++++++++++------------- libs/core.js | 3 +- libs/events.js | 24 +++++++--- libs/ui.js | 6 ++- 更新说明.txt | 4 +- 8 files changed, 112 insertions(+), 62 deletions(-) diff --git a/_server/blockly/MotaAction.g4 b/_server/blockly/MotaAction.g4 index 14451bc4..67bbc574 100644 --- a/_server/blockly/MotaAction.g4 +++ b/_server/blockly/MotaAction.g4 @@ -875,30 +875,32 @@ return code; */; animateImage_0_s - : '图片淡入' EvalString '起点像素位置' 'x' PosString 'y' PosString '动画时间' Int '不等待执行完毕' Bool Newline + : '图片淡入' EvalString '起点像素位置' 'x' PosString 'y' PosString '动画时间' Int '保留图片' Bool '不等待执行完毕' Bool Newline /* animateImage_0_s tooltip : animageImage：图片淡入 helpUrl : https://ckcz123.github.io/mota-js/#/event?id=animateimage%EF%BC%9A%E5%9B%BE%E7%89%87%E6%B7%A1%E5%85%A5%E6%B7%A1%E5%87%BA -default : ["bg.jpg","0","0",500,false] +default : ["bg.jpg","0","0",500,true,false] colour : this.printColor -var async = Bool_0?', "async": true':''; -var code = '{"type": "animateImage", "action": "show", "name": "'+EvalString_0+'", "loc": ['+PosString_0+','+PosString_1+'], "time": '+Int_0+async+'},\n'; +var keep = Bool_0?', "keep": true':''; +var async = Bool_1?', "async": true':''; +var code = '{"type": "animateImage", "action": "show", "name": "'+EvalString_0+'", "loc": ['+PosString_0+','+PosString_1+'], "time": '+Int_0+keep+async+'},\n'; return code; */; animateImage_1_s - : '图片淡出' EvalString '起点像素位置' 'x' PosString 'y' PosString '动画时间' Int '不等待执行完毕' Bool Newline + : '图片淡出' EvalString '起点像素位置' 'x' PosString 'y' PosString '动画时间' Int '清除图片' Bool '不等待执行完毕' Bool Newline /* animateImage_1_s tooltip : animageImage：图片淡出 helpUrl : https://ckcz123.github.io/mota-js/#/event?id=animateimage%EF%BC%9A%E5%9B%BE%E7%89%87%E6%B7%A1%E5%85%A5%E6%B7%A1%E5%87%BA -default : ["bg.jpg","0","0",500,false] +default : ["bg.jpg","0","0",500,true,false] colour : this.printColor -var async = Bool_0?', "async": true':''; -var code = '{"type": "animateImage", "action": "hide", "name": "'+EvalString_0+'", "loc": ['+PosString_0+','+PosString_1+'], "time": '+Int_0+async+'},\n'; +var keep = Bool_0?', "keep": true':''; +var async = Bool_1?', "async": true':''; +var code = '{"type": "animateImage", "action": "hide", "name": "'+EvalString_0+'", "loc": ['+PosString_0+','+PosString_1+'], "time": '+Int_0+keep+async+'},\n'; return code; */; @@ -929,16 +931,17 @@ return code; moveImage_0_s : '图片移动' EvalString '起点像素位置' 'x' PosString 'y' PosString BGNL - '终点像素位置' 'x' PosString 'y' PosString '移动时间' Int '不等待执行完毕' Bool Newline + '终点像素位置' 'x' PosString 'y' PosString '移动时间' Int '保留图片' Bool '不等待执行完毕' Bool Newline /* moveImage_0_s tooltip : moveImage：图片移动 helpUrl : https://ckcz123.github.io/mota-js/#/event?id=moveimage%EF%BC%9A%E5%9B%BE%E7%89%87%E7%A7%BB%E5%8A%A8 -default : ["bg.jpg","0","0","0","0",500,false] +default : ["bg.jpg","0","0","0","0",500,true,false] colour : this.printColor -var async = Bool_0?', "async": true':''; -var code = '{"type": "moveImage", "name": "'+EvalString_0+'", "from": ['+PosString_0+','+PosString_1+'], "to": ['+PosString_2+','+PosString_3+'], "time": '+Int_0+async+'},\n'; +var keep = Bool_0?', "keep": true':''; +var async = Bool_1?', "async": true':''; +var code = '{"type": "moveImage", "name": "'+EvalString_0+'", "from": ['+PosString_0+','+PosString_1+'], "to": ['+PosString_2+','+PosString_3+'], "time": '+Int_0+keep+async+'},\n'; return code; */; @@ -1836,10 +1839,10 @@ ActionParser.prototype.parseAction = function() { case "animateImage": // 显示图片 if(data.action == 'show'){ this.next = MotaActionBlocks['animateImage_0_s'].xmlText([ - data.name,data.loc[0],data.loc[1],data.time,data.async||false,this.next]); + data.name,data.loc[0],data.loc[1],data.time,data.keep||false,data.async||false,this.next]); } else if (data.action == 'hide') { this.next = MotaActionBlocks['animateImage_1_s'].xmlText([ - data.name,data.loc[0],data.loc[1],data.time,data.async||false,this.next]); + data.name,data.loc[0],data.loc[1],data.time,data.keep||false,data.async||false,this.next]); } break; case "showGif": // 显示动图 @@ -1853,7 +1856,7 @@ ActionParser.prototype.parseAction = function() { break; case "moveImage": // 移动图片 this.next = MotaActionBlocks['moveImage_0_s'].xmlText([ - data.name, data.from[0], data.from[1], data.to[0], data.to[1], data.time, data.async||false, this.next + data.name, data.from[0], data.from[1], data.to[0], data.to[1], data.time, data.keep||false, data.async||false, this.next ]); break; case "setFg": // 颜色渐变 diff --git a/docs/event.md b/docs/event.md index 7f64e99d..8d438840 100644 --- a/docs/event.md +++ b/docs/event.md @@ -800,7 +800,7 @@ loc为图片左上角坐标，以像素为单位进行计算。 ``` js "x,y": [ // 实际执行的事件列表 - {"type": "animateImage", "action": "show", "name": "bg.jpg", "loc": [231,297], "time": 500}, // 在(231,297)淡入bg.jpg，动画时间500ms + {"type": "animateImage", "action": "show", "name": "bg.jpg", "loc": [231,297], "time": 500, "keep": true}, // 在(231,297)淡入bg.jpg，动画时间500ms {"type": "animateImage", "action": "hide", "name": "1.png", "loc": [109,167], "time": 300, "async": true}, // 在(109,167)淡出1.png，动画时间300ms，异步执行 ] ``` @@ -813,9 +813,9 @@ loc为图片左上角坐标，以像素为单位进行计算。 time为淡入淡出的时间，如果是0则忽略此项。 -async可选，如果为true则会异步执行（即不等待当前事件执行完毕，立刻执行下一个事件）。 +keep可选，如果为true则在淡入图片后立刻调用showImage以保留图片，在淡出图片前先清除再动画。 -!> 淡入淡出图片只是会在顶层绘制“淡入”和“淡出”效果，动画结束即消失，并不会实际对图片的显示造成影响。请与showImage事件合用。 +async可选，如果为true则会异步执行（即不等待当前事件执行完毕，立刻执行下一个事件）。 如果多张图片的淡入淡出可以采用以下方式（仅供参考）： @@ -846,7 +846,7 @@ loc为动图左上角坐标，以像素为单位进行计算。 ``` js "x,y": [ // 实际执行的事件列表 - {"type": "moveImage", "name": "bg.jpg", "from": [231,297], "to": [22,333], "time": 500, "async": true}, + {"type": "moveImage", "name": "bg.jpg", "from": [231,297], "to": [22,333], "time": 500, "keep": true, "async": true}, ] ``` @@ -858,9 +858,9 @@ to为终点图片左上角坐标，以像素为单位进行计算。 time为总移动的时间。 -async可选，如果为true则会异步执行（即不等待当前事件执行完毕，立刻执行下一个事件）。 +keep可选，如果为true则在移动结束后立刻调用showImage以保留图片。 -!> 移动图片只是会在顶层绘制“移动”效果，动画结束即消失，并不会实际对图片的显示造成影响。请与showImage事件合用。 +async可选，如果为true则会异步执行（即不等待当前事件执行完毕，立刻执行下一个事件）。 ### setFg：更改画面色调 diff --git a/libs/actions.js b/libs/actions.js index 2bf5694c..7c8a1404 100644 --- a/libs/actions.js +++ b/libs/actions.js @@ -1018,6 +1018,12 @@ actions.prototype.clickViewMaps = function (x,y) { var cx = core.status.event.data.x, cy = core.status.event.data.y; var floorId = core.floorIds[index], mw = core.floors[floorId].width||13, mh = core.floors[floorId].height||13; + if (x==0 && y==0) { + core.status.event.data.damage = !core.status.event.data.damage; + core.ui.drawMaps(index, cx, cy); + return; + } + if (x>=2 && x<=10 && y<=1 && mh>13) { core.ui.drawMaps(index, cx, cy-1); return; @@ -1083,6 +1089,10 @@ actions.prototype.keyUpViewMaps = function (keycode) { core.setOpacity('data', 1); core.ui.closePanel(); } + if (keycode==86) { + core.status.event.data.damage = !core.status.event.data.damage; + core.ui.drawMaps(core.status.event.data.index, core.status.event.data.x, core.status.event.data.y); + } if (keycode==88 || (core.status.replay.replaying && keycode==67)) { if (core.isset(core.status.replay)&&core.status.replay.replaying) { core.bookReplay(); diff --git a/libs/control.js b/libs/control.js index c6673075..f5d1b7d2 100644 --- a/libs/control.js +++ b/libs/control.js @@ -1500,18 +1500,24 @@ control.prototype.setFg = function(color, time, callback) { } ////// 更新全地图显伤 ////// -control.prototype.updateDamage = function () { +control.prototype.updateDamage = function (floorId, canvas) { - if (!core.isset(core.status.thisMap) || !core.isset(core.status.thisMap.blocks)) return; + if (!core.isset(floorId)) floorId = core.status.floorId; + if (!core.isset(canvas)) { + canvas = core.canvas.damage; + core.clearMap('damage'); + } + + // if (!core.isset(core.status.thisMap) || !core.isset(core.status.thisMap.blocks)) return; // 更新显伤 - var mapBlocks = core.status.thisMap.blocks; - core.clearMap('damage'); + var mapBlocks = core.status.maps[floorId].blocks; // 没有怪物手册 if (!core.hasItem('book')) return; - core.setFont('damage', "bold 11px Arial"); + canvas.font = "bold 11px Arial"; + var hero_hp = core.status.hero.hp; if (core.flags.displayEnemyDamage || core.flags.displayCritical) { - core.canvas.damage.textAlign = 'left'; + canvas.textAlign = 'left'; for (var b = 0; b < mapBlocks.length; b++) { var x = mapBlocks[b].x, y = mapBlocks[b].y; if (core.isset(mapBlocks[b].event) && mapBlocks[b].event.cls.indexOf('enemy')==0 @@ -1520,7 +1526,7 @@ control.prototype.updateDamage = function () { // 非系统默认的战斗事件（被覆盖） if (mapBlocks[b].event.trigger != 'battle') { // 判断显伤 - var event = core.floors[core.status.floorId].events[x+","+y]; + var event = core.floors[floorId].events[x+","+y]; if (core.isset(event) && !(event instanceof Array)) { if (event.displayDamage === false) continue; @@ -1550,14 +1556,14 @@ control.prototype.updateDamage = function () { damage += "-"; } - core.setFillStyle('damage', '#000000'); - core.canvas.damage.fillText(damage, 32 * x + 2, 32 * (y + 1) - 2); - core.canvas.damage.fillText(damage, 32 * x, 32 * (y + 1) - 2); - core.canvas.damage.fillText(damage, 32 * x + 2, 32 * (y + 1)); - core.canvas.damage.fillText(damage, 32 * x, 32 * (y + 1)); + canvas.fillStyle = '#000000'; + canvas.fillText(damage, 32 * x + 2, 32 * (y + 1) - 2); + canvas.fillText(damage, 32 * x, 32 * (y + 1) - 2); + canvas.fillText(damage, 32 * x + 2, 32 * (y + 1)); + canvas.fillText(damage, 32 * x, 32 * (y + 1)); - core.setFillStyle('damage', color); - core.canvas.damage.fillText(damage, 32 * x + 1, 32 * (y + 1) - 1); + canvas.fillStyle = color; + canvas.fillText(damage, 32 * x + 1, 32 * (y + 1) - 1); } // 临界显伤 @@ -1566,13 +1572,13 @@ control.prototype.updateDamage = function () { if (critical.length>0) critical=critical[0]; critical = core.formatBigNumber(critical[0]); if (critical == '???') critical = '?'; - core.setFillStyle('damage', '#000000'); - core.canvas.damage.fillText(critical, 32 * x + 2, 32 * (y + 1) - 2 - 10); - core.canvas.damage.fillText(critical, 32 * x, 32 * (y + 1) - 2 - 10); - core.canvas.damage.fillText(critical, 32 * x + 2, 32 * (y + 1) - 10); - core.canvas.damage.fillText(critical, 32 * x, 32 * (y + 1) - 10); - core.setFillStyle('damage', '#FFFFFF'); - core.canvas.damage.fillText(critical, 32 * x + 1, 32 * (y + 1) - 1 - 10); + canvas.fillStyle = '#000000'; + canvas.fillText(critical, 32 * x + 2, 32 * (y + 1) - 2 - 10); + canvas.fillText(critical, 32 * x, 32 * (y + 1) - 2 - 10); + canvas.fillText(critical, 32 * x + 2, 32 * (y + 1) - 10); + canvas.fillText(critical, 32 * x, 32 * (y + 1) - 10); + canvas.fillStyle = '#FFFFFF'; + canvas.fillText(critical, 32 * x + 1, 32 * (y + 1) - 1 - 10); } } @@ -1580,23 +1586,41 @@ control.prototype.updateDamage = function () { } // 如果是领域&夹击 if (core.flags.displayExtraDamage) { - core.canvas.damage.textAlign = 'center'; + canvas.textAlign = 'center'; + + // 临时改变 + var tempCheckBlock = null; + if (floorId != core.status.floorId) { + tempCheckBlock = core.clone(core.status.checkBlock); + core.status.thisMap = core.status.maps[floorId]; + core.bigmap.width = core.floors[floorId].width || 13; + core.bigmap.height = core.floors[floorId].height || 13; + core.updateCheckBlock(); + } + for (var x=0;x0) { damage = core.formatBigNumber(damage); - core.setFillStyle('damage', '#000000'); - core.canvas.damage.fillText(damage, 32 * x + 17, 32 * (y + 1) - 13); - core.canvas.damage.fillText(damage, 32 * x + 15, 32 * (y + 1) - 15); - core.canvas.damage.fillText(damage, 32 * x + 17, 32 * (y + 1) - 15); - core.canvas.damage.fillText(damage, 32 * x + 15, 32 * (y + 1) - 13); + canvas.fillStyle = '#000000'; + canvas.fillText(damage, 32 * x + 17, 32 * (y + 1) - 13); + canvas.fillText(damage, 32 * x + 15, 32 * (y + 1) - 15); + canvas.fillText(damage, 32 * x + 17, 32 * (y + 1) - 15); + canvas.fillText(damage, 32 * x + 15, 32 * (y + 1) - 13); - core.setFillStyle('damage', '#FF7F00'); - core.canvas.damage.fillText(damage, 32 * x + 16, 32 * (y + 1) - 14); + canvas.fillStyle = '#FF7F00'; + canvas.fillText(damage, 32 * x + 16, 32 * (y + 1) - 14); } } } + + if (floorId!=core.status.floorId) { + core.status.thisMap = core.status.maps[core.status.floorId]; + core.status.checkBlock = tempCheckBlock; + core.bigmap.width = core.floors[core.status.floorId].width || 13; + core.bigmap.height = core.floors[core.status.floorId].height || 13; + } } } diff --git a/libs/core.js b/libs/core.js index 451ed925..e7b2084c 100644 --- a/libs/core.js +++ b/libs/core.js @@ -233,8 +233,7 @@ core.prototype.init = function (coreData, callback) { core.platform.isSafari = /Safari/i.test(navigator.userAgent) && !/Chrome/i.test(navigator.userAgent); core.platform.isQQ = /QQ/i.test(navigator.userAgent); core.platform.isWeChat = /MicroMessenger/i.test(navigator.userAgent); - core.platform.useLocalForage = core.getLocalStorage('useLocalForage', true); - if (core.platform.isIOS) core.platform.useLocalForage=false; + core.platform.useLocalForage = core.getLocalStorage('useLocalForage', !core.platform.isIOS); if (core.platform.useLocalForage) { try { core.setLocalForage("__test__", LZString.compress("__test__"), function() { diff --git a/libs/events.js b/libs/events.js index b5bba1b4..933b5c5e 100644 --- a/libs/events.js +++ b/libs/events.js @@ -600,11 +600,11 @@ events.prototype.doAction = function() { else { if (core.isset(data.loc) && core.isset(core.material.images.images[data.name]) && (data.action=="show" || data.action=="hide")) { if (data.async) { - core.events.animateImage(data.action, core.material.images.images[data.name], data.loc, data.time); + core.events.animateImage(data.action, core.material.images.images[data.name], data.loc, data.time, data.keep); this.doAction(); } else { - core.events.animateImage(data.action, core.material.images.images[data.name], data.loc, data.time, function() { + core.events.animateImage(data.action, core.material.images.images[data.name], data.loc, data.time, data.keep, function() { core.events.doAction(); }); } @@ -637,11 +637,11 @@ events.prototype.doAction = function() { else { if (core.isset(data.from) && core.isset(data.to) && core.isset(core.material.images.images[data.name])) { if (data.async) { - core.events.moveImage(core.material.images.images[data.name], data.from, data.to, data.time); + core.events.moveImage(core.material.images.images[data.name], data.from, data.to, data.time, data.keep); this.doAction(); } else { - core.events.moveImage(core.material.images.images[data.name], data.from, data.to, data.time, function() { + core.events.moveImage(core.material.images.images[data.name], data.from, data.to, data.time, data.keep, function() { core.events.doAction(); }); } @@ -1355,7 +1355,7 @@ events.prototype.changeFloor = function (floorId, stair, heroLoc, time, callback } ////// 图片淡入/淡出 ////// -events.prototype.animateImage = function (type, image, loc, time, callback) { +events.prototype.animateImage = function (type, image, loc, time, keep, callback) { time = time||0; if ((type!='show' && type!='hide') || time<=0) { if (core.isset(callback)) callback(); @@ -1368,8 +1368,13 @@ events.prototype.animateImage = function (type, image, loc, time, callback) { var opacityVal = 0; if (type == 'hide') opacityVal = 1; + if (type == 'hide' && keep) { + core.clearMap('animate'); + } + core.setOpacity('data', opacityVal); - core.canvas.data.drawImage(image, core.calValue(loc[0]), core.calValue(loc[1])); + var x = core.calValue(loc[0]), y = core.calValue(loc[1]); + core.canvas.data.drawImage(image, x, y); core.status.replay.animate=true; var animate = setInterval(function () { if (type=='show') opacityVal += 0.1; @@ -1377,6 +1382,8 @@ events.prototype.animateImage = function (type, image, loc, time, callback) { core.setOpacity('data', opacityVal); if (opacityVal >=1 || opacityVal<=0) { clearInterval(animate); + if (type == 'show' && keep) + core.canvas.animate.drawImage(image, x, y); core.clearMap('data'); core.setOpacity('data', 1); core.status.replay.animate=false; @@ -1386,12 +1393,14 @@ events.prototype.animateImage = function (type, image, loc, time, callback) { } ////// 移动图片 ////// -events.prototype.moveImage = function (image, from, to, time, callback) { +events.prototype.moveImage = function (image, from, to, time, keep, callback) { time = time || 1000; clearInterval(core.interval.tipAnimate); core.setAlpha('data', 1); core.setOpacity('data', 1); + if (keep) core.clearMap('animate'); + core.status.replay.animate=true; var fromX = core.calValue(from[0]), fromY = core.calValue(from[1]), toX = core.calValue(to[0]), toY = core.calValue(to[1]); @@ -1411,6 +1420,7 @@ events.prototype.moveImage = function (image, from, to, time, callback) { clearInterval(animate); core.clearMap('data'); core.status.replay.animate=false; + if (keep) core.canvas.data.drawImage(image, toX, toY); if (core.isset(callback)) callback(); } }, time / 64); diff --git a/libs/ui.js b/libs/ui.js index 9d2ffcd6..0fd8403a 100644 --- a/libs/ui.js +++ b/libs/ui.js @@ -1594,7 +1594,7 @@ ui.prototype.drawMaps = function (index, x, y) { if (y<6) y=6; if (y>mh-7) y=mh-7; - core.status.event.data = {"index": index, "x": x, "y": y}; + core.status.event.data = {"index": index, "x": x, "y": y, "damage": (core.status.event.data||{"damage":false}).damage}; clearTimeout(core.interval.tipAnimate); core.clearMap('ui'); @@ -2101,6 +2101,10 @@ ui.prototype.drawThumbnail = function(floorId, canvas, blocks, x, y, size, cente } }) + // draw damage + if (core.status.event.id=='viewMaps' && (core.status.event.data||{}).damage) + core.control.updateDamage(floorId, tempCanvas); + // draw to canvas core.clearMap(canvas, x, y, size, size); if (!core.isset(centerX)) centerX=parseInt(mw/2); diff --git a/更新说明.txt b/更新说明.txt index b0ff89d0..b838085c 100644 --- a/更新说明.txt +++ b/更新说明.txt @@ -7,12 +7,12 @@ 事件改变天气或画面色调，读档后仍有效 Autotile自动元件的新增和注册 状态栏可以显示角色名字 +浏览地图可以显伤 +图片淡入淡出和移动图片可以将其保留 双击道具栏图标直接进入装备栏 可以设置剧情文本的字体大小 录像播放可以最高24倍速 1-6键快速设置录像播放速度；滚轮加减速 -修复大地图的夹击Bug -iOS设备默认关闭新版存档 部分其他细节优化 -----------------------------------------------------------------------