可以使用自己的图片素材作为背景
This commit is contained in:
ckcz123
parent
8979c1ddcf
commit
334e215009
62
libs/core.js
62
libs/core.js
@ -7,6 +7,7 @@ function core() {
|
||||
this.statusBar = {};
|
||||
this.canvas = {};
|
||||
this.images = [];
|
||||
this.pngs = [];
|
||||
this.bgms = [];
|
||||
this.sounds = [];
|
||||
this.floorIds = [];
|
||||
@ -105,11 +106,12 @@ function core() {
|
||||
/////////// 系统事件相关 ///////////
|
||||
|
||||
////// 初始化 //////
|
||||
core.prototype.init = function (dom, statusBar, canvas, images, bgms, sounds, floorIds, floors, coreData) {
|
||||
core.prototype.init = function (dom, statusBar, canvas, images, pngs, bgms, sounds, floorIds, floors, coreData) {
|
||||
core.dom = dom;
|
||||
core.statusBar = statusBar;
|
||||
core.canvas = canvas;
|
||||
core.images = images;
|
||||
core.pngs = pngs;
|
||||
core.bgms = bgms;
|
||||
core.sounds = sounds;
|
||||
core.floorIds = floorIds;
|
||||
@ -138,8 +140,6 @@ core.prototype.init = function (dom, statusBar, canvas, images, bgms, sounds, fl
|
||||
core.material.icons = core.icons.getIcons();
|
||||
core.material.events = core.events.getEvents();
|
||||
|
||||
|
||||
|
||||
if (location.protocol.indexOf("http")==0) {
|
||||
window.AudioContext = window.AudioContext || window.webkitAudioContext || window.mozAudioContext || window.msAudioContext;
|
||||
try {
|
||||
@ -259,18 +259,29 @@ core.prototype.loader = function (callback) {
|
||||
core.setStartLoadTipText(imgName + ' 加载完毕...');
|
||||
core.setStartProgressVal(loadedImageNum * (100 / allImageNum));
|
||||
if (loadedImageNum == allImageNum) {
|
||||
|
||||
// 加载Autotile
|
||||
core.material.images.autotile={};
|
||||
var autotileIds = Object.keys(core.material.icons.autotile);
|
||||
for (var x=0;x<autotileIds.length;x++) {
|
||||
core.loadImage(autotileIds[x], function (autotileId, image) {
|
||||
core.material.images.autotile[autotileId]=image;
|
||||
if (Object.keys(core.material.images.autotile).length==autotileIds.length) {
|
||||
// 音频
|
||||
core.loadMusic(callback);
|
||||
|
||||
// 加载pngs
|
||||
core.material.images.pngs = {};
|
||||
for (var x=0;x<core.pngs.length;x++) {
|
||||
core.loadImage(core.pngs[x], function (pngId, image) {
|
||||
core.material.images.pngs[pngId] = image;
|
||||
if (Object.keys(core.material.images.pngs).length==core.pngs.length) {
|
||||
|
||||
// 加载Autotile
|
||||
core.material.images.autotile={};
|
||||
var autotileIds = Object.keys(core.material.icons.autotile);
|
||||
for (var x=0;x<autotileIds.length;x++) {
|
||||
core.loadImage(autotileIds[x], function (autotileId, image) {
|
||||
core.material.images.autotile[autotileId]=image;
|
||||
if (Object.keys(core.material.images.autotile).length==autotileIds.length) {
|
||||
|
||||
// 最后加载音频
|
||||
core.loadMusic(callback);
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
@ -281,8 +292,11 @@ core.prototype.loader = function (callback) {
|
||||
core.prototype.loadImage = function (imgName, callback) {
|
||||
try {
|
||||
core.setStartLoadTipText('加载图片 ' + imgName + ' 中...');
|
||||
var name=imgName;
|
||||
if (name.indexOf(".png")<0) // 不包含"png"
|
||||
name=name+".png";
|
||||
var image = new Image();
|
||||
image.src = 'images/' + imgName + '.png';
|
||||
image.src = 'images/' + name;
|
||||
if (image.complete) {
|
||||
callback(imgName, image);
|
||||
return;
|
||||
@ -1999,6 +2013,14 @@ core.prototype.drawMap = function (mapName, callback) {
|
||||
core.canvas.bg.drawImage(blockImage, 0, blockIcon * 32, 32, 32, x * 32, y * 32, 32, 32);
|
||||
}
|
||||
}
|
||||
// 如果存在png
|
||||
if (core.isset(core.floors[mapName].png)) {
|
||||
var png = core.floors[mapName].png;
|
||||
if (core.isset(core.material.images.pngs[png])) {
|
||||
core.canvas.bg.drawImage(core.material.images.pngs[png], 0, 0, 416, 416);
|
||||
}
|
||||
}
|
||||
|
||||
var autotileMaps = [];
|
||||
for (var b = 0; b < mapBlocks.length; b++) {
|
||||
// 事件启用
|
||||
@ -2010,10 +2032,12 @@ core.prototype.drawMap = function (mapName, callback) {
|
||||
continue;
|
||||
}
|
||||
else {
|
||||
blockIcon = core.material.icons[block.event.cls][block.event.id];
|
||||
blockImage = core.material.images[block.event.cls];
|
||||
core.canvas.event.drawImage(core.material.images[block.event.cls], 0, blockIcon * 32, 32, 32, block.x * 32, block.y * 32, 32, 32);
|
||||
core.addGlobalAnimate(block.event.animate, block.x * 32, block.y * 32, blockIcon, blockImage);
|
||||
if (block.event.id!='none') {
|
||||
blockIcon = core.material.icons[block.event.cls][block.event.id];
|
||||
blockImage = core.material.images[block.event.cls];
|
||||
core.canvas.event.drawImage(core.material.images[block.event.cls], 0, blockIcon * 32, 32, 32, block.x * 32, block.y * 32, 32, 32);
|
||||
core.addGlobalAnimate(block.event.animate, block.x * 32, block.y * 32, blockIcon, blockImage);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -8,6 +8,7 @@ main.floors.MT0 = {
|
||||
"canFlyTo": true, // 该楼能否被楼传器飞到（不能的话在该楼也不允许使用楼传器）
|
||||
"canUseQuickShop": true, // 该层是否允许使用快捷商店
|
||||
"defaultGround": "ground", // 默认地面的图块ID（terrains中）
|
||||
// "png": "bg.png", // 背景图；你可以选择一张png图片来作为背景素材。详细用法请参见文档“自定义素材”中的说明。
|
||||
// "color": [0,0,0,0.3], // 该层的默认画面色调。本项可不写（代表无色调），如果写需要是一个RGBA数组。
|
||||
// "bgm": "bgm.mp3", // 到达该层后默认播放的BGM。本项可忽略。
|
||||
"map": [ // 地图数据，需要是13x13，建议使用地图生成器来生成
|
||||
|
||||
@ -8,6 +8,7 @@ main.floors.sample0 = {
|
||||
"canFlyTo": true, // 该楼能否被楼传器飞到（不能的话在该楼也不允许使用楼传器）
|
||||
"canUseQuickShop": true, // 该层是否允许使用快捷商店
|
||||
"defaultGround": "ground", // 默认地面的图块ID（terrains中）
|
||||
// "png": "bg.png", // 背景图；你可以选择一张png图片来作为背景素材。详细用法请参见文档“自定义素材”中的说明。
|
||||
// "color": [0,0,0,0.3] // 该层的默认画面色调。本项可不写（代表无色调），如果写需要是一个RGBA数组。
|
||||
"bgm": "bgm.mp3", // 到达该层后默认播放的BGM。本项可忽略。
|
||||
"map": [ // 地图数据，需要是13x13，建议使用地图生成器来生成
|
||||
|
||||
@ -8,6 +8,7 @@ main.floors.sample1 = {
|
||||
"canFlyTo": true, // 该楼能否被楼传器飞到（不能的话在该楼也不允许使用楼传器）
|
||||
"canUseQuickShop": true, // 该层是否允许使用快捷商店
|
||||
"defaultGround": "grass", // 默认地面的图块ID（terrains中）
|
||||
"png": "bg.png", // 背景图；你可以选择一张png图片来作为背景素材。详细用法请参见文档“自定义素材”中的说明。
|
||||
// "color": [0,0,0,0.3] // 该层的默认画面色调。本项可不写（代表无色调），如果写需要是一个RGBA数组。
|
||||
// "bgm": "bgm.mp3", // 到达该层后默认播放的BGM。本项可忽略。
|
||||
"map": [ // 地图数据，需要是13x13，建议使用地图生成器来生成
|
||||
|
||||
@ -8,6 +8,7 @@ main.floors.sample2 = {
|
||||
"canFlyTo": false, // 该楼能否被楼传器飞到（不能的话在该楼也不允许使用楼传器）
|
||||
"canUseQuickShop": true, // 该层是否允许使用快捷商店
|
||||
"defaultGround": "snowGround", // 默认地面的图块ID（terrains中）
|
||||
// "png": "bg.png", // 背景图；你可以选择一张png图片来作为背景素材。详细用法请参见文档“自定义素材”中的说明。
|
||||
"color": [255,0,0,0.3], // 该层的默认画面色调。本项可不写（代表无色调），如果写需要是一个RGBA数组。
|
||||
"bgm": "qianjin.mid", // 到达该层后默认播放的BGM。本项可忽略。
|
||||
"map": [ // 地图数据，需要是13x13，建议使用地图生成器来生成
|
||||
|
||||
12
libs/maps.js
12
libs/maps.js
@ -14,7 +14,7 @@ maps.prototype.loadFloor = function (floorId, map) {
|
||||
for (var i = 0; i < 13; i++) {
|
||||
for (var j = 0; j < 13; j++) {
|
||||
var block = this.getBlock(j, i, map[i][j]);
|
||||
if (block.event != undefined) {
|
||||
if (core.isset(block.event)) {
|
||||
if (block.event.cls == 'enemys' && block.event.trigger==undefined) {
|
||||
block.event.trigger = 'battle';
|
||||
}
|
||||
@ -35,7 +35,7 @@ maps.prototype.loadFloor = function (floorId, map) {
|
||||
}
|
||||
}
|
||||
}
|
||||
this.addEvent(block,j,i,floor.events[j+","+i],floor.defaultGround || "ground")
|
||||
this.addEvent(block,j,i,floor.events[j+","+i])
|
||||
this.addChangeFloor(block,j,i,floor.changeFloor[j+","+i]);
|
||||
if (core.isset(block.event)) blocks.push(block);
|
||||
}
|
||||
@ -258,10 +258,10 @@ maps.prototype.getBlock = function (x, y, id) {
|
||||
}
|
||||
|
||||
////// 向该楼层添加剧本的自定义事件 //////
|
||||
maps.prototype.addEvent = function (block, x, y, event, ground) {
|
||||
maps.prototype.addEvent = function (block, x, y, event) {
|
||||
if (!core.isset(event)) return;
|
||||
if (!core.isset(block.event)) { // 本身是空地？
|
||||
block.event = {'cls': 'terrains', 'id': ground, 'noPass': false};
|
||||
block.event = {'cls': 'terrains', 'id': 'none', 'noPass': false};
|
||||
}
|
||||
// event是字符串或数组？
|
||||
if (typeof event == "string") {
|
||||
@ -273,6 +273,10 @@ maps.prototype.addEvent = function (block, x, y, event, ground) {
|
||||
if (!core.isset(event.data))
|
||||
event.data = [];
|
||||
|
||||
// 覆盖noPass
|
||||
if (core.isset(event.noPass))
|
||||
block.event.noPass = event.noPass;
|
||||
|
||||
// 覆盖enable
|
||||
if (!core.isset(block.enable) && core.isset(event.enable)) {
|
||||
block.enable=event.enable;
|
||||
|
||||
17
libs/ui.js
17
libs/ui.js
@ -1083,6 +1083,15 @@ ui.prototype.drawThumbnail = function(floorId, canvas, blocks, x, y, size, heroL
|
||||
core.canvas[canvas].drawImage(blockImage, 0, blockIcon * 32, 32, 32, x + i * persize, y + j * persize, persize, persize);
|
||||
}
|
||||
}
|
||||
|
||||
// 如果存在png
|
||||
if (core.isset(core.floors[floorId].png)) {
|
||||
var png = core.floors[floorId].png;
|
||||
if (core.isset(core.material.images.pngs[png])) {
|
||||
core.canvas[canvas].drawImage(core.material.images.pngs[png], x, y, size, size);
|
||||
}
|
||||
}
|
||||
|
||||
var autotileMaps = [];
|
||||
for (var b in blocks) {
|
||||
var block = blocks[b];
|
||||
@ -1093,9 +1102,11 @@ ui.prototype.drawThumbnail = function(floorId, canvas, blocks, x, y, size, heroL
|
||||
continue;
|
||||
}
|
||||
else {
|
||||
var blockIcon = core.material.icons[block.event.cls][block.event.id];
|
||||
var blockImage = core.material.images[block.event.cls];
|
||||
core.canvas[canvas].drawImage(blockImage, 0, blockIcon * 32, 32, 32, x + block.x * persize, y + block.y * persize, persize, persize);
|
||||
if (block.event.id!='none') {
|
||||
var blockIcon = core.material.icons[block.event.cls][block.event.id];
|
||||
var blockImage = core.material.images[block.event.cls];
|
||||
core.canvas[canvas].drawImage(blockImage, 0, blockIcon * 32, 32, 32, x + block.x * persize, y + block.y * persize, persize, persize);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
54
main.js
54
main.js
@ -1,4 +1,33 @@
|
||||
function main() {
|
||||
|
||||
//------------------------ 用户修改内容 ------------------------//
|
||||
|
||||
this.version = "0.1"; // 游戏版本号；如果更改了游戏内容建议修改此version以免造成缓存问题。
|
||||
|
||||
this.useCompress = false; // 是否使用压缩文件
|
||||
// 当你即将发布你的塔时，请使用“JS代码压缩工具”将所有js代码进行压缩，然后将这里的useCompress改为true。
|
||||
// 请注意，只有useCompress是false时才会读取floors目录下的文件，为true时会直接读取libs目录下的floors.min.js文件。
|
||||
// 如果要进行剧本的修改请务必将其改成false。
|
||||
|
||||
this.floorIds = [ // 在这里按顺序放所有的楼层；其顺序直接影响到楼层传送器的顺序和上楼器/下楼器的顺序
|
||||
"sample0", "sample1", "sample2"
|
||||
];
|
||||
this.pngs = [ // 在此存放所有可能的背景图片；背景图片最好是416*416像素，其他分辨率会被强制缩放成416*416
|
||||
// 建议对于较大的图片，在网上使用在线的“图片压缩工具”来进行压缩，以节省流量
|
||||
// 有关使用自定义背景图，请参见文档的“自定义素材”说明
|
||||
"bg.png", // "yewai.png",
|
||||
];
|
||||
this.bgms = [ // 在此存放所有的bgm，和文件名一致。第一项为默认播放项
|
||||
// 音频名不能使用中文，不能带空格或特殊字符；可以直接改名拼音就好
|
||||
'058-Slow01.mid', 'bgm.mp3', 'qianjin.mid', 'star.mid',
|
||||
];
|
||||
this.sounds = [ // 在此存放所有的SE，和文件名一致
|
||||
// 音频名不能使用中文，不能带空格或特殊字符；可以直接改名拼音就好
|
||||
'floor.mp3', 'attack.ogg', 'door.ogg', 'item.ogg',
|
||||
];
|
||||
|
||||
//------------------------ 用户修改内容 END ------------------------//
|
||||
|
||||
this.dom = {
|
||||
'body': document.body,
|
||||
'gameGroup': document.getElementById('gameGroup'),
|
||||
@ -46,14 +75,7 @@ function main() {
|
||||
this.images = [
|
||||
'animates', 'enemys', 'hero', 'items', 'npcs', 'terrains'
|
||||
];
|
||||
this.bgms = [ // 在此存放所有的bgm，和文件名一致。第一项为默认播放项
|
||||
// 音频名不能使用中文，不能带空格或特殊字符；可以直接改名拼音就好
|
||||
'058-Slow01.mid', 'bgm.mp3', 'qianjin.mid', 'star.mid'
|
||||
];
|
||||
this.sounds = [ // 在此存放所有的SE，和文件名一致
|
||||
// 音频名不能使用中文，不能带空格或特殊字符；可以直接改名拼音就好
|
||||
'floor.mp3', 'attack.ogg', 'door.ogg', 'item.ogg'
|
||||
]
|
||||
|
||||
this.statusBar = {
|
||||
'image': {
|
||||
'floor': document.getElementById('img-floor'),
|
||||
@ -90,20 +112,6 @@ function main() {
|
||||
'curse': document.getElementById('curse'),
|
||||
'hard': document.getElementById("hard")
|
||||
}
|
||||
|
||||
//------------------------ 用户修改内容 ------------------------//
|
||||
this.version = "0.1"; // 游戏版本号；如果更改了游戏内容建议修改此version以免造成缓存问题。
|
||||
|
||||
this.useCompress = false; // 是否使用压缩文件
|
||||
// 当你即将发布你的塔时，请使用“JS代码压缩工具”将所有js代码进行压缩，然后将这里的useCompress改为true。
|
||||
// 请注意，只有useCompress是false时才会读取floors目录下的文件，为true时会直接读取libs目录下的floors.min.js文件。
|
||||
// 如果要进行剧本的修改请务必将其改成false。
|
||||
|
||||
this.floorIds = [ // 在这里按顺序放所有的楼层；其顺序直接影响到楼层传送器的顺序和上楼器/下楼器的顺序
|
||||
"sample0", "sample1", "sample2"
|
||||
]
|
||||
//------------------------ 用户修改内容 END ------------------------//
|
||||
|
||||
this.floors = {}
|
||||
this.instance = {};
|
||||
this.canvas = {};
|
||||
@ -122,7 +130,7 @@ main.prototype.init = function () {
|
||||
coreData[name] = main[name];
|
||||
}
|
||||
main.loaderFloors(function() {
|
||||
main.core.init(main.dom, main.statusBar, main.canvas, main.images, main.bgms, main.sounds, main.floorIds, main.floors, coreData);
|
||||
main.core.init(main.dom, main.statusBar, main.canvas, main.images, main.pngs, main.bgms, main.sounds, main.floorIds, main.floors, coreData);
|
||||
main.core.resize(main.dom.body.clientWidth, main.dom.body.clientHeight);
|
||||
})
|
||||
});
|
||||
|
||||
Loading…
Reference in New Issue
Block a user