jianghe2nd/mota-js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

lastUsed

Browse Source
This commit is contained in:
ckcz123 2019-12-31 12:43:59 +08:00
parent 6c0f286b46
commit c0ffce339a
8 changed files with 85 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
_server/editor.js
View File

@ -8,6 +8,7 @@ function editor() {
body:document.body,
eui:document.getElementById('eui'),
euiCtx:document.getElementById('eui').getContext('2d'),
efgCtx:document.getElementById('efg').getContext('2d'),
mid:document.getElementById('mid'),
mapEdit:document.getElementById('mapEdit'),
selectFloor:document.getElementById('selectFloor'),
@ -26,9 +27,13 @@ function editor() {
brushMod2:document.getElementById('brushMod2'),
brushMod3:document.getElementById('brushMod3'),
bgc : document.getElementById('bg'),
bgCtx : document.getElementById('bg').getContext('2d'),
fgc : document.getElementById('fg'),
evc : document.getElementById('event'),
fgCtx : document.getElementById('fg').getContext('2d'),
evc : document.getElementById('event'),
evCtx : document.getElementById('event').getContext('2d'),
ev2c : document.getElementById('event2'),
ev2Ctx : document.getElementById('event2').getContext('2d'),
layerMod:document.getElementById('layerMod'),
layerMod2:document.getElementById('layerMod2'),
layerMod3:document.getElementById('layerMod3'),
@ -46,6 +51,10 @@ function editor() {
changeFloorId :document.getElementById('changeFloorId'),
left1 : document.getElementById('left1'),
editModeSelect :document.getElementById('editModeSelect'),
mid2 : document.getElementById('mid2'),
lastUsedDiv: document.getElementById('lastUsedDiv'),
lastUsed: document.getElementById('lastUsed'),
lastUsedCtx: document.getElementById('lastUsed').getContext('2d'),
};
this.uivalues={
@ -89,6 +98,9 @@ function editor() {
// tile
tileSize: [1,1],
// 最近使用的图块
lastUsed: [],
};
window.onerror = function (msg, url, lineNo, columnNo, error) {
@ -212,9 +224,9 @@ editor.prototype.init = function (callback) {
}
editor.prototype.mapInit = function () {
var ec = document.getElementById('event').getContext('2d');
var ec = editor.dom.evCtx;
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.dom.ev2Ctx.clearRect(0, 0, core.bigmap.width*32, core.bigmap.height*32);
editor.map = [];
var sy=editor.currentFloorData.map.length,sx=editor.currentFloorData.map[0].length;
for (var y = 0; y < sy; y++) {
@ -268,7 +280,7 @@ editor.prototype.changeFloor = function (floorId, callback) {
/////////// 游戏绘图相关 ///////////
editor.prototype.drawEventBlock = function () {
var fg=document.getElementById('efg').getContext('2d');
var fg=editor.dom.efgCtx;
fg.clearRect(0, 0, core.__PIXELS__, core.__PIXELS__);
var firstData = editor.game.getFirstData();
@ -319,7 +331,7 @@ editor.prototype.drawEventBlock = function () {
editor.prototype.drawPosSelection = function () {
this.drawEventBlock();
var fg=document.getElementById('efg').getContext('2d');
var fg=editor.dom.efgCtx;
fg.strokeStyle = 'rgba(255,255,255,0.7)';
fg.lineWidth = 4;
fg.strokeRect(32*editor.pos.x - core.bigmap.offsetX + 4, 32*editor.pos.y - core.bigmap.offsetY + 4, 24, 24);
@ -371,20 +383,42 @@ editor.prototype.updateMap = function () {
//ctx.drawImage(core.material.images[tileInfo.images], 0, tileInfo.y*32, 32, 32, x*32, y*32, 32, 32);
}
// 绘制地图 start
var eventCtx = document.getElementById('event').getContext("2d");
var fgCtx = document.getElementById('fg').getContext("2d");
var bgCtx = document.getElementById('bg').getContext("2d");
for (var y = 0; y < editor.map.length; y++)
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];
drawTile(eventCtx, x, y, tileInfo);
drawTile(editor.dom.evCtx, x, y, tileInfo);
tileInfo = editor.fgmap[y][x];
drawTile(fgCtx, x, y, tileInfo);
drawTile(editor.dom.fgCtx, x, y, tileInfo);
tileInfo = editor.bgmap[y][x];
drawTile(bgCtx, x, y, tileInfo);
drawTile(editor.dom.bgCtx, x, y, tileInfo);
}
}
// 绘制地图 end
this.updateLastUsedMap();
}
editor.prototype.updateLastUsedMap = function () {
// 绘制最近使用事件
var ctx = editor.dom.lastUsedCtx;
ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
ctx.strokeStyle = 'rgba(255,128,0,0.85)';
ctx.lineWidth = 4;
for (var i = 0; i < editor.uivalues.lastUsed.length; ++i) {
var x = i % core.__SIZE__, y = parseInt(i / core.__SIZE__);
if (y >= 5) break;
var info = editor.uivalues.lastUsed[i];
if (!info || !info.images) continue;
if (info.isTile) {
ctx.drawImage(core.material.images.tilesets[info.images], 32 * info.x, 32 * info.y, 32, 32, x*32, y*32, 32, 32);
} else {
var per_height = info.images.endsWith('48') ? 48 : 32;
ctx.drawImage(core.material.images[info.images], 0, info.y * per_height, 32, per_height, x * 32, y * 32, 32, 32);
}
if (selectBox.isSelected() && editor.info.id == info.id) {
ctx.strokeRect(32 * x + 2, 32 * y + 2, 28, 28);
}
}
}
editor.prototype.setViewport=function (x, y) {
@ -413,6 +447,7 @@ editor.prototype.drawInitData = function (icons) {
// editor.uivalues.folded = true;
editor.uivalues.foldPerCol = core.getLocalStorage('foldPerCol', 50);
// var imgNames = Object.keys(images); //还是固定顺序吧；
editor.uivalues.lastUsed = core.getLocalStorage("lastUsed", []);
var imgNames = ["terrains", "animates", "enemys", "enemy48", "items", "npcs", "npc48", "autotile"];
for (var ii = 0; ii < imgNames.length; ii++) {
@ -605,7 +640,10 @@ editor.prototype.setSelectBoxFromInfo=function(thisevent){
editor.dom.dataSelection.style.left = pos.x * 32 + 'px';
editor.dom.dataSelection.style.top = pos.y * ysize + 'px';
editor.dom.dataSelection.style.height = ysize - 6 + 'px';
setTimeout(function(){selectBox.isSelected(true);});
setTimeout(function(){
selectBox.isSelected(true);
editor.updateLastUsedMap();
});
editor.info = JSON.parse(JSON.stringify(thisevent));
tip.infos(JSON.parse(JSON.stringify(thisevent)));
editor.pos=pos;

2
_server/editor_datapanel.js
View File

@ -540,7 +540,7 @@ editor_datapanel_wrapper = function (editor) {
}
//画灰白相间的格子
var bgc = editor.dom.bg.getContext('2d');
var bgc = editor.dom.bgCtx;
var colorA = ["#f8f8f8", "#cccccc"];
var colorIndex;
var sratio = 4;

2
_server/editor_listen.js
View File

@ -34,6 +34,8 @@ editor_listen_wrapper = function (editor) {
editor.dom.clearEvent.onmousedown = editor.uifunctions.clearEvent_click
editor.dom.clearLoc.onmousedown = editor.uifunctions.clearLoc_click
editor.dom.lastUsed.onmousedown = editor.uifunctions.lastUsed_click;
editor.dom.brushMod.onchange = editor.uifunctions.brushMod_onchange
if (editor.dom.brushMod2) editor.dom.brushMod2.onchange = editor.uifunctions.brushMod2_onchange;
if (editor.dom.brushMod3) editor.dom.brushMod3.onchange = editor.uifunctions.brushMod3_onchange;

22
_server/editor_mappanel.js
View File

@ -251,6 +251,10 @@ editor_mappanel_wrapper = function (editor) {
editor[editor.layerMod][editor.uivalues.stepPostfix[ii].y][editor.uivalues.stepPostfix[ii].x] = editor.info;
}
// console.log(editor.map);
if (editor.info.y != null) {
editor.uivalues.lastUsed = [editor.info].concat(editor.uivalues.lastUsed.filter(function (e) { return e.id != editor.info.id}));
core.setLocalStorage("lastUsed", editor.uivalues.lastUsed);
}
editor.updateMap();
editor.uivalues.holdingPath = 0;
editor.uivalues.stepPostfix = [];
@ -587,6 +591,7 @@ editor_mappanel_wrapper = function (editor) {
* 切换画笔模式
*/
editor.uifunctions.brushMod3_onchange = function () {
alert("从V2.6.6开始，tileset贴图模式已被废弃。\n请右键额外素材，并输入所需要绘制的宽高，然后单击地图以绘制一个区域。");
// tip.showHelp(5)
tip.isSelectedBlock(false)
tip.msgs[11] = String('tileset贴图模式下可以按选中tileset素材，并在地图上拖动来一次绘制一个区域');
@ -710,6 +715,20 @@ editor_mappanel_wrapper = function (editor) {
saveFloor.onclick = editor_mode.saveFloor;
}
editor.uifunctions.lastUsed_click = function (e) {
if (editor.isMobile) return;
var scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop
var px = scrollLeft + e.clientX - editor.dom.mid2.offsetLeft - editor.dom.lastUsedDiv.offsetLeft,
py = scrollTop + e.clientY - editor.dom.mid2.offsetTop - editor.dom.lastUsedDiv.offsetTop;
var x = parseInt(px / 32), y = parseInt(py / 32);
var index = x + core.__SIZE__ * y;
if (index >= editor.uivalues.lastUsed.length) return;
editor.setSelectBoxFromInfo(editor.uivalues.lastUsed[index]);
return;
}
/////////////////////////////////////////////////////////////////////////////
@ -863,7 +882,4 @@ editor_mappanel_wrapper = function (editor) {
}

1
_server/editor_materialpanel.js
View File

@ -147,6 +147,7 @@ editor_materialpanel_wrapper = function (editor) {
tip.infos(JSON.parse(JSON.stringify(editor.info)));
editor_mode.onmode('nextChange');
editor_mode.onmode('enemyitem');
editor.updateLastUsedMap();
//editor_mode.enemyitem();
}
}

2
_server/editor_ui.js
View File

@ -49,7 +49,7 @@ editor_ui_wrapper = function (editor) {
}
}
if (unselect) {
if (clickpath.indexOf('eui') === -1) {
if (clickpath.indexOf('eui') === -1 && clickpath.indexOf('lastUsed')) {
if (selectBox.isSelected()) {
editor_mode.onmode('');
editor.file.saveFloorFile(function (err) {

7
editor-mobile.html
View File

@ -313,8 +313,11 @@
</div>
</div>
<div id="mid2">
<div id="mid2" style="display: none">
<p style="margin: 10px">最近使用的图块列表：</p>
<div class="map" style="height: 160px; margin-top: 25px" id="lastUsedDiv">
<canvas class='gameCanvas' id='lastUsed' width='416' height='160'></canvas>
</div>
</div>
<div id="right" style="z-index:-1;opacity: 0;">
<div id="iconLib">

5
editor.html
View File

@ -357,7 +357,10 @@
</div>
</div>
<div id="mid2">
<p style="margin: 10px">最近使用的图块列表：</p>
<div class="map" style="height: 160px; margin-top: 25px" id="lastUsedDiv">
<canvas class='gameCanvas' id='lastUsed' width='416' height='160'></canvas>
</div>
</div>
<div id="right">
<div id="iconLib">