color in choices

_server/blockly/MotaAction.g4

@@ -1528,15 +1528,22 @@ return code;
 */;
 
 choicesContext
-    :   '子选项' EvalString BGNL? Newline action+
+    :   '子选项' EvalString '颜色' EvalString? Colour BGNL? Newline action+
 
 
 /* choicesContext
 tooltip : 选项的选择
 helpUrl : https://h5mota.com/games/template/docs/#/event?id=choices%EF%BC%9A%E7%BB%99%E7%94%A8%E6%88%B7%E6%8F%90%E4%BE%9B%E9%80%89%E9%A1%B9
-default : ["提示文字:红钥匙"]
+default : ["提示文字:红钥匙",""]
 colour : this.subColor
-var code = '{"text": "'+EvalString_0+'", "action": [\n'+action_0+']},\n';
+if (EvalString_1) {
+  var colorRe = /^(25[0-5]|2[0-4]\d|1\d\d|[1-9]\d|\d),(25[0-5]|2[0-4]\d|1\d\d|[1-9]\d|\d),(25[0-5]|2[0-4]\d|1\d\d|[1-9]\d|\d)(,0(\.\d+)?|,1)?$/;
+  if (colorRe.test(EvalString_1))
+      EvalString_1 = ', "color": ['+EvalString_1+']';
+  else
+      EvalString_1 = ', "color": "'+EvalString_1+'"';
+}
+var code = '{"text": "'+EvalString_0+'"'+EvalString_1+', "action": [\n'+action_0+']},\n';
 return code;
 */;
 
