合并loader加载过程
This commit is contained in:
ckcz123
parent
a8c6b3fab3
commit
a4e3bd904f
311
libs/loader.js
311
libs/loader.js
@ -25,22 +25,90 @@ loader.prototype._setStartLoadTipText = function (text) {
|
||||
}
|
||||
|
||||
loader.prototype._load = function (callback) {
|
||||
this._loadIcons();
|
||||
this._loadAnimates();
|
||||
this._loadMusic();
|
||||
if (main.useCompress) {
|
||||
this._load_async(callback);
|
||||
} else {
|
||||
this._load_sync(callback);
|
||||
}
|
||||
}
|
||||
|
||||
core.loader._loadMaterialImages(function () {
|
||||
core.loader._loadExtraImages(function () {
|
||||
core.loader._loadAutotiles(function () {
|
||||
core.loader._loadTilesets(callback);
|
||||
loader.prototype._load_sync = function (callback) {
|
||||
this._loadAnimates_sync();
|
||||
this._loadMusic_sync();
|
||||
core.loader._loadMaterials_sync(function () {
|
||||
core.loader._loadExtraImages_sync(function () {
|
||||
core.loader._loadAutotiles_sync(function () {
|
||||
core.loader._loadTilesets_sync(callback);
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadIcons = function () {
|
||||
this.loadImage("materials", "icons.png", function (id, image) {
|
||||
var images = core.splitImage(image);
|
||||
loader.prototype._load_async = function (callback) {
|
||||
core.loader._setStartLoadTipText('正在加载资源文件...');
|
||||
var all = {};
|
||||
|
||||
var _makeOnProgress = function (name) {
|
||||
if (!all[name]) all[name] = {loaded: 0, total: 0, finished: false};
|
||||
return function (loaded, total) {
|
||||
all[name].loaded = loaded;
|
||||
all[name].total = total;
|
||||
var allLoaded = 0, allTotal = 0;
|
||||
for (var one in all) {
|
||||
allLoaded += all[one].loaded;
|
||||
allTotal += all[one].total;
|
||||
}
|
||||
if (allTotal > 0) {
|
||||
if (allLoaded == allTotal) {
|
||||
core.loader._setStartLoadTipText("正在处理资源文件... 请稍后...");
|
||||
} else {
|
||||
core.loader._setStartLoadTipText('正在加载资源文件... ' +
|
||||
core.formatSize(allLoaded) + " / " + core.formatSize(allTotal) +
|
||||
" (" + (allLoaded / allTotal * 100).toFixed(2) + "%)");
|
||||
}
|
||||
core.loader._setStartProgressVal(allLoaded / allTotal * 100);
|
||||
}
|
||||
};
|
||||
}
|
||||
var _makeOnFinished = function (name) {
|
||||
return function () {
|
||||
setTimeout(function () {
|
||||
all[name].finished = true;
|
||||
for (var one in all) {
|
||||
if (!all[one].finished) return;
|
||||
}
|
||||
callback();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
this._loadAnimates_async(_makeOnProgress('animates'), _makeOnFinished('animates'));
|
||||
this._loadMusic_async(_makeOnProgress('sounds'), _makeOnFinished('sounds'));
|
||||
this._loadMaterials_async(_makeOnProgress('materials'), _makeOnFinished('materials'));
|
||||
this._loadExtraImages_async(_makeOnProgress('images'), _makeOnFinished('images'));
|
||||
this._loadAutotiles_async(_makeOnProgress('autotiles'), _makeOnFinished('autotiles'));
|
||||
this._loadTilesets_async(_makeOnProgress('tilesets'), _makeOnFinished('tilesets'));
|
||||
}
|
||||
|
||||
// ----- 加载资源文件 ------ //
|
||||
|
||||
loader.prototype._loadMaterials_sync = function (callback) {
|
||||
this._setStartLoadTipText("正在加载资源文件...");
|
||||
this.loadImages("materials", core.materials, core.material.images, function () {
|
||||
core.loader._loadMaterials_afterLoad();
|
||||
callback();
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadMaterials_async = function (onprogress, onfinished) {
|
||||
this.loadImagesFromZip('project/materials/materials.h5data', core.materials, core.material.images, onprogress, function () {
|
||||
core.loader._loadMaterials_afterLoad();
|
||||
onfinished();
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadMaterials_afterLoad = function () {
|
||||
var images = core.splitImage(core.material.images['icons']);
|
||||
for (var key in core.statusBar.icons) {
|
||||
if (typeof core.statusBar.icons[key] == 'number') {
|
||||
core.statusBar.icons[key] = images[core.statusBar.icons[key]];
|
||||
@ -48,25 +116,20 @@ loader.prototype._loadIcons = function () {
|
||||
core.statusBar.image[key].src = core.statusBar.icons[key].src;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadMaterialImages = function (callback) {
|
||||
this._setStartLoadTipText("正在加载资源文件...");
|
||||
if (main.useCompress) {
|
||||
this.loadImagesFromZip('project/materials/materials.h5data', core.materials, core.material.images, callback);
|
||||
} else {
|
||||
this.loadImages("materials", core.materials, core.material.images, callback);
|
||||
}
|
||||
}
|
||||
// ------ 加载使用的图片 ------ //
|
||||
|
||||
loader.prototype._loadExtraImages = function (callback) {
|
||||
loader.prototype._loadExtraImages_sync = function (callback) {
|
||||
core.material.images.images = {};
|
||||
|
||||
var images = core.clone(core.images);
|
||||
|
||||
this._setStartLoadTipText("正在加载图片文件...");
|
||||
if (main.useCompress) {
|
||||
core.loadImages("images", core.images, core.material.images.images, callback);
|
||||
}
|
||||
|
||||
loader.prototype._loadExtraImages_async = function (onprogress, onfinished) {
|
||||
core.material.images.images = {};
|
||||
var images = core.images;
|
||||
|
||||
// Check .gif
|
||||
var gifs = images.filter(function (name) {
|
||||
return name.toLowerCase().endsWith('.gif');
|
||||
@ -75,7 +138,8 @@ loader.prototype._loadExtraImages = function (callback) {
|
||||
return !name.toLowerCase().endsWith('.gif');
|
||||
});
|
||||
|
||||
this.loadImagesFromZip('project/images/images.h5data', images, core.material.images.images, callback);
|
||||
this.loadImagesFromZip('project/images/images.h5data', images, core.material.images.images, onprogress, onfinished);
|
||||
// gif没有被压缩在zip中，延迟加载...
|
||||
gifs.forEach(function (gif) {
|
||||
this.loadImage("images", gif, function (id, image) {
|
||||
if (image != null) {
|
||||
@ -83,16 +147,35 @@ loader.prototype._loadExtraImages = function (callback) {
|
||||
}
|
||||
});
|
||||
}, this);
|
||||
} else {
|
||||
this.loadImages("images", images, core.material.images.images, callback);
|
||||
}
|
||||
}
|
||||
|
||||
loader.prototype._loadAutotiles = function (callback) {
|
||||
// ------ 加载自动元件 ------ //
|
||||
|
||||
loader.prototype._loadAutotiles_sync = function (callback) {
|
||||
core.material.images.autotile = {};
|
||||
var keys = Object.keys(core.material.icons.autotile);
|
||||
var autotiles = {};
|
||||
var _callback = function () {
|
||||
|
||||
this._setStartLoadTipText("正在加载自动元件...");
|
||||
this.loadImages("autotiles", keys, autotiles, function () {
|
||||
core.loader._loadAutotiles_afterLoad(keys, autotiles);
|
||||
callback();
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadAutotiles_async = function (onprogress, onfinished) {
|
||||
core.material.images.autotile = {};
|
||||
var keys = Object.keys(core.material.icons.autotile);
|
||||
var autotiles = {};
|
||||
|
||||
this.loadImagesFromZip('project/autotiles/autotiles.h5data', keys, autotiles, onprogress, function () {
|
||||
core.loader._loadAutotiles_afterLoad(keys, autotiles);
|
||||
onfinished();
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadAutotiles_afterLoad = function (keys, autotiles) {
|
||||
// autotile需要保证顺序
|
||||
keys.forEach(function (v) {
|
||||
core.material.images.autotile[v] = autotiles[v];
|
||||
});
|
||||
@ -100,21 +183,28 @@ loader.prototype._loadAutotiles = function (callback) {
|
||||
setTimeout(function () {
|
||||
core.maps._makeAutotileEdges();
|
||||
});
|
||||
|
||||
callback();
|
||||
}
|
||||
this._setStartLoadTipText("正在加载自动元件...");
|
||||
if (main.useCompress) {
|
||||
this.loadImagesFromZip('project/autotiles/autotiles.h5data', keys, autotiles, _callback);
|
||||
} else {
|
||||
this.loadImages("autotiles", keys, autotiles, _callback);
|
||||
}
|
||||
}
|
||||
|
||||
loader.prototype._loadTilesets = function (callback) {
|
||||
// ------ 加载额外素材 ------ //
|
||||
|
||||
loader.prototype._loadTilesets_sync = function (callback) {
|
||||
core.material.images.tilesets = {};
|
||||
core.tilesets = core.tilesets || [];
|
||||
var _callback = function () {
|
||||
this._setStartLoadTipText("正在加载额外素材...");
|
||||
this.loadImages("tilesets", core.tilesets, core.material.images.tilesets, function () {
|
||||
core.loader._loadTilesets_afterLoad();
|
||||
callback();
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadTilesets_async = function (onprogress, onfinished) {
|
||||
core.material.images.tilesets = {};
|
||||
this.loadImagesFromZip('project/tilesets/tilesets.h5data', core.tilesets, core.material.images.tilesets, onprogress, function () {
|
||||
core.loader._loadTilesets_afterLoad();
|
||||
onfinished();
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadTilesets_afterLoad = function () {
|
||||
// 检查宽高是32倍数，如果出错在控制台报错
|
||||
for (var imgName in core.material.images.tilesets) {
|
||||
var img = core.material.images.tilesets[imgName];
|
||||
@ -125,16 +215,10 @@ loader.prototype._loadTilesets = function (callback) {
|
||||
console.warn("警告！" + imgName + "上的图块素材个数大于3000！");
|
||||
}
|
||||
}
|
||||
callback();
|
||||
}
|
||||
this._setStartLoadTipText("正在加载额外素材...");
|
||||
if (main.useCompress) {
|
||||
this.loadImagesFromZip('project/tilesets/tilesets.h5data', core.tilesets, core.material.images.tilesets, _callback);
|
||||
} else {
|
||||
this.loadImages("tilesets", core.tilesets, core.material.images.tilesets, _callback);
|
||||
}
|
||||
}
|
||||
|
||||
// ------ 实际加载一系列图片 ------ //
|
||||
|
||||
loader.prototype.loadImages = function (dir, names, toSave, callback) {
|
||||
if (!names || names.length == 0) {
|
||||
if (callback) callback();
|
||||
@ -159,37 +243,6 @@ loader.prototype.loadImages = function (dir, names, toSave, callback) {
|
||||
}
|
||||
}
|
||||
|
||||
loader.prototype.loadImagesFromZip = function (url, names, toSave, callback) {
|
||||
if (!names || names.length == 0) {
|
||||
if (callback) callback();
|
||||
return;
|
||||
}
|
||||
|
||||
core.unzip(url + "?v=" + main.version, function (data) {
|
||||
var cnt = 1;
|
||||
names.forEach(function (name) {
|
||||
var imgName = name;
|
||||
if (imgName.indexOf('.') < 0) imgName += '.png';
|
||||
if (imgName in data) {
|
||||
var img = new Image();
|
||||
var url = URL.createObjectURL(data[imgName]);
|
||||
cnt++;
|
||||
img.onload = function () {
|
||||
cnt--;
|
||||
URL.revokeObjectURL(url);
|
||||
if (cnt == 0 && callback) callback();
|
||||
}
|
||||
img.src = url;
|
||||
toSave[name] = img;
|
||||
}
|
||||
});
|
||||
cnt--;
|
||||
if (cnt == 0 && callback) callback();
|
||||
}, null, false, function (percentage) {
|
||||
core.loader._setStartProgressVal(percentage * 100);
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype.loadImage = function (dir, imgName, callback) {
|
||||
try {
|
||||
var name = imgName;
|
||||
@ -211,9 +264,53 @@ loader.prototype.loadImage = function (dir, imgName, callback) {
|
||||
}
|
||||
}
|
||||
|
||||
loader.prototype._loadAnimates = function () {
|
||||
// ------ 从zip中加载一系列图片 ------ //
|
||||
|
||||
loader.prototype.loadImagesFromZip = function (url, names, toSave, onprogress, onfinished) {
|
||||
if (!names || names.length == 0) {
|
||||
if (onfinished) onfinished();
|
||||
return;
|
||||
}
|
||||
|
||||
core.unzip(url + "?v=" + main.version, function (data) {
|
||||
var cnt = 1;
|
||||
names.forEach(function (name) {
|
||||
var imgName = name;
|
||||
if (imgName.indexOf('.') < 0) imgName += '.png';
|
||||
if (imgName in data) {
|
||||
var img = new Image();
|
||||
var url = URL.createObjectURL(data[imgName]);
|
||||
cnt++;
|
||||
img.onload = function () {
|
||||
cnt--;
|
||||
URL.revokeObjectURL(url);
|
||||
if (cnt == 0 && onfinished) onfinished();
|
||||
}
|
||||
img.src = url;
|
||||
toSave[name] = img;
|
||||
}
|
||||
});
|
||||
cnt--;
|
||||
if (cnt == 0 && onfinished) onfinished();
|
||||
}, null, false, onprogress);
|
||||
}
|
||||
|
||||
// ------ 加载动画文件 ------ //
|
||||
|
||||
loader.prototype._loadAnimates_sync = function () {
|
||||
this._setStartLoadTipText("正在加载动画文件...");
|
||||
if (main.useCompress) {
|
||||
|
||||
core.animates.forEach(function (t) {
|
||||
core.http('GET', 'project/animates/' + t + ".animate?v=" + main.version, null, function (content) {
|
||||
core.loader._loadAnimate(t, content);
|
||||
}, function (e) {
|
||||
main.log(e);
|
||||
core.material.animates[t] = null;
|
||||
}, "text/plain; charset=x-user-defined")
|
||||
});
|
||||
}
|
||||
|
||||
loader.prototype._loadAnimates_async = function (onprogress, onfinished) {
|
||||
core.unzip('project/animates/animates.h5data?v=' + main.version, function (animates) {
|
||||
for (var name in animates) {
|
||||
if (name.endsWith(".animate")) {
|
||||
@ -222,17 +319,8 @@ loader.prototype._loadAnimates = function () {
|
||||
core.loader._loadAnimate(t, animates[name]);
|
||||
}
|
||||
}
|
||||
}, null, true);
|
||||
} else {
|
||||
core.animates.forEach(function (t) {
|
||||
core.http('GET', 'project/animates/' + t + ".animate?v=" + main.version, null, function (content) {
|
||||
core.loader._loadAnimate(t, content);
|
||||
}, function (e) {
|
||||
main.log(e);
|
||||
core.material.animates[t] = null;
|
||||
}, "text/plain; charset=x-user-defined")
|
||||
})
|
||||
}
|
||||
onfinished();
|
||||
}, null, true, onprogress);
|
||||
}
|
||||
|
||||
loader.prototype._loadAnimate = function (name, content) {
|
||||
@ -283,26 +371,36 @@ loader.prototype._loadAnimate = function (name, content) {
|
||||
}
|
||||
}
|
||||
|
||||
////// 加载音频 //////
|
||||
loader.prototype._loadMusic = function () {
|
||||
// ------ 加载音乐和音效 ------ //
|
||||
|
||||
loader.prototype._loadMusic_sync = function () {
|
||||
this._setStartLoadTipText("正在加载音效文件...");
|
||||
core.bgms.forEach(function (t) {
|
||||
core.loader.loadOneMusic(t);
|
||||
});
|
||||
core.sounds.forEach(function (t) {
|
||||
core.loader.loadOneSound(t);
|
||||
});
|
||||
// 直接开始播放
|
||||
core.playBgm(main.startBgm);
|
||||
}
|
||||
|
||||
this._setStartLoadTipText("正在加载音效文件...");
|
||||
if (main.useCompress && core.musicStatus.audioContext) {
|
||||
loader.prototype._loadMusic_async = function (onprogress, onfinished) {
|
||||
core.bgms.forEach(function (t) {
|
||||
core.loader.loadOneMusic(t);
|
||||
});
|
||||
core.unzip('project/sounds/sounds.h5data?v=' + main.version, function (data) {
|
||||
// 延迟解析
|
||||
setTimeout(function () {
|
||||
for (var name in data) {
|
||||
if (core.sounds.indexOf(name) >= 0) {
|
||||
core.loader._loadOneSound_decodeData(name, data[name]);
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
core.sounds.forEach(function (t) {
|
||||
core.loader.loadOneSound(t);
|
||||
});
|
||||
}
|
||||
onfinished();
|
||||
}, null, false, onprogress);
|
||||
|
||||
// 直接开始播放
|
||||
core.playBgm(main.startBgm);
|
||||
}
|
||||
@ -317,7 +415,6 @@ loader.prototype.loadOneMusic = function (name) {
|
||||
}
|
||||
|
||||
loader.prototype.loadOneSound = function (name) {
|
||||
if (core.musicStatus.audioContext != null) {
|
||||
core.http('GET', 'project/sounds/' + name + "?v=" + main.version, null, function (data) {
|
||||
core.loader._loadOneSound_decodeData(name, data);
|
||||
}, function (e) {
|
||||
@ -325,12 +422,6 @@ loader.prototype.loadOneSound = function (name) {
|
||||
core.material.sounds[name] = null;
|
||||
}, null, 'arraybuffer');
|
||||
}
|
||||
else {
|
||||
var music = new Audio();
|
||||
music.src = 'project/sounds/' + name;
|
||||
core.material.sounds[name] = music;
|
||||
}
|
||||
}
|
||||
|
||||
loader.prototype._loadOneSound_decodeData = function (name, data) {
|
||||
if (data instanceof Blob) {
|
||||
|
||||
@ -392,6 +392,12 @@ utils.prototype.setTwoDigits = function (x) {
|
||||
return parseInt(x) < 10 ? "0" + x : x;
|
||||
}
|
||||
|
||||
utils.prototype.formatSize = function (size) {
|
||||
if (size < 1024) return size + 'B';
|
||||
else if (size < 1024 * 1024) return (size/1024).toFixed(2) + "KB";
|
||||
else return (size/1024/1024).toFixed(2) + "MB";
|
||||
}
|
||||
|
||||
utils.prototype.formatBigNumber = function (x, onMap) {
|
||||
x = Math.floor(parseFloat(x));
|
||||
if (!core.isset(x)) return '???';
|
||||
@ -1227,7 +1233,7 @@ utils.prototype.http = function (type, url, formData, success, error, mimeType,
|
||||
};
|
||||
xhr.onprogress = function (e) {
|
||||
if (e.lengthComputable) {
|
||||
if (onprogress) onprogress(e.loaded / e.total);
|
||||
if (onprogress) onprogress(e.loaded, e.total);
|
||||
}
|
||||
}
|
||||
xhr.onabort = function () {
|
||||
|
||||
2
main.js
2
main.js
@ -85,7 +85,7 @@ function main() {
|
||||
'data', 'enemys', 'icons', 'maps', 'items', 'functions', 'events', 'plugins'
|
||||
];
|
||||
this.materials = [
|
||||
'animates', 'enemys', 'items', 'npcs', 'terrains', 'enemy48', 'npc48'
|
||||
'animates', 'enemys', 'items', 'npcs', 'terrains', 'enemy48', 'npc48', 'icons'
|
||||
];
|
||||
|
||||
this.statusBar = {
|
||||
|
||||
@ -53,7 +53,7 @@
|
||||
大屏幕下放大游戏界面
|
||||
最近使用/最常使用的图块
|
||||
loader并行加载
|
||||
合并items.js
|
||||
（已完成！） 合并items.js
|
||||
增加fonts目录，全塔属性增加fonts引用
|
||||
|
||||
-------------
|
||||
|
||||
Loading…
Reference in New Issue
Block a user