CG回廊入口
This commit is contained in:
parent
87ce50edf4
commit
88572376da
@ -64,6 +64,7 @@
|
||||
<div id='startButtons'>
|
||||
<span class='startButton' id='playGame'>START GAME</span>
|
||||
<span class='startButton' id='loadGame'>LOAD GAME</span>
|
||||
<span class='startButton' id='CGMode'>CG MODE</span>
|
||||
<span class='startButton' id='replayGame'>REPLAY MODE</span>
|
||||
</div>
|
||||
<div id='levelChooseButtons'></div>
|
||||
|
1
main.js
1
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'),
|
||||
|
@ -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",
|
||||
|
@ -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()
|
||||
}
|
||||
}
|
||||
}
|
Loading…
Reference in New Issue
Block a user