From a8c78d482d5e42925c3990bc6792d6e533ac31df Mon Sep 17 00:00:00 2001
From: Mahdi Dibaiee <mdibaiee@aol.com>
Date: Thu, 20 Feb 2014 13:36:52 +0330
Subject: [PATCH] Fixed Email, Save on Mn Sdcard (B2G), Increased font size,
 Color Picker closed by clicking outside

---
 Gruntfile.js                 |  6 +++---
 Mobile/index.html            |  4 ++--
 Mobile/js/diff.js            | 26 +++++++++++++++++---------
 Mobile/manifest.webapp       |  2 +-
 Shared/css/main.less         | 21 +++++++++++----------
 Shared/js/events.js          | 28 ++++++++++++++++++----------
 Web/index.html               |  4 ++--
 Web/js/main.js               |  1 +
 build/mobile/css/main.css    | 20 +++++++++++---------
 build/mobile/index.html      |  5 ++---
 build/mobile/js/diff.js      |  2 +-
 build/mobile/js/events.js    |  2 +-
 build/mobile/manifest.webapp |  2 +-
 build/web/css/main.css       | 20 +++++++++++---------
 build/web/index.html         |  4 ++--
 build/web/js/events.js       |  2 +-
 build/web/js/main.js         |  2 +-
 17 files changed, 86 insertions(+), 65 deletions(-)

