Merge pull request 'CG剧情事件完工' (#7) from cg/剧情功能 into main

Reviewed-on: #7

_server/MotaAction.g4

@@ -809,6 +809,7 @@ action
     :   text_0_s
     |   text_1_s
     |   text_2_s
+    |   cgtext_s
     |   moveTextBox_s
     |   clearTextBox_s
     |   comment_s
@@ -1059,6 +1060,46 @@ if (block.isCollapsed() || !block.isEnabled() || pos || Int_0 || Bool_0) {
 return code+',\n';
 */;
 
+cgtext_s
+    :    '背景' EvalString? '头像' EvalString?'名字' EvalString?'坐标PX' Number'打字间隔' Int? BGNL? Newline
+     EvalString BGNL? Newline textcgDrawingList* Newline
+    
+
+/* cgtext_s
+tooltip : cgtext：显示一段包含cg的文字（剧情）
+helpUrl : /_docs/#/instruction
+allImages : ['EvalString_0','EvalString_1']
+default : ["bg_5043.png","face_050445.png","菲奥奈",-300,0,"这句话显示在对话框内",[{ "name":"tati_050145a.png" , "px": 100,"filter":false }]]
+var head ='{ "name": "'+EvalString_1+'", "px": '+Number_0+' }'
+var list=',"bodyList": [\n'+textcgDrawingList_0+'\n]'
+var code = '{"type": "cgtext", "bg":"'+EvalString_0+'","head":'+head+' ,"name":"'+EvalString_2+'","time":'+Int_0+',"text": "'+EvalString_3+'"'+list+' },\n';
+return code;
+*/;
+textcgDrawingList
+    : textcgDrawing
+    | textcgDrawingEmpty;
+
+textcgDrawing
+    : '立绘' EvalString '绘制坐标' 'x' Number '变暗'Bool? Newline
+
+/* textcgDrawing
+tooltip : 立绘
+helpUrl : /_docs/#/instruction
+default : ["tati_050145a.png",100,false]
+colour : this.subColor
+allImages : ['EvalString_0']
+
+return '{ "name": "'+EvalString_0+'", "px": '+Number_0+',"filter":'+Bool_0+' }'
+*/;
+
+textcgDrawingEmpty
+    :   Newline
+    
+/* textcgDrawingEmpty
+var code = [];
+return code;
+*/;
+
 textDrawingList
     : textDrawing
     | textDrawingEmpty;

_server/MotaActionParser.js

@@ -304,6 +304,20 @@ ActionParser.prototype.parseAction = function() {
            /* isShadow */false, /*comment*/ null, /*collapsed*/ data._collapsed, /*disabled*/ data._disabled);
       }
       break;
+    case "cgtext": // cg对话框
+    var buildcgDrawing= function (obj) {
+      obj = MotaActionFunctions.processcgDrawing(obj||[]);
+      var res = null;
+      for(var ii=obj.length-1,one;one=obj[ii];ii--) {
+       
+        res=MotaActionBlocks['textcgDrawing'].xmlText([one[0],one[1],one[2], res]);
+      }
+      return res;
+    }
+      this.next = MotaActionBlocks['cgtext_s'].xmlText([
+        data.bg, data.head.name, data.name||"", data.head.px||-300,data.time, data.text,buildcgDrawing(data.bodyList),  this.next]);
+         
+      break;
     case "moveTextBox": // 移动对话框
       data.loc = data.loc || ['',''];
       this.next = MotaActionBlocks['moveTextBox_s'].xmlText([
@@ -1520,6 +1534,13 @@ MotaActionFunctions.processMoveDirections = function (steps) {
   return result;
 }
 
+MotaActionFunctions.processcgDrawing = function (bodyList) {
+  var list=[]
+  bodyList.forEach(function (one) {
+    list.push([one.name,one.px,one.filter])})
+  return list;
+}
+
 MotaActionFunctions.processMultiLoc = function (EvalString_0, EvalString_1) {
   var floorstr = '';
   if (EvalString_0 && EvalString_1) {

project/data.js

@@ -94,6 +94,8 @@ var data_a1e2fb4a_e986_4524_b0da_9b7ba7c0874d =
 			"eve_050704.png",
 			"eve_050801.png",
 			"eve_070101.png",
+			"face_050445.png",
+			"face_120107.png",
 			"green.png",
 			"h25.png",
 			"hero.png",
@@ -115,6 +117,8 @@ var data_a1e2fb4a_e986_4524_b0da_9b7ba7c0874d =
 			"t015d97564abe3b6a74.jpg",
 			"t0187fe5a5fa586419d.jpg",
 			"t01c16e1361b78b9412.jpg",
+			"tati_050145a.png",
+			"tati_120124.png",
 			"u.png",
 			"ud.png",
 			"udl.png",

project/functions.js

@@ -1045,9 +1045,8 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
 		'guid': core.getGuid(),
 		"time": new Date().getTime()
 	};
-
 	return data;
-		},
+},
         "loadData": function (data, callback) {
 	// 读档操作；从存储中读取了内容后的行为
 
@@ -1087,6 +1086,7 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
 		core.removeFlag('__fromLoad__');
 		if (callback) callback();
 	});
+	core.doAction()
 },
         "getStatusLabel": function (name) {
 			// 返回某个状态英文名的对应中文标签，如atk -> 攻击，def -> 防御等。

project/plugins.js

@@ -5,31 +5,58 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 =
 		// 本函数将在所有资源加载完毕后，游戏开启前被执行
 		core.ui.statusBar.init();
 		core.registerEvent("changeMouse", function (data) {
-			core.changeMouse(data.icon, data.div, data.translate[0], data.translate[1], data.scale[0], data.scale[1], data.angel, data.px, data.py)
+			if (!main.replayChecking && !core.isReplaying()) core.changeMouse(data.icon, data.div, data.translate[0], data.translate[1], data.scale[0], data.scale[1], data.angel, data.px, data.py)
 			core.doAction()
 		})
 		core.registerEvent("removeMouse", function (data) {
-			core.removeMouse(data.div)
+			if (!main.replayChecking && !core.isReplaying()) core.removeMouse(data.div)
 			core.doAction()
 		})
 		core.registerEvent("addPop", function (data) {
+			if (!main.replayChecking && !core.isReplaying()) {
+				data.value = core.replaceText(data.value)
 				core.addPop(data.value, data.px, data.py, data.color, data.boldColor, data.left, data.jump, data.time, data.show, data.font, data.speed)
+			}
 			core.doAction()
 		})
 		core.registerEvent("drawWarning", function (data) {
+			if (!main.replayChecking && !core.isReplaying()) {
+				data.text = core.replaceText(data.text)
+				data.text2 = core.replaceText(data.text2)
 				core.drawWarning(data.x, data.y, data?.text, data?.text2, data?.warning)
 				setTimeout(() => core.doAction(), 3100)
+			} else {
+				core.doAction();
+			}
 		})
 		core.registerEvent("playStereo", function (data) {
-			core.playStereo(data.name, data.left, data.right, data.split)
+			if (!main.replayChecking && !core.isReplaying()) core.playStereo(data.name, data.left, data.right, data.split)
 			core.doAction()
 		})
 		core.registerEvent("moveStereo", function (data) {
+			if (!main.replayChecking && !core.isReplaying()) {
 				const id = core.playStereo(data.name, data.left, data.right, data.split)
 				core.moveStereo(id, data.leftTo, data.rightTo, data.time)
+			}
 			core.doAction()
 		})
+		core.registerEvent("cgtext", function (data) {
+			if (!main.replayChecking && !core.isReplaying()) {
+				core.ui.cgText.image = data.bg;
+				core.ui.cgText.head = core.clone(data.head);
+				core.ui.cgText.name = data.name;
+				core.ui.cgText.text = data.text;
+				core.ui.cgText.time = data.time;
+				core.ui.cgText.bodyList = core.clone(data.bodyList);
+				main.dom.cgText.style.display = 'block';
+				core.ui.cgText.update()
+
+			} else {
+				core.doAction()
 			}
+		})
+	}
+
 },
     "drawLight": function () {
 
@@ -1975,6 +2002,8 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 =
 		main.dom.outerUI.style.height = obj.totalHeight + 'px';
 		main.dom.CGUI.style.width = obj.totalWidth + 'px';
 		main.dom.CGUI.style.height = obj.totalHeight + 'px';
+		main.dom.cgText.style.width = obj.totalWidth + 'px';
+		main.dom.cgText.style.height = obj.totalHeight + 'px';
 
 		const innerSize = (obj.canvasWidth * core.domStyle.scale) + "px";
 		for (let i = 0; i < core.dom.gameCanvas.length; ++i)
@@ -2089,7 +2118,8 @@ var plugins_bb40132b_638b_4a9f_b028_d3fe47acc8d1 =
 
 		if (core.status.automaticRoute == null) core.status.automaticRoute = {};
 		core.updateStatusBar();
-		core.ui.CG.update()
+		core.ui.CG.update();
+		core.ui.cgText.update();
 
 	}
 