@@ -2095,7 +2102,9 @@ ActionParser.prototype.parseAction = function() {
       if (!/^\w+\.png$/.test(data.background))
         data.background=setTextfunc(data.background);
       this.next = MotaActionBlocks['setText_s'].xmlText([
-        data.position,data.offset,data.title,`rgba(${data.title})`,data.text,`rgba(${data.text})`,data.background,`rgba(${data.background})`,data.bold,data.titlefont,data.textfont,data.time,this.next]);
+        data.position,data.offset,data.title,'rgba('+data.title+')',
+        data.text,'rgba('+data.text+')',data.background,'rgba('+data.background+')',
+        data.bold,data.titlefont,data.textfont,data.time,this.next]);
       break;
     case "tip":
       this.next = MotaActionBlocks['tip_s'].xmlText([
@@ -2267,7 +2276,7 @@ ActionParser.prototype.parseAction = function() {
     case "setFg": // 颜色渐变
       if(this.isset(data.color)){
         this.next = MotaActionBlocks['setFg_0_s'].xmlText([
-          data.color,`rgba(${data.color})`,data.time||0,data.async||false,this.next]);
+          data.color,'rgba('+data.color+')',data.time||0,data.async||false,this.next]);
       } else {
         this.next = MotaActionBlocks['setFg_1_s'].xmlText([
           data.time||0,data.async||false,this.next]);
@@ -2275,7 +2284,7 @@ ActionParser.prototype.parseAction = function() {
       break;
     case "screenFlash": // 画面闪烁
         this.next = MotaActionBlocks['screenFlash_s'].xmlText([
-          data.color,`rgba(${data.color})`,data.time||500,data.times||1,data.async||false,this.next]);
+          data.color,'rgba('+data.color+')',data.time||500,data.times||1,data.async||false,this.next]);
       break;
     case "setWeather": // 更改天气
       this.next = MotaActionBlocks['setWeather_s'].xmlText([
@@ -2402,7 +2411,7 @@ ActionParser.prototype.parseAction = function() {
       var text_choices = null;
       for(var ii=data.choices.length-1,choice;choice=data.choices[ii];ii--) {
         text_choices=MotaActionBlocks['choicesContext'].xmlText([
-          choice.text,this.insertActionList(choice.action),text_choices]);
+          choice.text,choice.color,'rgba('+choice.color+')',this.insertActionList(choice.action),text_choices]);
       }
       this.next = MotaActionBlocks['choices_s'].xmlText([
         this.isset(data.text)?this.EvalString(data.text):null,'','',text_choices,this.next]);

_server/editor_blockly.js

@@ -64,9 +64,9 @@ editor_blockly = function () {
       MotaActionBlocks['lose_s'].xmlText(),
       MotaActionBlocks['choices_s'].xmlText([
         '选择剑或者盾','流浪者','man',MotaActionBlocks['choicesContext'].xmlText([
-          '剑',MotaActionFunctions.actionParser.parseList([{"type": "openDoor", "loc": [3,3]}]),
+          '剑','',null,MotaActionFunctions.actionParser.parseList([{"type": "openDoor", "loc": [3,3]}]),
           MotaActionBlocks['choicesContext'].xmlText([
-            '盾',MotaActionFunctions.actionParser.parseList([{"type": "openDoor", "loc": [9,3]}]),
+            '盾','',null,MotaActionFunctions.actionParser.parseList([{"type": "openDoor", "loc": [9,3]}]),
           ])
         ])
       ]),
@@ -175,7 +175,7 @@ editor_blockly = function () {
       MotaActionFunctions.actionParser.parse([
         {"type": "choices", "text": "\t[老人,man]少年，你需要钥匙吗？\n我这里有大把的！",
         "choices": [
-            {"text": "黄钥匙（\${9+flag:shop_times}金币）", "action": [
+            {"text": "黄钥匙（\${9+flag:shop_times}金币）", "color": [255,255,0,1], "action": [
                 {"type": "if", "condition": "status:money>=9+flag:shop_times",
                     "true": [
                         {"type": "setValue", "name": "status:money", "value": "status:money-(9+flag:shop_times)"},
@@ -187,7 +187,7 @@ editor_blockly = function () {
                     ]
                 }
             ]},
-            {"text": "蓝钥匙（\${18+2*flag:shop_times}金币）", "action": [
+            {"text": "蓝钥匙（\${18+2*flag:shop_times}金币）", "color": [0,0,255,1], "action": [
             ]},
             {"text": "离开", "action": [
                 {"type": "exit"}

libs/ui.js

@@ -503,6 +503,73 @@ ui.prototype.calTextBoxWidth = function (canvas, content, min_width, max_width)
     }
 }
 
+ui.prototype.__drawText = function (canvas, content, content_left, content_top, valid_width,
+                                    color, per_height, time) {
+
+    var offsetx = content_left, offsety = content_top;
+    core.setFillStyle(canvas, color);
+    var index = 0, currcolor = color, changed = false;
+
+    var drawNext = function () {
+        if (index >= content.length) return false;
+        if (changed) {
+            core.setFillStyle(canvas, currcolor);
+            changed = false;
+        }
+
+        // get next character
+        var ch = content.charAt(index++);
+        // \n, \\n
+        if (ch == '\n' || (ch=='\\' && content.charAt(index)=='n')) {
+            offsetx = content_left;
+            offsety += per_height;
+            if (ch=='\\') index++;
+            return drawNext();
+        }
+        // \r, \\r
+        if (ch == '\r' || (ch=='\\' && content.charAt(index)=='r')) {
+            if (ch == '\\') index++;
+            changed = true;
+            // 检查是不是 []
+            var index2;
+            if (content.charAt(index) == '[' && ((index2=content.indexOf(']', index))>=0)) {
+                // 变色
+                var str = content.substring(index+1, index2);
+                if (str=="") currcolor = color;
+                else currcolor = str;
+                index = index2+1;
+            }
+            else currcolor = color;
+            return drawNext();
+        }
+        // 检查是不是自动换行
+        if (core.isset(valid_width)) {
+            var charwidth = core.calWidth(canvas, ch);
+            if (offsetx + charwidth > content_left + valid_width) {
+                index--;
+                offsetx = content_left;
+                offsety += per_height;
+                return drawNext();
+            }
+        }
+        // 输出
+        core.fillText(canvas, ch, offsetx, offsety);
+        offsetx += charwidth;
+        return true;
+    };
+
+    if (!core.isset(time) || time<=0) while (drawNext());
+    else {
+        core.status.event.interval = setInterval(function () {
+            changed = true;
+            if (!drawNext()) {
+                clearInterval(core.status.event.interval);
+                core.status.event.interval = null;
+            }
+        }, time);
+    }
+}
+
 ////// 绘制一个对话框 //////
 ui.prototype.drawTextBox = function(content, showAll) {
 
@@ -729,69 +796,10 @@ ui.prototype.drawTextBox = function(content, showAll) {
         core.drawImage('ui', image, 0, 0, image.width, image.height, left+10, top+10, 70, 70);
     }
 
-    var offsetx = content_left, offsety = content_top;
     core.setFont('ui', font);
-    core.setFillStyle('ui', textColor);
-    var index = 0, currcolor = textColor, changed = false;
 
-    var drawNext = function () {
+    this.__drawText('ui', content, content_left, content_top, validWidth, textColor, textfont + 5,
-        if (index >= content.length) return false;
+        (showAll || textAttribute.time<=0 || core.status.event.id!='action')?0:textAttribute.time);
-        if (changed) {
-            core.setFillStyle('ui', currcolor);
-            changed = false;
-        }
-
-        // get next character
-        var ch = content.charAt(index++);
-        // \n, \\n
-        if (ch == '\n' || (ch=='\\' && content.charAt(index)=='n')) {
-            offsetx = content_left;
-            offsety += textfont+5;
-            if (ch=='\\') index++;
-            return drawNext();
-        }
-        // \r, \\r
-        if (ch == '\r' || (ch=='\\' && content.charAt(index)=='r')) {
-            if (ch == '\\') index++;
-            changed = true;
-            // 检查是不是 []
-            var index2;
-            if (content.charAt(index) == '[' && ((index2=content.indexOf(']', index))>=0)) {
-                // 变色
-                var str = content.substring(index+1, index2);
-                if (str=="") currcolor = textColor;
-                else currcolor = str;
-                index = index2+1;
-            }
-            else currcolor = textColor;
-            return drawNext();
-        }
-        // 检查是不是自动换行
-        var charwidth = core.calWidth('ui', ch);
-        if (offsetx + charwidth > content_left + validWidth) {
-            index--;
-            offsetx = content_left;
-            offsety += textfont+5;
-            return drawNext();
-        }
-        // 输出
-        core.fillText('ui', ch, offsetx, offsety);
-        offsetx += charwidth;
-        return true;
-    };
-
-    if (showAll || textAttribute.time<=0 || core.status.event.id!='action') {
-        while (drawNext());
-    }
-    else {
-        core.status.event.interval = setInterval(function () {
-            changed = true;
-            if (!drawNext()) {
-                clearInterval(core.status.event.interval);
-                core.status.event.interval = null;
-            }
-        }, textAttribute.time);
-    }
 
 }
 
@@ -812,7 +820,8 @@ ui.prototype.drawScrollText = function (content, time, callback) {
 
     var font = textfont+"px "+core.status.globalAttribute.font;
     if (textAttribute.bold) font = "bold "+font;
-    var contents = core.splitLines('ui', content), lines = contents.length;
+    var realContent = content.replace(/(\r|\\r)(\[.*?])?/g, "");
+    var contents = core.splitLines('ui', realContent), lines = contents.length;
 
     // 计算总高度，按1.4倍行距计算
     var width = 416, height = textfont * 1.4 * lines;
@@ -821,15 +830,8 @@ ui.prototype.drawScrollText = function (content, time, callback) {
     tempCanvas.canvas.height = height;
     tempCanvas.clearRect(0, 0, width, height);
     tempCanvas.font = font;
-    tempCanvas.fillStyle = textColor;
 
-    // 全部绘制
+    this.__drawText(tempCanvas, content, 0, textfont, null, textColor, 1.4*textfont, 0);
-    var currH = textfont;
-    for (var i = 0; i < lines; ++i) {
-        var text = contents[i];
-        tempCanvas.fillText(text, offset, currH);
-        currH += 1.4 * textfont;
-    }
 
     // 开始绘制到UI上
     core.clearMap('ui');
@@ -891,17 +893,19 @@ ui.prototype.drawChoices = function(content, choices) {
 
     var contents = null;
     var content_left = left + 15;
+    var validWidth = width-(content_left-left)-10;
 
     if (core.isset(content)) {
-        // 获得name, image, icon
         // 获得name, image, icon
         var info = this.getTitleAndIcon(content);
         content = core.replaceText(info.content);
+        var realContent = content.replace(/(\r|\\r)(\[.*?])?/g, "");
         id=info.id; name=info.name; image=info.image;
         icon=info.icon; iconHeight=info.iconHeight; animate=info.animate;
         if (id=='hero' || core.isset(icon))
             content_left = left+60;
-        contents = core.splitLines('ui', content, width-(content_left-left)-10, 'bold 15px '+globalFont);
+        validWidth = width-(content_left-left)-10
+        contents = core.splitLines('ui', realContent, validWidth, 'bold 15px '+globalFont);
 
         // content部分高度
         var cheight=0;
@@ -964,16 +968,16 @@ ui.prototype.drawChoices = function(content, choices) {
         }
 
         core.setTextAlign('ui', 'left');
-        for (var i=0;i<contents.length;i++) {
+        core.setFont('ui', 'bold 15px '+globalFont);
-            core.fillText('ui', contents[i], content_left, content_top, textColor, 'bold 15px '+globalFont);
+        this.__drawText('ui', content, content_left, content_top, validWidth, textColor, 20, 0);
-            content_top+=20;
-        }
     }
 
     // 选项
     core.setTextAlign('ui', 'center');
     for (var i = 0; i < choices.length; i++) {
-        core.setFillStyle('ui', choices[i].color || textColor);
+        var color = choices[i].color || textColor;
+        if (color instanceof Array) color = core.arrayToRGBA(color);
+        core.setFillStyle('ui', color);
         core.fillText('ui', core.replaceText(choices[i].text || choices[i]), 208, choice_top + 32 * i, null, "bold 17px "+globalFont);
     }