diff --git a/README.md b/README.md index 08857b63..b0008ae7 100644 --- a/README.md +++ b/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和注册 diff --git a/_server/editor_file.js b/_server/editor_file.js index e0ce6877..9e5f28f8 100644 --- a/_server/editor_file.js +++ b/_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'); diff --git a/_server/editor_mode.js b/_server/editor_mode.js index 9bbf0c0b..1b0e71f2 100644 --- a/_server/editor_mode.js +++ b/_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(["\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); diff --git a/docs/V2.0.md b/docs/V2.0.md index 95c18918..2e1ca201 100644 --- a/docs/V2.0.md +++ b/docs/V2.0.md @@ -1,6 +1,6 @@ # V2.0版本介绍 -?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} * +?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} * 目前样板已经更新到V2.0版本以上，本章将对V2.0的一些内容进行介绍。 diff --git a/docs/api.md b/docs/api.md index 0388bd22..6bc861dc 100644 --- a/docs/api.md +++ b/docs/api.md @@ -1,6 +1,6 @@ # 附录: API列表 -?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} * +?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} * **这里只列出所有可能会被造塔者用到的常用API，更多的有关内容请在代码内进行查询。** diff --git a/docs/element.md b/docs/element.md index 400a0605..89e3ffa3 100644 --- a/docs/element.md +++ b/docs/element.md @@ -1,6 +1,6 @@ # 元件说明 -?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} * +?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} * 在本章中，将对样板里的各个元件进行说明。各个元件主要包括道具、门、怪物、楼梯等等。 diff --git a/docs/event.md b/docs/event.md index b2d67f93..7f64e99d 100644 --- a/docs/event.md +++ b/docs/event.md @@ -1,6 +1,6 @@ # 事件 -?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} * +?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} * 本章内将对样板所支持的事件进行介绍。 diff --git a/docs/index.md b/docs/index.md index b99b20b0..c243a47d 100644 --- a/docs/index.md +++ b/docs/index.md @@ -1,6 +1,6 @@ # HTML5 魔塔样板说明文档 -?> 目前版本**v2.4.2**，上次更新时间：* {docsify-updated} * +?> 目前版本**v2.4.3**，上次更新时间：* {docsify-updated} * 众所周知，魔塔的趋势是向移动端发展，贴吧中也常常能见到“求手机魔塔”的帖子。然而现有的工具中，NekoRPG有着比较大的局限性，游戏感较差，更是完全没法在iOS上运行。而一些APP的魔塔虽然可用，但是必须要下载安装，对于Android和iOS还必须开发不同的版本，非常麻烦。 diff --git a/docs/personalization.md b/docs/personalization.md index 78ab906f..4738fce6 100644 --- a/docs/personalization.md +++ b/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. 看到成功的提示后刷新编辑器即可。 + +