diff --git a/_docs/api.md b/_docs/api.md index 3f40d96f..3316e221 100644 --- a/_docs/api.md +++ b/_docs/api.md @@ -1846,8 +1846,9 @@ zIndex: 创建的纵向高度（关系到画布之间的覆盖），z值高的 deleteAllCanvas: fn() 清空所有的自定义画布 -deleteCanvas: fn(name: string) +deleteCanvas: fn(name: string|fn(name: string) -> bool) 删除一个自定义画布 +name: 画布名；也可以传入一个filter对画布名进行筛选。 drawArrow: fn(name: string|CanvasRenderingContext2D, x1: number, y1: number, x2: number, y2: number, style?: string, lineWidth?: number) 在某个canvas上绘制一个箭头 diff --git a/_server/CodeMirror/defs.js b/_server/CodeMirror/defs.js index aca37dc9..1c64b918 100644 --- a/_server/CodeMirror/defs.js +++ b/_server/CodeMirror/defs.js @@ -3393,8 +3393,8 @@ var terndefs_f6783a0a_522d_417e_8407_94c67b692e50 = [ "!type": "fn(name: string, x: number, y: number)" }, "deleteCanvas": { - "!doc": "删除一个自定义画布", - "!type": "fn(name: string)" + "!doc": "删除一个自定义画布
name: 画布名，也可以传入一个函数对所有画布进行筛选", + "!type": "fn(name: string|fn(name: string) -> bool)" }, "deleteAllCanvas": { "!doc": "清空所有的自定义画布", diff --git a/_server/editor_ui.js b/_server/editor_ui.js index 3a65e5a0..d284c214 100644 --- a/_server/editor_ui.js +++ b/_server/editor_ui.js @@ -696,7 +696,7 @@ editor_ui_wrapper = function (editor) { var html = "

该变量出现的所有位置如下：

"; diff --git a/libs/actions.js b/libs/actions.js index 9ec02faf..dae45741 100644 --- a/libs/actions.js +++ b/libs/actions.js @@ -946,7 +946,7 @@ actions.prototype._clickCenterFly = function (x, y) { actions.prototype._keyUpCenterFly = function (keycode) { core.ui.closePanel(); - if (keycode == 13 || keycode == 32 || keycode == 67) { + if (keycode == 51 || keycode == 13 || keycode == 32 || keycode == 67) { if (core.canUseItem('centerFly')) { core.useItem('centerFly'); } diff --git a/libs/control.js b/libs/control.js index 913b5b29..7aa570c6 100644 --- a/libs/control.js +++ b/libs/control.js @@ -977,6 +977,17 @@ control.prototype.updateViewport = function() { }); // ------ 路线 core.relocateCanvas('route', core.status.automaticRoute.offsetX - core.bigmap.offsetX, core.status.automaticRoute.offsetY - core.bigmap.offsetY); + // ------ 所有的大怪物也都需要重定位 + for (var one in core.dymCanvas) { + if (one.startsWith('_bigImage_')) { + var ox = core.dymCanvas[one].canvas.getAttribute('_ox'); + var oy = core.dymCanvas[one].canvas.getAttribute('_oy'); + if (ox != null && oy != null) { + core.relocateCanvas(one, parseInt(ox) - core.bigmap.offsetX, parseInt(oy) - core.bigmap.offsetY); + } + } + } + } ////// 设置视野范围 ////// @@ -988,6 +999,7 @@ control.prototype.setViewport = function (px, py) { var hero_x = core.clamp((core.getHeroLoc('x') - core.__HALF_SIZE__) * 32, 0, 32*core.bigmap.width-core.__PIXELS__); var hero_y = core.clamp((core.getHeroLoc('y') - core.__HALF_SIZE__) * 32, 0, 32*core.bigmap.height-core.__PIXELS__); core.control.setGameCanvasTranslate('hero', hero_x - core.bigmap.offsetX, hero_y - core.bigmap.offsetY); + } ////// 移动视野范围 ////// diff --git a/libs/maps.js b/libs/maps.js index c067c36d..4c6b7e6f 100644 --- a/libs/maps.js +++ b/libs/maps.js @@ -954,6 +954,29 @@ maps.prototype._automaticRoute_deepAdd = function (x, y, blocks) { // -------- 绘制地图，各层图块，楼层贴图，Autotile -------- // +maps.prototype._getBigImageInfo = function (bigImage, face, animate) { + face = face || "down"; + if (["up", "down", "left", "right"].indexOf(face) < 0) face = "down"; + var per_width = bigImage.width / 4; + var per_height = bigImage.height / 4; + var sx = animate * per_width, sy; + if (per_height < per_width / 2) { // 强制视为 1*4 的怪物 + per_height = bigImage.height; + sy = 0; + } else { + sy = core.material.icons.hero[face].loc * per_height; + } + var dx, dy; + switch (face) { + case "down": dx = 16 - per_width / 2; dy = 32 - per_height; break; + case "left": dx = 0; dy = 16 - per_height / 2; break; + case "right": dx = 32 - per_width; dy = 16 - per_height / 2; break; + case "up": dx = 16 - per_width / 2; dy = 0; break; + } + + return {sx: sx, sy: sy, per_width: per_width, per_height: per_height, face: face, dx: dx, dy: dy}; +} + ////// 绘制一个图块 ////// maps.prototype.drawBlock = function (block, animate, ctx) { if (block.event.id == 'none') return; @@ -987,66 +1010,104 @@ maps.prototype.drawBlock = function (block, animate, ctx) { this._drawBlockInfo_bgfg(blockInfo, block.name, block.x, block.y, ctx); } -maps.prototype._drawBlockInfo_bigImage = function (blockInfo, x, y) { - var face = blockInfo.face || "down"; - if (["up", "down", "left", "right"].indexOf(face) < 0) face = "down"; +maps.prototype._drawBlockInfo_bigImage = function (blockInfo, x, y, ctx) { + var bigImageInfo = this._getBigImageInfo(blockInfo.bigImage, blockInfo.face, blockInfo.posX); + var per_width = bigImageInfo.per_width, per_height = bigImageInfo.per_height, sx = bigImageInfo.sx, sy = bigImageInfo.sy; var bigImage = blockInfo.bigImage; - var per_width = bigImage.width / 4; - var per_height = bigImage.height / 4; - if (face == 'down' && per_height < per_width / 2) { // 强制视为 1*4 的怪物 - per_height = bigImage.height; + + if (main.mode == 'editor') { + var px = 32 * x - 32 * core.bigmap.posX; + var py = 32 * y - 32 * core.bigmap.posY; + if (ctx == null) ctx = 'event'; + core.clearMap(ctx, px, py, 32, 32); + core.drawImage(ctx, bigImage, sx, sy, per_width, per_height, px, py, 32, 32); + return; } - var sx = blockInfo.posX * per_width; - var sy = core.material.icons.hero[face].loc * per_height; + + var px = 32 * x - core.bigmap.offsetX; + var py = 32 * y - core.bigmap.offsetY; // 上半部分 - 会遮挡勇士；z值高于event2，为51 var header = "_bigImage_header_" + x + "_" + y; // 下半部分 - 会被勇士遮挡；z值高于event，为31 var body = "_bigImage_body_" + x + "_" + y; - var px = 32 * x - core.bigmap.offsetX; - var py = 32 * y - core.bigmap.offsetY; + var dx = bigImageInfo.dx, dy = bigImageInfo.dy; - switch (face) { + switch (bigImageInfo.face) { case "down": - var dx = px + 16 - per_width / 2; - var dy = py + 32 - per_height; - core.createCanvas(header, dx, dy, per_width, per_height - 32, 51); - core.drawImage(header, bigImage, sx, sy, per_width, per_height - 32, 0, 0, per_width, per_height - 32); - core.createCanvas(body, dx, dy + per_height - 32, per_width, 32, 31); - core.drawImage(body, bigImage, sx, sy + per_height - 32, per_width, 32, 0, 0, per_width, 32); + core.createCanvas(header, px + dx, py + dy, per_width, per_height - 32, 51); + this._drawBlockInfo_drawWithFilter(blockInfo, header, function () { + core.drawImage(header, bigImage, sx, sy, per_width, per_height - 32, 0, 0, per_width, per_height - 32); + }); + core.createCanvas(body, px + dx, py, per_width, 32, 31); + this._drawBlockInfo_drawWithFilter(blockInfo, body, function () { + core.drawImage(body, bigImage, sx, sy + per_height - 32, per_width, 32, 0, 0, per_width, 32); + }) break; case "left": - core.createCanvas(header, px, py + 16 - per_height / 2, per_width, per_height / 2 - 16, 51); - core.drawImage(header, bigImage, sx, sy, per_width, per_height / 2 - 16, 0, 0, per_width, per_height / 2 - 16); - core.createCanvas(body, px, py, per_width, per_height / 2 + 16, 31); - core.drawImage(body, bigImage, sx, sy + per_height / 2 - 16, per_width, per_height / 2 + 16, 0, 0, per_width, per_height / 2 + 16); + core.createCanvas(header, px + dx, py + dy, per_width, per_height / 2 - 16, 51); + this._drawBlockInfo_drawWithFilter(blockInfo, header, function () { + core.drawImage(header, bigImage, sx, sy, per_width, per_height / 2 - 16, 0, 0, per_width, per_height / 2 - 16); + }); + core.createCanvas(body, px + dx, py, per_width, per_height / 2 + 16, 31); + this._drawBlockInfo_drawWithFilter(blockInfo, body, function () { + core.drawImage(body, bigImage, sx, sy + per_height / 2 - 16, per_width, per_height / 2 + 16, 0, 0, per_width, per_height / 2 + 16); + }); break; + case "right": + core.createCanvas(header, px + dx, py + dy, per_width, per_height / 2 - 16, 51); + this._drawBlockInfo_drawWithFilter(blockInfo, header, function () { + core.drawImage(header, bigImage, sx, sy, per_width, per_height / 2 - 16, 0, 0, per_width, per_height / 2 - 16); + }); + core.createCanvas(body, px + dx, py, per_width, per_height / 2 + 16, 31); + this._drawBlockInfo_drawWithFilter(blockInfo, body, function () { + core.drawImage(body, bigImage, sx, sy + per_height / 2 - 16, per_width, per_height / 2 + 16, 0, 0, per_width, per_height / 2 + 16); + }); + break; + case "up": + core.deleteCanvas(header); + core.createCanvas(body, px + dx, py, per_width, per_height, 31); + this._drawBlockInfo_drawWithFilter(blockInfo, body, function () { + core.drawImage(body, bigImage, sx, sy, per_width, per_height, 0, 0, per_width, per_height); + }); + break; + } + if (core.dymCanvas[header]) { + core.dymCanvas[header].canvas.setAttribute('_ox', 32 * x + dx); + core.dymCanvas[header].canvas.setAttribute('_oy', 32 * y + dy); + } + if (core.dymCanvas[body]) { + core.dymCanvas[body].canvas.setAttribute('_ox', 32 * x + dx); + core.dymCanvas[body].canvas.setAttribute('_oy', 32 * y); } } +maps.prototype._drawBlockInfo_drawWithFilter = function (blockInfo, ctx, func) { + var alpha = null; + if (blockInfo.opacity != null) alpha = core.setAlpha(ctx, blockInfo.opacity); + core.setFilter(ctx, blockInfo.filter); + func(); + core.setFilter(ctx, null); + if (alpha != null) core.setAlpha(ctx, alpha); +} + maps.prototype._drawBlockInfo = function (blockInfo, x, y, ctx) { - if (blockInfo.bigImage) return this._drawBlockInfo_bigImage(blockInfo, x, y); + if (blockInfo.bigImage) return this._drawBlockInfo_bigImage(blockInfo, x, y, ctx); var image = blockInfo.image, posX = blockInfo.posX, posY = blockInfo.posY, height = blockInfo.height; var px = 32 * x - 32 * core.bigmap.posX; var py = 32 * y - 32 * core.bigmap.posY; if (ctx == null) ctx = 'event'; - var alpha = null; - if (blockInfo.opacity != null) alpha = core.setAlpha(ctx, blockInfo.opacity); - core.setFilter(ctx, blockInfo.filter); - core.clearMap(ctx, px, py, 32, 32); - core.drawImage(ctx, image, posX * 32, posY * height + height - 32, 32, 32, px, py, 32, 32); - core.setFilter(ctx, null); - if (alpha != null) core.setAlpha(ctx, alpha); + this._drawBlockInfo_drawWithFilter(blockInfo, ctx, function () { + core.clearMap(ctx, px, py, 32, 32); + core.drawImage(ctx, image, posX * 32, posY * height + height - 32, 32, 32, px, py, 32, 32); + }); if (height > 32) { - alpha = null; - if (blockInfo.opacity != null) alpha = core.setAlpha('event2', blockInfo.opacity); - core.setFilter('event2', blockInfo.filter); - core.clearMap('event2', px, py + 32 - height, 32, height - 32) - core.drawImage('event2', image, posX * 32, posY * height, 32, height - 32, px, py + 32 - height, 32, height - 32); - core.setFilter('event2', null); - if (alpha != null) core.setAlpha('event2', alpha); + this._drawBlockInfo_drawWithFilter(blockInfo, 'event2', function () { + core.clearMap('event2', px, py + 32 - height, 32, height - 32); + core.drawImage('event2', image, posX * 32, posY * height, 32, height - 32, px, py + 32 - height, 32, height - 32); + }); } } @@ -1130,8 +1191,9 @@ maps.prototype._drawMap_drawAll = function (floorId, config) { this.drawFg(floorId, config); } -maps.prototype._drawMap_drawBlockInfo = function (ctx, block, blockInfo, arr, onMap) { +maps.prototype._drawMap_drawBlockInfo = function (ctx, block, blockInfo, arr, config) { if (blockInfo == null) return; + var onMap = config.onMap; if (onMap && core.bigmap.v2) { // 判定是否绘制 var posX = core.bigmap.posX, posY = core.bigmap.posY; @@ -1152,12 +1214,20 @@ maps.prototype._drawMap_drawBlockInfo = function (ctx, block, blockInfo, arr, on } if (!onMap) { var height = blockInfo.height; - var alpha = null; - if (block.opacity != null) alpha = core.setAlpha(ctx, block.opacity); - core.setFilter(ctx, block.filter); - core.drawImage(ctx, blockInfo.image, 32 * blockInfo.posX, height * blockInfo.posY, 32, height, 32 * block.x, 32 * block.y + 32 - height, 32, height); - core.setFilter(ctx, null); - if (alpha != null) core.setAlpha(ctx, alpha); + if (blockInfo.bigImage) { + config.postDraw.push(function () { + var bigImageInfo = core.maps._getBigImageInfo(blockInfo.bigImage, blockInfo.face, 0); + var per_width = bigImageInfo.per_width, per_height = bigImageInfo.per_height; + core.maps._drawBlockInfo_drawWithFilter(block, ctx, function () { + core.drawImage(ctx, blockInfo.bigImage, bigImageInfo.sx, bigImageInfo.sy, per_width, per_height, + 32 * block.x + bigImageInfo.dx, 32 * block.y + bigImageInfo.dy, per_width, per_height); + }); + }); + return; + } + this._drawBlockInfo_drawWithFilter(block, ctx, function () { + core.drawImage(ctx, blockInfo.image, 32 * blockInfo.posX, height * blockInfo.posY, 32, height, 32 * block.x, 32 * block.y + 32 - height, 32, height); + }); return; } this.drawBlock(block, null, ctx); @@ -1251,6 +1321,7 @@ maps.prototype.drawEvents = function (floorId, blocks, config) { } else { arr = this._getMapArrayFromBlocks(blocks, core.floors[floorId].width, core.floors[floorId].height); } + config.postDraw = []; blocks.filter(function (block) { if (config.onMap && core.bigmap.v2) { @@ -1262,8 +1333,10 @@ maps.prototype.drawEvents = function (floorId, blocks, config) { } return block.event && !block.disable; }).forEach(function (block) { - core.maps._drawMap_drawBlockInfo(cacheCtx, block, core.maps.getBlockInfo(block), arr, config.onMap); + core.maps._drawMap_drawBlockInfo(cacheCtx, block, core.maps.getBlockInfo(block), arr, config); }); + config.postDraw.forEach(function (v) { v(); }); + delete config.postDraw; if (config.onMap) { core.drawImage(toDrawCtx, cacheCtx.canvas, core.bigmap.v2 ? -32 : 0, core.bigmap.v2 ? -32 : 0); @@ -1323,6 +1396,7 @@ maps.prototype._drawBgFgMap = function (floorId, name, config) { var endY = config.onMap && core.bigmap.v2 ? Math.min(height, core.bigmap.posY + core.__SIZE__ + 2) : height; // +1 for 48 px var arr = this._getBgFgMapArray(name, floorId, !config.redraw); + config.postDraw = []; for (var x = startX; x < endX; x++) { for (var y = startY; y < endY; y++) { if (arr[y][x] == 0) continue; @@ -1330,9 +1404,11 @@ maps.prototype._drawBgFgMap = function (floorId, name, config) { block.name = name; var blockInfo = this.getBlockInfo(block); if (!blockInfo) continue; - this._drawMap_drawBlockInfo(config.ctx, block, blockInfo, arr, config.onMap); + this._drawMap_drawBlockInfo(config.ctx, block, blockInfo, arr, config); } } + config.postDraw.forEach(function (v) { v(); }); + delete config.postDraw; } ////// 绘制楼层贴图 ////// @@ -2034,8 +2110,10 @@ maps.prototype._removeBlockFromMap = function (floorId, block) { core.removeGlobalAnimate(x, y); core.clearMap('event', px, py, 32, 32); var height = block.event.height || 32; - if (height > 32) - core.clearMap('event2', px, py + 32 - height, 32, height - 32); + if (height > 32) core.clearMap('event2', px, py + 32 - height, 32, height - 32); + // 删除大怪物 + core.deleteCanvas("_bigImage_header_" + x + "_" + y); + core.deleteCanvas("_bigImage_body_" + x + "_" + y); core.updateStatusBar(); } } @@ -2391,12 +2469,17 @@ maps.prototype.resetMap = function (floorId) { maps.prototype._initDetachedBlock = function (blockInfo, x, y, displayDamage) { var headCanvas = null, bodyCanvas = '__body_' + x + "_" + y, damageCanvas = null; // head - if (blockInfo.height > 32) { + if (!blockInfo.bigImage && blockInfo.height > 32) { headCanvas = "__head_" + x + "_" + y; core.createCanvas(headCanvas, 0, 0, 32, blockInfo.height - 32, 55); } // body - core.createCanvas(bodyCanvas, 0, 0, 32, 32, 35); + if (blockInfo.bigImage) { + var bigImageInfo = this._getBigImageInfo(blockInfo.bigImage, blockInfo.face, blockInfo.posX); + core.createCanvas(bodyCanvas, 0, 0, bigImageInfo.per_width, bigImageInfo.per_height, 35); + } else { + core.createCanvas(bodyCanvas, 0, 0, 32, 32, 35); + } // damage var damage = null, damageColor = null; if (blockInfo.cls.indexOf('enemy') == 0 && core.hasItem('book') && displayDamage) { @@ -2436,10 +2519,19 @@ maps.prototype._moveDetachedBlock = function (blockInfo, nowX, nowY, opacity, ca core.setOpacity(headCanvas, opacity); } if (bodyCanvas) { - core.dymCanvas[bodyCanvas].clearRect(0, 0, 32, 32); - core.dymCanvas[bodyCanvas].drawImage(image, posX * 32, posY * height + height - 32, 32, 32, 0, 0, 32, 32); - core.relocateCanvas(bodyCanvas, nowX - core.bigmap.offsetX, nowY - core.bigmap.offsetY); - core.setOpacity(bodyCanvas, opacity); + if (blockInfo.bigImage) { + var bigImageInfo = this._getBigImageInfo(blockInfo.bigImage, blockInfo.face, blockInfo.posX); + var per_width = bigImageInfo.per_width, per_height = bigImageInfo.per_height; + core.dymCanvas[bodyCanvas].clearRect(0, 0, bigImageInfo.per_width, bigImageInfo.per_height); + core.dymCanvas[bodyCanvas].drawImage(blockInfo.bigImage, bigImageInfo.sx, bigImageInfo.sy, per_width, per_height, 0, 0, per_width, per_height); + core.relocateCanvas(bodyCanvas, nowX - core.bigmap.offsetX + bigImageInfo.dx, nowY - core.bigmap.offsetY + bigImageInfo.dy); + core.setOpacity(bodyCanvas, opacity); + } else { + core.dymCanvas[bodyCanvas].clearRect(0, 0, 32, 32); + core.dymCanvas[bodyCanvas].drawImage(image, posX * 32, posY * height + height - 32, 32, 32, 0, 0, 32, 32); + core.relocateCanvas(bodyCanvas, nowX - core.bigmap.offsetX, nowY - core.bigmap.offsetY); + core.setOpacity(bodyCanvas, opacity); + } } if (damageCanvas) { core.relocateCanvas(damageCanvas, nowX - core.bigmap.offsetX, nowY - core.bigmap.offsetY); @@ -2560,6 +2652,7 @@ maps.prototype._moveBlock_updateDirection = function (blockInfo, moveInfo) { if (faceDirection == 'leftup' || faceDirection == 'leftdown') faceDirection = 'left'; if (faceDirection == 'rightup' || faceDirection == 'rightdown') faceDirection = 'right'; var currid = blockInfo.faceIds[faceDirection]; + blockInfo.face = faceDirection; if (currid) { var posY = core.material.icons[blockInfo.cls][currid]; if (posY != null) { @@ -2719,9 +2812,10 @@ maps.prototype._animateBlock_getList = function (loc, type) { var list = []; loc.forEach(function (t) { var block = core.getBlock(t[0], t[1], null, true); + if (block == null) return; + var fromOpacity = block.opacity; if (fromOpacity == null) fromOpacity = 1.0; - if (block == null) return; var blockInfo = core.maps.getBlockInfo(block); if (blockInfo == null) { @@ -2807,12 +2901,27 @@ maps.prototype.removeGlobalAnimate = function (x, y, name) { ////// 绘制UI层的box动画 ////// maps.prototype.drawBoxAnimate = function () { if (core.status.boxAnimateObjs.length == 0) return; + // check ui2 + if (main.mode == 'play' && core.status.boxAnimateObjs.filter(function (one) { return one.bigImage }).length > 0 && !core.dymCanvas.ui2) { + core.createCanvas('ui2', 0, 0, core.__PIXELS__, core.__PIXELS__, 142); + } + core.clearMap('ui2'); + core.status.boxAnimateObjs.forEach(function (obj) { - var ctx = obj.ctx || 'ui'; - core.clearMap(ctx, obj.bgx, obj.bgy, obj.bgWidth, obj.bgHeight); - core.fillRect(ctx, obj.bgx, obj.bgy, obj.bgWidth, obj.bgHeight, core.material.groundPattern); - core.drawImage(ctx, obj.image, core.status.globalAnimateStatus % obj.animate * 32, obj.pos, - 32, obj.height, obj.x, obj.y, obj.dw || 32, obj.dh || obj.height); + if (obj.bigImage) { + var ctx = obj.ctx || 'ui2'; + var bigImageInfo = core.maps._getBigImageInfo(obj.bigImage, obj.face, core.status.globalAnimateStatus % 4); + var sx = bigImageInfo.sx, sy = bigImageInfo.sy, per_width = bigImageInfo.per_width, per_height = bigImageInfo.per_height; + var actual_width = Math.min(per_width, obj.max_width || per_width), actual_height = per_height * actual_width / per_width; + core.drawImage(ctx, obj.bigImage, sx, sy, per_width, per_height, + obj.centerX - actual_width / 2, obj.centerY - actual_height / 2, actual_width, actual_height); + } else { + var ctx = obj.ctx || 'ui'; + core.clearMap(ctx, obj.bgx, obj.bgy, obj.bgWidth, obj.bgHeight); + core.fillRect(ctx, obj.bgx, obj.bgy, obj.bgWidth, obj.bgHeight, core.material.groundPattern); + core.drawImage(ctx, obj.image, core.status.globalAnimateStatus % obj.animate * 32, obj.pos, + 32, obj.height, obj.x, obj.y, obj.dw || 32, obj.dh || obj.height); + } }); if (main.mode != 'play') core.status.boxAnimateObjs = []; } diff --git a/libs/ui.js b/libs/ui.js index 55cec94b..f8fd231f 100644 --- a/libs/ui.js +++ b/libs/ui.js @@ -54,6 +54,7 @@ ui.prototype.clearMap = function (name, x, y, width, height) { } core.dom.gif.innerHTML = ""; core.removeGlobalAnimate(); + core.deleteCanvas(function (one) { return one.startsWith('_bigImage_'); }); core.setWeather(null); } else { @@ -681,12 +682,13 @@ ui.prototype.closePanel = function () { ui.prototype.clearUI = function () { core.status.boxAnimateObjs = []; - if (core.dymCanvas._selector) core.deleteCanvas("_selector"); + core.deleteCanvas("_selector"); main.dom.next.style.display = 'none'; main.dom.next.style.opacity = 1; core.clearMap('ui'); core.setAlpha('ui', 1); core.setOpacity('ui', 1); + core.deleteCanvas('ui2'); } ////// 左上角绘制一段提示 ////// @@ -704,7 +706,7 @@ ui.prototype.drawTip = function (text, id, frame) { }; if (id != null) { var info = core.getBlockInfo(id); - if (info == null || !info.image) { + if (info == null || !info.image || info.bigImage) { // 检查状态栏图标 if (core.statusBar.icons[id] instanceof Image) { info = {image: core.statusBar.icons[id], posX: 0, posY: 0, height: 32}; @@ -767,6 +769,7 @@ ui.prototype._drawText_setContent = function (contents, callback) { ////// 正则处理 \t[xx,yy] 问题 ui.prototype._getTitleAndIcon = function (content) { var title = null, image = null, icon = null, height = 32, animate = 1; + var bigImage = null, face = null; content = content.replace(/(\t|\\t)\[(([^\],]+),)?([^\],]+)\]/g, function (s0, s1, s2, s3, s4) { if (s4) { if (s4 == 'hero') { @@ -784,9 +787,11 @@ ui.prototype._getTitleAndIcon = function (content) { var blockInfo = core.getBlockInfo(s4); if (blockInfo != null) { if (blockInfo.name) title = blockInfo.name; + bigImage = blockInfo.bigImage; + face = blockInfo.face; image = blockInfo.image; icon = blockInfo.posY; - height = blockInfo.height; + height = bigImage == null ? blockInfo.height : 32; animate = blockInfo.animate; } else title = s4; @@ -804,7 +809,9 @@ ui.prototype._getTitleAndIcon = function (content) { image: image, icon: icon, height: height, - animate: animate + animate: animate, + bigImage: bigImage, + face: face, }; } @@ -882,11 +889,7 @@ ui.prototype._uievent_drawSelector = function (data) { ////// 清除自绘的选择光标 ui.prototype.clearUIEventSelector = function (codes) { if (codes == null) { - Object.keys(core.dymCanvas).forEach(function (name) { - if (name.startsWith('_uievent_selector_')) { - core.deleteCanvas(name); - } - }); + core.deleteCanvas(function (one) { return one.startsWith('_uievent_selector_'); }) return; } if (codes instanceof Array) { @@ -1615,11 +1618,18 @@ ui.prototype._drawTextBox_drawTitleAndIcon = function (titleInfo, hPos, vPos, al } } else { - core.status.boxAnimateObjs.push({ - 'bgx': hPos.left + 15, 'bgy': image_top, 'bgWidth': 32, 'bgHeight': titleInfo.height, - 'x': hPos.left + 15, 'y': image_top, 'height': titleInfo.height, 'animate': titleInfo.animate, - 'image': titleInfo.image, 'pos': titleInfo.icon * titleInfo.height, ctx: ctx, - }); + if (titleInfo.bigImage) { + core.status.boxAnimateObjs.push({ + bigImage: titleInfo.bigImage, face: titleInfo.face, centerX: hPos.left + 15 + 16, + centerY: image_top + titleInfo.height / 2, max_width: 50, ctx: ctx + }); + } else { + core.status.boxAnimateObjs.push({ + 'bgx': hPos.left + 15, 'bgy': image_top, 'bgWidth': 32, 'bgHeight': titleInfo.height, + 'x': hPos.left + 15, 'y': image_top, 'height': titleInfo.height, 'animate': titleInfo.animate, + 'image': titleInfo.image, 'pos': titleInfo.icon * titleInfo.height, ctx: ctx, + }); + } } core.drawBoxAnimate(); } @@ -1761,11 +1771,18 @@ ui.prototype._drawChoices_drawTitle = function (titleInfo, hPos, vPos, ctx) { title_offset += 12; core.strokeRect(ctx, hPos.left + 15 - 1, vPos.top + 30 - 1, 34, titleInfo.height + 2, '#DDDDDD', 2); core.status.boxAnimateObjs = []; - core.status.boxAnimateObjs.push({ - 'bgx': hPos.left + 15, 'bgy': vPos.top + 30, 'bgWidth': 32, 'bgHeight': titleInfo.height, - 'x': hPos.left + 15, 'y': vPos.top + 30, 'height': titleInfo.height, 'animate': titleInfo.animate, - 'image': titleInfo.image, 'pos': titleInfo.icon * titleInfo.height, ctx: ctx - }); + if (titleInfo.bigImage) { + core.status.boxAnimateObjs.push({ + bigImage: titleInfo.bigImage, face: titleInfo.face, centerX: hPos.left + 15 + 16, + centerY: vPos.top + 30 + titleInfo.height / 2, max_width: 50, ctx: ctx + }); + } else { + core.status.boxAnimateObjs.push({ + 'bgx': hPos.left + 15, 'bgy': vPos.top + 30, 'bgWidth': 32, 'bgHeight': titleInfo.height, + 'x': hPos.left + 15, 'y': vPos.top + 30, 'height': titleInfo.height, 'animate': titleInfo.animate, + 'image': titleInfo.image, 'pos': titleInfo.icon * titleInfo.height, ctx: ctx + }); + } core.drawBoxAnimate(); }; @@ -2154,7 +2171,15 @@ ui.prototype._drawBook_drawBox = function (index, enemy, top, pageinfo) { var img_top = border_top + 5, img_left = border_left + 5; core.strokeRect('ui', 22, border_top, 42, 42, '#DDDDDD', 2); var blockInfo = core.getBlockInfo(enemy.id); - if (blockInfo.height >= 42) { + + // 检查大怪物 + if (blockInfo.bigImage) { + core.status.boxAnimateObjs.push({ + bigImage: blockInfo.bigImage, face: blockInfo.face, centerX: border_left + 21, centerY: border_top + 21, + max_width: 60 + }); + } + else if (blockInfo.height >= 42) { var originEnemy = core.material.enemys[enemy.id] || {}; // 检查上半部分是不是纯透明的；取用原始值避免重复计算 if (originEnemy.is32x32 == null) { @@ -3415,6 +3440,13 @@ ui.prototype.resizeCanvas = function (name, width, height, styleOnly) { } ////// canvas删除 ////// ui.prototype.deleteCanvas = function (name) { + if (name instanceof Function) { + Object.keys(core.dymCanvas).forEach(function (one) { + if (name(one)) core.deleteCanvas(one); + }); + return; + } + if (!core.dymCanvas[name]) return null; core.dom.gameDraw.removeChild(core.dymCanvas[name].canvas); delete core.dymCanvas[name]; @@ -3422,8 +3454,5 @@ ui.prototype.deleteCanvas = function (name) { ////// 删除所有动态canvas ////// ui.prototype.deleteAllCanvas = function () { - Object.keys(core.dymCanvas).forEach(function (name) { - core.dom.gameDraw.removeChild(core.dymCanvas[name].canvas); - delete core.dymCanvas[name]; - }); + return this.deleteCanvas(function () { return true; }) } diff --git a/runtime.d.ts b/runtime.d.ts index 0f36634a..9dfe2630 100644 --- a/runtime.d.ts +++ b/runtime.d.ts @@ -2149,8 +2149,7 @@ declare class ui { rotateCanvas(name: string, angle: number, centerX?: number, centerY?: number): void /** 删除一个自定义画布 */ - deleteCanvas(name: string): void - + deleteCanvas(name: string | ((name: string) => bool)): void /** 清空所有的自定义画布 */ deleteAllCanvas(): void