Merge pull request #237 from ckcz123/v2.0

V2.4.3

README.md

@@ -53,6 +53,22 @@ HTML5 canvas制作的魔塔样板，支持全平台游戏！
 
 ## 更新说明
 
+### 2018.10.14 V2.4.3
+
+* [x] 并行事件处理
+* [x] 增加光环属性，还可以制作区域光环效果
+* [x] 将部分代码移动到脚本编辑中
+* [x] 事件改变天气或画面色调，读档后仍有效
+* [x] Autotile自动元件的新增和注册
+* [x] 状态栏可以显示角色名字
+* [x] 双击道具栏图标直接进入装备栏
+* [x] 可以设置剧情文本的字体大小
+* [x] 录像播放可以最高24倍速
+* [x] 1-6键快速设置录像播放速度；滚轮加减速
+* [x] 修复大地图的夹击Bug
+* [x] iOS设备默认关闭新版存档
+* [x] 部分其他细节优化
+
 ### 2018.9.28 V2.4.2
 
 * [x] 允许导入tilesets直接使用，无需PS和注册

_server/editor_file.js

@@ -248,6 +248,32 @@ editor_file = function (editor, callback) {
         else tempcallback(null);
     }
 
+    editor_file.registerAutotile = function (filename, callback) {
+        var idnum = 140;
+        while (editor.core.maps.blocksInfo[idnum]) idnum++;
+
+        var iconActions = [];
+        var mapActions = [];
+
+        iconActions.push(["add", "['autotile']['" + filename + "']", 0]);
+        mapActions.push(["add", "['" + idnum + "']", {'cls': 'autotile', 'id': filename, 'noPass': true}]);
+
+        var templist = [];
+        var tempcallback = function (err) {
+            templist.push(err);
+            if (templist.length == 2) {
+                if (templist[0] != null || templist[1] != null)
+                    callback((templist[0] || '') + '\n' + (templist[1] || ''));
+                //这里如果一个成功一个失败会出严重bug
+                else
+                    callback(null);
+            }
+        }
+
+        saveSetting('icons', iconActions, tempcallback);
+        saveSetting('maps', mapActions, tempcallback);
+    }
+
     editor_file.changeIdAndIdnum = function (id, idnum, info, callback) {
         if (!isset(callback)) {
             printe('未设置callback');

_server/editor_mode.js

@@ -512,12 +512,26 @@ editor_mode = function (editor) {
 
         var selectAppend = document.getElementById('selectAppend');
         var selectAppend_str = [];
-        ["terrains", "animates", "enemys", "enemy48", "items", "npcs", "npc48"].forEach(function (image) {
+        ["terrains", "animates", "enemys", "enemy48", "items", "npcs", "npc48", "autotile"].forEach(function (image) {
             selectAppend_str.push(["<option value='", image, "'>", image, '</option>\n'].join(''));
         });
         selectAppend.innerHTML = selectAppend_str.join('');
         selectAppend.onchange = function () {
+
             var value = selectAppend.value;
+
+            if (value == 'autotile') {
+                editor_mode.appendPic.imageName = 'autotile';
+                for (var jj=0;jj<4;jj++) appendPicSelection.children[jj].style = 'display:none';
+                if (editor_mode.appendPic.img) {
+                    sprite.style.width = (sprite.width = editor_mode.appendPic.img.width) / ratio + 'px';
+                    sprite.style.height = (sprite.height = editor_mode.appendPic.img.height) / ratio + 'px';
+                    sprite.getContext('2d').clearRect(0, 0, sprite.width, sprite.height);
+                    sprite.getContext('2d').drawImage(editor_mode.appendPic.img, 0, 0);
+                }
+                return;
+            }
+
             var ysize = selectAppend.value.indexOf('48') === -1 ? 32 : 48;
             editor_mode.appendPic.imageName = value;
             var img = core.material.images[value];
@@ -545,14 +559,14 @@ editor_mode = function (editor) {
             var loadImage = function (content, callback) {
                 var image = new Image();
                 try {
+                    image.onload = function () {
+                        callback(image);
+                    }
                     image.src = content;
                     if (image.complete) {
                         callback(image);
                         return;
                     }
-                    image.onload = function () {
-                        callback(image);
-                    }
                 }
                 catch (e) {
                     printe(e);
@@ -563,11 +577,20 @@ editor_mode = function (editor) {
                     editor_mode.appendPic.img = image;
                     editor_mode.appendPic.width = image.width;
                     editor_mode.appendPic.height = image.height;
-                    var ysize = selectAppend.value.indexOf('48') === -1 ? 32 : 48;
-                    for (var ii = 0; ii < 3; ii++) {
-                        var newsprite = appendPicCanvas.children[ii];
-                        newsprite.style.width = (newsprite.width = Math.floor(image.width / 32) * 32) / ratio + 'px';
-                        newsprite.style.height = (newsprite.height = Math.floor(image.height / ysize) * ysize) / ratio + 'px';
+
+                    if (selectAppend.value == 'autotile') {
+                        sprite.style.width = (sprite.width = image.width) / ratio + 'px';
+                        sprite.style.height = (sprite.height = image.height) / ratio + 'px';
+                        sprite.getContext('2d').clearRect(0, 0, sprite.width, sprite.height);
+                        sprite.getContext('2d').drawImage(image, 0, 0);
+                    }
+                    else {
+                        var ysize = selectAppend.value.indexOf('48') === -1 ? 32 : 48;
+                        for (var ii = 0; ii < 3; ii++) {
+                            var newsprite = appendPicCanvas.children[ii];
+                            newsprite.style.width = (newsprite.width = Math.floor(image.width / 32) * 32) / ratio + 'px';
+                            newsprite.style.height = (newsprite.height = Math.floor(image.height / ysize) * ysize) / ratio + 'px';
+                        }
                     }
 
                     //画灰白相间的格子
@@ -631,6 +654,54 @@ editor_mode = function (editor) {
 
         var appendConfirm = document.getElementById('appendConfirm');
         appendConfirm.onclick = function () {
+
+            var confirmAutotile = function () {
+                if (sprite.width != 96 || sprite.height != 128) {
+                    printe("不合法的Autotile图片！");
+                    return;
+                }
+                var imgbase64 = sprite.toDataURL().split(',')[1];
+
+                // Step 1: List文件名
+                fs.readdir('./project/images', function (err, data) {
+                    if (err) {
+                        printe(err);
+                        throw(err);
+                    }
+
+                    // Step 2: 选择Autotile文件名
+                    var filename;
+                    for (var i=1;;++i) {
+                        filename = 'autotile'+i;
+                        if (data.indexOf(filename+".png")==-1) break;
+                    }
+
+                    // Step 3: 写入文件
+                    fs.writeFile('./project/images/'+filename+".png", imgbase64, 'base64', function (err, data) {
+                        if (err) {
+                            printe(err);
+                            throw(err);
+                        }
+                        // Step 4: 自动注册
+                        editor_file.registerAutotile(filename, function (err) {
+                            if (err) {
+                                printe(err);
+                                throw(err);
+                            }
+                            printe('自动元件'+filename+'注册成功,请F5刷新编辑器');
+                        })
+
+                    })
+
+                })
+
+            }
+
+            if (selectAppend.value == 'autotile') {
+                confirmAutotile();
+                return;
+            }
+
             var ysize = selectAppend.value.indexOf('48') === -1 ? 32 : 48;
             var sprited = sprite.getContext('2d');
             //sprited.drawImage(img, 0, 0);

docs/V2.0.md

@@ -1,6 +1,6 @@
 # V2.0版本介绍
 
-?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} *
+?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} *
 
 目前样板已经更新到V2.0版本以上，本章将对V2.0的一些内容进行介绍。
 

docs/api.md

@@ -1,6 +1,6 @@
 # 附录: API列表
 
-?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} *
+?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} *
 
 **这里只列出所有可能会被造塔者用到的常用API，更多的有关内容请在代码内进行查询。**
 

docs/element.md

@@ -1,6 +1,6 @@
 # 元件说明
 
-?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} *
+?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} *
 
 在本章中，将对样板里的各个元件进行说明。各个元件主要包括道具、门、怪物、楼梯等等。
 

docs/event.md

@@ -1,6 +1,6 @@
 # 事件
 
-?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} *
+?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} *
 
 本章内将对样板所支持的事件进行介绍。
 

docs/index.md

@@ -1,6 +1,6 @@
 # HTML5 魔塔样板说明文档
 
-?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} *
+?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} *
 
 众所周知，魔塔的趋势是向移动端发展，贴吧中也常常能见到“求手机魔塔”的帖子。然而现有的工具中，NekoRPG有着比较大的局限性，游戏感较差，更是完全没法在iOS上运行。而一些APP的魔塔虽然可用，但是必须要下载安装，对于Android和iOS还必须开发不同的版本，非常麻烦。
 

docs/personalization.md

@@ -1,6 +1,6 @@
 # 个性化
 
-?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} *
+?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} *
 
 有时候只靠样板本身可能是不够的。我们需要一些个性化、自定义的素材，道具效果，怪物属性，等等。
 
@@ -27,7 +27,7 @@ HTML5魔塔是使用画布（canvas）来绘制，存在若干个图层，它们
 
 所有素材的图片都在`images`目录下。
 - `animates.png` 为所有动画效果。主要是星空熔岩，开门，毒网，传送门之类的效果。为四帧。
-- `autotile.png` 为Autotile块。
+- `autotile*.png` 为Autotile块。
 - `enemys.png` 为所有怪物的图片。
 - `enemy48.png` 为所有48x32怪物的图片。
 - `heros.png` 为勇士行走图。
@@ -151,18 +151,25 @@ ID必须由数字字母下划线组成，数字在1000以内，且均不能和
 
 素材注册完毕后，即可在游戏中正常使用，也可以被地图生成器所识别（需要重开地图生成器）。
 
-#### Autotile的注册
+#### Autotile自动元件的注册
 
 但是，通过上面这种方式，我们是没办法新增并注册Autotile的。
 
 除了替换样板现有的几个外，如果我们还需要新添加Autotile，则：
 
+1. 下拉框切到“追加素材”，导入文件到画板，然后导入一张Autotile自动元件图片。
+2. 下拉框选择autotile，然后点“追加”
+3. 看到成功的提示后刷新编辑器即可。
+
+<!--
+
 1. 将新的Autotile图片复制到images目录下。文件名必须是字母数字和下划线组成。
 2. 进入icons.js，在autotile分类下进行添加该文件的名称，索引简单的写0。
 3. 指定一个数字，在maps.js中类似进行添加。
 
 !> Autotile的ID和文件名应确保完全相同！
 
+-->
 <!--
 #### 新添加自定义地形（路面、墙壁等）
 

docs/start.md

@@ -1,6 +1,6 @@
 # 快速上手
 
-?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} *
+?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} *
 
 在这一节中，将详细介绍做一部塔的流程。现在，让我们来做一部单层塔！
 

