From ea89397c6e06f9a3f36cf4604441c9b357d45ab0 Mon Sep 17 00:00:00 2001 From: liply Date: Fri, 6 Oct 2017 22:21:36 +0900 Subject: [PATCH] testbed --- js/rpg_core/Graphics.js | 37 +++++++++++++++++++++++++++++ js/rpg_core/ProgressWatcher.js | 41 +++++++++++++++++++++++++++++++++ js/rpg_managers/AudioManager.js | 12 +++++++++- js/rpg_managers/ImageManager.js | 12 ++++++++++ js/rpg_managers/SceneManager.js | 5 ++++ rpg_core.json | 1 + 6 files changed, 107 insertions(+), 1 deletion(-) create mode 100644 js/rpg_core/ProgressWatcher.js diff --git a/js/rpg_core/Graphics.js b/js/rpg_core/Graphics.js index 9be6ec9d..d82bcb5a 100644 --- a/js/rpg_core/Graphics.js +++ b/js/rpg_core/Graphics.js @@ -62,6 +62,7 @@ Graphics.initialize = function(width, height, type) { this._disableContextMenu(); this._setupEventHandlers(); this._setupCssFontLoading(); + this._setupProgress(); }; @@ -247,6 +248,40 @@ Graphics.setLoadingImage = function(src) { */ Graphics.startLoading = function() { this._loadingCount = 0; + + ProgressWatcher.truncateProgress(); + ProgressWatcher.setProgressListener(this._updateProgressCount.bind(this)); + Graphics._showProgress(); +}; + +Graphics._setupProgress = function(){ + this._progressElement = document.createElement('progress'); + this._progressElement.id = 'loading-progress'; + this._progressElement.max = 100; + this._progressElement.value = 0; + document.body.appendChild(this._progressElement); +}; + +Graphics._showProgress = function(){ + this._progressElement.value = 0; + this._progressElement.style.visibility = 'visible'; +}; + +Graphics._hideProgress = function(){ + this._progressElement.style.visibility = 'hidden'; +}; + +Graphics._updateProgressCount = function(countLoaded, countLoading){ + if(countLoading !== 0){ + this._progressElement.value = (countLoaded/countLoading) * 100; + }else{ + this._progressElement.value = 100; + } +}; + +Graphics._updateProgress = function(){ + this._progressElement.style.zIndex = 99; + this._centerElement(this._progressElement); }; /** @@ -259,6 +294,7 @@ Graphics.updateLoading = function() { this._loadingCount++; this._paintUpperCanvas(); this._upperCanvas.style.opacity = 1; + this._updateProgress(); }; /** @@ -270,6 +306,7 @@ Graphics.updateLoading = function() { Graphics.endLoading = function() { this._clearUpperCanvas(); this._upperCanvas.style.opacity = 0; + this._hideProgress(); }; /** diff --git a/js/rpg_core/ProgressWatcher.js b/js/rpg_core/ProgressWatcher.js new file mode 100644 index 00000000..aad5409f --- /dev/null +++ b/js/rpg_core/ProgressWatcher.js @@ -0,0 +1,41 @@ +function ProgressWatcher(){ + throw new Error('This is a static class'); +} + +ProgressWatcher.initialize = function(){ + this.clearProgress(); + ImageManager.setCreationHook(this._bitmapListener.bind(this)); + AudioManager.setCreationHook(this._audioListener.bind(this)); +}; + +ProgressWatcher._bitmapListener = function(bitmap){ + this._countLoading++; + bitmap.addLoadListener(function(){ + this._countLoaded++; + this._progressListener(this._countLoaded, this._countLoading); + }.bind(this)); +}; + +ProgressWatcher._audioListener = function(audio){ + this._countLoading++; + audio.addLoadListener(function(){ + this._countLoaded++; + this._progressListener(this._countLoaded, this._countLoading); + }.bind(this)); +}; + +ProgressWatcher.setProgressListener = function(progressListener){ + this._progressListener = progressListener; +}; + +ProgressWatcher.clearProgress = function(){ + this._countLoading = 0; + this._countLoaded = 0; +}; + +ProgressWatcher.truncateProgress = function(){ + if(this._countLoaded){ + this._countLoading -= this._countLoaded; + this._countLoaded = 0; + } +}; \ No newline at end of file diff --git a/js/rpg_managers/AudioManager.js b/js/rpg_managers/AudioManager.js index 2ea88bfd..104b42a9 100644 --- a/js/rpg_managers/AudioManager.js +++ b/js/rpg_managers/AudioManager.js @@ -375,7 +375,9 @@ AudioManager.createBuffer = function(folder, name) { else Html5Audio.setup(url); return Html5Audio; } else { - return new WebAudio(url); + var audio = new WebAudio(url); + this._callCreationHook(audio); + return audio; } }; @@ -418,3 +420,11 @@ AudioManager.checkWebAudioError = function(webAudio) { throw new Error('Failed to load: ' + webAudio.url); } }; + +AudioManager.setCreationHook = function(hook){ + this._creationHook = hook; +}; + +AudioManager._callCreationHook = function(audio){ + if(this._creationHook) this._creationHook(audio); +}; \ No newline at end of file diff --git a/js/rpg_managers/ImageManager.js b/js/rpg_managers/ImageManager.js index 0afa5996..e4175e0b 100644 --- a/js/rpg_managers/ImageManager.js +++ b/js/rpg_managers/ImageManager.js @@ -100,6 +100,8 @@ ImageManager.loadNormalBitmap = function(path, hue) { var bitmap = this._imageCache.get(key); if (!bitmap) { bitmap = Bitmap.load(path); + this._callCreationHook(bitmap); + bitmap.addLoadListener(function() { bitmap.rotateHue(hue); }); @@ -289,6 +291,8 @@ ImageManager.requestNormalBitmap = function(path, hue){ var bitmap = this._imageCache.get(key); if(!bitmap){ bitmap = Bitmap.request(path); + this._callCreationHook(bitmap); + bitmap.addLoadListener(function(){ bitmap.rotateHue(hue); }); @@ -308,3 +312,11 @@ ImageManager.update = function(){ ImageManager.clearRequest = function(){ this._requestQueue.clear(); }; + +ImageManager.setCreationHook = function(hook){ + this._creationHook = hook; +}; + +ImageManager._callCreationHook = function(bitmap){ + if(this._creationHook) this._creationHook(bitmap); +}; \ No newline at end of file diff --git a/js/rpg_managers/SceneManager.js b/js/rpg_managers/SceneManager.js index 3a506805..2c6687b3 100644 --- a/js/rpg_managers/SceneManager.js +++ b/js/rpg_managers/SceneManager.js @@ -42,6 +42,7 @@ SceneManager.run = function(sceneClass) { }; SceneManager.initialize = function() { + this.initProgressWatcher(); this.initGraphics(); this.checkFileAccess(); this.initAudio(); @@ -51,6 +52,10 @@ SceneManager.initialize = function() { this.setupErrorHandlers(); }; +SceneManager.initProgressWatcher = function(){ + ProgressWatcher.initialize(); +}; + SceneManager.initGraphics = function() { var type = this.preferableRendererType(); Graphics.initialize(this._screenWidth, this._screenHeight, type); diff --git a/rpg_core.json b/rpg_core.json index e58bfc59..09596aa9 100644 --- a/rpg_core.json +++ b/rpg_core.json @@ -1,6 +1,7 @@ [ "js/rpg_core/_header.js", "js/rpg_core/Patch.js", + "js/rpg_core/ProgressWatcher.js", "js/rpg_core/JsExtensions.js", "js/rpg_core/Utils.js", "js/rpg_core/CacheEntry.js",