diff --git a/_server/comment.js b/_server/comment.js index 982424a4..42422d46 100644 --- a/_server/comment.js +++ b/_server/comment.js @@ -245,6 +245,18 @@ comment_c456ea59_6018_45ef_8bcc_211a24c627dc = "_type": "textarea", "_data": "显示在状态栏中的层数" }, + "width": { + "_leaf": true, + "_type": "textarea", + "_range": "false", + "_data": "地图x方向大小,这里不能更改,仅能在新建地图时设置,null视为13" + }, + "height": { + "_leaf": true, + "_type": "textarea", + "_range": "false", + "_data": "地图y方向大小,这里不能更改,仅能在新建地图时设置,null视为13" + }, "canFlyTo": { "_leaf": true, "_type": "checkbox", diff --git a/_server/css/editor.css b/_server/css/editor.css index f5681118..928a0964 100644 --- a/_server/css/editor.css +++ b/_server/css/editor.css @@ -89,6 +89,10 @@ body { height: 630px; } +#mapEdit { + overflow: hidden; +} + .map { position: absolute; left: 20px; diff --git a/_server/css/editor_mobile.css b/_server/css/editor_mobile.css index d5eed943..36ca92ae 100644 --- a/_server/css/editor_mobile.css +++ b/_server/css/editor_mobile.css @@ -82,6 +82,10 @@ body { position: absolute; } +#mapEdit { + overflow: hidden; +} + .map { position: absolute; left: 4vw; diff --git a/_server/editor.js b/_server/editor.js index f5c7d0e1..08795309 100644 --- a/_server/editor.js +++ b/_server/editor.js @@ -21,6 +21,7 @@ editor.prototype.init = function (callback) { editor.updateMap(); editor.currentFloorId = core.status.floorId; editor.currentFloorData = core.floors[core.status.floorId]; + editor.buildMark(); editor.drawEventBlock(); if (Boolean(callback)) callback(); }); @@ -162,9 +163,10 @@ editor.prototype.mapInit = function () { ec.clearRect(0, 0, core.bigmap.width*32, core.bigmap.height*32); document.getElementById('event2').getContext('2d').clearRect(0, 0, core.bigmap.width*32, core.bigmap.height*32); editor.map = []; - for (var y = 0; y < 13; y++) { + var sy=editor.currentFloorData.map.length,sy=editor.currentFloorData.map[0].length; + for (var y = 0; y < sy; y++) { editor.map[y] = []; - for (var x = 0; x < 13; x++) { + for (var x = 0; x < sx; x++) { editor.map[y][x] = 0; } } @@ -201,7 +203,7 @@ editor.prototype.drawEventBlock = function () { for (var i=0;i<13;i++) { for (var j=0;j<13;j++) { var color=null; - var loc=i+","+j; + var loc=(i+core.bigmap.offsetX/32)+","+(j+core.bigmap.offsetY/32); if (core.isset(editor.currentFloorData.events[loc])) color = '#FF0000'; else if (core.isset(editor.currentFloorData.changeFloor[loc])) @@ -254,8 +256,8 @@ editor.prototype.updateMap = function () { } // 绘制地图 start var eventCtx = document.getElementById('event').getContext("2d"); - for (var y = 0; y < 13; y++) - for (var x = 0; x < 13; x++) { + for (var y = 0; y < editor.map.length; y++) + for (var x = 0; x < editor.map[0].length; x++) { var tileInfo = editor.map[y][x]; if (false && isAutotile(tileInfo)) { addIndexToAutotileInfo(x, y); @@ -266,6 +268,64 @@ editor.prototype.updateMap = function () { } +editor.prototype.buildMark = function(){ + // 生成定位编号 + var arrColMark=document.getElementById('arrColMark'); + var arrRowMark=document.getElementById('arrRowMark'); + var mapColMark=document.getElementById('mapColMark'); + var mapRowMark=document.getElementById('mapRowMark'); + var buildMark = function (offsetX,offsetY) { + var colNum = ' '; + for (var i = 0; i < 13; i++) { + var tpl = '' + (i+offsetX) + '
'; + colNum += tpl; + } + arrColMark.innerHTML = '' + colNum + ''; + mapColMark.innerHTML = '' + colNum + ''; + var rowNum = ' '; + for (var i = 0; i < 13; i++) { + var tpl = '' + (i+offsetY) + '
'; + rowNum += tpl; + } + arrRowMark.innerHTML = rowNum; + mapRowMark.innerHTML = rowNum; + } + var buildMark_mobile = function (offsetX,offsetY) { + var colNum = ' '; + for (var i = 0; i < 13; i++) { + var tpl = '' + (' '+i).slice(-2).replace(' ',' ') + '
'; + colNum += tpl; + } + arrColMark.innerHTML = '' + colNum + ''; + //mapColMark.innerHTML = '' + colNum + ''; + var rowNum = ' '; + for (var i = 0; i < 13; i++) { + var tpl = '' + (' '+i).slice(-2).replace(' ',' ') + '
'; + rowNum += tpl; + } + arrRowMark.innerHTML = rowNum; + //mapRowMark.innerHTML = rowNum; + //===== + var colNum = ' '; + for (var i = 0; i < 13; i++) { + var tpl = '
' + (' '+(i+offsetX)).slice(-2).replace(' ',' ') + '
'; + colNum += tpl; + } + mapColMark.innerHTML = '
' + colNum + '
'; + var rowNum = ' '; + for (var i = 0; i < 13; i++) { + var tpl = '
' + (' '+(i+offsetY)).slice(-2).replace(' ',' ') + '
'; + rowNum += tpl; + } + mapRowMark.innerHTML = rowNum; + } + if(editor.isMobile){ + buildMark_mobile(core.bigmap.offsetX/32,core.bigmap.offsetY/32); + } else { + buildMark(core.bigmap.offsetX/32,core.bigmap.offsetY/32); + } +} + editor.prototype.changeFloor = function (floorId, callback) { editor.currentFloorData.map = editor.map.map(function (v) { return v.map(function (v) { @@ -308,7 +368,7 @@ editor.prototype.listen = function () { function fillPos(pos) { uc.fillStyle = '#' + ~~(Math.random() * 8) + ~~(Math.random() * 8) + ~~(Math.random() * 8); - uc.fillRect(pos.x * 32 + 12, pos.y * 32 + 12, 8, 8); + uc.fillRect(pos.x * 32 + 12 - core.bigmap.offsetX, pos.y * 32 + 12 - core.bigmap.offsetY, 8, 8); }//在格子内画一个随机色块 function eToLoc(e) { @@ -324,8 +384,13 @@ editor.prototype.listen = function () { return editor.loc; }//返回可用的组件内坐标 - function locToPos(loc) { - editor.pos = {'x': ~~(loc.x / loc.size), 'y': ~~(loc.y / loc.size)} + function locToPos(loc, addViewportOffset) { + var offsetX=0, offsetY=0; + if (addViewportOffset){ + offsetX=core.bigmap.offsetX/32; + offsetY=core.bigmap.offsetY/32; + } + editor.pos = {'x': ~~(loc.x / loc.size)+offsetX, 'y': ~~(loc.y / loc.size)+offsetY} return editor.pos; } @@ -350,13 +415,13 @@ editor.prototype.listen = function () { eui.onmousedown = function (e) { if (e.button==2){ var loc = eToLoc(e); - var pos = locToPos(loc); + var pos = locToPos(loc,true); editor.showMidMenu(e.clientX,e.clientY); return; } if (!selectBox.isSelected) { var loc = eToLoc(e); - var pos = locToPos(loc); + var pos = locToPos(loc,true); editor_mode.onmode('nextChange'); editor_mode.onmode('loc'); //editor_mode.loc(); @@ -372,7 +437,7 @@ editor.prototype.listen = function () { e.stopPropagation(); uc.clearRect(0, 0, 416, 416); var loc = eToLoc(e); - var pos = locToPos(loc); + var pos = locToPos(loc,true); stepPostfix = []; stepPostfix.push(pos); fillPos(pos); @@ -390,7 +455,7 @@ editor.prototype.listen = function () { mouseOutCheck = 2; e.stopPropagation(); var loc = eToLoc(e); - var pos = locToPos(loc); + var pos = locToPos(loc,true); var pos0 = stepPostfix[stepPostfix.length - 1] var directionDistance = [pos.y - pos0.y, pos0.x - pos.x, pos0.y - pos.y, pos.x - pos0.x] var max = 0, index = 4; @@ -778,6 +843,24 @@ editor.prototype.listen = function () { editor.brushMod=brushMod2.value; } + + editor.moveViewport=function(x,y){ + core.bigmap.offsetX = core.clamp(core.bigmap.offsetX+32*x, 0, 32*core.bigmap.width-416); + core.bigmap.offsetY = core.clamp(core.bigmap.offsetY+32*y, 0, 32*core.bigmap.height-416); + core.control.updateViewport(); + editor.buildMark(); + editor.drawEventBlock(); + } + + var viewportButtons=document.getElementById('viewportButtons'); + for(var ii=0,node;node=viewportButtons.children[ii];ii++){ + (function(x,y){ + node.onclick=function(){ + editor.moveViewport(x,y); + } + })([-1,0,0,1][ii],[0,-1,1,0][ii]); + } + }//绑定事件 /* diff --git a/_server/editor_file.js b/_server/editor_file.js index 82247ee0..46b2fe6b 100644 --- a/_server/editor_file.js +++ b/_server/editor_file.js @@ -695,19 +695,20 @@ editor_file = function (editor, callback) { } var formatMap = function (mapArr) { - //把13*13或者1*169数组格式化 + //把二维数组格式化 var formatArrStr = ''; var arr = JSON.stringify(mapArr).replace(/\s+/g, '').split('],['); - for (var i = 0; i < 13; i++) { + var si=mapArr.length-1,sk=mapArr[0].length-1; + for (var i = 0; i <= si; i++) { var a = []; formatArrStr += ' ['; - if (i == 0 || i == 12) a = arr[i].split(/\D+/).join(' ').trim().split(' '); + if (i == 0 || i == si) a = arr[i].split(/\D+/).join(' ').trim().split(' '); else a = arr[i].split(/\D+/); - for (var k = 0; k < 13; k++) { + for (var k = 0; k <= sk; k++) { var num = parseInt(a[k]); - formatArrStr += Array(Math.max(4 - String(num).length, 0)).join(' ') + num + (k == 12 ? '' : ','); + formatArrStr += Array(Math.max(4 - String(num).length, 0)).join(' ') + num + (k == sk ? '' : ','); } - formatArrStr += ']' + (i == 12 ? '' : ',\n'); + formatArrStr += ']' + (i == si ? '' : ',\n'); } return formatArrStr; } diff --git a/_server/vm.js b/_server/vm.js index 312507fa..27e0aa6f 100644 --- a/_server/vm.js +++ b/_server/vm.js @@ -24,7 +24,14 @@ document.body.onmousedown = function (e) { } }); - if (clickpath.indexOf('edit') === -1 && clickpath.indexOf('tip') === -1 && clickpath.indexOf('brushMod') === -1 && clickpath.indexOf('brushMod2') === -1) { + var unselect=true; + for(var ii=0,thisId;thisId=['edit','tip','brushMod','brushMod2','viewportButtons'][ii];ii++){ + if (clickpath.indexOf(thisId) !== -1){ + unselect=false; + break; + } + } + if (unselect) { if (clickpath.indexOf('eui') === -1) { if (selectBox.isSelected) { editor_mode.onmode(''); @@ -60,11 +67,12 @@ var exportMap = new Vue({ methods: { exportMap: function () { editor.updateMap(); + var sx=editor.map.length-1,sy=editor.map[0].length-1; var filestr = ''; - for (var yy = 0; yy < 13; yy++) { + for (var yy = 0; yy <= sy; yy++) { filestr += '[' - for (var xx = 0; xx < 13; xx++) { + for (var xx = 0; xx <= sx; xx++) { var mapxy = editor.map[yy][xx]; if (typeof(mapxy) == typeof({})) { if ('idnum' in mapxy) mapxy = mapxy.idnum; @@ -79,10 +87,10 @@ var exportMap = new Vue({ } mapxy = String(mapxy); mapxy = Array(Math.max(4 - mapxy.length, 0)).join(' ') + mapxy; - filestr += mapxy + (xx == 12 ? '' : ',') + filestr += mapxy + (xx == sx ? '' : ',') } - filestr += ']' + (yy == 12 ? '' : ',\n'); + filestr += ']' + (yy == sy ? '' : ',\n'); } pout.value = filestr; editArea.mapArr = filestr; @@ -97,7 +105,7 @@ var editArea = new Vue({ data: { mapArr: '', errors: [ // 编号1,2,3,4 - "格式错误!请使用正确格式(13*13数组,如不清楚,可先点击生成地图查看正确格式)", + "格式错误!请使用正确格式(width*height数组,如不清楚,可先点击生成地图查看正确格式)", "当前有未定义ID(在地图区域显示红块),请修改ID或者到icons.js和maps.js中进行定义!", "ID越界(在地图区域显示红块),当前编辑器暂时支持编号小于400,请修改编号!", // "发生错误!", @@ -138,8 +146,9 @@ var editArea = new Vue({ // var mapArray = that.mapArr.split(/\D+/).join(' ').trim().split(' '); var mapArray = JSON.parse('[' + that.mapArr + ']'); - for (var y = 0; y < 13; y++) - for (var x = 0; x < 13; x++) { + var sy=editor.map.length,sx=editor.map[0].length; + for (var y = 0; y < sy; y++) + for (var x = 0; x < sx; x++) { var num = mapArray[y][x]; if (num == 0) editor.map[y][x] = 0; @@ -159,25 +168,26 @@ var editArea = new Vue({ var formatArrStr = ''; var that = this; clearTimeout(that.formatTimer); - if (this.mapArr.split(/\D+/).join(' ').trim().split(' ').length != 169) return false; + var si=this.mapArr.length,sk=this.mapArr[0].length; + if (this.mapArr.split(/\D+/).join(' ').trim().split(' ').length != si*sk) return false; var arr = this.mapArr.replace(/\s+/g, '').split('],['); - if (arr.length != 13) return; - for (var i = 0; i < 13; i++) { + if (arr.length != si) return; + for (var i = 0; i < si; i++) { var a = []; formatArrStr += '['; - if (i == 0 || i == 12) a = arr[i].split(/\D+/).join(' ').trim().split(' '); + if (i == 0 || i == si-1) a = arr[i].split(/\D+/).join(' ').trim().split(' '); else a = arr[i].split(/\D+/); - if (a.length != 13) { + if (a.length != sk) { formatArrStr = ''; return; } - for (var k = 0; k < 13; k++) { + for (var k = 0; k < sk; k++) { var num = parseInt(a[k]); - formatArrStr += Array(Math.max(4 - String(num).length, 0)).join(' ') + num + (k == 12 ? '' : ','); + formatArrStr += Array(Math.max(4 - String(num).length, 0)).join(' ') + num + (k == sk-1 ? '' : ','); } - formatArrStr += ']' + (i == 12 ? '' : ',\n'); + formatArrStr += ']' + (i == si-1 ? '' : ',\n'); } return formatArrStr; } diff --git a/editor-mobile.html b/editor-mobile.html index eae04732..e7092229 100644 --- a/editor-mobile.html +++ b/editor-mobile.html @@ -268,7 +268,12 @@ -
+
+ + + + +
-


+
+
+ + + + +
+
@@ -370,36 +377,20 @@
- - - - - - - - - 此浏览器不支持HTML5 +
+ + + + + + + + + + 此浏览器不支持HTML5 +
-