main.js

@@ -2,7 +2,7 @@ function main() {
 
     //------------------------ 用户修改内容 ------------------------//
 
-    this.version = "2.4.2"; // 游戏版本号；如果更改了游戏内容建议修改此version以免造成缓存问题。
+    this.version = "2.4.3"; // 游戏版本号；如果更改了游戏内容建议修改此version以免造成缓存问题。
 
     this.useCompress = false; // 是否使用压缩文件
     // 当你即将发布你的塔时，请使用“JS代码压缩工具”将所有js代码进行压缩，然后将这里的useCompress改为true。

project/data.js

@@ -61,7 +61,7 @@ data_a1e2fb4a_e986_4524_b0da_9b7ba7c0874d =
 	"firstData": {
 		"title": "魔塔样板",
 		"name": "template",
-		"version": "Ver 2.4.2",
+		"version": "Ver 2.4.3",
 		"floorId": "sample0",
 		"hero": {
 			"name": "阳光",

更新说明.txt

@@ -5,7 +5,7 @@
 将部分代码移动到脚本编辑中
 （怪物属性获取、楼层传送、数据统计等）
 事件改变天气或画面色调，读档后仍有效
-Autotile注册优化
+Autotile自动元件的新增和注册
 状态栏可以显示角色名字
 双击道具栏图标直接进入装备栏
 可以设置剧情文本的字体大小