Performance improvement

index.html

@@ -935,6 +935,15 @@
       </div>
       <button type="button" class="button button-primary c-download-button">Download C file</button>
     </div>
+    <div class="export-panel-section">
+      <div style="padding-bottom: 5px">
+        <span style="color: gold;">Export selected frame as PNG File: </span>
+        <span class="export-info">
+          PNG export of the currently selected frame.
+        </span>
+      </div>
+      <button type="button" class="button button-primary selected-frame-download-button">Download</button>
+    </div>
   </div>
 </script>
 
@@ -942,15 +951,19 @@
     (function () {
 
   /**
-   * See @Gruntfile.js => after build, -2016-07-24-05-08 is replaced by the build version
+   * See @Gruntfile.js => after build, -2016-10-01-02-48 is replaced by the build version
    */
-  var version = '-2016-07-24-05-08';
+  var version = '-2016-10-01-02-48';
   var versionHasNotBeenReplaced = version.indexOf('@@') === 0;
   if (versionHasNotBeenReplaced)  {
     version = '';
   }
 
-  window.onPiskelReady = function () {
+  if (!window.piskelReadyCallbacks) {
+    window.piskelReadyCallbacks = [];
+  }
+
+  window._onPiskelReady = function () {
     var loadingMask = document.getElementById('loading-mask');
     loadingMask.style.opacity = 0;
     window.setTimeout(function () {loadingMask.parentNode.removeChild(loadingMask);}, 600);
@@ -959,6 +972,11 @@
     delete window.pskl_exports;
     delete window.loadDebugScripts;
     delete window.done;
+
+    // Run Piskel ready callbacks
+    for (var i = 0; i < window.piskelReadyCallbacks.length; i++) {
+      window.piskelReadyCallbacks[i]();
+    }
   };
 
   var prefixPath = function (path) {
@@ -991,7 +1009,7 @@
     var scriptIndex = 0;
     window.loadNextScript = function () {
       if (scriptIndex == window.pskl_exports.scripts.length) {
-        window.onPiskelReady();
+        window._onPiskelReady();
       } else {
         loadScript(window.pskl_exports.scripts[scriptIndex], 'loadNextScript()');
         scriptIndex ++;
@@ -1015,7 +1033,7 @@
     }
 
     loadStyle('css/piskel-style-packaged' + version + '.css');
-    loadScript(script, 'onPiskelReady()');
+    loadScript(script, '_onPiskelReady()');
   }
 })();
   </script>

piskelapp-partials/main-partial.html

@@ -887,6 +887,15 @@
     </div>
     <button type="button" class="button button-primary c-download-button">Download C file</button>
   </div>
+  <div class="export-panel-section">
+    <div style="padding-bottom: 5px">
+      <span style="color: gold;">Export selected frame as PNG File: </span>
+      <span class="export-info">
+        PNG export of the currently selected frame.
+      </span>
+    </div>
+    <button type="button" class="button button-primary selected-frame-download-button">Download</button>
+  </div>
 </div>
 </script>
 
@@ -894,15 +903,19 @@
   (function () {
 
 /**
- * See @Gruntfile.js => after build, -2016-07-24-05-08 is replaced by the build version
+ * See @Gruntfile.js => after build, -2016-10-01-02-48 is replaced by the build version
  */
-var version = '-2016-07-24-05-08';
+var version = '-2016-10-01-02-48';
 var versionHasNotBeenReplaced = version.indexOf('@@') === 0;
 if (versionHasNotBeenReplaced)  {
   version = '';
 }
 
-window.onPiskelReady = function () {
+if (!window.piskelReadyCallbacks) {
+  window.piskelReadyCallbacks = [];
+}
+
+window._onPiskelReady = function () {
   var loadingMask = document.getElementById('loading-mask');
   loadingMask.style.opacity = 0;
   window.setTimeout(function () {loadingMask.parentNode.removeChild(loadingMask);}, 600);
@@ -911,6 +924,11 @@ window.onPiskelReady = function () {
   delete window.pskl_exports;
   delete window.loadDebugScripts;
   delete window.done;
+
+  // Run Piskel ready callbacks
+  for (var i = 0; i < window.piskelReadyCallbacks.length; i++) {
+    window.piskelReadyCallbacks[i]();
+  }
 };
 
 var prefixPath = function (path) {
@@ -943,7 +961,7 @@ if (window.location.href.indexOf('debug') != -1) {
   var scriptIndex = 0;
   window.loadNextScript = function () {
     if (scriptIndex == window.pskl_exports.scripts.length) {
-      window.onPiskelReady();
+      window._onPiskelReady();
     } else {
       loadScript(window.pskl_exports.scripts[scriptIndex], 'loadNextScript()');
       scriptIndex ++;
@@ -967,7 +985,7 @@ if (window.location.href.indexOf('debug') != -1) {
   }
 
   loadStyle('css/piskel-style-packaged' + version + '.css');
-  loadScript(script, 'onPiskelReady()');
+  loadScript(script, '_onPiskelReady()');
 }
 })();
 </script>

q

@@ -0,0 +1,170 @@
+diff --git a/img/cursors/circle.png b/img/cursors/circle.png
+index a186a26..eba4637 100644
+Binary files a/img/cursors/circle.png and b/img/cursors/circle.png differ
+diff --git a/img/cursors/stroke.png b/img/cursors/stroke.png
+index 0bfecd5..641f438 100644
+Binary files a/img/cursors/stroke.png and b/img/cursors/stroke.png differ
+diff --git a/img/icons.png b/img/icons.png
+index 3b474d1..2fea01d 100644
+Binary files a/img/icons.png and b/img/icons.png differ
+diff --git a/img/icons/tools/tool-lasso-select.png b/img/icons/tools/tool-lasso-select.png
+index cd8d04d..f388925 100644
+Binary files a/img/icons/tools/tool-lasso-select.png and b/img/icons/tools/tool-lasso-select.png differ
+diff --git a/img/icons/tools/tool-lasso-select@2x.png b/img/icons/tools/tool-lasso-select@2x.png
+index 39e3359..17e7162 100644
+Binary files a/img/icons/tools/tool-lasso-select@2x.png and b/img/icons/tools/tool-lasso-select@2x.png differ
+diff --git a/img/icons/tools/tool-shape-select.png b/img/icons/tools/tool-shape-select.png
+index 2c7ed31..55d6400 100644
+Binary files a/img/icons/tools/tool-shape-select.png and b/img/icons/tools/tool-shape-select.png differ
+diff --git a/img/icons/tools/tool-shape-select@2x.png b/img/icons/tools/tool-shape-select@2x.png
+index 5430e5b..fed2da9 100644
+Binary files a/img/icons/tools/tool-shape-select@2x.png and b/img/icons/tools/tool-shape-select@2x.png differ
+diff --git a/img/icons@2x.png b/img/icons@2x.png
+index 00275b7..74b86c6 100644
+Binary files a/img/icons@2x.png and b/img/icons@2x.png differ
+diff --git a/index.html b/index.html
+index da606eb..18eb1fa 100644
+--- a/index.html
++++ b/index.html
+@@ -935,6 +935,15 @@
+       </div>
+       <button type="button" class="button button-primary c-download-button">Download C file</button>
+     </div>
++    <div class="export-panel-section">
++      <div style="padding-bottom: 5px">
++        <span style="color: gold;">Export selected frame as PNG File: </span>
++        <span class="export-info">
++          PNG export of the currently selected frame.
++        </span>
++      </div>
++      <button type="button" class="button button-primary selected-frame-download-button">Download</button>
++    </div>
+   </div>
+ </script>
+ 
+@@ -942,15 +951,19 @@
+     (function () {
+ 
+   /**
+-   * See @Gruntfile.js => after build, -2016-07-24-05-08 is replaced by the build version
++   * See @Gruntfile.js => after build, -2016-10-01-02-48 is replaced by the build version
+    */
+-  var version = '-2016-07-24-05-08';
++  var version = '-2016-10-01-02-48';
+   var versionHasNotBeenReplaced = version.indexOf('@@') === 0;
+   if (versionHasNotBeenReplaced)  {
+     version = '';
+   }
+ 
+-  window.onPiskelReady = function () {
++  if (!window.piskelReadyCallbacks) {
++    window.piskelReadyCallbacks = [];
++  }
++
++  window._onPiskelReady = function () {
+     var loadingMask = document.getElementById('loading-mask');
+     loadingMask.style.opacity = 0;
+     window.setTimeout(function () {loadingMask.parentNode.removeChild(loadingMask);}, 600);
+@@ -959,6 +972,11 @@
+     delete window.pskl_exports;
+     delete window.loadDebugScripts;
+     delete window.done;
++
++    // Run Piskel ready callbacks
++    for (var i = 0; i < window.piskelReadyCallbacks.length; i++) {
++      window.piskelReadyCallbacks[i]();
++    }
+   };
+ 
+   var prefixPath = function (path) {
+@@ -991,7 +1009,7 @@
+     var scriptIndex = 0;
+     window.loadNextScript = function () {
+       if (scriptIndex == window.pskl_exports.scripts.length) {
+-        window.onPiskelReady();
++        window._onPiskelReady();
+       } else {
+         loadScript(window.pskl_exports.scripts[scriptIndex], 'loadNextScript()');
+         scriptIndex ++;
+@@ -1015,7 +1033,7 @@
+     }
+ 
+     loadStyle('css/piskel-style-packaged' + version + '.css');
+-    loadScript(script, 'onPiskelReady()');
++    loadScript(script, '_onPiskelReady()');
+   }
+ })();
+   </script>
+diff --git a/piskelapp-partials/main-partial.html b/piskelapp-partials/main-partial.html
+index 9060764..de5d984 100644
+--- a/piskelapp-partials/main-partial.html
++++ b/piskelapp-partials/main-partial.html
+@@ -887,6 +887,15 @@
+     </div>
+     <button type="button" class="button button-primary c-download-button">Download C file</button>
+   </div>
++  <div class="export-panel-section">
++    <div style="padding-bottom: 5px">
++      <span style="color: gold;">Export selected frame as PNG File: </span>
++      <span class="export-info">
++        PNG export of the currently selected frame.
++      </span>
++    </div>
++    <button type="button" class="button button-primary selected-frame-download-button">Download</button>
++  </div>
+ </div>
+ </script>
+ 
+@@ -894,15 +903,19 @@
+   (function () {
+ 
+ /**
+- * See @Gruntfile.js => after build, -2016-07-24-05-08 is replaced by the build version
++ * See @Gruntfile.js => after build, -2016-10-01-02-48 is replaced by the build version
+  */
+-var version = '-2016-07-24-05-08';
++var version = '-2016-10-01-02-48';
+ var versionHasNotBeenReplaced = version.indexOf('@@') === 0;
+ if (versionHasNotBeenReplaced)  {
+   version = '';
+ }
+ 
+-window.onPiskelReady = function () {
++if (!window.piskelReadyCallbacks) {
++  window.piskelReadyCallbacks = [];
++}
++
++window._onPiskelReady = function () {
+   var loadingMask = document.getElementById('loading-mask');
+   loadingMask.style.opacity = 0;
+   window.setTimeout(function () {loadingMask.parentNode.removeChild(loadingMask);}, 600);
+@@ -911,6 +924,11 @@ window.onPiskelReady = function () {
+   delete window.pskl_exports;
+   delete window.loadDebugScripts;
+   delete window.done;
++
++  // Run Piskel ready callbacks
++  for (var i = 0; i < window.piskelReadyCallbacks.length; i++) {
++    window.piskelReadyCallbacks[i]();
++  }
+ };
+ 
+ var prefixPath = function (path) {
+@@ -943,7 +961,7 @@ if (window.location.href.indexOf('debug') != -1) {
+   var scriptIndex = 0;
+   window.loadNextScript = function () {
+     if (scriptIndex == window.pskl_exports.scripts.length) {
+-      window.onPiskelReady();
++      window._onPiskelReady();
+     } else {
+       loadScript(window.pskl_exports.scripts[scriptIndex], 'loadNextScript()');
+       scriptIndex ++;
+@@ -967,7 +985,7 @@ if (window.location.href.indexOf('debug') != -1) {
+   }
+ 
+   loadStyle('css/piskel-style-packaged' + version + '.css');
+-  loadScript(script, 'onPiskelReady()');
++  loadScript(script, '_onPiskelReady()');
+ }
+ })();
+ </script>