From cc2fc481078628250a98e64a49dc1720f1a558b7 Mon Sep 17 00:00:00 2001
From: Julian Descottes <julian.descottes@gmail.com>
Date: Sat, 3 Jun 2017 00:12:46 +0200
Subject: [PATCH] Fix #271: add new piskel button for desktop application

---
 Gruntfile.js                    | 18 ++---------------
 src/index.html                  |  2 --
 src/templates/debug-header.html | 34 ++++++++++++++++++++++++++++++++-
 3 files changed, 35 insertions(+), 19 deletions(-)

diff --git a/Gruntfile.js b/Gruntfile.js
index 5cfa7cf0..6b972940 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -238,20 +238,6 @@ module.exports = function(grunt) {
           src: ['dest/tmp/css/piskel-style-packaged' + version + '.css'],
           dest: 'dest/prod/css/piskel-style-packaged' + version + '.css'
         }]
-      },
-      // remove the fake header from the desktop build
-      desktop: {
-        options: {
-          patterns: [{
-              match: /<!--standalone-start-->(?:.|[\r\n])*<!--standalone-end-->/,
-              replacement: "",
-              description : "Remove everything between standalone-start & standalone-end"
-            }
-          ]
-        },
-        files: [
-          {src: ['dest/prod/index.html'], dest: 'dest/prod/index.html'}
-        ]
       }
     },
 
@@ -372,8 +358,8 @@ module.exports = function(grunt) {
   grunt.registerTask('merge-statics', ['concat:js', 'concat:css', 'uglify']);
   grunt.registerTask('build',  ['clean:prod', 'sprite', 'merge-statics', 'build-index.html', 'replace:mainPartial', 'replace:css', 'copy:prod']);
   grunt.registerTask('build-dev',  ['clean:dev', 'sprite', 'build-index.html', 'copy:dev']);
-  grunt.registerTask('desktop', ['clean:desktop', 'default', 'replace:desktop', 'nwjs:windows']);
-  grunt.registerTask('desktop-mac', ['clean:desktop', 'default', 'replace:desktop', 'nwjs:macos']);
+  grunt.registerTask('desktop', ['clean:desktop', 'default', 'nwjs:windows']);
+  grunt.registerTask('desktop-mac', ['clean:desktop', 'default', 'nwjs:macos']);
   grunt.registerTask('desktop-mac-old', ['clean:desktop', 'default', 'replace:desktop', 'nwjs:macos_old']);
 
   // SERVER TASKS
diff --git a/src/index.html b/src/index.html
index aba1f8b9..c8580157 100644
--- a/src/index.html
+++ b/src/index.html
@@ -22,9 +22,7 @@
     color:white;">
       <span style="top:45%">Loading Piskel ...</span>
   </div>
-  <!--standalone-start-->
   @@include('templates/debug-header.html', {})
-  <!--standalone-end-->
 
   <!-- the comment below indicates the beginning of markup reused by the editor integrated in piskelapp.com -->
   <!-- do not delete, do not move :) -->
diff --git a/src/templates/debug-header.html b/src/templates/debug-header.html
index 37fe6d28..c59f4684 100644
--- a/src/templates/debug-header.html
+++ b/src/templates/debug-header.html
@@ -4,16 +4,48 @@
   }
 
   .fake-piskelapp-header {
+    position: relative;
     text-align: center;
     height: 40px;
     line-height: 40px;
     font-size: 24px;
     background: black;
     color: gold;
+    z-index: 100;
   }
 
   .piskel-name.piskel-name-saving {
     color: red;
   }
+
+  .new-piskel-desktop {
+    position: absolute;
+
+    display: flex;
+    top: 7px;
+    right: 7px;
+
+    height: 26px;
+    width: 26px;
+
+    border-radius: 3px;
+    font-size: 22px;
+    color: black;
+    background: gold;
+    text-decoration: none;
+
+    align-items: center;
+    justify-content: center;
+  }
 </style>
-<div class="fake-piskelapp-header"><span class="piskel-name"></span></div>
\ No newline at end of file
+<div class="fake-piskelapp-header">
+  <a
+    href="index.html"
+    target="_blank"
+    class="new-piskel-desktop button button-primary"
+    title="Create a new sprite"
+    rel="tooltip"
+    data-placement="left"
+    >+</a>
+  <span class="piskel-name"></span>
+</div>
\ No newline at end of file