@@ -7127,6 +7157,17 @@ core.plugin.animate = {
 						MotaActionBlocks['text_0_s'].xmlText(),
 						MotaActionBlocks['text_1_s'].xmlText(),
 						MotaActionFunctions.actionParser.parseList("\t[小妖精,fairy]\f[fairy.png,0,0]欢迎使用事件编辑器(双击方块可直接预览)"),
+						MotaActionFunctions.actionParser.parseList([{
+							"type": "cgtext",
+							"bg": "bg_5043.png",
+							"head": { "name": "face_050445.png", "px": -300 },
+							"name": "菲奥奈",
+							"time": 0,
+							"text": "这句话显示在对话框内",
+							"bodyList": [
+								{ "name": "tati_050145a.png", "px": 100, "filter": false }
+							]
+						}]),
 						MotaActionBlocks['moveTextBox_s'].xmlText(),
 						MotaActionBlocks['clearTextBox_s'].xmlText(),
 						MotaActionBlocks['comment_s'].xmlText(),
@@ -8835,6 +8876,7 @@ core.plugin.animate = {
 
 		//更新
 		update() {
+
 			this.background()
 			this.drawUI()
 		}
@@ -8977,13 +9019,13 @@ core.plugin.animate = {
 				const imagebox3 = makeBox([300, 750], [480, 320])
 				const imagebox4 = makeBox([800, 750], [480, 320])
 				const imagebox5 = makeBox([1300, 750], [480, 320])
-				if (inRect(pos, pageupbox)) {
+				if (inRect(pos, pagedownbox)) {
 					if (page < this.UIMx.length - 1) {
 						page++;
 						core.clearMap(ctx);
 						this.update();
 					}
-				} else if (inRect(pos, pagedownbox)) {
+				} else if (inRect(pos, pageupbox)) {
 					if (page > 0) {
 						page--;
 						core.clearMap(ctx);
@@ -9141,6 +9183,7 @@ core.plugin.animate = {
     "光标设置": function () {
 	// 在此增加新插件
 	this.changeMouse = function (icon, div = 'gameGroup', translateX = 0, translateY = 0, scaleX = 1, scaleY = 1, degree = 0, px = 0, py = 0) {
+
 		const canvas = document.createElement('canvas');
 		canvas.width = 64
 		canvas.height = 64
@@ -9157,6 +9200,7 @@ core.plugin.animate = {
 		core.dom[div].style.cursor = `url(${data}) ${px} ${py},url(${data}),auto` //div为你要改变光标的元素，默认为包含状态栏的整个游戏画面,px/py为点击点偏移像素
 	}
 	this.removeMouse = function (div = 'gameGroup') {
+
 		core.dom[div].style.cursor = 'auto'
 	}
 },
@@ -9211,6 +9255,7 @@ core.plugin.animate = {
 
 	/** 添加弹出内容 */
 	this.addPop = function (value, px, py, color, boldColor, left, jump, time, show, font, speed) {
+
 		var data = { px: px, py: py, value: value, color: color || colorD, boldColor: boldColor || boldColorD, frame: 0, left: left || false, jump: jump || false, time: time || 60, show: show || 30, font: font || fontD, speed: speed || 1 };
 		if (!core.status.pop) core.status.pop = [data];
 		else core.status.pop.push(data);
@@ -9230,6 +9275,7 @@ core.plugin.animate = {
 	 * @param {string} text 显示的文字
 	 */
 	this.drawWarning = function (x, y, text, text2, warning) {
+
 		if (timeout) return;
 		x = x ?? 6;
 		y = y ?? 6;
@@ -9421,7 +9467,7 @@ core.plugin.animate = {
 	}
 	events.prototype._changeFloor_beforeChange = function (info, block, callback) {
 		this._changeFloor_playSound();
-		if (block && block?.event) {
+		if (block && block?.event && !main.replayChecking && !core.isReplaying()) {
 			const dirEntries = allChangeEntries.find(v => v[1] === block.event.id);
 			if (block?.event?.trigger === 'changeFloor' && dirEntries) {
 				const toFloorId = block.event.data.floorId;
@@ -9498,5 +9544,258 @@ core.plugin.animate = {
 	}
 
 
+},
+    "剧情cg": function () {
+	// 在此增加新插件
+	const cg = document.createElement('canvas'); //cg画布设置
+	cg.style.position = 'absolute';
+	cg.style.zIndex = 300;
+	cg.style.display = "none"
+	cg.id = 'cgText';
+	main.dom.gameGroup.insertAdjacentElement('afterend', cg)
+	cg.style.top = "50%"
+	cg.style.left = "50%"
+	cg.style.transform = "translate(-50%,-50%)"
+	const ctx = cg.getContext("2d");
+	main.dom.cgText = cg;
+
+
+	cg.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.cgText.click(px * 3, py * 3);
+		} catch (ee) {
+			main.log(ee);
+		}
+	}
+	class cgText {
+		constructor() {
+			this.image = ""
+			this.head = { name: 'face_050445.png', px: -300 }
+			this.bodyList = [{ name: 'tati_050145a.png', px: 100, filter: false }, { name: 'tati_120124.png', px: 1100, filter: true }]
+			this.name = ""
+			this.text = ''
+			this.time = 0;
+		}
+		click(px, py) {
+
+			const makeBox = ([x, y], [w, h]) => {
+				return [
+					[x, y],
+					[x + w, y + h]
+				];
+			}
+			const inRect = ([x, y], [
+				[sx, sy],
+				[dx, dy]
+			]) => {
+				return sx <= x && x <= dx && sy <= y && y <= dy;
+			};
+			const pos = [px, py];
+			const savebox = makeBox([1700, 1100], [192, 96]);
+			const saveboxVertical = makeBox([52, 1700], [96, 192])
+			if ((core.domStyle.isVertical && inRect(pos, saveboxVertical)) || (!core.domStyle.isVertical && inRect(pos, savebox))) {
+				if (core.status.event.animateUI) return;
+				if (core.status.event.interval != null) return;
+				const current = core.clone(core.status.event.data.current)
+				current.showAll = true;
+				current.time = 0
+				current.text = current.text.replace(/(\\(z))(\[.*?])?/g, "");
+				cg.style.display = "none"
+				const data = [{ 'type': 'callSave' }, current]
+				core.insertAction(data)
+				core.doAction();
+
+			} else {
+				// 正在淡入淡出的话不执行
+				if (core.status.event.animateUI) return;
+
+				var data = core.clone(core.status.event.data.current);
+				// 打字机效果显示全部文字
+				if (core.status.event.interval != null) {
+					data.showAll = true;
+					data.time = 0
+					data.text = data.text.replace(/(\\(z))(\[.*?])?/g, "");
+
+					core.insertAction(data);
+					core.doAction();
+					return;
+				}
+
+				cg.style.display = "none"
+				core.ui._animateUI('hide', null, core.doAction);
+
+			}
+
+		}
+		drawTextContent(ctx, content, config) {
+
+			ctx = core.getContextByName(ctx);
+			// 设置默认配置项
+			var textAttribute = core.status.textAttribute || core.initStatus.textAttribute;
+			var globalAttribute = core.status.globalAttribute || core.initStatus.globalAttribute;
+			config = core.clone(config || {});
+			config.left = config.left || 0;
+			config.right = config.left + (config.maxWidth == null ? core._PX_ : config.maxWidth);
+			config.top = config.top || 0;
+			config.color = core.arrayToRGBA(config.color || textAttribute.text);
+			if (config.bold == null) config.bold = textAttribute.bold;
+			config.italic = config.italic || false;
+			config.align = config.align || textAttribute.align || "left";
+			config.fontSize = config.fontSize || textAttribute.textfont;
+			config.lineHeight = config.lineHeight || (config.fontSize * 1.3);
+			config.defaultFont = config.font = config.font || globalAttribute.font;
+			config.time = config.time || 0;
+			config.letterSpacing = config.letterSpacing == null ? (textAttribute.letterSpacing || 0) : config.letterSpacing;
+
+			config.index = 0;
+			config.currcolor = config.color;
+			config.currfont = config.fontSize;
+			config.lineMargin = Math.max(Math.round(config.fontSize / 4), config.lineHeight - config.fontSize);
+			config.topMargin = parseInt(config.lineMargin / 2);
+			config.lineMaxHeight = config.lineMargin + config.fontSize;
+			config.offsetX = 0;
+			config.offsetY = 0;
+			config.line = 0;
+			config.blocks = [];
+			config.isHD = ctx == null || ctx.canvas.hasAttribute('isHD');
+
+			// 创建一个新的临时画布
+			var tempCtx = document.createElement('canvas').getContext('2d');
+			if (config.isHD && ctx) {
+				core.maps._setHDCanvasSize(
+					tempCtx,
+					ctx.canvas.width,
+					ctx.canvas.height
+				);
+			} else {
+				tempCtx.canvas.width = ctx == null ? 1 : ctx.canvas.width;
+				tempCtx.canvas.height = ctx == null ? 1 : ctx.canvas.height;
+			}
+
+			tempCtx.textBaseline = 'top';
+			tempCtx.font = core.ui._buildFont(config.fontSize, config.bold, config.italic, config.font);
+			tempCtx.fillStyle = config.color;
+			config = this._drawTextContent_draw(ctx, tempCtx, content, config);
+			return config;
+
+		}
+		_drawTextContent_draw(ctx, tempCtx, content, config) {
+			// Step 1: 绘制到tempCtx上，并记录下图块信息
+			while (core.ui._drawTextContent_next(tempCtx, content, config));
+
+			if (ctx == null) return config;
+
+			// Step 2: 从tempCtx绘制到画布上
+			config.index = 0;
+			var _drawNext = function () {
+				if (config.index >= config.blocks.length) return false;
+				var block = config.blocks[config.index++];
+				if (block != null) {
+					// It works, why?
+					const scale = config.isHD ? devicePixelRatio * core.domStyle.scale : 1;
+					ctx.restore();
+					ctx.save(); //保存设置
+					if (core.domStyle.isVertical) {
+						ctx.translate(1248, 0) //重新定位右上角为基准
+						ctx.rotate(Math.PI / 2) //旋转90度
+					}
+					ctx.drawImage(
+						tempCtx.canvas,
+						block.left * scale,
+						block.top * scale,
+						block.width * scale,
+						block.height * scale,
+						config.left + block.left + block.marginLeft,
+						config.top + block.top + block.marginTop,
+						block.width,
+						block.height
+					);
+					ctx.restore();
+				}
+				return true;
+			}
+
+			if (config.time == 0) {
+				while (_drawNext());
+			} else {
+				clearInterval(core.status.event.interval);
+				core.status.event.interval = setInterval(function () {
+					if (!_drawNext()) {
+						clearInterval(core.status.event.interval);
+						core.status.event.interval = null;
+					}
+				}, config.time);
+			}
+
+			return config;
+		}
+
+		update() {
+			this.background();
+		}
+		background() {
+			const img = core.material.images.images?.[this.image]
+			if (core.domStyle.isVertical) {
+				ctx.canvas.width = 1248;
+				ctx.canvas.height = 2028;
+				ctx.save(); //保存设置
+				ctx.translate(1248, 0) //重新定位右上角为基准
+				ctx.rotate(Math.PI / 2) //旋转90度
+			} else {
+				ctx.canvas.width = 2028;
+				ctx.canvas.height = 1248;
+			}
+
+			if (img) {
+				ctx.drawImage(img, 0, 0, 2028, 1248)
+
+			} else {
+				core.fillRect(ctx, 0, 0, 2028, 1248)
+			}
+			this.bodyList.forEach(v => {
+				const body = core.material.images.images?.[v.name]
+				if (v.filter) ctx.filter = 'brightness(50%)'
+				if (body) {
+					ctx.drawImage(body, 0, 0, body.width, body.height, v.px, 1248 - body.height * 1.5, body.width * 1.5, body.height * 1.5)
+				}
+				ctx.filter = 'none'
+			})
+			if (core.isPlaying()) core.drawWindowSkin("winskin.png", ctx, 30, 802, 1968, 416)
+			const head = core.material.images.images?.[this.head.name]
+			if (head) {
+				ctx.drawImage(head, 0, 0, head.width, head.height, this.head.px, 1248 - head.height * 2, head.width * 2, head.height * 2)
+			}
+			if (core.isPlaying()) core.drawWindowSkin("winskin.png", ctx, 1700, 1100, 192, 96)
+			core.fillText(ctx, '存 档', 1736, 1166, '#FFFFFF', "bold 48px Verdana")
+			if (this.name) core.fillText(ctx, `【${this.name}】`, 500, 880, '#FFFFFF', "bold 48px Verdana")
+			if (this.text) {
+				this.drawTextContent(ctx, this.text, {
+					left: 500,
+					top: 950,
+					bold: true,
+					color: '#FFFFFF',
+					align: "left",
+					fontSize: 48,
+					time: this.time || 0,
+					font: 'Verdana',
+					maxWidth: 1000
+				});
+			}
+
+			ctx.restore();
+
+
+
+		}
+
+	}
+	core.ui.cgText = new cgText()
+
 }
 }