added loading over + fixed bug with highlighted pixel removal
This commit is contained in:
parent
4056142b97
commit
fbdf1aaf9a
5 changed files with 36 additions and 14 deletions
13
index.html
13
index.html
|
@ -9,6 +9,19 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
</head>
|
||||
<body>
|
||||
<div
|
||||
id="loading-mask"
|
||||
style="
|
||||
position:fixed;
|
||||
top:0;right:0;bottom:0;left:0;
|
||||
background:black;
|
||||
opacity:1;
|
||||
text-align:center;
|
||||
z-index : 20000;
|
||||
transition:opacity 0.5s;
|
||||
color:white;">
|
||||
<span style="top:45%">Loading pixels ...</span>
|
||||
</div>
|
||||
<script type="text/javascript" src="js/lib/iframeLoader.js"></script>
|
||||
<div class="piskel-name-container">
|
||||
<input readonly id="piskel-name" type="text" value=""/>
|
||||
|
|
|
@ -32,9 +32,11 @@
|
|||
};
|
||||
|
||||
ns.BaseTool.prototype.hideHighlightedPixel = function(overlay) {
|
||||
overlay.setPixel(this.highlightedPixelCol, this.highlightedPixelRow, Constants.TRANSPARENT_COLOR);
|
||||
this.highlightedPixelRow = null;
|
||||
this.highlightedPixelCol = null;
|
||||
if (this.highlightedPixelRow !== null && this.highlightedPixelCol !== null) {
|
||||
overlay.setPixel(this.highlightedPixelCol, this.highlightedPixelRow, Constants.TRANSPARENT_COLOR);
|
||||
this.highlightedPixelRow = null;
|
||||
this.highlightedPixelCol = null;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
|
|
@ -70,6 +70,9 @@
|
|||
}
|
||||
};
|
||||
|
||||
ns.BaseSelect.prototype.hideHighlightedPixel = function () {
|
||||
// not implemented for selection tools
|
||||
};
|
||||
|
||||
/**
|
||||
* If we mouseover the selection draw inside the overlay frame, show the 'move' cursor
|
||||
|
|
|
@ -6,7 +6,6 @@
|
|||
this.isRunning = false;
|
||||
this.previousTime = 0;
|
||||
this.callbacks = [];
|
||||
this.i = 0;
|
||||
};
|
||||
|
||||
ns.DrawingLoop.prototype.addCallback = function (callback, scope, args) {
|
||||
|
@ -34,10 +33,7 @@
|
|||
ns.DrawingLoop.prototype.loop_ = function () {
|
||||
var currentTime = Date.now();
|
||||
var delta = currentTime - this.previousTime;
|
||||
this.i++;
|
||||
if(this.i%2 === 0) {
|
||||
this.executeCallbacks_(delta);
|
||||
}
|
||||
this.executeCallbacks_(delta);
|
||||
this.previousTime = currentTime;
|
||||
this.requestAnimationFrame.call(window, this.loop_.bind(this));
|
||||
};
|
||||
|
|
|
@ -1,4 +1,16 @@
|
|||
(function () {
|
||||
|
||||
window.onPiskelReady = function () {
|
||||
var loadingMask = document.getElementById('loading-mask');
|
||||
loadingMask.style.opacity = 0;
|
||||
window.setTimeout(function () {loadingMask.parentNode.removeChild(loadingMask);}, 600)
|
||||
pskl.app.init();
|
||||
// cleanup
|
||||
delete window.exports;
|
||||
delete window.loadDebugScripts;
|
||||
delete window.done;
|
||||
};
|
||||
|
||||
var prefixPath = function (path) {
|
||||
if (window.pskl && window.pskl.appEngineToken_) {
|
||||
return '../' + path;
|
||||
|
@ -29,11 +41,7 @@
|
|||
var scriptIndex = 0;
|
||||
window.loadNextScript = function () {
|
||||
if (scriptIndex == window.exports.scripts.length) {
|
||||
pskl.app.init();
|
||||
// cleanup
|
||||
delete window.exports;
|
||||
delete window.loadDebugScripts;
|
||||
delete window.done;
|
||||
window.onPiskelReady();
|
||||
} else {
|
||||
loadScript(window.exports.scripts[scriptIndex], "loadNextScript()");
|
||||
scriptIndex ++;
|
||||
|
@ -60,7 +68,7 @@
|
|||
var loaderInterval = window.setInterval(function () {
|
||||
if (document.querySelectorAll("[data-iframe-loader]").length === 0) {
|
||||
window.clearInterval(loaderInterval);
|
||||
loadScript(script, "pskl.app.init()");
|
||||
loadScript(script, "onPiskelReady()");
|
||||
} else {
|
||||
console.log("waiting for templates to load ....");
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue