added loading over + fixed bug with highlighted pixel removal

This commit is contained in:
juliandescottes 2013-12-23 15:04:13 +01:00
parent 4056142b97
commit fbdf1aaf9a
5 changed files with 36 additions and 14 deletions

View file

@ -9,6 +9,19 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head> </head>
<body> <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> <script type="text/javascript" src="js/lib/iframeLoader.js"></script>
<div class="piskel-name-container"> <div class="piskel-name-container">
<input readonly id="piskel-name" type="text" value=""/> <input readonly id="piskel-name" type="text" value=""/>

View file

@ -32,9 +32,11 @@
}; };
ns.BaseTool.prototype.hideHighlightedPixel = function(overlay) { ns.BaseTool.prototype.hideHighlightedPixel = function(overlay) {
overlay.setPixel(this.highlightedPixelCol, this.highlightedPixelRow, Constants.TRANSPARENT_COLOR); if (this.highlightedPixelRow !== null && this.highlightedPixelCol !== null) {
this.highlightedPixelRow = null; overlay.setPixel(this.highlightedPixelCol, this.highlightedPixelRow, Constants.TRANSPARENT_COLOR);
this.highlightedPixelCol = null; this.highlightedPixelRow = null;
this.highlightedPixelCol = null;
}
}; };

View file

@ -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 * If we mouseover the selection draw inside the overlay frame, show the 'move' cursor

View file

@ -6,7 +6,6 @@
this.isRunning = false; this.isRunning = false;
this.previousTime = 0; this.previousTime = 0;
this.callbacks = []; this.callbacks = [];
this.i = 0;
}; };
ns.DrawingLoop.prototype.addCallback = function (callback, scope, args) { ns.DrawingLoop.prototype.addCallback = function (callback, scope, args) {
@ -34,10 +33,7 @@
ns.DrawingLoop.prototype.loop_ = function () { ns.DrawingLoop.prototype.loop_ = function () {
var currentTime = Date.now(); var currentTime = Date.now();
var delta = currentTime - this.previousTime; var delta = currentTime - this.previousTime;
this.i++; this.executeCallbacks_(delta);
if(this.i%2 === 0) {
this.executeCallbacks_(delta);
}
this.previousTime = currentTime; this.previousTime = currentTime;
this.requestAnimationFrame.call(window, this.loop_.bind(this)); this.requestAnimationFrame.call(window, this.loop_.bind(this));
}; };

View file

@ -1,4 +1,16 @@
(function () { (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) { var prefixPath = function (path) {
if (window.pskl && window.pskl.appEngineToken_) { if (window.pskl && window.pskl.appEngineToken_) {
return '../' + path; return '../' + path;
@ -29,11 +41,7 @@
var scriptIndex = 0; var scriptIndex = 0;
window.loadNextScript = function () { window.loadNextScript = function () {
if (scriptIndex == window.exports.scripts.length) { if (scriptIndex == window.exports.scripts.length) {
pskl.app.init(); window.onPiskelReady();
// cleanup
delete window.exports;
delete window.loadDebugScripts;
delete window.done;
} else { } else {
loadScript(window.exports.scripts[scriptIndex], "loadNextScript()"); loadScript(window.exports.scripts[scriptIndex], "loadNextScript()");
scriptIndex ++; scriptIndex ++;
@ -60,7 +68,7 @@
var loaderInterval = window.setInterval(function () { var loaderInterval = window.setInterval(function () {
if (document.querySelectorAll("[data-iframe-loader]").length === 0) { if (document.querySelectorAll("[data-iframe-loader]").length === 0) {
window.clearInterval(loaderInterval); window.clearInterval(loaderInterval);
loadScript(script, "pskl.app.init()"); loadScript(script, "onPiskelReady()");
} else { } else {
console.log("waiting for templates to load ...."); console.log("waiting for templates to load ....");
} }