diff --git a/Gruntfile.js b/Gruntfile.js
index 4982baa..620c64f 100644
--- a/Gruntfile.js
+++ b/Gruntfile.js
@@ -52,13 +52,13 @@ module.exports = function(grunt) {
           {
             expand: true,
             cwd: 'Shared',
-            src: 'img',
+            src: 'img/**',
             dest: 'build/mobile'
           },
           {
             expand: true,
             cwd: 'Shared',
-            src: 'img',
+            src: 'img/**',
             dest: 'build/web'
           },
           {
@@ -109,7 +109,7 @@ module.exports = function(grunt) {
         }
       },
       copy: {
-        files: 'Shared/**',
+        files: ['Shared/img/**', 'Mobile/index.html', 'Mobile/manifest.webapp', 'Web/index.html', 'Web/manifest.webapp', 'Web/cache.appcache'],
         tasks: 'copy',
         options: {
           spawn: false
diff --git a/Mobile/index.html b/Mobile/index.html
index 5620125..a183641 100755
--- a/Mobile/index.html
+++ b/Mobile/index.html
@@ -42,7 +42,7 @@
           <hr>
           <div class='sketch'>
             <p class='icon-settings'>Sketch</p>
-            <p id='connectTelorance'>Connet Telorance<span>40</span></p>
+            <p id='connectTelorance'>Telorance<span>40</span></p>
             <div role="slider" class='connectTelorance'>
               <div>
                 <progress value="40" min="1" max="100"></progress>
@@ -53,7 +53,7 @@
 
           <div class='fur hidden'>
             <p class='icon-settings'>Fur</p>
-            <p id='connectTelorance'>Connet Telorance<span>40</span></p>
+            <p id='connectTelorance'>Telorance<span>40</span></p>
             <div role="slider" class='connectTelorance'>
               <div>
                 <progress value="40" min="10" max="100"></progress>
diff --git a/Mobile/js/diff.js b/Mobile/js/diff.js
index a9b9856..33c9eaa 100644
--- a/Mobile/js/diff.js
+++ b/Mobile/js/diff.js
@@ -2,7 +2,6 @@ $(document).ready(function() {
 
   $('*').off('click mousemove mousedown mouseup mouseleave').on('click mousemove mousedown mouseup mouseleave', function(e) {
     e.preventDefault;
-    return false;
   })
 
   $('a[href^="http"]').tap(function(e) {
@@ -19,17 +18,17 @@ $(document).ready(function() {
 
   $('a[href^="mailto"]').tap(function(e) {
     e.preventDefault();
-    var mail = /mailto:(.*)/.exec($(this).attr('href'))[1];
     var mail = new MozActivity({
       name: 'new',
       data: {
         type: 'mail',
-        url: mail
+        url: $(this).attr('href')
       }
     })
   })
 
   window.save = function() {
+    var f = c.getImageData(0, 0, width(), height());
     switch(save.background) {
       case 'white': {
         c.fillStyle = 'white';
@@ -63,7 +62,7 @@ $(document).ready(function() {
           localStorage.setItem('projects', JSON.stringify(list));
         }
       }
-      else
+      else {
         list ? list.push({
             name: save['file name'],
             data: data,
@@ -74,13 +73,22 @@ $(document).ready(function() {
             points: window.points
           }];
         localStorage.setItem('projects', JSON.stringify(list)); 
-      } else {
-        window.open(data, '_blank').focus();
+      }         
+    } else {
+      var sd = navigator.getDeviceStorage('pictures');
+      var file = dataToBlob(data);
+      var req = sd.addNamed(file, save['file name'] + '.png');
+      req.onsuccess = function() {
+        alert('Your Sketch was saved successfuly: ' + this.result);
+      }
+      req.onerror = function(e) {
+        alert('Something bad happened trying to save your sketch ' + save['file name'] + '\n Possible reasons:\n Duplicate Name \n Not enough permission')
+        console.log(e);
+        console.log(this);
       }
-
-      c.putImageData(window.points.history[window.points.history.last].data, 0, 0);
     }
-
+    c.putImageData(f, 0, 0);
+  }
   window.load = function() {
       var file = JSON.parse(localStorage.getItem('projects')).filter(function(a) { return a.name == load.file })[0];
       var img = document.createElement('img');
diff --git a/Mobile/manifest.webapp b/Mobile/manifest.webapp
index e644881..b384d60 100755
--- a/Mobile/manifest.webapp
+++ b/Mobile/manifest.webapp
@@ -35,7 +35,7 @@
   ],
   "permissions": {
     "device-storage:pictures": {
-      "description": "Required to save sketched pics",
+      "description": "Required to save sketches",
       "access": "readwrite"
     }
   }
diff --git a/Shared/css/main.less b/Shared/css/main.less
index 9cb6c0f..dfa9788 100755
--- a/Shared/css/main.less
+++ b/Shared/css/main.less
@@ -9,6 +9,7 @@ html, body {
   overflow: hidden;
   width: 100%;
   height: 100%;
+  position: absolute;
 }
 
 *::-moz-focus-inner {
@@ -180,25 +181,22 @@ header {
   }
 }
 
-
 #menu {
-  width: 15rem;
+  width: 15.4rem;
   height: 100%;
   display: block;
   background: #262626;
   position: absolute;
-  left: -15rem;
+  left: -15.4rem;
   top: 5rem;
   color: white;
-  font-family: 'MozTT-Light';
-  font-size: 8pt;
-  transition: left 0.2s ease-out;
+  transition: left 0.3s ease-out;
   border-collapse: collapse;
-  overflow-y: auto;
+  overflow: hidden;
 
   &.pulled {
     left: 0;
-    transition: left 0.2s ease-out;
+    transition: left 0.3s ease-out;
   }
 
   button[id^='set'], p, .bottom button {
@@ -208,8 +206,8 @@ header {
     color: white;
     text-align: left;
     margin: 1rem 2.5rem;
-    font-family: 'MozTT-Light';
-    font-size: 8pt;
+    font-family: 'MozTT-Light' !important;
+    font-size: 9pt;
     padding: 0 0.6rem;
     cursor: pointer;
   }
@@ -219,6 +217,7 @@ header {
   span {
     float: right;
     font-size: 7pt;
+    padding-top: 0.3rem;
   }
   div[role='slider'] {
     width: 60%;
@@ -243,6 +242,7 @@ header {
   *[class^='icon'] {
     display: block;
     margin: 1rem 0.5rem;
+    font-family: 'MozTT-Regular' !important;
     
     &:nth-of-type(2) {
       padding-top: 0.5rem;
@@ -275,6 +275,7 @@ header {
     display: table-row;
     vertical-align: top;
     margin-top: 1rem;
+    width: 100%;
   }
   .bottom {
     width: 100%;
diff --git a/Shared/js/events.js b/Shared/js/events.js
index dcf1e3b..9f760f6 100755
--- a/Shared/js/events.js
+++ b/Shared/js/events.js
@@ -1,6 +1,5 @@
 "use strict";
 
-$(window).resize(sizeAndPos);
 $(document).ready(function() {
   $('.menu').on('click tap', function() {
     $('#menu').toggleClass('pulled');
@@ -10,7 +9,7 @@ $(document).ready(function() {
   })
   $('.load').on('click tap', function() {
     $('#load').removeClass('hidden');
-    $('#load li').remove();
+    $('#load li, #load p').remove();
     var list = JSON.parse(localStorage.getItem('projects'));
     if( !list || list.length < 1 ) {
       $('#load ol').append(
@@ -29,16 +28,10 @@ $(document).ready(function() {
       $(this).attr('aria-selected', 'true');
     })
     $('#pro').on('click tap', function() {
-      $('#save ol:nth-of-type(2) li').each(function() {
-        if( $(this).find('span').html() !== 'Transparent' ) {
-          $(this).addClass('hidden');
-          $(this).removeAttr('aria-selected');
-        }
-        else $(this).attr('aria-selected', 'true');
-      })
+      $('#save ol:nth-of-type(2)').addClass('hidden');
     })
     $('#exp').on('click tap', function() {
-      $('#save ol:nth-of-type(2) li').removeClass('hidden');
+      $('#save ol:nth-of-type(2)').removeClass('hidden');
     })
   })
   $('#pro').on('click tap', function() {
@@ -112,6 +105,14 @@ $(document).ready(function() {
       points: window.points.slice(0)
     })
     window.points.history.last = window.points.history.length-1;
+  }).on('longTap', function(e) {
+    if( settings.type == 'line' ) {
+      e.preventDefault();
+      window.active = false;
+      points[points.length-1].type = '';
+      points[points.length-1].start = undefined;
+      finishLine();
+    }
   })
   
   // Value Selector
@@ -181,6 +182,12 @@ $(document).ready(function() {
       return $(this).on('click tap', function() {
         $('.picker').removeClass('hidden');
         $('.picker').attr('data-caller', target);
+        setTimeout(function() {
+          $('body').on('click tap', 'canvas, #menu, header', function() {
+            $('.picker').addClass('hidden');
+            $('body').off('click tap');
+          })
+        }, 500);
       })
     }
     $(this).on('click tap', function(e) {
@@ -229,6 +236,7 @@ $(document).ready(function() {
   
   $('.close, .tour button').on('click tap', function() {
     $(this).parent().addClass('hidden');
+    $('body').off('click tap');
   })
 
   // Bottom
diff --git a/Web/index.html b/Web/index.html
index 3fa2c1e..43e8e20 100755
--- a/Web/index.html
+++ b/Web/index.html
@@ -44,7 +44,7 @@
           <hr>
           <div class='sketch'>
             <p class='icon-settings'>Sketch</p>
-            <p id='connectTelorance'>Connet Telorance<span>40</span></p>
+            <p id='connectTelorance'>Telorance<span>40</span></p>
             <div role="slider" class='connectTelorance'>
               <div>
                 <progress value="40" min="1" max="100"></progress>
@@ -55,7 +55,7 @@
 
           <div class='fur hidden'>
             <p class='icon-settings'>Fur</p>
-            <p id='connectTelorance'>Connet Telorance<span>40</span></p>
+            <p id='connectTelorance'>Telorance<span>40</span></p>
             <div role="slider" class='connectTelorance'>
               <div>
                 <progress value="40" min="10" max="100"></progress>
diff --git a/Web/js/main.js b/Web/js/main.js
index 84b1954..a79758c 100755
--- a/Web/js/main.js
+++ b/Web/js/main.js
@@ -8,6 +8,7 @@ $(document).ready(function() {
     nope: ['js/libs/color-picker.js']
   })
 
+  $(window).resize(sizeAndPos);
 
   function save() {
     switch(save.background) {
diff --git a/build/mobile/css/main.css b/build/mobile/css/main.css
index e2da7ab..f5366f4 100644
--- a/build/mobile/css/main.css
+++ b/build/mobile/css/main.css
@@ -364,6 +364,7 @@ body {
   overflow: hidden;
   width: 100%;
   height: 100%;
+  position: absolute;
 }
 *::-moz-focus-inner {
   border: none;
@@ -527,23 +528,21 @@ header #title {
   left: -2rem;
 }
 #menu {
-  width: 15rem;
+  width: 15.4rem;
   height: 100%;
   display: block;
   background: #262626;
   position: absolute;
-  left: -15rem;
+  left: -15.4rem;
   top: 5rem;
   color: white;
-  font-family: 'MozTT-Light';
-  font-size: 8pt;
-  transition: left 0.2s ease-out;
+  transition: left 0.3s ease-out;
   border-collapse: collapse;
-  overflow-y: auto;
+  overflow: hidden;
 }
 #menu.pulled {
   left: 0;
-  transition: left 0.2s ease-out;
+  transition: left 0.3s ease-out;
 }
 #menu button[id^='set'],
 #menu p,
@@ -554,8 +553,8 @@ header #title {
   color: white;
   text-align: left;
   margin: 1rem 2.5rem;
-  font-family: 'MozTT-Light';
-  font-size: 8pt;
+  font-family: 'MozTT-Light' !important;
+  font-size: 9pt;
   padding: 0 0.6rem;
   cursor: pointer;
 }
@@ -565,6 +564,7 @@ header #title {
 #menu span {
   float: right;
   font-size: 7pt;
+  padding-top: 0.3rem;
 }
 #menu div[role='slider'] {
   width: 60%;
@@ -588,6 +588,7 @@ header #title {
 #menu *[class^='icon'] {
   display: block;
   margin: 1rem 0.5rem;
+  font-family: 'MozTT-Regular' !important;
 }
 #menu *[class^='icon']:nth-of-type(2) {
   padding-top: 0.5rem;
@@ -617,6 +618,7 @@ header #title {
   display: table-row;
   vertical-align: top;
   margin-top: 1rem;
+  width: 100%;
 }
 #menu .bottom {
   width: 100%;
diff --git a/build/mobile/index.html b/build/mobile/index.html
index ecb646d..a183641 100644
--- a/build/mobile/index.html
+++ b/build/mobile/index.html
@@ -42,7 +42,7 @@
           <hr>
           <div class='sketch'>
             <p class='icon-settings'>Sketch</p>
-            <p id='connectTelorance'>Connet Telorance<span>40</span></p>
+            <p id='connectTelorance'>Telorance<span>40</span></p>
             <div role="slider" class='connectTelorance'>
               <div>
                 <progress value="40" min="1" max="100"></progress>
@@ -53,7 +53,7 @@
 
           <div class='fur hidden'>
             <p class='icon-settings'>Fur</p>
-            <p id='connectTelorance'>Connet Telorance<span>40</span></p>
+            <p id='connectTelorance'>Telorance<span>40</span></p>
             <div role="slider" class='connectTelorance'>
               <div>
                 <progress value="40" min="10" max="100"></progress>
@@ -254,7 +254,6 @@
     <script src='js/libs/color-picker-touch.js'></script>
     <script src='js/functions.js'></script>
     <script src='js/shared.js'></script>
-    <script src='js/main.js'></script>
     <script src='js/events.js'></script>
     <script src='js/diff.js'></script>
 
diff --git a/build/mobile/js/diff.js b/build/mobile/js/diff.js
index 417dc8b..7550d16 100644
--- a/build/mobile/js/diff.js
+++ b/build/mobile/js/diff.js
@@ -1 +1 @@
-$(document).ready(function(){$("*").off("click mousemove mousedown mouseup mouseleave").on("click mousemove mousedown mouseup mouseleave",function(a){return a.preventDefault,!1}),$('a[href^="http"]').tap(function(a){a.preventDefault();{var b=$(this).attr("href");new MozActivity({name:"view",data:{type:"url",url:b}})}}),$('a[href^="mailto"]').tap(function(a){a.preventDefault();var b=/mailto:(.*)/.exec($(this).attr("href"))[1],b=new MozActivity({name:"new",data:{type:"mail",url:b}})}),window.save=function(){switch(save.background){case"white":c.fillStyle="white",c.globalCompositeOperation="destination-over",c.fillRect(0,0,width(),height()),c.fillStyle=settings.color,c.globalCompositeOperation=settings.composite;break;case"current color":c.fillStyle=settings.bg,c.globalCompositeOperation="destination-over",c.fillRect(0,0,width(),height()),c.globalCompositeOperation=settings.composite}var a=$c[0].toDataURL();if("sketchy project"==save.type){var b,d=JSON.parse(localStorage.getItem("projects"));d&&d.some(function(a,c){return a.name==save["file name"]?(b=c,!0):!1})?(console.log(b),d[b]={name:save["file name"],data:a,points:window.points,settings:settings},localStorage.setItem("projects",JSON.stringify(d))):d?d.push({name:save["file name"],data:a,points:window.points}):d=[{name:save["file name"],data:a,points:window.points}],localStorage.setItem("projects",JSON.stringify(d))}else window.open(a,"_blank").focus();c.putImageData(window.points.history[window.points.history.last].data,0,0)},window.load=function(){var a=JSON.parse(localStorage.getItem("projects")).filter(function(a){return a.name==load.file})[0],b=document.createElement("img");b.src=a.data,b.onload=function(){c.clearRect(0,0,width(),height()),c.drawImage(b,0,0),window.points=a.points,window.points.history=[{data:c.createImageData($c.width(),$c.height()),points:[]},{data:c.getImageData(0,0,width(),height()),points:a.points}],$c.first().css("background",a.settings.bg),window.settings.bg=a.settings.bg}},localStorage.getItem("sawTips")!=settings.version&&($(".tour").removeClass("hidden"),localStorage.setItem("sawTips",settings.version))});
\ No newline at end of file
+$(document).ready(function(){$("*").off("click mousemove mousedown mouseup mouseleave").on("click mousemove mousedown mouseup mouseleave",function(a){a.preventDefault}),$('a[href^="http"]').tap(function(a){a.preventDefault();{var b=$(this).attr("href");new MozActivity({name:"view",data:{type:"url",url:b}})}}),$('a[href^="mailto"]').tap(function(a){a.preventDefault();new MozActivity({name:"new",data:{type:"mail",url:$(this).attr("href")}})}),window.save=function(){var a=c.getImageData(0,0,width(),height());switch(save.background){case"white":c.fillStyle="white",c.globalCompositeOperation="destination-over",c.fillRect(0,0,width(),height()),c.fillStyle=settings.color,c.globalCompositeOperation=settings.composite;break;case"current color":c.fillStyle=settings.bg,c.globalCompositeOperation="destination-over",c.fillRect(0,0,width(),height()),c.globalCompositeOperation=settings.composite}var b=$c[0].toDataURL();if("sketchy project"==save.type){var d,e=JSON.parse(localStorage.getItem("projects"));e&&e.some(function(a,b){return a.name==save["file name"]?(d=b,!0):!1})?(console.log(d),e[d]={name:save["file name"],data:b,points:window.points,settings:settings},localStorage.setItem("projects",JSON.stringify(e))):(e?e.push({name:save["file name"],data:b,points:window.points}):e=[{name:save["file name"],data:b,points:window.points}],localStorage.setItem("projects",JSON.stringify(e)))}else{var f=navigator.getDeviceStorage("pictures"),g=dataToBlob(b),h=f.addNamed(g,save["file name"]+".png");h.onsuccess=function(){alert("Your Sketch was saved successfuly: "+this.result)},h.onerror=function(a){alert("Something bad happened trying to save your sketch "+save["file name"]+"\n Possible reasons:\n Duplicate Name \n Not enough permission"),console.log(a),console.log(this)}}c.putImageData(a,0,0)},window.load=function(){var a=JSON.parse(localStorage.getItem("projects")).filter(function(a){return a.name==load.file})[0],b=document.createElement("img");b.src=a.data,b.onload=function(){c.clearRect(0,0,width(),height()),c.drawImage(b,0,0),window.points=a.points,window.points.history=[{data:c.createImageData($c.width(),$c.height()),points:[]},{data:c.getImageData(0,0,width(),height()),points:a.points}],$c.first().css("background",a.settings.bg),window.settings.bg=a.settings.bg}},localStorage.getItem("sawTips")!=settings.version&&($(".tour").removeClass("hidden"),localStorage.setItem("sawTips",settings.version))});
\ No newline at end of file
diff --git a/build/mobile/js/events.js b/build/mobile/js/events.js
index 6c0a2e6..65c45ed 100644
--- a/build/mobile/js/events.js
+++ b/build/mobile/js/events.js
@@ -1 +1 @@
-"use strict";$(window).resize(sizeAndPos),$(document).ready(function(){$(".menu").on("click tap",function(){$("#menu").toggleClass("pulled")}),$(".save").on("click tap",function(){$("#save").removeClass("hidden")}),$(".load").on("click tap",function(){$("#load").removeClass("hidden"),$("#load li").remove();var a=JSON.parse(localStorage.getItem("projects"));if(!a||a.length<1)return void $("#load ol").append($("<p>No sketch found.</p>"));for(var c=0,d=a.length;d>c;c++)$("#load ol").append($("<li><label><span>"+a[c].name+"</span></label></li>"));b.find("li").off("click").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true")}),$("#pro").on("click tap",function(){$("#save ol:nth-of-type(2) li").each(function(){"Transparent"!==$(this).find("span").html()?($(this).addClass("hidden"),$(this).removeAttr("aria-selected")):$(this).attr("aria-selected","true")})}),$("#exp").on("click tap",function(){$("#save ol:nth-of-type(2) li").removeClass("hidden")})}),$("#pro").on("click tap",function(){$("#save ol:nth-of-type(2) li").each(function(){"Transparent"!==$(this).find("span").html()?($(this).addClass("hidden"),$(this).removeAttr("aria-selected")):$(this).attr("aria-selected","true")})}),$("#exp").on("click tap",function(){$("#save ol:nth-of-type(2) li").removeClass("hidden")}),$c.last().on("mousedown touchstart",function(a){a.preventDefault(),a.changedTouches&&(a=a.changedTouches[0]);var b=relative(a.pageX,a.pageY);startPoint(b.x,b.y),window.active=!0}).on("mousemove touchmove",function(a){if(a.preventDefault(),a.changedTouches&&(a=a.changedTouches[0]),window.active&&"line"!=settings.type){var b=relative(a.pageX,a.pageY);drawPoint(b.x,b.y)}}).on("mouseup touchend",function(a){if(a.preventDefault(),window.active=!1,"eraser"!=settings.type){if(window.points.history.last<window.points.history.length-1&&window.points.history.splice(window.points.history.last+1),"shape"==settings.type){var b=settings.comShape;switch(o.clear(),c.beginPath(),c.fillStyle=settings.color,c.strokeStyle=settings.color,c.lineWidth=settings.lineWidth/20,b.type){case"circle":c.arc(b.x,b.y,b.radius,0,2*Math.PI);break;case"rectangle":c.rect(b.x,b.y,b.w,b.h);break;case"triangle":c.moveTo(b.start.x+b.dix,b.start.y),c.lineTo(b.x,b.y),c.lineTo(b.start.x,b.y),c.lineTo(b.start.x+b.dix,b.start.y)}settings.fill&&c.fill(),settings.stroke&&c.stroke()}"line"!=settings.type&&(window.points.history.push({data:c.getImageData(0,0,width(),height()),points:window.points.slice(0)}),window.points.history.last=window.points.history.length-1)}});var a=$("form.single");a.find("li").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true");var a=$(this).parents("form").attr("id"),b=$(this).find("label span").html().toLowerCase(),c=$(this).attr("data-target");window.settings[a]=b,$('button[id="set'+a+'"] span').html(b[0].toUpperCase()+b.substr(1)),c&&($("#menu div.options > div").addClass("hidden"),$("#menu div.options > .general, #menu div.options > ."+c).removeClass("hidden")),$(this).parents("form").addClass("hidden")}),a.submit(function(a){a.preventDefault(),$(this).addClass("hidden")});var b=$("form.confirm");b.each(function(){$(this).find("li").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true")}),$(this).find("button").last().on("click tap",function(a){a.preventDefault();var b=$(this).parents("form").attr("id");$(this).parents("form").find("h1").each(function(a){if(a>0){var c=$(this).html().toLowerCase(),d=$(this).parent().find("ol:nth-of-type("+a+") li[aria-selected] span").html();"file name"!==c&&"file"!==c&&(d=d.toLowerCase()),window[b][c]=d}}),$(this).parents("form").addClass("hidden"),window[b]()}),$(this).find("button").first().on("click tap",function(a){a.preventDefault(),$(this).parents("form").addClass("hidden")})});var d=$('button[id^="set"]');d.each(function(){var a=/set(.*)/.exec($(this).attr("id"))[1];return"color"==a||"bg"==a?$(this).on("click tap",function(){$(".picker").removeClass("hidden"),$(".picker").attr("data-caller",a)}):void $(this).on("click tap",function(b){b.preventDefault(),$('form[id="'+a+'"]').removeClass("hidden")})});var e;$('div[role="slider"] button').on("mousedown touchstart",function(){$(this).attr("data-moving","true"),e||(e=$('div[role="slider"] button').offset().left)}).on("mousemove touchmove",function(a){if($(this).attr("data-moving")){a.changedTouches&&(a=a.changedTouches[0]);var b=parseInt(a.pageX-e-15),c=$("."+$(this).parents('div[role="slider"]').attr("class")),d=c.find("progress"),f=+d.attr("max"),g=+d.attr("min");if(f>=b&&b>=g){c.find("button").css("left",b+"%"),d.attr("value",b);var h=c.attr("class");settings[h]=b,$("#"+h+" span").html(b)}}}).on("mouseup mouseleave touchend",function(){$(this).removeAttr("data-moving")}),$(".fill, .stroke").on("click tap",function(){var a=$("."+$(this).attr("class")).find("span");"Yes"==a.html()?(a.html("No"),settings[$(this).attr("class")]=!1):(a.html("Yes"),settings[$(this).attr("class")]=!0)}),$(".close, .tour button").on("click tap",function(){$(this).parent().addClass("hidden")}),$("#clear").on("click tap",function(){c.clear();var a=window.points.history;window.points=[],window.points.history=a,window.points.history.last<window.points.history.length-1&&window.points.history.splice(window.points.history.last+1),window.points.history.push({data:c.getImageData(0,0,width(),height()),points:[]}),window.points.history.last=window.points.history.length-1}),$("#undo").on("click tap",undo),$("#redo").on("click tap",redo),$("#about").on("click tap",function(){$(".about").removeClass("hidden")}),window.mobile&&$("*").on("click mousemove mousedown mouseup mouseleave",function(){return!1})});
\ No newline at end of file
+"use strict";$(document).ready(function(){$(".menu").on("click tap",function(){$("#menu").toggleClass("pulled")}),$(".save").on("click tap",function(){$("#save").removeClass("hidden")}),$(".load").on("click tap",function(){$("#load").removeClass("hidden"),$("#load li, #load p").remove();var a=JSON.parse(localStorage.getItem("projects"));if(!a||a.length<1)return void $("#load ol").append($("<p>No sketch found.</p>"));for(var c=0,d=a.length;d>c;c++)$("#load ol").append($("<li><label><span>"+a[c].name+"</span></label></li>"));b.find("li").off("click").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true")}),$("#pro").on("click tap",function(){$("#save ol:nth-of-type(2)").addClass("hidden")}),$("#exp").on("click tap",function(){$("#save ol:nth-of-type(2)").removeClass("hidden")})}),$("#pro").on("click tap",function(){$("#save ol:nth-of-type(2) li").each(function(){"Transparent"!==$(this).find("span").html()?($(this).addClass("hidden"),$(this).removeAttr("aria-selected")):$(this).attr("aria-selected","true")})}),$("#exp").on("click tap",function(){$("#save ol:nth-of-type(2) li").removeClass("hidden")}),$c.last().on("mousedown touchstart",function(a){a.preventDefault(),a.changedTouches&&(a=a.changedTouches[0]);var b=relative(a.pageX,a.pageY);startPoint(b.x,b.y),window.active=!0}).on("mousemove touchmove",function(a){if(a.preventDefault(),a.changedTouches&&(a=a.changedTouches[0]),window.active&&"line"!=settings.type){var b=relative(a.pageX,a.pageY);drawPoint(b.x,b.y)}}).on("mouseup touchend",function(a){if(a.preventDefault(),window.active=!1,"eraser"!=settings.type){if(window.points.history.last<window.points.history.length-1&&window.points.history.splice(window.points.history.last+1),"shape"==settings.type){var b=settings.comShape;switch(o.clear(),c.beginPath(),c.fillStyle=settings.color,c.strokeStyle=settings.color,c.lineWidth=settings.lineWidth/20,b.type){case"circle":c.arc(b.x,b.y,b.radius,0,2*Math.PI);break;case"rectangle":c.rect(b.x,b.y,b.w,b.h);break;case"triangle":c.moveTo(b.start.x+b.dix,b.start.y),c.lineTo(b.x,b.y),c.lineTo(b.start.x,b.y),c.lineTo(b.start.x+b.dix,b.start.y)}settings.fill&&c.fill(),settings.stroke&&c.stroke()}"line"!=settings.type&&(window.points.history.push({data:c.getImageData(0,0,width(),height()),points:window.points.slice(0)}),window.points.history.last=window.points.history.length-1)}}).on("longTap",function(a){"line"==settings.type&&(a.preventDefault(),window.active=!1,points[points.length-1].type="",points[points.length-1].start=void 0,finishLine())});var a=$("form.single");a.find("li").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true");var a=$(this).parents("form").attr("id"),b=$(this).find("label span").html().toLowerCase(),c=$(this).attr("data-target");window.settings[a]=b,$('button[id="set'+a+'"] span').html(b[0].toUpperCase()+b.substr(1)),c&&($("#menu div.options > div").addClass("hidden"),$("#menu div.options > .general, #menu div.options > ."+c).removeClass("hidden")),$(this).parents("form").addClass("hidden")}),a.submit(function(a){a.preventDefault(),$(this).addClass("hidden")});var b=$("form.confirm");b.each(function(){$(this).find("li").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true")}),$(this).find("button").last().on("click tap",function(a){a.preventDefault();var b=$(this).parents("form").attr("id");$(this).parents("form").find("h1").each(function(a){if(a>0){var c=$(this).html().toLowerCase(),d=$(this).parent().find("ol:nth-of-type("+a+") li[aria-selected] span").html();"file name"!==c&&"file"!==c&&(d=d.toLowerCase()),window[b][c]=d}}),$(this).parents("form").addClass("hidden"),window[b]()}),$(this).find("button").first().on("click tap",function(a){a.preventDefault(),$(this).parents("form").addClass("hidden")})});var d=$('button[id^="set"]');d.each(function(){var a=/set(.*)/.exec($(this).attr("id"))[1];return"color"==a||"bg"==a?$(this).on("click tap",function(){$(".picker").removeClass("hidden"),$(".picker").attr("data-caller",a),setTimeout(function(){$("body").on("click tap","canvas, #menu, header",function(){$(".picker").addClass("hidden"),$("body").off("click tap")})},500)}):void $(this).on("click tap",function(b){b.preventDefault(),$('form[id="'+a+'"]').removeClass("hidden")})});var e;$('div[role="slider"] button').on("mousedown touchstart",function(){$(this).attr("data-moving","true"),e||(e=$('div[role="slider"] button').offset().left)}).on("mousemove touchmove",function(a){if($(this).attr("data-moving")){a.changedTouches&&(a=a.changedTouches[0]);var b=parseInt(a.pageX-e-15),c=$("."+$(this).parents('div[role="slider"]').attr("class")),d=c.find("progress"),f=+d.attr("max"),g=+d.attr("min");if(f>=b&&b>=g){c.find("button").css("left",b+"%"),d.attr("value",b);var h=c.attr("class");settings[h]=b,$("#"+h+" span").html(b)}}}).on("mouseup mouseleave touchend",function(){$(this).removeAttr("data-moving")}),$(".fill, .stroke").on("click tap",function(){var a=$("."+$(this).attr("class")).find("span");"Yes"==a.html()?(a.html("No"),settings[$(this).attr("class")]=!1):(a.html("Yes"),settings[$(this).attr("class")]=!0)}),$(".close, .tour button").on("click tap",function(){$(this).parent().addClass("hidden"),$("body").off("click tap")}),$("#clear").on("click tap",function(){c.clear();var a=window.points.history;window.points=[],window.points.history=a,window.points.history.last<window.points.history.length-1&&window.points.history.splice(window.points.history.last+1),window.points.history.push({data:c.getImageData(0,0,width(),height()),points:[]}),window.points.history.last=window.points.history.length-1}),$("#undo").on("click tap",undo),$("#redo").on("click tap",redo),$("#about").on("click tap",function(){$(".about").removeClass("hidden")}),window.mobile&&$("*").on("click mousemove mousedown mouseup mouseleave",function(){return!1})});
\ No newline at end of file
diff --git a/build/mobile/manifest.webapp b/build/mobile/manifest.webapp
index e644881..b384d60 100644
--- a/build/mobile/manifest.webapp
+++ b/build/mobile/manifest.webapp
@@ -35,7 +35,7 @@
   ],
   "permissions": {
     "device-storage:pictures": {
-      "description": "Required to save sketched pics",
+      "description": "Required to save sketches",
       "access": "readwrite"
     }
   }
diff --git a/build/web/css/main.css b/build/web/css/main.css
index e2da7ab..f5366f4 100644
--- a/build/web/css/main.css
+++ b/build/web/css/main.css
@@ -364,6 +364,7 @@ body {
   overflow: hidden;
   width: 100%;
   height: 100%;
+  position: absolute;
 }
 *::-moz-focus-inner {
   border: none;
@@ -527,23 +528,21 @@ header #title {
   left: -2rem;
 }
 #menu {
-  width: 15rem;
+  width: 15.4rem;
   height: 100%;
   display: block;
   background: #262626;
   position: absolute;
-  left: -15rem;
+  left: -15.4rem;
   top: 5rem;
   color: white;
-  font-family: 'MozTT-Light';
-  font-size: 8pt;
-  transition: left 0.2s ease-out;
+  transition: left 0.3s ease-out;
   border-collapse: collapse;
-  overflow-y: auto;
+  overflow: hidden;
 }
 #menu.pulled {
   left: 0;
-  transition: left 0.2s ease-out;
+  transition: left 0.3s ease-out;
 }
 #menu button[id^='set'],
 #menu p,
@@ -554,8 +553,8 @@ header #title {
   color: white;
   text-align: left;
   margin: 1rem 2.5rem;
-  font-family: 'MozTT-Light';
-  font-size: 8pt;
+  font-family: 'MozTT-Light' !important;
+  font-size: 9pt;
   padding: 0 0.6rem;
   cursor: pointer;
 }
@@ -565,6 +564,7 @@ header #title {
 #menu span {
   float: right;
   font-size: 7pt;
+  padding-top: 0.3rem;
 }
 #menu div[role='slider'] {
   width: 60%;
@@ -588,6 +588,7 @@ header #title {
 #menu *[class^='icon'] {
   display: block;
   margin: 1rem 0.5rem;
+  font-family: 'MozTT-Regular' !important;
 }
 #menu *[class^='icon']:nth-of-type(2) {
   padding-top: 0.5rem;
@@ -617,6 +618,7 @@ header #title {
   display: table-row;
   vertical-align: top;
   margin-top: 1rem;
+  width: 100%;
 }
 #menu .bottom {
   width: 100%;
diff --git a/build/web/index.html b/build/web/index.html
index 3fa2c1e..43e8e20 100644
--- a/build/web/index.html
+++ b/build/web/index.html
@@ -44,7 +44,7 @@
           <hr>
           <div class='sketch'>
             <p class='icon-settings'>Sketch</p>
-            <p id='connectTelorance'>Connet Telorance<span>40</span></p>
+            <p id='connectTelorance'>Telorance<span>40</span></p>
             <div role="slider" class='connectTelorance'>
               <div>
                 <progress value="40" min="1" max="100"></progress>
@@ -55,7 +55,7 @@
 
           <div class='fur hidden'>
             <p class='icon-settings'>Fur</p>
-            <p id='connectTelorance'>Connet Telorance<span>40</span></p>
+            <p id='connectTelorance'>Telorance<span>40</span></p>
             <div role="slider" class='connectTelorance'>
               <div>
                 <progress value="40" min="10" max="100"></progress>
diff --git a/build/web/js/events.js b/build/web/js/events.js
index 6c0a2e6..65c45ed 100644
--- a/build/web/js/events.js
+++ b/build/web/js/events.js
@@ -1 +1 @@
-"use strict";$(window).resize(sizeAndPos),$(document).ready(function(){$(".menu").on("click tap",function(){$("#menu").toggleClass("pulled")}),$(".save").on("click tap",function(){$("#save").removeClass("hidden")}),$(".load").on("click tap",function(){$("#load").removeClass("hidden"),$("#load li").remove();var a=JSON.parse(localStorage.getItem("projects"));if(!a||a.length<1)return void $("#load ol").append($("<p>No sketch found.</p>"));for(var c=0,d=a.length;d>c;c++)$("#load ol").append($("<li><label><span>"+a[c].name+"</span></label></li>"));b.find("li").off("click").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true")}),$("#pro").on("click tap",function(){$("#save ol:nth-of-type(2) li").each(function(){"Transparent"!==$(this).find("span").html()?($(this).addClass("hidden"),$(this).removeAttr("aria-selected")):$(this).attr("aria-selected","true")})}),$("#exp").on("click tap",function(){$("#save ol:nth-of-type(2) li").removeClass("hidden")})}),$("#pro").on("click tap",function(){$("#save ol:nth-of-type(2) li").each(function(){"Transparent"!==$(this).find("span").html()?($(this).addClass("hidden"),$(this).removeAttr("aria-selected")):$(this).attr("aria-selected","true")})}),$("#exp").on("click tap",function(){$("#save ol:nth-of-type(2) li").removeClass("hidden")}),$c.last().on("mousedown touchstart",function(a){a.preventDefault(),a.changedTouches&&(a=a.changedTouches[0]);var b=relative(a.pageX,a.pageY);startPoint(b.x,b.y),window.active=!0}).on("mousemove touchmove",function(a){if(a.preventDefault(),a.changedTouches&&(a=a.changedTouches[0]),window.active&&"line"!=settings.type){var b=relative(a.pageX,a.pageY);drawPoint(b.x,b.y)}}).on("mouseup touchend",function(a){if(a.preventDefault(),window.active=!1,"eraser"!=settings.type){if(window.points.history.last<window.points.history.length-1&&window.points.history.splice(window.points.history.last+1),"shape"==settings.type){var b=settings.comShape;switch(o.clear(),c.beginPath(),c.fillStyle=settings.color,c.strokeStyle=settings.color,c.lineWidth=settings.lineWidth/20,b.type){case"circle":c.arc(b.x,b.y,b.radius,0,2*Math.PI);break;case"rectangle":c.rect(b.x,b.y,b.w,b.h);break;case"triangle":c.moveTo(b.start.x+b.dix,b.start.y),c.lineTo(b.x,b.y),c.lineTo(b.start.x,b.y),c.lineTo(b.start.x+b.dix,b.start.y)}settings.fill&&c.fill(),settings.stroke&&c.stroke()}"line"!=settings.type&&(window.points.history.push({data:c.getImageData(0,0,width(),height()),points:window.points.slice(0)}),window.points.history.last=window.points.history.length-1)}});var a=$("form.single");a.find("li").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true");var a=$(this).parents("form").attr("id"),b=$(this).find("label span").html().toLowerCase(),c=$(this).attr("data-target");window.settings[a]=b,$('button[id="set'+a+'"] span').html(b[0].toUpperCase()+b.substr(1)),c&&($("#menu div.options > div").addClass("hidden"),$("#menu div.options > .general, #menu div.options > ."+c).removeClass("hidden")),$(this).parents("form").addClass("hidden")}),a.submit(function(a){a.preventDefault(),$(this).addClass("hidden")});var b=$("form.confirm");b.each(function(){$(this).find("li").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true")}),$(this).find("button").last().on("click tap",function(a){a.preventDefault();var b=$(this).parents("form").attr("id");$(this).parents("form").find("h1").each(function(a){if(a>0){var c=$(this).html().toLowerCase(),d=$(this).parent().find("ol:nth-of-type("+a+") li[aria-selected] span").html();"file name"!==c&&"file"!==c&&(d=d.toLowerCase()),window[b][c]=d}}),$(this).parents("form").addClass("hidden"),window[b]()}),$(this).find("button").first().on("click tap",function(a){a.preventDefault(),$(this).parents("form").addClass("hidden")})});var d=$('button[id^="set"]');d.each(function(){var a=/set(.*)/.exec($(this).attr("id"))[1];return"color"==a||"bg"==a?$(this).on("click tap",function(){$(".picker").removeClass("hidden"),$(".picker").attr("data-caller",a)}):void $(this).on("click tap",function(b){b.preventDefault(),$('form[id="'+a+'"]').removeClass("hidden")})});var e;$('div[role="slider"] button').on("mousedown touchstart",function(){$(this).attr("data-moving","true"),e||(e=$('div[role="slider"] button').offset().left)}).on("mousemove touchmove",function(a){if($(this).attr("data-moving")){a.changedTouches&&(a=a.changedTouches[0]);var b=parseInt(a.pageX-e-15),c=$("."+$(this).parents('div[role="slider"]').attr("class")),d=c.find("progress"),f=+d.attr("max"),g=+d.attr("min");if(f>=b&&b>=g){c.find("button").css("left",b+"%"),d.attr("value",b);var h=c.attr("class");settings[h]=b,$("#"+h+" span").html(b)}}}).on("mouseup mouseleave touchend",function(){$(this).removeAttr("data-moving")}),$(".fill, .stroke").on("click tap",function(){var a=$("."+$(this).attr("class")).find("span");"Yes"==a.html()?(a.html("No"),settings[$(this).attr("class")]=!1):(a.html("Yes"),settings[$(this).attr("class")]=!0)}),$(".close, .tour button").on("click tap",function(){$(this).parent().addClass("hidden")}),$("#clear").on("click tap",function(){c.clear();var a=window.points.history;window.points=[],window.points.history=a,window.points.history.last<window.points.history.length-1&&window.points.history.splice(window.points.history.last+1),window.points.history.push({data:c.getImageData(0,0,width(),height()),points:[]}),window.points.history.last=window.points.history.length-1}),$("#undo").on("click tap",undo),$("#redo").on("click tap",redo),$("#about").on("click tap",function(){$(".about").removeClass("hidden")}),window.mobile&&$("*").on("click mousemove mousedown mouseup mouseleave",function(){return!1})});
\ No newline at end of file
+"use strict";$(document).ready(function(){$(".menu").on("click tap",function(){$("#menu").toggleClass("pulled")}),$(".save").on("click tap",function(){$("#save").removeClass("hidden")}),$(".load").on("click tap",function(){$("#load").removeClass("hidden"),$("#load li, #load p").remove();var a=JSON.parse(localStorage.getItem("projects"));if(!a||a.length<1)return void $("#load ol").append($("<p>No sketch found.</p>"));for(var c=0,d=a.length;d>c;c++)$("#load ol").append($("<li><label><span>"+a[c].name+"</span></label></li>"));b.find("li").off("click").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true")}),$("#pro").on("click tap",function(){$("#save ol:nth-of-type(2)").addClass("hidden")}),$("#exp").on("click tap",function(){$("#save ol:nth-of-type(2)").removeClass("hidden")})}),$("#pro").on("click tap",function(){$("#save ol:nth-of-type(2) li").each(function(){"Transparent"!==$(this).find("span").html()?($(this).addClass("hidden"),$(this).removeAttr("aria-selected")):$(this).attr("aria-selected","true")})}),$("#exp").on("click tap",function(){$("#save ol:nth-of-type(2) li").removeClass("hidden")}),$c.last().on("mousedown touchstart",function(a){a.preventDefault(),a.changedTouches&&(a=a.changedTouches[0]);var b=relative(a.pageX,a.pageY);startPoint(b.x,b.y),window.active=!0}).on("mousemove touchmove",function(a){if(a.preventDefault(),a.changedTouches&&(a=a.changedTouches[0]),window.active&&"line"!=settings.type){var b=relative(a.pageX,a.pageY);drawPoint(b.x,b.y)}}).on("mouseup touchend",function(a){if(a.preventDefault(),window.active=!1,"eraser"!=settings.type){if(window.points.history.last<window.points.history.length-1&&window.points.history.splice(window.points.history.last+1),"shape"==settings.type){var b=settings.comShape;switch(o.clear(),c.beginPath(),c.fillStyle=settings.color,c.strokeStyle=settings.color,c.lineWidth=settings.lineWidth/20,b.type){case"circle":c.arc(b.x,b.y,b.radius,0,2*Math.PI);break;case"rectangle":c.rect(b.x,b.y,b.w,b.h);break;case"triangle":c.moveTo(b.start.x+b.dix,b.start.y),c.lineTo(b.x,b.y),c.lineTo(b.start.x,b.y),c.lineTo(b.start.x+b.dix,b.start.y)}settings.fill&&c.fill(),settings.stroke&&c.stroke()}"line"!=settings.type&&(window.points.history.push({data:c.getImageData(0,0,width(),height()),points:window.points.slice(0)}),window.points.history.last=window.points.history.length-1)}}).on("longTap",function(a){"line"==settings.type&&(a.preventDefault(),window.active=!1,points[points.length-1].type="",points[points.length-1].start=void 0,finishLine())});var a=$("form.single");a.find("li").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true");var a=$(this).parents("form").attr("id"),b=$(this).find("label span").html().toLowerCase(),c=$(this).attr("data-target");window.settings[a]=b,$('button[id="set'+a+'"] span').html(b[0].toUpperCase()+b.substr(1)),c&&($("#menu div.options > div").addClass("hidden"),$("#menu div.options > .general, #menu div.options > ."+c).removeClass("hidden")),$(this).parents("form").addClass("hidden")}),a.submit(function(a){a.preventDefault(),$(this).addClass("hidden")});var b=$("form.confirm");b.each(function(){$(this).find("li").on("click tap",function(){$(this).parent().find("li[aria-selected]").removeAttr("aria-selected"),$(this).attr("aria-selected","true")}),$(this).find("button").last().on("click tap",function(a){a.preventDefault();var b=$(this).parents("form").attr("id");$(this).parents("form").find("h1").each(function(a){if(a>0){var c=$(this).html().toLowerCase(),d=$(this).parent().find("ol:nth-of-type("+a+") li[aria-selected] span").html();"file name"!==c&&"file"!==c&&(d=d.toLowerCase()),window[b][c]=d}}),$(this).parents("form").addClass("hidden"),window[b]()}),$(this).find("button").first().on("click tap",function(a){a.preventDefault(),$(this).parents("form").addClass("hidden")})});var d=$('button[id^="set"]');d.each(function(){var a=/set(.*)/.exec($(this).attr("id"))[1];return"color"==a||"bg"==a?$(this).on("click tap",function(){$(".picker").removeClass("hidden"),$(".picker").attr("data-caller",a),setTimeout(function(){$("body").on("click tap","canvas, #menu, header",function(){$(".picker").addClass("hidden"),$("body").off("click tap")})},500)}):void $(this).on("click tap",function(b){b.preventDefault(),$('form[id="'+a+'"]').removeClass("hidden")})});var e;$('div[role="slider"] button').on("mousedown touchstart",function(){$(this).attr("data-moving","true"),e||(e=$('div[role="slider"] button').offset().left)}).on("mousemove touchmove",function(a){if($(this).attr("data-moving")){a.changedTouches&&(a=a.changedTouches[0]);var b=parseInt(a.pageX-e-15),c=$("."+$(this).parents('div[role="slider"]').attr("class")),d=c.find("progress"),f=+d.attr("max"),g=+d.attr("min");if(f>=b&&b>=g){c.find("button").css("left",b+"%"),d.attr("value",b);var h=c.attr("class");settings[h]=b,$("#"+h+" span").html(b)}}}).on("mouseup mouseleave touchend",function(){$(this).removeAttr("data-moving")}),$(".fill, .stroke").on("click tap",function(){var a=$("."+$(this).attr("class")).find("span");"Yes"==a.html()?(a.html("No"),settings[$(this).attr("class")]=!1):(a.html("Yes"),settings[$(this).attr("class")]=!0)}),$(".close, .tour button").on("click tap",function(){$(this).parent().addClass("hidden"),$("body").off("click tap")}),$("#clear").on("click tap",function(){c.clear();var a=window.points.history;window.points=[],window.points.history=a,window.points.history.last<window.points.history.length-1&&window.points.history.splice(window.points.history.last+1),window.points.history.push({data:c.getImageData(0,0,width(),height()),points:[]}),window.points.history.last=window.points.history.length-1}),$("#undo").on("click tap",undo),$("#redo").on("click tap",redo),$("#about").on("click tap",function(){$(".about").removeClass("hidden")}),window.mobile&&$("*").on("click mousemove mousedown mouseup mouseleave",function(){return!1})});
\ No newline at end of file
diff --git a/build/web/js/main.js b/build/web/js/main.js
index 2d7a55b..dbca542 100644
--- a/build/web/js/main.js
+++ b/build/web/js/main.js
@@ -1 +1 @@
-"use strict";$(document).ready(function(){function a(){switch(a.background){case"white":c.fillStyle="white",c.globalCompositeOperation="destination-over",c.fillRect(0,0,width(),height()),c.fillStyle=settings.color,c.globalCompositeOperation=settings.composite;break;case"current color":c.fillStyle=settings.bg,c.globalCompositeOperation="destination-over",c.fillRect(0,0,width(),height()),c.globalCompositeOperation=settings.composite}var b=$c[0].toDataURL();if("sketchy project"==a.type){var d,e=JSON.parse(localStorage.getItem("projects"));e&&e.some(function(b,c){return b.name==a["file name"]?(d=c,!0):!1})?(console.log(d),e[d]={name:a["file name"],data:b,points:window.points,settings:settings},localStorage.setItem("projects",JSON.stringify(e))):e?e.push({name:a["file name"],data:b,points:window.points}):e=[{name:a["file name"],data:b,points:window.points}],localStorage.setItem("projects",JSON.stringify(e))}else window.open(b,"_blank").focus();c.putImageData(window.points.history[window.points.history.last].data,0,0)}function b(){var a=JSON.parse(localStorage.getItem("projects")).filter(function(a){return a.name==b.file})[0],d=document.createElement("img");d.src=a.data,d.onload=function(){c.clearRect(0,0,width(),height()),c.drawImage(d,0,0),window.points=a.points,window.points.history=[{data:c.createImageData($c.width(),$c.height()),points:[]},{data:c.getImageData(0,0,width(),height()),points:a.points}],$c.first().css("background",a.settings.bg),window.settings.bg=a.settings.bg}}yepnope({test:window.mobile,yep:["js/mobile.js","js/libs/color-picker-touch.js"],nope:["js/libs/color-picker.js"]}),window.load=b,window.save=a});
\ No newline at end of file
+"use strict";$(document).ready(function(){function a(){switch(a.background){case"white":c.fillStyle="white",c.globalCompositeOperation="destination-over",c.fillRect(0,0,width(),height()),c.fillStyle=settings.color,c.globalCompositeOperation=settings.composite;break;case"current color":c.fillStyle=settings.bg,c.globalCompositeOperation="destination-over",c.fillRect(0,0,width(),height()),c.globalCompositeOperation=settings.composite}var b=$c[0].toDataURL();if("sketchy project"==a.type){var d,e=JSON.parse(localStorage.getItem("projects"));e&&e.some(function(b,c){return b.name==a["file name"]?(d=c,!0):!1})?(console.log(d),e[d]={name:a["file name"],data:b,points:window.points,settings:settings},localStorage.setItem("projects",JSON.stringify(e))):e?e.push({name:a["file name"],data:b,points:window.points}):e=[{name:a["file name"],data:b,points:window.points}],localStorage.setItem("projects",JSON.stringify(e))}else window.open(b,"_blank").focus();c.putImageData(window.points.history[window.points.history.last].data,0,0)}function b(){var a=JSON.parse(localStorage.getItem("projects")).filter(function(a){return a.name==b.file})[0],d=document.createElement("img");d.src=a.data,d.onload=function(){c.clearRect(0,0,width(),height()),c.drawImage(d,0,0),window.points=a.points,window.points.history=[{data:c.createImageData($c.width(),$c.height()),points:[]},{data:c.getImageData(0,0,width(),height()),points:a.points}],$c.first().css("background",a.settings.bg),window.settings.bg=a.settings.bg}}yepnope({test:window.mobile,yep:["js/mobile.js","js/libs/color-picker-touch.js"],nope:["js/libs/color-picker.js"]}),$(window).resize(sizeAndPos),window.load=b,window.save=a});
\ No newline at end of file