From 88572376da2a62f65ad366e04e39a44b06a8a2fd Mon Sep 17 00:00:00 2001 From: strawberry42271 <2806566736@qq.com> Date: Sun, 1 Dec 2024 14:52:03 +0800 Subject: [PATCH] =?UTF-8?q?CG=E5=9B=9E=E5=BB=8A=E5=85=A5=E5=8F=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 1 + main.js | 1 + project/data.js | 1 + project/plugins.js | 183 +++++++++++++++++++++++++++++++++++++++++++++ 4 files changed, 186 insertions(+) diff --git a/index.html b/index.html index 40d87b6..2ffec0e 100644 --- a/index.html +++ b/index.html @@ -64,6 +64,7 @@
START GAME LOAD GAME + CG MODE REPLAY MODE
diff --git a/main.js b/main.js index 167aaf1..d331ff9 100644 --- a/main.js +++ b/main.js @@ -48,6 +48,7 @@ function main() { startButtons: document.getElementById('startButtons'), playGame: document.getElementById('playGame'), loadGame: document.getElementById('loadGame'), + CGMode: document.getElementById('CGMode'), replayGame: document.getElementById('replayGame'), levelChooseButtons: document.getElementById('levelChooseButtons'), data: document.getElementById('data'), diff --git a/project/data.js b/project/data.js index d893796..2fe4abc 100644 --- a/project/data.js +++ b/project/data.js @@ -41,6 +41,7 @@ var data_a1e2fb4a_e986_4524_b0da_9b7ba7c0874d = "now.png", "null.png", "r.png", + "shengnvxizao.png", "status.png", "statusBackground.jpg", "statusBackground.png", diff --git a/project/plugins.js b/project/plugins.js index 51b8348..fd79c15 100644 --- a/project/plugins.js +++ b/project/plugins.js @@ -1939,6 +1939,7 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = core.dom.playGame.style.fontSize = font + "px" core.dom.loadGame.style.fontSize = font + "px" + core.dom.CGMode.style.fontSize = font + "px" core.dom.replayGame.style.fontSize = font + "px" core.dom.startButtonGroup.style.padding = font * 0.3 + "px 25px" } @@ -1947,6 +1948,8 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = main.dom.outerBackground.style.height = obj.totalHeight + 'px'; main.dom.outerUI.style.width = obj.totalWidth + 'px'; main.dom.outerUI.style.height = obj.totalHeight + 'px'; + main.dom.CGUI.style.width = obj.totalWidth + 'px'; + main.dom.CGUI.style.height = obj.totalHeight + 'px'; const innerSize = (obj.canvasWidth * core.domStyle.scale) + "px"; for (let i = 0; i < core.dom.gameCanvas.length; ++i) @@ -1972,6 +1975,7 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = canvas.style.left = parseFloat(canvas.getAttribute("_left")) * core.domStyle.scale + "px"; canvas.style.top = parseFloat(canvas.getAttribute("_top")) * core.domStyle.scale + "px"; } + // resize next main.dom.next.style.width = main.dom.next.style.height = 5 * core.domStyle.scale + "px"; main.dom.next.style.borderBottomWidth = main.dom.next.style.borderRightWidth = 4 * core.domStyle.scale + "px"; @@ -2060,6 +2064,8 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 = if (core.status.automaticRoute == null) core.status.automaticRoute = {}; core.updateStatusBar(); + core.ui.CG.update() + } class StatusBar { @@ -8628,5 +8634,182 @@ core.plugin.animate = { } core.registerAction('onmousewheel', '_sys_onmousewheel', actions.prototype._sys_onmousewheel, 0); +}, + "CG回廊": function () { + // 在此增加新插件 + const CGUI = document.createElement('canvas'); //CGui画布设置 + CGUI.style.position = 'absolute'; + CGUI.style.zIndex = 0; + CGUI.id = 'CGUI'; + main.dom.gameGroup.insertAdjacentElement('afterend', CGUI) + CGUI.style.top = "50%" + CGUI.style.left = "50%" + CGUI.style.transform = "translate(-50%,-50%)" + const ctx = CGUI.getContext("2d"); + main.dom.CGUI = CGUI; + CGUI.onclick = function (e) { + try { + e.preventDefault(); + if (core.isPlaying()) return false; + const left = core.dom.gameGroup.offsetLeft; + const top = core.dom.gameGroup.offsetTop; + const px = Math.floor((e.clientX - left) / core.domStyle.scale), + py = Math.floor((e.clientY - top) / core.domStyle.scale); + core.ui.CG.onclick(px * 3, py * 3); + } catch (ee) { + main.log(ee); + } + } + + function drawImage(name, image, x, y, w, h, x1, y1, w1, h1, angle, reverse) { + // 检测文件名以 :x, :y, :o 结尾,表示左右翻转,上下翻转和中心翻转 + + image = core.material.images.images[image]; + + + var scale = { + 'x': [-1, 1], + 'y': [1, -1], + 'o': [-1, -1] + }; + + // 只能接受2, 4, 8个参数 + if (x != null && y != null) { + if (w == null || h == null) { + // 两个参数变成四个参数 + w = image.width; + h = image.height; + } + if (x1 != null && y1 != null && w1 != null && h1 != null) { + if (!reverse && !angle) { + name.drawImage(image, x, y, w, h, x1, y1, w1, h1); + } else { + name.save(); + name.translate(x1 + w1 / 2, y1 + h1 / 2); + if (reverse) name.scale(scale[reverse][0], scale[reverse][1]); + if (angle) name.rotate(angle); + name.drawImage(image, x, y, w, h, -w1 / 2, -h1 / 2, w1, h1); + name.restore(); + } + return; + } + if (!reverse && !angle) { + name.drawImage(image, x, y, w, h); + } else { + name.save(); + name.translate(x + w / 2, y + h / 2); + if (reverse) name.scale(scale[reverse][0], scale[reverse][1]); + if (angle) name.rotate(angle); + name.drawImage(image, -w / 2, -h / 2, w, h); + name.restore(); + } + return; + } + } + + function drawWindow(background, ctx, x, y, w, h, direction, px, py) { + // 仿RM窗口皮肤 ↓ + + drawImage(ctx, background, 0, 0, 128, 128, x + 2, y + 2, w - 4, h - 4); + // 绘制边框 + // 上方 + drawImage(ctx, background, 128, 0, 16, 16, x, y, 16, 16); + for (var dx = 0; dx < w - 64; dx += 32) { + drawImage(ctx, background, 144, 0, 32, 16, x + dx + 16, y, 32, 16); + drawImage(ctx, background, 144, 48, 32, 16, x + dx + 16, y + h - 16, 32, 16); + } + drawImage(ctx, background, 144, 0, w - dx - 32, 16, x + dx + 16, y, w - dx - 32, 16); + drawImage(ctx, background, 144, 48, w - dx - 32, 16, x + dx + 16, y + h - 16, w - dx - 32, 16); + drawImage(ctx, background, 176, 0, 16, 16, x + w - 16, y, 16, 16); + // 左右 + for (var dy = 0; dy < h - 64; dy += 32) { + drawImage(ctx, background, 128, 16, 16, 32, x, y + dy + 16, 16, 32); + drawImage(ctx, background, 176, 16, 16, 32, x + w - 16, y + dy + 16, 16, 32); + } + drawImage(ctx, background, 128, 16, 16, h - dy - 32, x, y + dy + 16, 16, h - dy - 32); + drawImage(ctx, background, 176, 16, 16, h - dy - 32, x + w - 16, y + dy + 16, 16, h - dy - 32); + // 下方 + drawImage(ctx, background, 128, 48, 16, 16, x, y + h - 16, 16, 16); + drawImage(ctx, background, 176, 48, 16, 16, x + w - 16, y + h - 16, 16, 16); + + // arrow + if (px != null && py != null) { + if (direction == 'up') { + drawImage(ctx, background, 128, 96, 32, 32, px, y + h - 3, 32, 32); + } else if (direction == 'down') { + drawImage(ctx, background, 160, 96, 32, 32, px, y - 29, 32, 32); + } + } + // 仿RM窗口皮肤 ↑ + } + class CG { + constructor() { + //cg列表 + this.UIMx = [ //空位用‘none’填充,当前ui至多4列6行 + ["none", "none", 'none'], + ["none", "none", "none"], + ["none", "none", "none"], + ]; + } + + //更新 + update() { + this.background() + this.drawUI() + } + background() { + if (core.domStyle.isVertical) { + ctx.canvas.width = 1248; + ctx.canvas.height = 2028; + + core.setTextAlign(ctx, 'center'); + } else { + ctx.canvas.width = 2028; + ctx.canvas.height = 1248; + + core.setTextAlign(ctx, 'center'); + } + + + } + onclick(px, py) { //点击 + console.log([px, py]) + if (px >= 33 && px <= 177 && py >= 33 && py <= 177) { //离开按钮是一致的,其余的记区分横竖屏 + CGUI.style.zIndex = 0 + core.clearMap(ctx) + core.restart(); + } + } + drawUI() { + core.clearMap(CGUI) + if (!core?.material?.images?.images['winskin1.png']) return + if (core.domStyle.isVertical) { //竖屏 + + core.drawWindowSkin('winskin1.png', ctx, 0, 0, 1248, 2028) + core.setTextAlign(ctx, 'center'); + core.fillRoundRect(ctx, 45 - 6, 45 - 6, 120 + 12, 120 + 12, 6, '#444444'); + core.strokeRoundRect(ctx, 45 - 12, 45 - 12, 120 + 24, 120 + 24, 12, "#444444", 3) + core.fillText(ctx, '离开', 100, 110, '#FFFFFF', core.ui._buildFont(33, true)) + } else { //横屏 + ctx.canvas.width = 2028; + ctx.canvas.height = 1248; + core.drawWindowSkin('winskin1.png', ctx, 0, 0, 2028, 1248) + core.setTextAlign(ctx, 'center'); + core.fillRoundRect(ctx, 45 - 6, 45 - 6, 120 + 12, 120 + 12, 6, '#444444'); + core.strokeRoundRect(ctx, 45 - 12, 45 - 12, 120 + 24, 120 + 24, 12, "#444444", 3) + core.fillText(ctx, '离开', 100, 110, '#FFFFFF', core.ui._buildFont(33, true)) + } + + + } + + } + core.ui.CG = new CG(); + main.dom.CGMode.onclick = function () { + main.core.control.checkBgm(); + + CGUI.style.zIndex = 10000 + main.core.ui.CG.update() + } } } \ No newline at end of file