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

setStatusBarInnerHTML

Browse Source
This commit is contained in:
oc 2019-03-16 19:37:41 +08:00
parent fb7bf47804
commit b3b395c9aa
5 changed files with 83 additions and 80 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
libs/control.js
View File

@ -2812,8 +2812,7 @@ control.prototype.checkBgm = function() {
////// 清空状态栏 //////
control.prototype.clearStatusBar = function() {
Object.keys(core.statusBar).forEach(function (e) {
if (core.isset(core.statusBar[e].innerHTML))
core.statusBar[e].innerHTML = " ";
core.statusBar[e].innerHTML = "";
})
core.statusBar.image.book.style.opacity = 0.3;
if (!core.flags.equipboxButton) {

39
libs/events.js
View File

@ -1509,6 +1509,9 @@ events.prototype._action_exit = function (data, x, y, prefix) {
// ------ 样板提供的的自定义事件 END ------ //
// ------ 一些事件的具体执行过程 ------ //
////// 跟随 //////
events.prototype.follow = function (name) {
core.status.hero.followers = core.status.hero.followers || [];
if (core.isset(core.material.images.images[name])
@ -1520,6 +1523,7 @@ events.prototype.follow = function (name) {
}
}
////// 取消跟随 //////
events.prototype.unfollow = function (name) {
core.status.hero.followers = core.status.hero.followers || [];
if (!core.isset(name)) {
@ -1538,6 +1542,7 @@ events.prototype.unfollow = function (name) {
core.drawHero();
}
////// 绘制或取消一张gif图片 //////
events.prototype.showGif = function (name, x, y) {
var image = core.material.images.images[name];
if (image) {
@ -1555,6 +1560,7 @@ events.prototype.showGif = function (name, x, y) {
}
}
////// 数值操作 //////
events.prototype.setValue = function (name, value, prefix, add) {
var value = core.calValue(value, prefix);
if (add) value += core.calValue(name, prefix);
@ -1592,16 +1598,19 @@ events.prototype._setValue_setSwitch = function (name, value, prefix) {
core.setFlag((prefix||"f@x@y")+"@"+data.name.substring(7), value);
}
////// 数值增减 //////
events.prototype.setValue2 = function (name, value, prefix) {
this.setValue(name, value, prefix, true);
}
////// 设置楼层属性 //////
events.prototype.setFloorInfo = function (name, value, floorId, prefix) {
floorId = floorId || data.floorId;
core.status.maps[floorId][name] = core.calValue(value, prefix);
core.updateStatusBar();
}
////// 设置全塔属性 //////
events.prototype.setGlobalAttribute = function (name, value) {
if (typeof value == 'string') {
if ((value.charAt(0)=='"' && value.charAt(value.length-1)=='"')
@ -1616,6 +1625,7 @@ events.prototype.setGlobalAttribute = function (name, value) {
core.setFlag('globalAttribute', core.status.globalAttribute);
}
////// 设置全局开关 //////
events.prototype.setGlobalFlag = function (name, value) {
var flags = core.getFlag("globalFlags", {});
flags[name] = value;
@ -1624,30 +1634,6 @@ events.prototype.setGlobalFlag = function (name, value) {
core.resize();
}
events.prototype.setFloorName = function (floorId) {
floorId = floorId || core.status.floorId;
if (!core.isset(floorId)) return;
// 根据文字判断是否斜体
var floorName = core.status.maps[floorId].name || "";
if (typeof floorName == 'number') floorName = ""+floorName;
if (!core.isset(floorName) || floorName=="") floorName=" "
if (core.statusBar.floor.innerHTML == floorName) return;
core.statusBar.floor.innerHTML = floorName;
if (/^[+-]?\d+$/.test(floorName)) {
core.statusBar.floor.style.fontStyle = 'italic';
core.statusBar.floor.style.fontSize = '1.1em';
}
else {
core.statusBar.floor.style.fontStyle = 'normal';
if (floorName.length<=5)
core.statusBar.floor.style.fontSize = '1.1em';
else if (floorName.length==6)
core.statusBar.floor.style.fontSize = '0.9em';
else
core.statusBar.floor.style.fontSize = '0.7em';
}
}
////// 显示图片 //////
events.prototype.showImage = function (code, image, x, y, dw, dh, opacityVal, time, callback) {
dw /= 100;
@ -2085,11 +2071,6 @@ events.prototype.tryUseItem = function(itemId) {
else core.drawTip("当前无法使用"+core.material.items[itemId].name);
}
////// 加点事件 //////
events.prototype.addPoint = function (enemy) {
return this.eventdata.addPoint(enemy);
}
////// 使用炸弹/圣锤后的事件 //////
events.prototype.afterUseBomb = function () {
return this.eventdata.afterUseBomb();

25
libs/maps.js
View File

@ -515,16 +515,15 @@ maps.prototype._canMoveDirectly_checkNextPoint = function (blocksObj, x, y) {
// -------- 绘制地图，各层图块，楼层贴图，Autotile -------- //
////// 绘制一个图块 //////
maps.prototype.drawBlock = function (block, animate, dx, dy) {
maps.prototype.drawBlock = function (block, animate) {
if (block.event.id == 'none') return;
animate = animate || 0;
dx = dx || 0;
dy = dy || 0;
var redraw = core.isset(animate);
if (!redraw) animate = 0;
var x = block.x, y = block.y;
// --- 在界面外的动画不绘制
if (animate > 1 && block.event.animate > 1 &&
(32*x + dx < core.bigmap.offsetX - 64 || 32*x + dx > core.bigmap.offsetX + this.DEFAULT_PIXEL_WIDTH + 32
|| 32*y + dy < core.bigmap.offsetY - 64 || 32*y + dy > core.bigmap.offsetY + this.DEFAULT_PIXEL_HEIGHT + 32 + 16)) {
if (redraw && block.event.animate > 1 &&
(32*x < core.bigmap.offsetX - 64 || 32*x > core.bigmap.offsetX + this.DEFAULT_PIXEL_WIDTH + 32
|| 32*y < core.bigmap.offsetY - 64 || 32*y > core.bigmap.offsetY + this.DEFAULT_PIXEL_HEIGHT + 32 + 16)) {
return;
}
@ -532,19 +531,19 @@ maps.prototype.drawBlock = function (block, animate, dx, dy) {
if (blockInfo == null) return;
if (blockInfo.cls != 'tileset') blockInfo.posX = animate % block.event.animate;
if (!core.isset(block.name))
this._drawBlockInfo(blockInfo, block.x, block.y, dx, dy);
this._drawBlockInfo(blockInfo, block.x, block.y);
else
this._drawBlockInfo_bgfg(blockInfo, block.name, block.x, block.y);
}
maps.prototype._drawBlockInfo = function (blockInfo, x, y, dx, dy) {
maps.prototype._drawBlockInfo = function (blockInfo, x, y) {
var image = blockInfo.image, posX = blockInfo.posX, posY = blockInfo.posY, height = blockInfo.height;
core.clearMap('event', x * 32 + dx, y * 32 + dy, 32, 32);
core.drawImage('event', image, posX * 32, posY * height + height - 32, 32, 32, x * 32 + dx, y * 32 + dy, 32, 32);
core.clearMap('event', x * 32, y * 32, 32, 32);
core.drawImage('event', image, posX * 32, posY * height + height - 32, 32, 32, x * 32, y * 32, 32, 32);
if (height>32) {
core.clearMap('event2', x * 32 + dx, y * 32 + 32 - height + dy, 32, height - 32)
core.drawImage('event2', image, posX * 32, posY * height, 32, height - 32, x * 32 + dx, y * 32 + 32 - height + dy, 32, height-32);
core.clearMap('event2', x * 32, y * 32 + 32 - height, 32, height - 32)
core.drawImage('event2', image, posX * 32, posY * height, 32, height - 32, x * 32, y * 32 + 32 - height, 32, height-32);
}
}

21
libs/utils.js
View File

@ -590,6 +590,27 @@ utils.prototype.expandMoveSteps = function (steps) {
return moveSteps;
}
////// 设置statusBar的innerHTML，会自动斜体和放缩，也可以增加自定义css //////
utils.prototype.setStatusBarInnerHTML = function (name, value, css) {
if (typeof value == 'number') value = this.formatBigNumber(value);
// 判定是否斜体
var italic = /^[-a-zA-Z0-9`~!@#$%^&*()_=+\[{\]}\\|;:'",<.>\/?]*$/.test(value);
var style = 'font-style: ' + (italic?'italic':'normal') + '; ';
// 判定是否需要缩放
var length = this.strlen(value) || 1;
style += 'font-size: ' + Math.min(1, 7/length) + 'em; ';
if (core.isset(css)) style += css;
core.statusBar[name].innerHTML = "<span style='" + style + "'>" + value + "</span>";
}
utils.prototype.strlen = function (str) {
var count = 0;
for (var i = 0, len = str.length; i < len; i++) {
count += str.charCodeAt(i) < 256 ? 1 : 2;
}
return count;
};
////// Base64加密 //////
utils.prototype.encodeBase64 = function (str) {
return btoa(encodeURIComponent(str).replace(/%([0-9A-F]{2})/g, function (match, p1) {

75
project/functions.js
View File

@ -946,18 +946,14 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
}
// 设置楼层名
core.events.setFloorName();
if (core.status.floorId) {
core.setStatusBarInnerHTML('floor', core.status.maps[core.status.floorId].name);
}
// 设置勇士名字和图标
core.statusBar.name.innerHTML = core.getStatus('name');
core.setStatusBarInnerHTML('name', core.getStatus('name'));
// 设置等级名称
var lvName = core.getLvName();
core.statusBar.lv.innerHTML = lvName;
// 检测是不是纯数字；如果带中文等需要取消斜体（不然很难看的！）
if (/^[+-]?\d+$/.test(lvName))
core.statusBar.lv.style.fontStyle = 'italic';
else core.statusBar.lv.style.fontStyle = 'normal';
core.setStatusBarInnerHTML('lv', core.getLvName());
// 设置生命上限、生命值、攻防魔防金币和经验值
var statusList = ['hpmax', 'hp', 'mana', 'atk', 'def', 'mdef', 'money', 'experience'];
@ -965,24 +961,24 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
// 向下取整
if (core.isset(core.status.hero[item]))
core.status.hero[item] = Math.floor(core.status.hero[item]);
// 大数据格式化；
core.statusBar[item].innerHTML = core.formatBigNumber(core.getRealStatus(item));
// 大数据格式化
core.setStatusBarInnerHTML(item, core.getRealStatus(item));
});
// 设置魔力值
if (core.flags.enableMana) {
// 也可以使用flag:manaMax来表示最大魔力值；详见文档-个性化-技能塔的支持
// core.status.hero.mana = Math.max(core.status.hero.mana, core.getFlag('manaMax', 10));
// core.statusBar.mana.innerHTML = core.status.hero.mana + "/" + core.getFlag('manaMax', 10);
// core.setStatusBarInnerHTML('mana', core.status.hero.mana + "/" + core.getFlag('manaMax', 10));
}
// 设置技能栏
if (core.flags.enableSkill) {
// 可以用flag:skill表示当前开启的技能类型，flag:skillName显示技能名；详见文档-个性化-技能塔的支持
core.statusBar.skill.innerHTML = core.getFlag('skillName', '无');
core.setStatusBarInnerHTML('skill', core.getFlag('skillName', '无'));
}
// 可以在这里添加自己额外的状态栏信息，比如想攻击显示 +0.5 可以这么写：
// if (core.hasFlag('halfAtk')) core.statusBar.atk.innerHTML += "+0.5";
// if (core.hasFlag('halfAtk')) core.setStatusBarInnerHTML('atk', core.statusBar.atk.innerText + "+0.5");
// 如果是自定义添加的状态栏，也需要在这里进行设置显示的数值
@ -990,32 +986,32 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
if (core.flags.enableLevelUp && core.status.hero.lv < core.firstData.levelUp.length) {
var need = core.calValue(core.firstData.levelUp[core.status.hero.lv].need);
if (core.flags.levelUpLeftMode)
core.statusBar.up.innerHTML = core.formatBigNumber(need - core.getStatus('experience')) || " ";
core.setStatusBarInnerHTML('up', core.formatBigNumber(need - core.getStatus('experience')) || "");
else
core.statusBar.up.innerHTML = core.formatBigNumber(need) || " ";
} else core.statusBar.up.innerHTML = " ";
core.setStatusBarInnerHTML('up', core.formatBigNumber(need) || "");
} else core.setStatusBarInnerHTML('up', "");
// 钥匙
var keys = ['yellowKey', 'blueKey', 'redKey'];
keys.forEach(function (key) {
core.statusBar[key].innerHTML = core.setTwoDigits(core.status.hero.items.keys[key]);
core.setStatusBarInnerHTML(key, core.setTwoDigits(core.itemCount(key)));
});
// 毒衰咒
if (core.flags.enableDebuff) {
core.statusBar.poison.innerHTML = core.hasFlag('poison') ? "毒" : "";
core.statusBar.weak.innerHTML = core.hasFlag('weak') ? "衰" : "";
core.statusBar.curse.innerHTML = core.hasFlag('curse') ? "咒" : "";
core.setStatusBarInnerHTML('poison', core.hasFlag('poison') ? "毒" : "");
core.setStatusBarInnerHTML('weak', core.hasFlag('weak') ? "衰" : "");
core.setStatusBarInnerHTML('curse', core.hasFlag('curse') ? "咒" : "");
}
// 破炸飞
if (core.flags.enablePZF) {
core.statusBar.pickaxe.innerHTML = "破" + core.itemCount('pickaxe');
core.statusBar.bomb.innerHTML = "炸" + core.itemCount('bomb');
core.statusBar.fly.innerHTML = "飞" + core.itemCount('centerFly');
core.setStatusBarInnerHTML('pickaxe', "破" + core.itemCount('pickaxe'));
core.setStatusBarInnerHTML('bomb', "炸" + core.itemCount('bomb'));
core.setStatusBarInnerHTML('fly', "飞" + core.itemCount('centerFly'));
}
// 难度
core.statusBar.hard.innerHTML = core.status.hard;
// 状态栏绘制
// 自定义状态栏绘制
core.drawStatusBar();
// 更新阻激夹域的伤害值
@ -1195,30 +1191,37 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
},
"ui": {
"drawStatusBar": function () {
// 自定义绘制状态栏，需要开启状态栏canvas化
// 如果是非状态栏canvas化，直接返回
if (!core.flags.statusCanvas) return;
var canvas = core.dom.statusCanvas, ctx = canvas.getContext('2d');
var canvas = core.dom.statusCanvas,
ctx = canvas.getContext('2d');
// 清空状态栏
ctx.clearRect(0, 0, canvas.width, canvas.height);
// 如果是隐藏状态栏模式，直接返回
if (!core.domStyle.showStatusBar) return;
// 作为样板，只绘制楼层、生命、攻击、防御、魔防、金币、钥匙这七个内容
// 需要其他的请自行进行修改；横竖屏都需要进行适配绘制。
// （可以使用Chrome浏览器开控制台来模拟手机上的竖屏模式的显示效果，具体方式自行百度）
// 横屏模式下的画布大小是 129*416
// 竖屏模式下的画布大小是 416*(32*rows+9) 其中rows为状态栏行数，即全塔属性中statusCanvasRowsOnMobile值
// 可以使用 core.domStyle.isVertical 来判定当前是否是竖屏模式
ctx.fillStyle = core.status.globalAttribute.statusBarColor || core.initStatus.globalAttribute.statusBarColor;
ctx.font = 'italic bold 18px Verdana';
// 距离左侧边框6像素，上侧边框9像素，行距约为39像素
var leftOffset = 6, topOffset = 9, lineHeight = 39;
var leftOffset = 6,
topOffset = 9,
lineHeight = 39;
if (core.domStyle.isVertical) { // 竖屏模式，行高32像素
leftOffset = 6; topOffset = 6; lineHeight = 32;
leftOffset = 6;
topOffset = 6;
lineHeight = 32;
}
var toDraw = ["floor", "hp", "atk", "def", "mdef", "money"];
for (var index = 0; index < toDraw.length; index++) {
// 绘制下一个数据
@ -1226,9 +1229,10 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
// 图片大小25x25
ctx.drawImage(core.statusBar.icons[name], leftOffset, topOffset, 25, 25);
// 文字内容
var text = (core.statusBar[name]||{}).innerText || " ";
var text = (core.statusBar[name] || {}).innerText || " ";
// 斜体判定：如果不是纯数字和字母，斜体会非常难看，需要取消
if (!/^[-+_.a-zA-Z0-9]*$/.test(text)) ctx.font = 'bold 18px Verdana';
if (!/^[-a-zA-Z0-9`~!@#$%^&*()_=+\[{\]}\\|;:'",<.>\/?]*$/.test(text))
ctx.font = 'bold 18px Verdana';
// 绘制文字
ctx.fillText(text, leftOffset + 36, topOffset + 20);
ctx.font = 'italic bold 18px Verdana';
@ -1240,8 +1244,7 @@ var functions_d6ad677b_427a_4623_b50f_a445a3b0ef8a =
leftOffset = 6;
topOffset += lineHeight;
}
}
else {
} else {
// 横屏模式
topOffset += lineHeight;
}