From bcbfd4f7183603256a64033957467e8ef5ccfccb Mon Sep 17 00:00:00 2001
From: Hardmath123 <hardmath123@gmail.com>
Date: Sat, 2 Nov 2013 16:00:36 -0700
Subject: [PATCH 1/8] Initial css changes

---
 index.html |  43 ++++++++++-----------
 player.css | 111 +++++++++++++++++++++++++++++++++++++++++++++++++++--
 2 files changed, 128 insertions(+), 26 deletions(-)

diff --git a/index.html b/index.html
index 5275ca3..1c9ee23 100755
--- a/index.html
+++ b/index.html
@@ -7,13 +7,6 @@
     <meta name="apple-mobile-web-app-capable" content="yes">
     <meta name="viewport" content="user-scalable=no, width=540" />
     <meta name="apple-mobile-web-app-status-bar-style" content="black">
-    <style type="text/css">
-        body {
-            background: #222;
-            color: #fff;
-            margin: 0;
-        }
-    </style>
     <link href="player.css" type="text/css" rel="stylesheet" />
     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
     <script src="js/util/Timer.js"></script>
@@ -38,6 +31,10 @@
     <script src="js/Interpreter.js"></script>
     <script src="js/Runtime.js"></script>
     <script src="js/Scratch.js"></script>
+    <script src="js/JSZip/jszip.js"></script>
+    <script src="js/JSZip/jszip-load.js"></script>
+    <script src="js/JSZip/jszip-inflate.js"></script>
+    <script src="js/IOzip.js"></script>
     <script type="text/javascript">
         if (window.location.hash) {
             var project_id = parseInt(window.location.hash.substr(1));
@@ -47,20 +44,22 @@
     </script>
   </head>
   <body>
-    <div id="up">&nbsp;</div>
-    <div id="left">&nbsp;</div>
-    <div id="overContainer">
-      <div id="greenSlide"><div id="greenSlideFg"><img src="img/greenflag.png"></div></div>
-      <div id="container"></div>
+    <div id="wrapper">
+        <h1>Scratch HTML5 player</h1>
+        <div id="up">
+        <div id="info">Loading...</div>
+        <button id="trigger_stop">&#9632;</button>
+        <button id="trigger_green_flag">&#9873;</button>
+        <div class="clearer"></div>
+        </div>
+        <div id="left">&nbsp;</div>
+        <div id="overContainer">
+          <div id="greenSlide"><div id="greenSlideFg"><img src="img/greenflag.png"></div></div>
+          <div id="container"></div>
+        </div>
+        <div id="right">&nbsp;</div>
+        <div id="down"><input type="text" name="project_id" id="project_id" /><button id='go_project'>Go!</button></div>
+        <p>The Scratch HTML5 player is still in development. Feedback is welcome! Please report any bugs (or differences from the Flash player) <a href="https://github.com/LLK/scratch-html5">on Github</a>.
     </div>
-    <div id="right">&nbsp;</div>
-    <div id="down">&nbsp;</div>
-    
-    <div id="info">Loading...</div>
-
-    <button id="trigger_green_flag">Green flag</button>
-    <button id="trigger_stop">Stop</button>
-
-    <input type="text" name="project_id" id="project_id" /><button id='go_project'>Go!</button>
   </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/player.css b/player.css
index b2f9174..e0d08d7 100644
--- a/player.css
+++ b/player.css
@@ -1,3 +1,22 @@
+body {
+    background: #fff;
+    color: #333;
+    margin: 0;
+    padding: 30px;
+    font-family: sans-serif;
+}
+
+/* Wrapper wraps the entire player, and the text below and above. Ideally,
+   all CSS selectors would be descendants of #wrapper so that the player
+   is embeddable.
+*/
+#wrapper {
+    width: 540px;
+    height: 420px;
+    margin:auto;
+}
+
+/* Container is the Stage */
 #container {
     border: none;
     cursor: default;
@@ -18,6 +37,7 @@
     user-select: none;  
 }
 
+/* The pane over a project with the green flag on startup. */
 #greenSlide {
     position: absolute;
     float: left;
@@ -25,6 +45,7 @@
     margin-left: 30px;
 }
 
+/* The green flag icon. */
 #greenSlideFg {
     background-color: #000;
     opacity: 0.4;
@@ -35,10 +56,37 @@
 }
 
 /* iPad arrow key frame */
-#up { width: 540px; height: 30px; clear: both; background-color: #333; }
-#left { float: left; width: 30px; height: 360px; background-color: #333; }
-#right { float: left; width: 30px; height: 360px; background-color: #333; }
-#down { width: 540px; height: 30px; clear: both; background-color: #333; }
+/*  This is the frame around the stage with various buttons. */
+/*  up and down are 30 + 480 + 30 pixels wide */
+/*  left and right are 360 pixels high */
+#up {
+    width: 540px;
+    height: 30px;
+    clear: both;
+    background-color: #eee;
+    border-top-left-radius: 10px;
+    border-top-right-radius: 10px;
+}
+#left {
+    float: left;
+    width: 30px;
+    height: 360px;
+    background-color: #eee;
+}
+#right {
+    float: left;
+    width: 30px;
+    height: 360px;
+    background-color: #eee;
+}
+#down {
+    width: 540px;
+    height: 30px;
+    clear: both;
+    background-color: #eee;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 10px;
+}
     
 /* Reporter styles */
 .reporter-normal {
@@ -137,3 +185,58 @@
     
     background: url(img/think-bottom.png) transparent no-repeat;
 }
+
+/* Button styling */
+button {
+    background-color: #ddd;
+    border-radius: 3px;
+    border-style: none;
+    cursor: pointer;
+    font-family: sans-serif;
+    width:30px;
+    padding: 3px;
+    margin:3px;
+    height: 24px;
+}
+button:hover {
+    background-color: #ccc;
+}
+#trigger_green_flag, #trigger_stop {
+    font-size: 20px;
+    width:24px;
+    margin:3px;
+    float:right;
+}
+#trigger_green_flag {
+    color:#050;
+}
+#trigger_stop {
+    color:#F33;
+    margin-right: 30px;
+}
+#clearer {
+    clear:both;
+}
+input[type=text] {
+    border-style: none;
+    border-radius: 4px;
+    font-family: sans-serif;
+    background-color: #ddd;
+    font-size: 14px;
+    padding:3px;
+    height:18px;
+    margin:3px;
+    margin-left: 30px;
+}
+input[type=text]:focus {
+    outline:none;
+    background-color: #ccc;
+}
+#info {
+    float:left;
+    margin-left: 30px;
+    height:24px;
+    padding:3px;
+    color:#aaa;
+    font-size:12px;
+}
\ No newline at end of file

From 7866a108af4e1b9670c2e6cfd0584c4e8ce1b242 Mon Sep 17 00:00:00 2001
From: Hardmath123 <hardmath123@gmail.com>
Date: Sat, 2 Nov 2013 16:32:58 -0700
Subject: [PATCH 2/8] Unicode arrow glyphs

---
 index.html | 20 ++++++++++++--------
 player.css | 44 +++++++++++++++++++++++++++++++++++++-------
 2 files changed, 49 insertions(+), 15 deletions(-)

diff --git a/index.html b/index.html
index 1c9ee23..f6bb42a 100755
--- a/index.html
+++ b/index.html
@@ -46,19 +46,23 @@
   <body>
     <div id="wrapper">
         <h1>Scratch HTML5 player</h1>
-        <div id="up">
-        <div id="info">Loading...</div>
-        <button id="trigger_stop">&#9632;</button>
-        <button id="trigger_green_flag">&#9873;</button>
-        <div class="clearer"></div>
+        <div id="up">&#x25B2;</div>
+        <div id="ui-top">
+            <div id="info">Loading...</div>
+            <button id="trigger_stop">&#9632;</button>
+            <button id="trigger_green_flag">&#9873;</button>
+            <div class="clearer"></div>
         </div>
-        <div id="left">&nbsp;</div>
+        <div id="left">&#x25c0;</div>
         <div id="overContainer">
           <div id="greenSlide"><div id="greenSlideFg"><img src="img/greenflag.png"></div></div>
           <div id="container"></div>
         </div>
-        <div id="right">&nbsp;</div>
-        <div id="down"><input type="text" name="project_id" id="project_id" /><button id='go_project'>Go!</button></div>
+        <div id="right">&#x25b6;</div>
+        <div id="ui-bottom">
+            http://scratch.mit.edu/projects/ <input type="text" name="project_id" id="project_id" />
+            <button id='go_project'>&rarr;</button></div>
+        <div id="down">&#x25BC;</div>
         <p>The Scratch HTML5 player is still in development. Feedback is welcome! Please report any bugs (or differences from the Flash player) <a href="https://github.com/LLK/scratch-html5">on Github</a>.
     </div>
   </body>
diff --git a/player.css b/player.css
index e0d08d7..40250b5 100644
--- a/player.css
+++ b/player.css
@@ -41,14 +41,14 @@ body {
 #greenSlide {
     position: absolute;
     float: left;
-    z-index: 500;
+    z-index: 500; /* Hmm, will this break after the 501st sprite? */
     margin-left: 30px;
 }
 
 /* The green flag icon. */
 #greenSlideFg {
     background-color: #000;
-    opacity: 0.4;
+    opacity: 0.2;
     width: 278px;
     height: 218px;
     padding-top: 142px;
@@ -57,35 +57,60 @@ body {
 
 /* iPad arrow key frame */
 /*  This is the frame around the stage with various buttons. */
-/*  up and down are 30 + 480 + 30 pixels wide */
-/*  left and right are 360 pixels high */
+#ui-top {
+    width: 540px;
+    height: 30px;
+    clear: both;
+    background-color: #eee;
+}
 #up {
+    padding-top:10px;
     width: 540px;
     height: 30px;
     clear: both;
     background-color: #eee;
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
+    text-align: center;
+
+    color:#ccc;
 }
 #left {
     float: left;
     width: 30px;
     height: 360px;
     background-color: #eee;
+    line-height: 360px;
+    color:#ccc;
+    text-align: center;
 }
 #right {
     float: left;
     width: 30px;
     height: 360px;
     background-color: #eee;
+    line-height: 360px;
+    color:#ccc;
+    text-align: center;
 }
 #down {
+    padding-top:10px;
     width: 540px;
     height: 30px;
-    clear: both;
     background-color: #eee;
+    text-align: center;
     border-bottom-left-radius: 10px;
     border-bottom-right-radius: 10px;
+
+    color:#ccc;
+}
+#ui-bottom {
+    width:480px;
+    height: 30px;
+    background-color: #eee;
+    padding-left: 30px;
+    padding-right: 30px;
+    clear: both;
 }
     
 /* Reporter styles */
@@ -190,18 +215,21 @@ body {
 button {
     background-color: #ddd;
     border-radius: 3px;
-    border-style: none;
     cursor: pointer;
+    border:none;
     font-family: sans-serif;
-    width:30px;
+    width:24px;
     padding: 3px;
     margin:3px;
     height: 24px;
+    background: -webkit-linear-gradient(#ddd, #ccc);
 }
 button:hover {
     background-color: #ccc;
+    background: -webkit-linear-gradient(#ccc, #bbb);
 }
 #trigger_green_flag, #trigger_stop {
+    padding-top:0px;
     font-size: 20px;
     width:24px;
     margin:3px;
@@ -213,6 +241,7 @@ button:hover {
 #trigger_stop {
     color:#F33;
     margin-right: 30px;
+    margin-left:0px;
 }
 #clearer {
     clear:both;
@@ -227,6 +256,7 @@ input[type=text] {
     height:18px;
     margin:3px;
     margin-left: 30px;
+    width:100px;
 }
 input[type=text]:focus {
     outline:none;

From ae86e1d43b1615b192dbf860fd3ef35f4e27601e Mon Sep 17 00:00:00 2001
From: Hardmath123 <hardmath123@gmail.com>
Date: Sun, 3 Nov 2013 17:57:46 -0800
Subject: [PATCH 3/8] Some final touch-ups

---
 index.html | 16 +++++++++++++---
 player.css | 38 ++++++++++++++++++++++++++++++--------
 2 files changed, 43 insertions(+), 11 deletions(-)

diff --git a/index.html b/index.html
index f6bb42a..c42d84e 100755
--- a/index.html
+++ b/index.html
@@ -42,13 +42,24 @@
             var project_id = 10000160; // Default project for display
         }
     </script>
+    <script type="text/javascript">
+        $(function() {
+            $("#project_id").keyup(function(){
+                if (isNaN(this.value)) {
+                    this.style.backgroundColor = "#FDD";
+                } else {
+                    this.style.backgroundColor = "#DFD";
+                }
+            })
+        });
+    </script>
   </head>
   <body>
     <div id="wrapper">
         <h1>Scratch HTML5 player</h1>
         <div id="up">&#x25B2;</div>
         <div id="ui-top">
-            <div id="info">Loading...</div>
+            <div id="info">Loading&hellip;</div>
             <button id="trigger_stop">&#9632;</button>
             <button id="trigger_green_flag">&#9873;</button>
             <div class="clearer"></div>
@@ -60,8 +71,7 @@
         </div>
         <div id="right">&#x25b6;</div>
         <div id="ui-bottom">
-            http://scratch.mit.edu/projects/ <input type="text" name="project_id" id="project_id" />
-            <button id='go_project'>&rarr;</button></div>
+            <span id="address-hint">http://scratch.mit.edu/projects/</span><input type="text" name="project_id" id="project_id" placeholder="10000160" /><button id='go_project'>&rarr;</button></div>
         <div id="down">&#x25BC;</div>
         <p>The Scratch HTML5 player is still in development. Feedback is welcome! Please report any bugs (or differences from the Flash player) <a href="https://github.com/LLK/scratch-html5">on Github</a>.
     </div>
diff --git a/player.css b/player.css
index 40250b5..4933483 100644
--- a/player.css
+++ b/player.css
@@ -111,6 +111,7 @@ body {
     padding-left: 30px;
     padding-right: 30px;
     clear: both;
+    text-align: right;
 }
     
 /* Reporter styles */
@@ -211,16 +212,26 @@ body {
     background: url(img/think-bottom.png) transparent no-repeat;
 }
 
+#info {
+    float:left;
+    margin-left: 30px;
+    height:24px;
+    padding:3px;
+    color:#aaa;
+    font-size:12px;
+}
+
 /* Button styling */
 button {
     background-color: #ddd;
     border-radius: 3px;
     cursor: pointer;
-    border:none;
+    border-style: none;
     font-family: sans-serif;
     width:24px;
     padding: 3px;
     margin:3px;
+    margin-top:0px;
     height: 24px;
     background: -webkit-linear-gradient(#ddd, #ccc);
 }
@@ -247,6 +258,7 @@ button:hover {
     clear:both;
 }
 input[type=text] {
+    display: inline-block;
     border-style: none;
     border-radius: 4px;
     font-family: sans-serif;
@@ -255,18 +267,28 @@ input[type=text] {
     padding:3px;
     height:18px;
     margin:3px;
-    margin-left: 30px;
     width:100px;
+    box-shadow: 0px 0px 5px inset black;
+    -webkit-box-shadow: 0px 0px 5px inset black;
 }
 input[type=text]:focus {
     outline:none;
     background-color: #ccc;
 }
-#info {
-    float:left;
-    margin-left: 30px;
-    height:24px;
-    padding:3px;
-    color:#aaa;
+
+#project_id {
+    text-align: center;
+}
+
+#address-hint {
     font-size:12px;
+}
+#go_project {
+    display: table-cell;
+    height:24px;
+    padding:0px;
+    margin-right: 0px;
+    margin-left: 0px;
+    margin-top: 3px;
+    margin-bottom: 0px;
 }
\ No newline at end of file

From 4d16d6b26816d1fac5b2cd3f527480d2072fcf60 Mon Sep 17 00:00:00 2001
From: Hardmath123 <hardmath123@gmail.com>
Date: Sun, 3 Nov 2013 17:59:42 -0800
Subject: [PATCH 4/8] Whoops--removed some of my junk...

---
 index.html | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/index.html b/index.html
index c42d84e..76ab24b 100755
--- a/index.html
+++ b/index.html
@@ -31,10 +31,6 @@
     <script src="js/Interpreter.js"></script>
     <script src="js/Runtime.js"></script>
     <script src="js/Scratch.js"></script>
-    <script src="js/JSZip/jszip.js"></script>
-    <script src="js/JSZip/jszip-load.js"></script>
-    <script src="js/JSZip/jszip-inflate.js"></script>
-    <script src="js/IOzip.js"></script>
     <script type="text/javascript">
         if (window.location.hash) {
             var project_id = parseInt(window.location.hash.substr(1));

From 5dee692345f61433b34f77de8a69e89fcb9f5409 Mon Sep 17 00:00:00 2001
From: Hardmath123 <hardmath123@gmail.com>
Date: Sun, 3 Nov 2013 18:46:05 -0800
Subject: [PATCH 5/8] Autoprefixed css.

---
 index.html |   2 +
 player.css | 423 +++++++++++++++++++++++++++--------------------------
 2 files changed, 218 insertions(+), 207 deletions(-)

diff --git a/index.html b/index.html
index 76ab24b..c90f3e2 100755
--- a/index.html
+++ b/index.html
@@ -41,6 +41,8 @@
     <script type="text/javascript">
         $(function() {
             $("#project_id").keyup(function(){
+                // Eventually, this will xhr to /projects/{{this.value}}/ and
+                // change color based on whether the response is 404 or 200.
                 if (isNaN(this.value)) {
                     this.style.backgroundColor = "#FDD";
                 } else {
diff --git a/player.css b/player.css
index 4933483..41234b9 100644
--- a/player.css
+++ b/player.css
@@ -1,294 +1,303 @@
 body {
-    background: #fff;
-    color: #333;
-    margin: 0;
-    padding: 30px;
-    font-family: sans-serif;
+  background: #fff;
+  color: #333;
+  margin: 0;
+  padding: 30px;
+  font-family: sans-serif;
 }
 
 /* Wrapper wraps the entire player, and the text below and above. Ideally,
    all CSS selectors would be descendants of #wrapper so that the player
    is embeddable.
 */
+
 #wrapper {
-    width: 540px;
-    height: 420px;
-    margin:auto;
+  width: 540px;
+  height: 420px;
+  margin: auto;
 }
 
 /* Container is the Stage */
+
 #container {
-    border: none;
-    cursor: default;
-    width: 480px;
-    height: 360px;
-    overflow: hidden;
-    position: relative;
-    float: left;
-    /* Before, we accomplished this with e.preventDefault
+  border: none;
+  cursor: default;
+  width: 480px;
+  height: 360px;
+  overflow: hidden;
+  position: relative;
+  float: left;
+  /* Before, we accomplished this with e.preventDefault
      * on the context div.  But, we'd like to use those click events
      * for some things like reporter sliders.
      */
-    -webkit-touch-callout: none;
-    -webkit-user-select: none;
-    -khtml-user-select: none;
-    -moz-user-select: none;
-    -ms-user-select: none;
-    user-select: none;  
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
 }
 
 /* The pane over a project with the green flag on startup. */
+
 #greenSlide {
-    position: absolute;
-    float: left;
-    z-index: 500; /* Hmm, will this break after the 501st sprite? */
-    margin-left: 30px;
+  position: absolute;
+  float: left;
+  z-index: 500;
+  /* Hmm, will this break after the 501st sprite? */
+  margin-left: 30px;
 }
 
 /* The green flag icon. */
+
 #greenSlideFg {
-    background-color: #000;
-    opacity: 0.2;
-    width: 278px;
-    height: 218px;
-    padding-top: 142px;
-    padding-left: 202px;;
+  background-color: #000;
+  opacity: 0.2;
+  width: 278px;
+  height: 218px;
+  padding-top: 142px;
+  padding-left: 202px;
 }
 
 /* iPad arrow key frame */
+
 /*  This is the frame around the stage with various buttons. */
+
 #ui-top {
-    width: 540px;
-    height: 30px;
-    clear: both;
-    background-color: #eee;
+  width: 540px;
+  height: 30px;
+  clear: both;
+  background-color: #eee;
 }
+
 #up {
-    padding-top:10px;
-    width: 540px;
-    height: 30px;
-    clear: both;
-    background-color: #eee;
-    border-top-left-radius: 10px;
-    border-top-right-radius: 10px;
-    text-align: center;
-
-    color:#ccc;
+  padding-top: 10px;
+  width: 540px;
+  height: 30px;
+  clear: both;
+  background-color: #eee;
+  border-top-left-radius: 10px;
+  border-top-right-radius: 10px;
+  text-align: center;
+  color: #ccc;
 }
+
 #left {
-    float: left;
-    width: 30px;
-    height: 360px;
-    background-color: #eee;
-    line-height: 360px;
-    color:#ccc;
-    text-align: center;
+  float: left;
+  width: 30px;
+  height: 360px;
+  background-color: #eee;
+  line-height: 360px;
+  color: #ccc;
+  text-align: center;
 }
+
 #right {
-    float: left;
-    width: 30px;
-    height: 360px;
-    background-color: #eee;
-    line-height: 360px;
-    color:#ccc;
-    text-align: center;
+  float: left;
+  width: 30px;
+  height: 360px;
+  background-color: #eee;
+  line-height: 360px;
+  color: #ccc;
+  text-align: center;
 }
+
 #down {
-    padding-top:10px;
-    width: 540px;
-    height: 30px;
-    background-color: #eee;
-    text-align: center;
-    border-bottom-left-radius: 10px;
-    border-bottom-right-radius: 10px;
-
-    color:#ccc;
+  padding-top: 10px;
+  width: 540px;
+  height: 30px;
+  background-color: #eee;
+  text-align: center;
+  border-bottom-left-radius: 10px;
+  border-bottom-right-radius: 10px;
+  color: #ccc;
 }
+
 #ui-bottom {
-    width:480px;
-    height: 30px;
-    background-color: #eee;
-    padding-left: 30px;
-    padding-right: 30px;
-    clear: both;
-    text-align: right;
+  width: 480px;
+  height: 30px;
+  background-color: #eee;
+  padding-left: 30px;
+  padding-right: 30px;
+  clear: both;
+  text-align: right;
 }
-    
+
 /* Reporter styles */
+
 .reporter-normal {
-    display: inline-block;
-    padding: 2px 5px 2px 5px;
-
-    background-color: rgb(193, 196, 199);
-    border: 1px solid rgb(130, 126, 126);
-    border-radius: 4px;
-
-    font-family: sans-serif;
-    font-size: 11px;
-    font-weight: bold;
-    color: #000;
-    
-    position: absolute;
+  display: inline-block;
+  padding: 2px 5px 2px 5px;
+  background-color: rgb(193, 196, 199);
+  border: 1px solid rgb(130, 126, 126);
+  border-radius: 4px;
+  font-family: sans-serif;
+  font-size: 11px;
+  font-weight: bold;
+  color: #000;
+  position: absolute;
 }
 
 .reporter-inset {
-    display: inline-block;
-    min-width: 40px;
-    margin-left: 5px;
-    padding: 1px;
-    
-    border: 1px solid #fff;
-    border-radius: 4px;
-    
-    box-shadow: inset 0 0 3px #fff;
-
-    text-align: center;
-    color: #fff;
+  display: inline-block;
+  min-width: 40px;
+  margin-left: 5px;
+  padding: 1px;
+  border: 1px solid #fff;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 0 3px #fff;
+  box-shadow: inset 0 0 3px #fff;
+  text-align: center;
+  color: #fff;
 }
 
 .reporter-large {
-    display: inline-block;
-    min-width: 40px;
-    padding: 2px 5px 1px 5px;
-
-    border-radius: 4px;
-
-    box-shadow: 0 -3px 3px -3px #fff inset, -3px 0 3px -3px #fff inset,
+  display: inline-block;
+  min-width: 40px;
+  padding: 2px 5px 1px 5px;
+  border-radius: 4px;
+  -webkit-box-shadow: 0 -3px 3px -3px #fff inset, -3px 0 3px -3px #fff inset,
                 0 3px 3px -3px #000 inset, 3px 0 3px -3px #000 inset;
-    
-    font-family: sans-serif;
-    font-size: 15px;
-    font-weight: bold;
-    text-align: center;
-    color: #fff;
-
-    position: absolute;
+  box-shadow: 0 -3px 3px -3px #fff inset, -3px 0 3px -3px #fff inset,
+                0 3px 3px -3px #000 inset, 3px 0 3px -3px #000 inset;
+  font-family: sans-serif;
+  font-size: 15px;
+  font-weight: bold;
+  text-align: center;
+  color: #fff;
+  position: absolute;
 }
 
 /* Say/think bubble styles */
+
 .bubble-container {
-    position: absolute;
+  position: absolute;
 }
 
 .bubble {
-    position: relative;
-    display: inline-block;
-    
-    max-width: 120px;
-    min-width: 40px;
-    padding: 6px 11px 6px 11px;
-    
-    border: 3px solid rgb(160, 160, 160);
-    border-radius: 10px;
-    
-    background: #fff;
-    
-    font-family: sans-serif;
-    font-weight: bold;
-    font-size: 14px;
-    color: #000;
-    text-align: center;
+  position: relative;
+  display: inline-block;
+  max-width: 120px;
+  min-width: 40px;
+  padding: 6px 11px 6px 11px;
+  border: 3px solid rgb(160, 160, 160);
+  border-radius: 10px;
+  background: #fff;
+  font-family: sans-serif;
+  font-weight: bold;
+  font-size: 14px;
+  color: #000;
+  text-align: center;
 }
 
 .bubble-say {
-    position: absolute;
-    
-    margin-top: -3px;
-    margin-left: 8px;
-    width: 44px;
-    height: 18px;
-    
-    background: url(img/say-bottom.png) transparent no-repeat;
+  position: absolute;
+  margin-top: -3px;
+  margin-left: 8px;
+  width: 44px;
+  height: 18px;
+  background: url(img/say-bottom.png) transparent no-repeat;
 }
 
 .bubble-think {
-    position: absolute;
-    
-    margin-top: 0px;
-    margin-left: 8px;
-    width: 44px;
-    height: 19px;
-    
-    background: url(img/think-bottom.png) transparent no-repeat;
+  position: absolute;
+  margin-top: 0px;
+  margin-left: 8px;
+  width: 44px;
+  height: 19px;
+  background: url(img/think-bottom.png) transparent no-repeat;
 }
 
 #info {
-    float:left;
-    margin-left: 30px;
-    height:24px;
-    padding:3px;
-    color:#aaa;
-    font-size:12px;
+  float: left;
+  margin-left: 30px;
+  height: 24px;
+  padding: 3px;
+  color: #aaa;
+  font-size: 12px;
 }
 
 /* Button styling */
+
 button {
-    background-color: #ddd;
-    border-radius: 3px;
-    cursor: pointer;
-    border-style: none;
-    font-family: sans-serif;
-    width:24px;
-    padding: 3px;
-    margin:3px;
-    margin-top:0px;
-    height: 24px;
-    background: -webkit-linear-gradient(#ddd, #ccc);
+  background-color: #ddd;
+  border-radius: 3px;
+  cursor: pointer;
+  border-style: none;
+  font-family: sans-serif;
+  width: 24px;
+  padding: 3px;
+  margin: 3px;
+  margin-top: 0px;
+  height: 24px;
+  background: -webkit-gradient(linear, top left, bottom left, from(#ddd), to(#ccc));
+  background: -webkit-linear-gradient(#ddd, #ccc);
+  background: linear-gradient(#ddd, #ccc);
 }
+
 button:hover {
-    background-color: #ccc;
-    background: -webkit-linear-gradient(#ccc, #bbb);
-}
-#trigger_green_flag, #trigger_stop {
-    padding-top:0px;
-    font-size: 20px;
-    width:24px;
-    margin:3px;
-    float:right;
-}
-#trigger_green_flag {
-    color:#050;
+  background-color: #ccc;
+  background: -webkit-gradient(linear, top left, bottom left, from(#ccc), to(#bbb));
+  background: -webkit-linear-gradient(#ccc, #bbb);
+  background: linear-gradient(#ccc, #bbb);
 }
+
+#trigger_green_flag,
 #trigger_stop {
-    color:#F33;
-    margin-right: 30px;
-    margin-left:0px;
+  padding-top: 0px;
+  font-size: 20px;
+  width: 24px;
+  margin: 3px;
+  float: right;
 }
+
+#trigger_green_flag {
+  color: #050;
+}
+
+#trigger_stop {
+  color: #F33;
+  margin-right: 30px;
+  margin-left: 0px;
+}
+
 #clearer {
-    clear:both;
+  clear: both;
 }
+
 input[type=text] {
-    display: inline-block;
-    border-style: none;
-    border-radius: 4px;
-    font-family: sans-serif;
-    background-color: #ddd;
-    font-size: 14px;
-    padding:3px;
-    height:18px;
-    margin:3px;
-    width:100px;
-    box-shadow: 0px 0px 5px inset black;
-    -webkit-box-shadow: 0px 0px 5px inset black;
+  display: inline-block;
+  border-style: none;
+  border-radius: 4px;
+  font-family: sans-serif;
+  background-color: #ddd;
+  font-size: 14px;
+  padding: 3px;
+  height: 18px;
+  margin: 3px;
+  width: 100px;
 }
+
 input[type=text]:focus {
-    outline:none;
-    background-color: #ccc;
+  outline: none;
+  background-color: #ccc;
 }
 
 #project_id {
-    text-align: center;
+  text-align: center;
 }
 
 #address-hint {
-    font-size:12px;
+  font-size: 12px;
 }
+
 #go_project {
-    display: table-cell;
-    height:24px;
-    padding:0px;
-    margin-right: 0px;
-    margin-left: 0px;
-    margin-top: 3px;
-    margin-bottom: 0px;
+  display: table-cell;
+  height: 24px;
+  padding: 0px;
+  margin-right: 0px;
+  margin-left: 0px;
+  margin-top: 3px;
+  margin-bottom: 0px;
 }
\ No newline at end of file

From 45adfecb3039b3fdb328b316db64c848edadeb6b Mon Sep 17 00:00:00 2001
From: Hardmath123 <hardmath123@gmail.com>
Date: Sun, 3 Nov 2013 19:30:34 -0800
Subject: [PATCH 6/8] 4 space indentation

---
 node_modules/.bin/cssbeautify                 |   1 +
 node_modules/cssbeautify/.npmignore           |   6 +
 node_modules/cssbeautify/CONTRIBUTING.md      |  24 +
 node_modules/cssbeautify/README.md            |  79 +++
 node_modules/cssbeautify/bin/cssbeautify      |  83 ++++
 node_modules/cssbeautify/cssbeautify.js       | 469 ++++++++++++++++++
 .../cssbeautify/cssbeautify.sublime-project   |   8 +
 .../cssbeautify/cssbeautify.sublime-workspace | 179 +++++++
 node_modules/cssbeautify/package.json         |  42 ++
 player.css                                    | 434 ++++++++--------
 10 files changed, 1088 insertions(+), 237 deletions(-)
 create mode 120000 node_modules/.bin/cssbeautify
 create mode 100644 node_modules/cssbeautify/.npmignore
 create mode 100644 node_modules/cssbeautify/CONTRIBUTING.md
 create mode 100644 node_modules/cssbeautify/README.md
 create mode 100755 node_modules/cssbeautify/bin/cssbeautify
 create mode 100644 node_modules/cssbeautify/cssbeautify.js
 create mode 100644 node_modules/cssbeautify/cssbeautify.sublime-project
 create mode 100644 node_modules/cssbeautify/cssbeautify.sublime-workspace
 create mode 100644 node_modules/cssbeautify/package.json

diff --git a/node_modules/.bin/cssbeautify b/node_modules/.bin/cssbeautify
new file mode 120000
index 0000000..1f10177
--- /dev/null
+++ b/node_modules/.bin/cssbeautify
@@ -0,0 +1 @@
+../cssbeautify/bin/cssbeautify
\ No newline at end of file
diff --git a/node_modules/cssbeautify/.npmignore b/node_modules/cssbeautify/.npmignore
new file mode 100644
index 0000000..f67c652
--- /dev/null
+++ b/node_modules/cssbeautify/.npmignore
@@ -0,0 +1,6 @@
+.git
+index.html
+test/
+assets/
+images/
+/node_modules/
diff --git a/node_modules/cssbeautify/CONTRIBUTING.md b/node_modules/cssbeautify/CONTRIBUTING.md
new file mode 100644
index 0000000..74bf7a0
--- /dev/null
+++ b/node_modules/cssbeautify/CONTRIBUTING.md
@@ -0,0 +1,24 @@
+# Contribution Guide
+
+This page describes how to contribute changes to CSS Beautify.
+
+Please do **not** create a pull request without reading this guide first. Failure to do so may result in the **rejection** of the pull request.
+
+## CLA
+
+Before we can accept any contributions, you need to sign [Contributor License Agreement](http://en.wikipedia.org/wiki/Contributor_License_Agreement). You can do that using Sencha Labs [online CLA](http://www.sencha.com/cla).
+
+## Coding Policies
+
+Make sure that your code passes [JSLint](http://jslint.com) checks.
+
+Make sure your patch does break existing tests (open <code>test/index.html</code> in a web browser).
+
+If you add a new feature, create a new test associated with that. Feature or enhancement pull request without a corresponding test will **not** be merged.
+
+## Pull Request
+
+For the actual contribution, please use [Github pull request](http://help.github.com/pull-requests/) workflow.
+
+Please do not create a pull request for multiple unrelated commits. It is strongly recommended to create a topic branch and make the commits as atomic as possible for the merge. This makes it easy to review all the changes.
+
diff --git a/node_modules/cssbeautify/README.md b/node_modules/cssbeautify/README.md
new file mode 100644
index 0000000..f7e78a3
--- /dev/null
+++ b/node_modules/cssbeautify/README.md
@@ -0,0 +1,79 @@
+# CSS Beautify #
+
+CSS Beautify is a JavaScript implementation of reindenter and reformatter for styles written in [CSS](http://www.w3.org/Style/CSS/).
+
+Given the following style:
+
+```css
+menu{color:red} navigation{background-color:#333}
+```
+
+CSS Beautify will produce:
+
+```css
+menu {
+    color: red
+}
+
+navigation {
+    background-color: #333
+}
+```
+
+Try it online at [cssbeautify.com](http://cssbeautify.com). For the
+command-line use, install Node.js [cssbeautify](https://npmjs.org/package/cssbeautify) package.
+
+For more examples, see also its [test suite](http://cssbeautify.com/test/).
+
+## Using cssbeautify() function ##
+
+Since CSS Beautify is written in pure JavaScript, it can run anywhere that JavaScript can run.
+
+The API is very simple:
+
+```javascript
+var result = cssbeautify(style, options);
+```
+
+**options** is an optional object to adjust the formatting. Known options so far are:
+
+  *  <code>indent</code> is a string used for the indentation of the declaration (default is 4 spaces)
+  *  <code>openbrace</code> defines the placement of open curly brace, either *end-of-line* (default) or *separate-line*.
+  *  <code>autosemicolon</code> always inserts a semicolon after the last ruleset (default is *false*)
+
+Example call:
+
+```javascript
+var beautified = cssbeautify('menu{opacity:.7}', {
+    indent: '  ',
+    openbrace: 'separate-line',
+    autosemicolon: true
+});
+```
+
+## Contributing ##
+
+Contributions are welcomed! Please read the [Contribution Guide](https://github.com/senchalabs/cssbeautify/blob/master/CONTRIBUTING.md) for more info.
+
+## License ##
+
+Copyright (C) 2012 Sencha Inc.
+Copyright (C) 2011 Sencha Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
diff --git a/node_modules/cssbeautify/bin/cssbeautify b/node_modules/cssbeautify/bin/cssbeautify
new file mode 100755
index 0000000..0f8b9b4
--- /dev/null
+++ b/node_modules/cssbeautify/bin/cssbeautify
@@ -0,0 +1,83 @@
+#!/usr/bin/env node
+/*
+ Copyright (C) 2012 Sencha Inc.
+
+ Author: Ariya Hidayat.
+
+ Permission is hereby granted, free of charge, to any person obtaining a copy
+ of this software and associated documentation files (the "Software"), to deal
+ in the Software without restriction, including without limitation the rights
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ copies of the Software, and to permit persons to whom the Software is
+ furnished to do so, subject to the following conditions:
+
+ The above copyright notice and this permission notice shall be included in
+ all copies or substantial portions of the Software.
+
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ THE SOFTWARE.
+*/
+
+/*jslint sloppy:true node:true */
+
+var fs, cssbeautify, fname, content, options, style;
+
+fs = require('fs');
+cssbeautify = require('cssbeautify');
+
+function showUsage() {
+    console.log('Usage:');
+    console.log('   cssbeautify [options] style.css');
+    console.log();
+    console.log('Available options:');
+    console.log();
+    console.log('  -v, --version  Shows program version');
+    console.log();
+    process.exit(1);
+}
+
+if (process.argv.length <= 2) {
+    showUsage();
+}
+
+options = {};
+
+process.argv.splice(2).forEach(function (entry) {
+
+    if (entry === '-h' || entry === '--help') {
+        showUsage();
+    } else if (entry === '-v' || entry === '--version') {
+        // Keep in sync with package.json
+        console.log('CSS Beautify version 0.3.1');
+        console.log();
+        process.exit(0);
+    } else if (entry.slice(0, 2) === '--') {
+        console.log('Error: unknown option ' + entry + '.');
+        process.exit(1);
+    } else if (typeof fname === 'string') {
+        console.log('Error: more than one input file.');
+        process.exit(1);
+    } else {
+        fname = entry;
+    }
+});
+
+if (typeof fname !== 'string') {
+    console.log('Error: no input file.');
+    process.exit(1);
+}
+
+try {
+    content = fs.readFileSync(fname, 'utf-8');
+    style = cssbeautify(content);
+    console.log(style);
+} catch (e) {
+    console.log('Error: ' + e.message);
+    process.exit(1);
+}
+
diff --git a/node_modules/cssbeautify/cssbeautify.js b/node_modules/cssbeautify/cssbeautify.js
new file mode 100644
index 0000000..b4ae096
--- /dev/null
+++ b/node_modules/cssbeautify/cssbeautify.js
@@ -0,0 +1,469 @@
+/*
+ Copyright (C) 2013 Sencha Inc.
+ Copyright (C) 2012 Sencha Inc.
+ Copyright (C) 2011 Sencha Inc.
+
+ Author: Ariya Hidayat.
+
+ Permission is hereby granted, free of charge, to any person obtaining a copy
+ of this software and associated documentation files (the "Software"), to deal
+ in the Software without restriction, including without limitation the rights
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ copies of the Software, and to permit persons to whom the Software is
+ furnished to do so, subject to the following conditions:
+
+ The above copyright notice and this permission notice shall be included in
+ all copies or substantial portions of the Software.
+
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ THE SOFTWARE.
+*/
+
+/*jslint continue: true, indent: 4 */
+/*global exports:true, module:true, window:true */
+
+(function () {
+
+    'use strict';
+
+    function cssbeautify(style, opt) {
+
+        var options, index = 0, length = style.length, blocks, formatted = '',
+            ch, ch2, str, state, State, depth, quote, comment,
+            openbracesuffix = true,
+            autosemicolon = false,
+            trimRight;
+
+        options = arguments.length > 1 ? opt : {};
+        if (typeof options.indent === 'undefined') {
+            options.indent = '    ';
+        }
+        if (typeof options.openbrace === 'string') {
+            openbracesuffix = (options.openbrace === 'end-of-line');
+        }
+        if (typeof options.autosemicolon === 'boolean') {
+            autosemicolon = options.autosemicolon;
+        }
+
+        function isWhitespace(c) {
+            return (c === ' ') || (c === '\n') || (c === '\t') || (c === '\r') || (c === '\f');
+        }
+
+        function isQuote(c) {
+            return (c === '\'') || (c === '"');
+        }
+
+        // FIXME: handle Unicode characters
+        function isName(c) {
+            return (ch >= 'a' && ch <= 'z') ||
+                (ch >= 'A' && ch <= 'Z') ||
+                (ch >= '0' && ch <= '9') ||
+                '-_*.:#[]'.indexOf(c) >= 0;
+        }
+
+        function appendIndent() {
+            var i;
+            for (i = depth; i > 0; i -= 1) {
+                formatted += options.indent;
+            }
+        }
+
+        function openBlock() {
+            formatted = trimRight(formatted);
+            if (openbracesuffix) {
+                formatted += ' {';
+            } else {
+                formatted += '\n';
+                appendIndent();
+                formatted += '{';
+            }
+            if (ch2 !== '\n') {
+                formatted += '\n';
+            }
+            depth += 1;
+        }
+
+        function closeBlock() {
+            var last;
+            depth -= 1;
+            formatted = trimRight(formatted);
+
+            if (formatted.length > 0 && autosemicolon) {
+                last = formatted.charAt(formatted.length - 1);
+                if (last !== ';' && last !== '{') {
+                    formatted += ';';
+                }
+            }
+
+            formatted += '\n';
+            appendIndent();
+            formatted += '}';
+            blocks.push(formatted);
+            formatted = '';
+        }
+
+        if (String.prototype.trimRight) {
+            trimRight = function (s) {
+                return s.trimRight();
+            };
+        } else {
+            // old Internet Explorer
+            trimRight = function (s) {
+                return s.replace(/\s+$/, '');
+            };
+        }
+
+        State = {
+            Start: 0,
+            AtRule: 1,
+            Block: 2,
+            Selector: 3,
+            Ruleset: 4,
+            Property: 5,
+            Separator: 6,
+            Expression: 7,
+            URL: 8
+        };
+
+        depth = 0;
+        state = State.Start;
+        comment = false;
+        blocks = [];
+
+        // We want to deal with LF (\n) only
+        style = style.replace(/\r\n/g, '\n');
+
+        while (index < length) {
+            ch = style.charAt(index);
+            ch2 = style.charAt(index + 1);
+            index += 1;
+
+            // Inside a string literal?
+            if (isQuote(quote)) {
+                formatted += ch;
+                if (ch === quote) {
+                    quote = null;
+                }
+                if (ch === '\\' && ch2 === quote) {
+                    // Don't treat escaped character as the closing quote
+                    formatted += ch2;
+                    index += 1;
+                }
+                continue;
+            }
+
+            // Starting a string literal?
+            if (isQuote(ch)) {
+                formatted += ch;
+                quote = ch;
+                continue;
+            }
+
+            // Comment
+            if (comment) {
+                formatted += ch;
+                if (ch === '*' && ch2 === '/') {
+                    comment = false;
+                    formatted += ch2;
+                    index += 1;
+                }
+                continue;
+            }
+            if (ch === '/' && ch2 === '*') {
+                comment = true;
+                formatted += ch;
+                formatted += ch2;
+                index += 1;
+                continue;
+            }
+
+            if (state === State.Start) {
+
+                if (blocks.length === 0) {
+                    if (isWhitespace(ch) && formatted.length === 0) {
+                        continue;
+                    }
+                }
+
+                // Copy white spaces and control characters
+                if (ch <= ' ' || ch.charCodeAt(0) >= 128) {
+                    state = State.Start;
+                    formatted += ch;
+                    continue;
+                }
+
+                // Selector or at-rule
+                if (isName(ch) || (ch === '@')) {
+
+                    // Clear trailing whitespaces and linefeeds.
+                    str = trimRight(formatted);
+
+                    if (str.length === 0) {
+                        // If we have empty string after removing all the trailing
+                        // spaces, that means we are right after a block.
+                        // Ensure a blank line as the separator.
+                        if (blocks.length > 0) {
+                            formatted = '\n\n';
+                        }
+                    } else {
+                        // After finishing a ruleset or directive statement,
+                        // there should be one blank line.
+                        if (str.charAt(str.length - 1) === '}' ||
+                                str.charAt(str.length - 1) === ';') {
+
+                            formatted = str + '\n\n';
+                        } else {
+                            // After block comment, keep all the linefeeds but
+                            // start from the first column (remove whitespaces prefix).
+                            while (true) {
+                                ch2 = formatted.charAt(formatted.length - 1);
+                                if (ch2 !== ' ' && ch2.charCodeAt(0) !== 9) {
+                                    break;
+                                }
+                                formatted = formatted.substr(0, formatted.length - 1);
+                            }
+                        }
+                    }
+                    formatted += ch;
+                    state = (ch === '@') ? State.AtRule : State.Selector;
+                    continue;
+                }
+            }
+
+            if (state === State.AtRule) {
+
+                // ';' terminates a statement.
+                if (ch === ';') {
+                    formatted += ch;
+                    state = State.Start;
+                    continue;
+                }
+
+                // '{' starts a block
+                if (ch === '{') {
+                    str = trimRight(formatted);
+                    openBlock();
+                    state = (str === '@font-face') ? State.Ruleset : State.Block;
+                    continue;
+                }
+
+                formatted += ch;
+                continue;
+            }
+
+            if (state === State.Block) {
+
+                // Selector
+                if (isName(ch)) {
+
+                    // Clear trailing whitespaces and linefeeds.
+                    str = trimRight(formatted);
+
+                    if (str.length === 0) {
+                        // If we have empty string after removing all the trailing
+                        // spaces, that means we are right after a block.
+                        // Ensure a blank line as the separator.
+                        if (blocks.length > 0) {
+                            formatted = '\n\n';
+                        }
+                    } else {
+                        // Insert blank line if necessary.
+                        if (str.charAt(str.length - 1) === '}') {
+                            formatted = str + '\n\n';
+                        } else {
+                            // After block comment, keep all the linefeeds but
+                            // start from the first column (remove whitespaces prefix).
+                            while (true) {
+                                ch2 = formatted.charAt(formatted.length - 1);
+                                if (ch2 !== ' ' && ch2.charCodeAt(0) !== 9) {
+                                    break;
+                                }
+                                formatted = formatted.substr(0, formatted.length - 1);
+                            }
+                        }
+                    }
+
+                    appendIndent();
+                    formatted += ch;
+                    state = State.Selector;
+                    continue;
+                }
+
+                // '}' resets the state.
+                if (ch === '}') {
+                    closeBlock();
+                    state = State.Start;
+                    continue;
+                }
+
+                formatted += ch;
+                continue;
+            }
+
+            if (state === State.Selector) {
+
+                // '{' starts the ruleset.
+                if (ch === '{') {
+                    openBlock();
+                    state = State.Ruleset;
+                    continue;
+                }
+
+                // '}' resets the state.
+                if (ch === '}') {
+                    closeBlock();
+                    state = State.Start;
+                    continue;
+                }
+
+                formatted += ch;
+                continue;
+            }
+
+            if (state === State.Ruleset) {
+
+                // '}' finishes the ruleset.
+                if (ch === '}') {
+                    closeBlock();
+                    state = State.Start;
+                    if (depth > 0) {
+                        state = State.Block;
+                    }
+                    continue;
+                }
+
+                // Make sure there is no blank line or trailing spaces inbetween
+                if (ch === '\n') {
+                    formatted = trimRight(formatted);
+                    formatted += '\n';
+                    continue;
+                }
+
+                // property name
+                if (!isWhitespace(ch)) {
+                    formatted = trimRight(formatted);
+                    formatted += '\n';
+                    appendIndent();
+                    formatted += ch;
+                    state = State.Property;
+                    continue;
+                }
+                formatted += ch;
+                continue;
+            }
+
+            if (state === State.Property) {
+
+                // ':' concludes the property.
+                if (ch === ':') {
+                    formatted = trimRight(formatted);
+                    formatted += ': ';
+                    state = State.Expression;
+                    if (isWhitespace(ch2)) {
+                        state = State.Separator;
+                    }
+                    continue;
+                }
+
+                // '}' finishes the ruleset.
+                if (ch === '}') {
+                    closeBlock();
+                    state = State.Start;
+                    if (depth > 0) {
+                        state = State.Block;
+                    }
+                    continue;
+                }
+
+                formatted += ch;
+                continue;
+            }
+
+            if (state === State.Separator) {
+
+                // Non-whitespace starts the expression.
+                if (!isWhitespace(ch)) {
+                    formatted += ch;
+                    state = State.Expression;
+                    continue;
+                }
+
+                // Anticipate string literal.
+                if (isQuote(ch2)) {
+                    state = State.Expression;
+                }
+
+                continue;
+            }
+
+            if (state === State.Expression) {
+
+                // '}' finishes the ruleset.
+                if (ch === '}') {
+                    closeBlock();
+                    state = State.Start;
+                    if (depth > 0) {
+                        state = State.Block;
+                    }
+                    continue;
+                }
+
+                // ';' completes the declaration.
+                if (ch === ';') {
+                    formatted = trimRight(formatted);
+                    formatted += ';\n';
+                    state = State.Ruleset;
+                    continue;
+                }
+
+                formatted += ch;
+
+                if (ch === '(') {
+                    if (formatted.charAt(formatted.length - 2) === 'l' &&
+                            formatted.charAt(formatted.length - 3) === 'r' &&
+                            formatted.charAt(formatted.length - 4) === 'u') {
+
+                        // URL starts with '(' and closes with ')'.
+                        state = State.URL;
+                        continue;
+                    }
+                }
+
+                continue;
+            }
+
+            if (state === State.URL) {
+
+
+                // ')' finishes the URL (only if it is not escaped).
+                if (ch === ')' && formatted.charAt(formatted.length - 1 !== '\\')) {
+                    formatted += ch;
+                    state = State.Expression;
+                    continue;
+                }
+            }
+
+            // The default action is to copy the character (to prevent
+            // infinite loop).
+            formatted += ch;
+        }
+
+        formatted = blocks.join('') + formatted;
+
+        return formatted;
+    }
+
+    if (typeof exports !== 'undefined') {
+        // Node.js module.
+        module.exports = exports = cssbeautify;
+    } else if (typeof window === 'object') {
+        // Browser loading.
+        window.cssbeautify = cssbeautify;
+    }
+
+}());
diff --git a/node_modules/cssbeautify/cssbeautify.sublime-project b/node_modules/cssbeautify/cssbeautify.sublime-project
new file mode 100644
index 0000000..89ea1f1
--- /dev/null
+++ b/node_modules/cssbeautify/cssbeautify.sublime-project
@@ -0,0 +1,8 @@
+{
+	"folders":
+	[
+		{
+			"path": "/Users/ariyahidayat/dev/sencha/cssbeautify"
+		}
+	]
+}
diff --git a/node_modules/cssbeautify/cssbeautify.sublime-workspace b/node_modules/cssbeautify/cssbeautify.sublime-workspace
new file mode 100644
index 0000000..0b4baf7
--- /dev/null
+++ b/node_modules/cssbeautify/cssbeautify.sublime-workspace
@@ -0,0 +1,179 @@
+{
+	"auto_complete":
+	{
+		"selected_items":
+		[
+		]
+	},
+	"buffers":
+	[
+		{
+			"contents": "/*\n Copyright (C) 2013 Sencha Inc.\n Copyright (C) 2012 Sencha Inc.\n Copyright (C) 2011 Sencha Inc.\n\n Author: Ariya Hidayat.\n\n Permission is hereby granted, free of charge, to any person obtaining a copy\n of this software and associated documentation files (the \"Software\"), to deal\n in the Software without restriction, including without limitation the rights\n to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n copies of the Software, and to permit persons to whom the Software is\n furnished to do so, subject to the following conditions:\n\n The above copyright notice and this permission notice shall be included in\n all copies or substantial portions of the Software.\n\n THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n THE SOFTWARE.\n*/\n\n/*jslint continue: true, indent: 4 */\n/*global exports:true, module:true, window:true */\n\n(function () {\n\n    'use strict';\n\n    function cssbeautify(style, opt) {\n\n        var options, index = 0, length = style.length, blocks, formatted = '',\n            ch, ch2, str, state, State, depth, quote, comment,\n            openbracesuffix = true,\n            autosemicolon = false,\n            trimRight;\n\n        options = arguments.length > 1 ? opt : {};\n        if (typeof options.indent === 'undefined') {\n            options.indent = '    ';\n        }\n        if (typeof options.openbrace === 'string') {\n            openbracesuffix = (options.openbrace === 'end-of-line');\n        }\n        if (typeof options.autosemicolon === 'boolean') {\n            autosemicolon = options.autosemicolon;\n        }\n\n        function isWhitespace(c) {\n            return (c === ' ') || (c === '\\n') || (c === '\\t') || (c === '\\r') || (c === '\\f');\n        }\n\n        function isQuote(c) {\n            return (c === '\\'') || (c === '\"');\n        }\n\n        // FIXME: handle Unicode characters\n        function isName(c) {\n            return (ch >= 'a' && ch <= 'z') ||\n                (ch >= 'A' && ch <= 'Z') ||\n                (ch >= '0' && ch <= '9') ||\n                '-_*.:#'.indexOf(c) >= 0;\n        }\n\n        function appendIndent() {\n            var i;\n            for (i = depth; i > 0; i -= 1) {\n                formatted += options.indent;\n            }\n        }\n\n        function openBlock() {\n            formatted = trimRight(formatted);\n            if (openbracesuffix) {\n                formatted += ' {';\n            } else {\n                formatted += '\\n';\n                appendIndent();\n                formatted += '{';\n            }\n            if (ch2 !== '\\n') {\n                formatted += '\\n';\n            }\n            depth += 1;\n        }\n\n        function closeBlock() {\n            var ch;\n            depth -= 1;\n            formatted = trimRight(formatted);\n\n            if (autosemicolon) {\n                ch = formatted.charAt(formatted.length - 1);\n                if (ch !== ';' && ch !== '{') {\n                    formatted += ';';\n                }\n            }\n\n            formatted += '\\n';\n            appendIndent();\n            formatted += '}';\n            blocks.push(formatted);\n            formatted = '';\n        }\n\n        if (String.prototype.trimRight) {\n            trimRight = function (s) {\n                return s.trimRight();\n            };\n        } else {\n            // old Internet Explorer\n            trimRight = function (s) {\n                return s.replace(/\\s+$/, '');\n            };\n        }\n\n        State = {\n            Start: 0,\n            AtRule: 1,\n            Block: 2,\n            Selector: 3,\n            Ruleset: 4,\n            Property: 5,\n            Separator: 6,\n            Expression: 7,\n            URL: 8\n        };\n\n        depth = 0;\n        state = State.Start;\n        comment = false;\n        blocks = [];\n\n        // We want to deal with LF (\\n) only\n        style = style.replace(/\\r\\n/g, '\\n');\n\n        while (index < length) {\n            ch = style.charAt(index);\n            ch2 = style.charAt(index + 1);\n            index += 1;\n\n            // Inside a string literal?\n            if (isQuote(quote)) {\n                formatted += ch;\n                if (ch === quote) {\n                    quote = null;\n                }\n                if (ch === '\\\\' && ch2 === quote) {\n                    // Don't treat escaped character as the closing quote\n                    formatted += ch2;\n                    index += 1;\n                }\n                continue;\n            }\n\n            // Starting a string literal?\n            if (isQuote(ch)) {\n                formatted += ch;\n                quote = ch;\n                continue;\n            }\n\n            // Comment\n            if (comment) {\n                formatted += ch;\n                if (ch === '*' && ch2 === '/') {\n                    comment = false;\n                    formatted += ch2;\n                    index += 1;\n                }\n                continue;\n            } else {\n                if (ch === '/' && ch2 === '*') {\n                    comment = true;\n                    formatted += ch;\n                    formatted += ch2;\n                    index += 1;\n                    continue;\n                }\n            }\n\n            if (state === State.Start) {\n\n                if (blocks.length === 0) {\n                    if (isWhitespace(ch) && formatted.length === 0) {\n                        continue;\n                    }\n                }\n\n                // Copy white spaces and control characters\n                if (ch <= ' ' || ch.charCodeAt(0) >= 128) {\n                    state = State.Start;\n                    formatted += ch;\n                    continue;\n                }\n\n                // Selector or at-rule\n                if (isName(ch) || (ch === '[') || (ch === '@')) {\n\n                    // Clear trailing whitespaces and linefeeds.\n                    str = trimRight(formatted);\n\n                    if (str.length === 0) {\n                        // If we have empty string after removing all the trailing\n                        // spaces, that means we are right after a block.\n                        // Ensure a blank line as the separator.\n                        if (blocks.length > 0) {\n                            formatted = '\\n\\n';\n                        }\n                    } else {\n                        // After finishing a ruleset or directive statement,\n                        // there should be one blank line.\n                        if (str.charAt(str.length - 1) === '}' ||\n                                str.charAt(str.length - 1) === ';') {\n\n                            formatted = str + '\\n\\n';\n                        } else {\n                            // After block comment, keep all the linefeeds but\n                            // start from the first column (remove whitespaces prefix).\n                            while (true) {\n                                ch2 = formatted.charAt(formatted.length - 1);\n                                if (ch2 !== ' ' && ch2.charCodeAt(0) !== 9) {\n                                    break;\n                                }\n                                formatted = formatted.substr(0, formatted.length - 1);\n                            }\n                        }\n                    }\n                    formatted += ch;\n                    state = (ch === '@') ? State.AtRule : State.Selector;\n                    continue;\n                }\n            }\n\n            if (state === State.AtRule) {\n\n                // ';' terminates a statement.\n                if (ch === ';') {\n                    formatted += ch;\n                    state = State.Start;\n                    continue;\n                }\n\n                // '{' starts a block\n                if (ch === '{') {\n                    str = trimRight(formatted);\n                    openBlock();\n                    state = (str === '@font-face') ? State.Ruleset : State.Block;\n                    continue;\n                }\n\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Block) {\n\n                // Selector\n                if (isName(ch)) {\n\n                    // Clear trailing whitespaces and linefeeds.\n                    str = trimRight(formatted);\n\n                    if (str.length === 0) {\n                        // If we have empty string after removing all the trailing\n                        // spaces, that means we are right after a block.\n                        // Ensure a blank line as the separator.\n                        if (blocks.length > 0) {\n                            formatted = '\\n\\n';\n                        }\n                    } else {\n                        // Insert blank line if necessary.\n                        if (str.charAt(str.length - 1) === '}') {\n                            formatted = str + '\\n\\n';\n                        } else {\n                            // After block comment, keep all the linefeeds but\n                            // start from the first column (remove whitespaces prefix).\n                            while (true) {\n                                ch2 = formatted.charAt(formatted.length - 1);\n                                if (ch2 !== ' ' && ch2.charCodeAt(0) !== 9) {\n                                    break;\n                                }\n                                formatted = formatted.substr(0, formatted.length - 1);\n                            }\n                        }\n                    }\n\n                    appendIndent();\n                    formatted += ch;\n                    state = State.Selector;\n                    continue;\n                }\n\n                // '}' resets the state.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    continue;\n                }\n\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Selector) {\n\n                // '{' starts the ruleset.\n                if (ch === '{') {\n                    openBlock();\n                    state = State.Ruleset;\n                    continue;\n                }\n\n                // '}' resets the state.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    continue;\n                }\n\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Ruleset) {\n\n                // '}' finishes the ruleset.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    if (depth > 0) {\n                        state = State.Block;\n                    }\n                    continue;\n                }\n\n                // Make sure there is no blank line or trailing spaces inbetween\n                if (ch === '\\n') {\n                    formatted = trimRight(formatted);\n                    formatted += '\\n';\n                    continue;\n                }\n\n                // property name\n                if (!isWhitespace(ch)) {\n                    formatted = trimRight(formatted);\n                    formatted += '\\n';\n                    appendIndent();\n                    formatted += ch;\n                    state = State.Property;\n                    continue;\n                }\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Property) {\n\n                // ':' concludes the property.\n                if (ch === ':') {\n                    formatted = trimRight(formatted);\n                    formatted += ': ';\n                    state = State.Expression;\n                    if (isWhitespace(ch2)) {\n                        state = State.Separator;\n                    }\n                    continue;\n                }\n\n                // '}' finishes the ruleset.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    if (depth > 0) {\n                        state = State.Block;\n                    }\n                    continue;\n                }\n\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Separator) {\n\n                // Non-whitespace starts the expression.\n                if (!isWhitespace(ch)) {\n                    formatted += ch;\n                    state = State.Expression;\n                    continue;\n                }\n\n                // Anticipate string literal.\n                if (isQuote(ch2)) {\n                    state = State.Expression;\n                }\n\n                continue;\n            }\n\n            if (state === State.Expression) {\n\n                // '}' finishes the ruleset.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    if (depth > 0) {\n                        state = State.Block;\n                    }\n                    continue;\n                }\n\n                // ';' completes the declaration.\n                if (ch === ';') {\n                    formatted = trimRight(formatted);\n                    formatted += ';\\n';\n                    state = State.Ruleset;\n                    continue;\n                }\n\n                formatted += ch;\n\n                if (ch === '(') {\n                    if (formatted.charAt(formatted.length - 2) === 'l' &&\n                            formatted.charAt(formatted.length - 3) === 'r' &&\n                            formatted.charAt(formatted.length - 4) === 'u') {\n\n                        // URL starts with '(' and closes with ')'.\n                        state = State.URL;\n                        continue;\n                    }\n                }\n\n                continue;\n            }\n\n            if (state === State.URL) {\n\n\n                // ')' finishes the URL (only if it is not escaped).\n                if (ch === ')' && formatted.charAt(formatted.length - 1 !== '\\\\')) {\n                    formatted += ch;\n                    state = State.Expression;\n                    continue;\n                }\n            }\n\n            // The default action is to copy the character (to prevent\n            // infinite loop).\n            formatted += ch;\n        }\n\n        formatted = blocks.join('') + formatted;\n\n        return formatted;\n    }\n\n    if (typeof exports !== 'undefined') {\n        // Node.js module.\n        module.exports = exports = cssbeautify;\n    } else if (typeof window === 'object') {\n        // Browser loading.\n        window.cssbeautify = cssbeautify;\n    }\n\n}());\n",
+			"file": "cssbeautify.js",
+			"file_size": 15117,
+			"file_write_time": 1363040172000000,
+			"settings":
+			{
+				"buffer_size": 15117,
+				"line_ending": "Unix"
+			}
+		}
+	],
+	"build_system": "",
+	"command_palette":
+	{
+		"height": 0.0,
+		"selected_items":
+		[
+		],
+		"width": 0.0
+	},
+	"console":
+	{
+		"height": 0.0
+	},
+	"distraction_free":
+	{
+		"menu_visible": true,
+		"show_minimap": false,
+		"show_open_files": false,
+		"show_tabs": false,
+		"side_bar_visible": false,
+		"status_bar_visible": false
+	},
+	"file_history":
+	[
+		"/Users/ariyahidayat/dev/sencha/cssbeautify/package.json",
+		"/Users/ariyahidayat/dev/sencha/cssbeautify/cssbeautify.sublime-workspace",
+		"/Users/ariyahidayat/dev/sencha/cssbeautify/cssbeautify.js"
+	],
+	"find":
+	{
+		"height": 0.0
+	},
+	"find_in_files":
+	{
+		"height": 0.0,
+		"where_history":
+		[
+		]
+	},
+	"find_state":
+	{
+		"case_sensitive": false,
+		"find_history":
+		[
+		],
+		"highlight": true,
+		"in_selection": false,
+		"preserve_case": false,
+		"regex": false,
+		"replace_history":
+		[
+		],
+		"reverse": false,
+		"show_context": true,
+		"use_buffer2": true,
+		"whole_word": false,
+		"wrap": true
+	},
+	"groups":
+	[
+		{
+			"selected": 0,
+			"sheets":
+			[
+				{
+					"buffer": 0,
+					"file": "cssbeautify.js",
+					"settings":
+					{
+						"buffer_size": 15117,
+						"regions":
+						{
+						},
+						"selection":
+						[
+							[
+								10743,
+								10743
+							]
+						],
+						"settings":
+						{
+							"syntax": "Packages/JavaScript/JavaScript.tmLanguage",
+							"tab_size": 4,
+							"translate_tabs_to_spaces": true
+						},
+						"translation.x": 0.0,
+						"translation.y": 0.0,
+						"zoom_level": 1.0
+					},
+					"type": "text"
+				}
+			]
+		}
+	],
+	"incremental_find":
+	{
+		"height": 0.0
+	},
+	"input":
+	{
+		"height": 0.0
+	},
+	"layout":
+	{
+		"cells":
+		[
+			[
+				0,
+				0,
+				1,
+				1
+			]
+		],
+		"cols":
+		[
+			0.0,
+			1.0
+		],
+		"rows":
+		[
+			0.0,
+			1.0
+		]
+	},
+	"menu_visible": true,
+	"replace":
+	{
+		"height": 0.0
+	},
+	"save_all_on_build": true,
+	"select_file":
+	{
+		"height": 0.0,
+		"selected_items":
+		[
+			[
+				"pac",
+				"package.json"
+			]
+		],
+		"width": 0.0
+	},
+	"select_project":
+	{
+		"height": 0.0,
+		"selected_items":
+		[
+		],
+		"width": 0.0
+	},
+	"show_minimap": true,
+	"show_open_files": false,
+	"show_tabs": true,
+	"side_bar_visible": true,
+	"side_bar_width": 206.0,
+	"status_bar_visible": true
+}
diff --git a/node_modules/cssbeautify/package.json b/node_modules/cssbeautify/package.json
new file mode 100644
index 0000000..fbd8395
--- /dev/null
+++ b/node_modules/cssbeautify/package.json
@@ -0,0 +1,42 @@
+{
+  "name": "cssbeautify",
+  "description": "Reindent and reformat CSS.",
+  "version": "0.3.1",
+  "homepage": "http://cssbeautify.com",
+  "author": {
+    "name": "Ariya Hidayat",
+    "email": "ariya@sencha.com"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/senchalabs/cssbeautify"
+  },
+  "bugs": {
+    "url": "https://github.com/senchalabs/cssbeautify/issues"
+  },
+  "licenses": [
+    {
+      "type": "MIT",
+      "url": "https://github.com/senchalabs/cssbeautify/blob/master/README.md"
+    }
+  ],
+  "main": "cssbeautify.js",
+  "bin": {
+    "cssbeautify": "bin/cssbeautify"
+  },
+  "engines": {
+    "node": "*"
+  },
+  "scripts": {
+    "test": "node test/runner.js"
+  },
+  "keywords": [
+    "cssbeautify",
+    "css",
+    "formatter"
+  ],
+  "readme": "# CSS Beautify #\n\nCSS Beautify is a JavaScript implementation of reindenter and reformatter for styles written in [CSS](http://www.w3.org/Style/CSS/).\n\nGiven the following style:\n\n```css\nmenu{color:red} navigation{background-color:#333}\n```\n\nCSS Beautify will produce:\n\n```css\nmenu {\n    color: red\n}\n\nnavigation {\n    background-color: #333\n}\n```\n\nTry it online at [cssbeautify.com](http://cssbeautify.com). For the\ncommand-line use, install Node.js [cssbeautify](https://npmjs.org/package/cssbeautify) package.\n\nFor more examples, see also its [test suite](http://cssbeautify.com/test/).\n\n## Using cssbeautify() function ##\n\nSince CSS Beautify is written in pure JavaScript, it can run anywhere that JavaScript can run.\n\nThe API is very simple:\n\n```javascript\nvar result = cssbeautify(style, options);\n```\n\n**options** is an optional object to adjust the formatting. Known options so far are:\n\n  *  <code>indent</code> is a string used for the indentation of the declaration (default is 4 spaces)\n  *  <code>openbrace</code> defines the placement of open curly brace, either *end-of-line* (default) or *separate-line*.\n  *  <code>autosemicolon</code> always inserts a semicolon after the last ruleset (default is *false*)\n\nExample call:\n\n```javascript\nvar beautified = cssbeautify('menu{opacity:.7}', {\n    indent: '  ',\n    openbrace: 'separate-line',\n    autosemicolon: true\n});\n```\n\n## Contributing ##\n\nContributions are welcomed! Please read the [Contribution Guide](https://github.com/senchalabs/cssbeautify/blob/master/CONTRIBUTING.md) for more info.\n\n## License ##\n\nCopyright (C) 2012 Sencha Inc.\nCopyright (C) 2011 Sencha Inc.\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in\nall copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\nTHE SOFTWARE.\n",
+  "readmeFilename": "README.md",
+  "_id": "cssbeautify@0.3.1",
+  "_from": "cssbeautify@"
+}
diff --git a/player.css b/player.css
index 41234b9..fc91ea4 100644
--- a/player.css
+++ b/player.css
@@ -1,303 +1,263 @@
 body {
-  background: #fff;
-  color: #333;
-  margin: 0;
-  padding: 30px;
-  font-family: sans-serif;
+    background: #fff;
+    color: #333;
+    margin: 0;
+    padding: 30px;
+    font-family: sans-serif;
 }
-
 /* Wrapper wraps the entire player, and the text below and above. Ideally,
    all CSS selectors would be descendants of #wrapper so that the player
    is embeddable.
 */
-
-#wrapper {
-  width: 540px;
-  height: 420px;
-  margin: auto;
+ #wrapper {
+    width: 540px;
+    height: 420px;
+    margin: auto;
 }
-
 /* Container is the Stage */
-
-#container {
-  border: none;
-  cursor: default;
-  width: 480px;
-  height: 360px;
-  overflow: hidden;
-  position: relative;
-  float: left;
-  /* Before, we accomplished this with e.preventDefault
+ #container {
+    border: none;
+    cursor: default;
+    width: 480px;
+    height: 360px;
+    overflow: hidden;
+    position: relative;
+    float: left;
+    /* Before, we accomplished this with e.preventDefault
      * on the context div.  But, we'd like to use those click events
      * for some things like reporter sliders.
      */
-  -webkit-touch-callout: none;
-  -webkit-user-select: none;
-  -khtml-user-select: none;
-  -moz-user-select: none;
-  -ms-user-select: none;
-  user-select: none;
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+    -khtml-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
 }
-
 /* The pane over a project with the green flag on startup. */
-
-#greenSlide {
-  position: absolute;
-  float: left;
-  z-index: 500;
-  /* Hmm, will this break after the 501st sprite? */
-  margin-left: 30px;
+ #greenSlide {
+    position: absolute;
+    float: left;
+    z-index: 500;
+    /* Hmm, will this break after the 501st sprite? */
+    margin-left: 30px;
 }
-
 /* The green flag icon. */
-
-#greenSlideFg {
-  background-color: #000;
-  opacity: 0.2;
-  width: 278px;
-  height: 218px;
-  padding-top: 142px;
-  padding-left: 202px;
+ #greenSlideFg {
+    background-color: #000;
+    opacity: 0.2;
+    width: 278px;
+    height: 218px;
+    padding-top: 142px;
+    padding-left: 202px;
 }
-
 /* iPad arrow key frame */
 
 /*  This is the frame around the stage with various buttons. */
-
-#ui-top {
-  width: 540px;
-  height: 30px;
-  clear: both;
-  background-color: #eee;
+ #ui-top {
+    width: 540px;
+    height: 30px;
+    clear: both;
+    background-color: #eee;
 }
-
 #up {
-  padding-top: 10px;
-  width: 540px;
-  height: 30px;
-  clear: both;
-  background-color: #eee;
-  border-top-left-radius: 10px;
-  border-top-right-radius: 10px;
-  text-align: center;
-  color: #ccc;
+    padding-top: 10px;
+    width: 540px;
+    height: 30px;
+    clear: both;
+    background-color: #eee;
+    border-top-left-radius: 10px;
+    border-top-right-radius: 10px;
+    text-align: center;
+    color: #ccc;
 }
-
 #left {
-  float: left;
-  width: 30px;
-  height: 360px;
-  background-color: #eee;
-  line-height: 360px;
-  color: #ccc;
-  text-align: center;
+    float: left;
+    width: 30px;
+    height: 360px;
+    background-color: #eee;
+    line-height: 360px;
+    color: #ccc;
+    text-align: center;
 }
-
 #right {
-  float: left;
-  width: 30px;
-  height: 360px;
-  background-color: #eee;
-  line-height: 360px;
-  color: #ccc;
-  text-align: center;
+    float: left;
+    width: 30px;
+    height: 360px;
+    background-color: #eee;
+    line-height: 360px;
+    color: #ccc;
+    text-align: center;
 }
-
 #down {
-  padding-top: 10px;
-  width: 540px;
-  height: 30px;
-  background-color: #eee;
-  text-align: center;
-  border-bottom-left-radius: 10px;
-  border-bottom-right-radius: 10px;
-  color: #ccc;
+    padding-top: 10px;
+    width: 540px;
+    height: 30px;
+    background-color: #eee;
+    text-align: center;
+    border-bottom-left-radius: 10px;
+    border-bottom-right-radius: 10px;
+    color: #ccc;
 }
-
 #ui-bottom {
-  width: 480px;
-  height: 30px;
-  background-color: #eee;
-  padding-left: 30px;
-  padding-right: 30px;
-  clear: both;
-  text-align: right;
+    width: 480px;
+    height: 30px;
+    background-color: #eee;
+    padding-left: 30px;
+    padding-right: 30px;
+    clear: both;
+    text-align: right;
 }
-
 /* Reporter styles */
-
-.reporter-normal {
-  display: inline-block;
-  padding: 2px 5px 2px 5px;
-  background-color: rgb(193, 196, 199);
-  border: 1px solid rgb(130, 126, 126);
-  border-radius: 4px;
-  font-family: sans-serif;
-  font-size: 11px;
-  font-weight: bold;
-  color: #000;
-  position: absolute;
+ .reporter-normal {
+    display: inline-block;
+    padding: 2px 5px 2px 5px;
+    background-color: rgb(193, 196, 199);
+    border: 1px solid rgb(130, 126, 126);
+    border-radius: 4px;
+    font-family: sans-serif;
+    font-size: 11px;
+    font-weight: bold;
+    color: #000;
+    position: absolute;
 }
-
 .reporter-inset {
-  display: inline-block;
-  min-width: 40px;
-  margin-left: 5px;
-  padding: 1px;
-  border: 1px solid #fff;
-  border-radius: 4px;
-  -webkit-box-shadow: inset 0 0 3px #fff;
-  box-shadow: inset 0 0 3px #fff;
-  text-align: center;
-  color: #fff;
+    display: inline-block;
+    min-width: 40px;
+    margin-left: 5px;
+    padding: 1px;
+    border: 1px solid #fff;
+    border-radius: 4px;
+    -webkit-box-shadow: inset 0 0 3px #fff;
+    box-shadow: inset 0 0 3px #fff;
+    text-align: center;
+    color: #fff;
 }
-
 .reporter-large {
-  display: inline-block;
-  min-width: 40px;
-  padding: 2px 5px 1px 5px;
-  border-radius: 4px;
-  -webkit-box-shadow: 0 -3px 3px -3px #fff inset, -3px 0 3px -3px #fff inset,
-                0 3px 3px -3px #000 inset, 3px 0 3px -3px #000 inset;
-  box-shadow: 0 -3px 3px -3px #fff inset, -3px 0 3px -3px #fff inset,
-                0 3px 3px -3px #000 inset, 3px 0 3px -3px #000 inset;
-  font-family: sans-serif;
-  font-size: 15px;
-  font-weight: bold;
-  text-align: center;
-  color: #fff;
-  position: absolute;
+    display: inline-block;
+    min-width: 40px;
+    padding: 2px 5px 1px 5px;
+    border-radius: 4px;
+    -webkit-box-shadow: 0 -3px 3px -3px #fff inset, -3px 0 3px -3px #fff inset, 0 3px 3px -3px #000 inset, 3px 0 3px -3px #000 inset;
+    box-shadow: 0 -3px 3px -3px #fff inset, -3px 0 3px -3px #fff inset, 0 3px 3px -3px #000 inset, 3px 0 3px -3px #000 inset;
+    font-family: sans-serif;
+    font-size: 15px;
+    font-weight: bold;
+    text-align: center;
+    color: #fff;
+    position: absolute;
 }
-
 /* Say/think bubble styles */
-
-.bubble-container {
-  position: absolute;
+ .bubble-container {
+    position: absolute;
 }
-
 .bubble {
-  position: relative;
-  display: inline-block;
-  max-width: 120px;
-  min-width: 40px;
-  padding: 6px 11px 6px 11px;
-  border: 3px solid rgb(160, 160, 160);
-  border-radius: 10px;
-  background: #fff;
-  font-family: sans-serif;
-  font-weight: bold;
-  font-size: 14px;
-  color: #000;
-  text-align: center;
+    position: relative;
+    display: inline-block;
+    max-width: 120px;
+    min-width: 40px;
+    padding: 6px 11px 6px 11px;
+    border: 3px solid rgb(160, 160, 160);
+    border-radius: 10px;
+    background: #fff;
+    font-family: sans-serif;
+    font-weight: bold;
+    font-size: 14px;
+    color: #000;
+    text-align: center;
 }
-
 .bubble-say {
-  position: absolute;
-  margin-top: -3px;
-  margin-left: 8px;
-  width: 44px;
-  height: 18px;
-  background: url(img/say-bottom.png) transparent no-repeat;
+    position: absolute;
+    margin-top: -3px;
+    margin-left: 8px;
+    width: 44px;
+    height: 18px;
+    background: url(img/say-bottom.png) transparent no-repeat;
 }
-
 .bubble-think {
-  position: absolute;
-  margin-top: 0px;
-  margin-left: 8px;
-  width: 44px;
-  height: 19px;
-  background: url(img/think-bottom.png) transparent no-repeat;
+    position: absolute;
+    margin-top: 0px;
+    margin-left: 8px;
+    width: 44px;
+    height: 19px;
+    background: url(img/think-bottom.png) transparent no-repeat;
 }
-
 #info {
-  float: left;
-  margin-left: 30px;
-  height: 24px;
-  padding: 3px;
-  color: #aaa;
-  font-size: 12px;
+    float: left;
+    margin-left: 30px;
+    height: 24px;
+    padding: 3px;
+    color: #aaa;
+    font-size: 12px;
 }
-
 /* Button styling */
-
-button {
-  background-color: #ddd;
-  border-radius: 3px;
-  cursor: pointer;
-  border-style: none;
-  font-family: sans-serif;
-  width: 24px;
-  padding: 3px;
-  margin: 3px;
-  margin-top: 0px;
-  height: 24px;
-  background: -webkit-gradient(linear, top left, bottom left, from(#ddd), to(#ccc));
-  background: -webkit-linear-gradient(#ddd, #ccc);
-  background: linear-gradient(#ddd, #ccc);
+ button {
+    background-color: #ddd;
+    border-radius: 3px;
+    cursor: pointer;
+    border-style: none;
+    font-family: sans-serif;
+    width: 24px;
+    padding: 3px;
+    margin: 3px;
+    margin-top: 0px;
+    height: 24px;
+    background: -webkit-gradient(linear, top left, bottom left, from(#ddd), to(#ccc));
+    background: -webkit-linear-gradient(#ddd, #ccc);
+    background: linear-gradient(#ddd, #ccc);
 }
-
 button:hover {
-  background-color: #ccc;
-  background: -webkit-gradient(linear, top left, bottom left, from(#ccc), to(#bbb));
-  background: -webkit-linear-gradient(#ccc, #bbb);
-  background: linear-gradient(#ccc, #bbb);
+    background-color: #ccc;
+    background: -webkit-gradient(linear, top left, bottom left, from(#ccc), to(#bbb));
+    background: -webkit-linear-gradient(#ccc, #bbb);
+    background: linear-gradient(#ccc, #bbb);
 }
-
-#trigger_green_flag,
-#trigger_stop {
-  padding-top: 0px;
-  font-size: 20px;
-  width: 24px;
-  margin: 3px;
-  float: right;
+#trigger_green_flag, #trigger_stop {
+    padding-top: 0px;
+    font-size: 20px;
+    width: 24px;
+    margin: 3px;
+    float: right;
 }
-
 #trigger_green_flag {
-  color: #050;
+    color: #050;
 }
-
 #trigger_stop {
-  color: #F33;
-  margin-right: 30px;
-  margin-left: 0px;
+    color: #F33;
+    margin-right: 30px;
+    margin-left: 0px;
 }
-
 #clearer {
-  clear: both;
+    clear: both;
 }
-
 input[type=text] {
-  display: inline-block;
-  border-style: none;
-  border-radius: 4px;
-  font-family: sans-serif;
-  background-color: #ddd;
-  font-size: 14px;
-  padding: 3px;
-  height: 18px;
-  margin: 3px;
-  width: 100px;
+    display: inline-block;
+    border-style: none;
+    border-radius: 4px;
+    font-family: sans-serif;
+    background-color: #ddd;
+    font-size: 14px;
+    padding: 3px;
+    height: 18px;
+    margin: 3px;
+    width: 100px;
 }
-
 input[type=text]:focus {
-  outline: none;
-  background-color: #ccc;
+    outline: none;
+    background-color: #ccc;
 }
-
 #project_id {
-  text-align: center;
+    text-align: center;
 }
-
 #address-hint {
-  font-size: 12px;
+    font-size: 12px;
 }
-
 #go_project {
-  display: table-cell;
-  height: 24px;
-  padding: 0px;
-  margin-right: 0px;
-  margin-left: 0px;
-  margin-top: 3px;
-  margin-bottom: 0px;
-}
\ No newline at end of file
+    display: table-cell;
+    height: 24px;
+    padding: 0px;
+    margin-right: 0px;
+    margin-left: 0px;
+    margin-top: 3px;
+    margin-bottom: 0px;
+}

From 26ee03976a3d301c840d35c7200865fd381a331f Mon Sep 17 00:00:00 2001
From: Hardmath123 <hardmath123@gmail.com>
Date: Sun, 3 Nov 2013 19:31:41 -0800
Subject: [PATCH 7/8] Removed node stuff

---
 node_modules/.bin/cssbeautify                 |   1 -
 node_modules/cssbeautify/.npmignore           |   6 -
 node_modules/cssbeautify/CONTRIBUTING.md      |  24 -
 node_modules/cssbeautify/README.md            |  79 ---
 node_modules/cssbeautify/bin/cssbeautify      |  83 ----
 node_modules/cssbeautify/cssbeautify.js       | 469 ------------------
 .../cssbeautify/cssbeautify.sublime-project   |   8 -
 .../cssbeautify/cssbeautify.sublime-workspace | 179 -------
 node_modules/cssbeautify/package.json         |  42 --
 9 files changed, 891 deletions(-)
 delete mode 120000 node_modules/.bin/cssbeautify
 delete mode 100644 node_modules/cssbeautify/.npmignore
 delete mode 100644 node_modules/cssbeautify/CONTRIBUTING.md
 delete mode 100644 node_modules/cssbeautify/README.md
 delete mode 100755 node_modules/cssbeautify/bin/cssbeautify
 delete mode 100644 node_modules/cssbeautify/cssbeautify.js
 delete mode 100644 node_modules/cssbeautify/cssbeautify.sublime-project
 delete mode 100644 node_modules/cssbeautify/cssbeautify.sublime-workspace
 delete mode 100644 node_modules/cssbeautify/package.json

diff --git a/node_modules/.bin/cssbeautify b/node_modules/.bin/cssbeautify
deleted file mode 120000
index 1f10177..0000000
--- a/node_modules/.bin/cssbeautify
+++ /dev/null
@@ -1 +0,0 @@
-../cssbeautify/bin/cssbeautify
\ No newline at end of file
diff --git a/node_modules/cssbeautify/.npmignore b/node_modules/cssbeautify/.npmignore
deleted file mode 100644
index f67c652..0000000
--- a/node_modules/cssbeautify/.npmignore
+++ /dev/null
@@ -1,6 +0,0 @@
-.git
-index.html
-test/
-assets/
-images/
-/node_modules/
diff --git a/node_modules/cssbeautify/CONTRIBUTING.md b/node_modules/cssbeautify/CONTRIBUTING.md
deleted file mode 100644
index 74bf7a0..0000000
--- a/node_modules/cssbeautify/CONTRIBUTING.md
+++ /dev/null
@@ -1,24 +0,0 @@
-# Contribution Guide
-
-This page describes how to contribute changes to CSS Beautify.
-
-Please do **not** create a pull request without reading this guide first. Failure to do so may result in the **rejection** of the pull request.
-
-## CLA
-
-Before we can accept any contributions, you need to sign [Contributor License Agreement](http://en.wikipedia.org/wiki/Contributor_License_Agreement). You can do that using Sencha Labs [online CLA](http://www.sencha.com/cla).
-
-## Coding Policies
-
-Make sure that your code passes [JSLint](http://jslint.com) checks.
-
-Make sure your patch does break existing tests (open <code>test/index.html</code> in a web browser).
-
-If you add a new feature, create a new test associated with that. Feature or enhancement pull request without a corresponding test will **not** be merged.
-
-## Pull Request
-
-For the actual contribution, please use [Github pull request](http://help.github.com/pull-requests/) workflow.
-
-Please do not create a pull request for multiple unrelated commits. It is strongly recommended to create a topic branch and make the commits as atomic as possible for the merge. This makes it easy to review all the changes.
-
diff --git a/node_modules/cssbeautify/README.md b/node_modules/cssbeautify/README.md
deleted file mode 100644
index f7e78a3..0000000
--- a/node_modules/cssbeautify/README.md
+++ /dev/null
@@ -1,79 +0,0 @@
-# CSS Beautify #
-
-CSS Beautify is a JavaScript implementation of reindenter and reformatter for styles written in [CSS](http://www.w3.org/Style/CSS/).
-
-Given the following style:
-
-```css
-menu{color:red} navigation{background-color:#333}
-```
-
-CSS Beautify will produce:
-
-```css
-menu {
-    color: red
-}
-
-navigation {
-    background-color: #333
-}
-```
-
-Try it online at [cssbeautify.com](http://cssbeautify.com). For the
-command-line use, install Node.js [cssbeautify](https://npmjs.org/package/cssbeautify) package.
-
-For more examples, see also its [test suite](http://cssbeautify.com/test/).
-
-## Using cssbeautify() function ##
-
-Since CSS Beautify is written in pure JavaScript, it can run anywhere that JavaScript can run.
-
-The API is very simple:
-
-```javascript
-var result = cssbeautify(style, options);
-```
-
-**options** is an optional object to adjust the formatting. Known options so far are:
-
-  *  <code>indent</code> is a string used for the indentation of the declaration (default is 4 spaces)
-  *  <code>openbrace</code> defines the placement of open curly brace, either *end-of-line* (default) or *separate-line*.
-  *  <code>autosemicolon</code> always inserts a semicolon after the last ruleset (default is *false*)
-
-Example call:
-
-```javascript
-var beautified = cssbeautify('menu{opacity:.7}', {
-    indent: '  ',
-    openbrace: 'separate-line',
-    autosemicolon: true
-});
-```
-
-## Contributing ##
-
-Contributions are welcomed! Please read the [Contribution Guide](https://github.com/senchalabs/cssbeautify/blob/master/CONTRIBUTING.md) for more info.
-
-## License ##
-
-Copyright (C) 2012 Sencha Inc.
-Copyright (C) 2011 Sencha Inc.
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in
-all copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
-THE SOFTWARE.
diff --git a/node_modules/cssbeautify/bin/cssbeautify b/node_modules/cssbeautify/bin/cssbeautify
deleted file mode 100755
index 0f8b9b4..0000000
--- a/node_modules/cssbeautify/bin/cssbeautify
+++ /dev/null
@@ -1,83 +0,0 @@
-#!/usr/bin/env node
-/*
- Copyright (C) 2012 Sencha Inc.
-
- Author: Ariya Hidayat.
-
- Permission is hereby granted, free of charge, to any person obtaining a copy
- of this software and associated documentation files (the "Software"), to deal
- in the Software without restriction, including without limitation the rights
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- copies of the Software, and to permit persons to whom the Software is
- furnished to do so, subject to the following conditions:
-
- The above copyright notice and this permission notice shall be included in
- all copies or substantial portions of the Software.
-
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
- THE SOFTWARE.
-*/
-
-/*jslint sloppy:true node:true */
-
-var fs, cssbeautify, fname, content, options, style;
-
-fs = require('fs');
-cssbeautify = require('cssbeautify');
-
-function showUsage() {
-    console.log('Usage:');
-    console.log('   cssbeautify [options] style.css');
-    console.log();
-    console.log('Available options:');
-    console.log();
-    console.log('  -v, --version  Shows program version');
-    console.log();
-    process.exit(1);
-}
-
-if (process.argv.length <= 2) {
-    showUsage();
-}
-
-options = {};
-
-process.argv.splice(2).forEach(function (entry) {
-
-    if (entry === '-h' || entry === '--help') {
-        showUsage();
-    } else if (entry === '-v' || entry === '--version') {
-        // Keep in sync with package.json
-        console.log('CSS Beautify version 0.3.1');
-        console.log();
-        process.exit(0);
-    } else if (entry.slice(0, 2) === '--') {
-        console.log('Error: unknown option ' + entry + '.');
-        process.exit(1);
-    } else if (typeof fname === 'string') {
-        console.log('Error: more than one input file.');
-        process.exit(1);
-    } else {
-        fname = entry;
-    }
-});
-
-if (typeof fname !== 'string') {
-    console.log('Error: no input file.');
-    process.exit(1);
-}
-
-try {
-    content = fs.readFileSync(fname, 'utf-8');
-    style = cssbeautify(content);
-    console.log(style);
-} catch (e) {
-    console.log('Error: ' + e.message);
-    process.exit(1);
-}
-
diff --git a/node_modules/cssbeautify/cssbeautify.js b/node_modules/cssbeautify/cssbeautify.js
deleted file mode 100644
index b4ae096..0000000
--- a/node_modules/cssbeautify/cssbeautify.js
+++ /dev/null
@@ -1,469 +0,0 @@
-/*
- Copyright (C) 2013 Sencha Inc.
- Copyright (C) 2012 Sencha Inc.
- Copyright (C) 2011 Sencha Inc.
-
- Author: Ariya Hidayat.
-
- Permission is hereby granted, free of charge, to any person obtaining a copy
- of this software and associated documentation files (the "Software"), to deal
- in the Software without restriction, including without limitation the rights
- to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
- copies of the Software, and to permit persons to whom the Software is
- furnished to do so, subject to the following conditions:
-
- The above copyright notice and this permission notice shall be included in
- all copies or substantial portions of the Software.
-
- THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
- IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
- FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
- AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
- LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
- OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
- THE SOFTWARE.
-*/
-
-/*jslint continue: true, indent: 4 */
-/*global exports:true, module:true, window:true */
-
-(function () {
-
-    'use strict';
-
-    function cssbeautify(style, opt) {
-
-        var options, index = 0, length = style.length, blocks, formatted = '',
-            ch, ch2, str, state, State, depth, quote, comment,
-            openbracesuffix = true,
-            autosemicolon = false,
-            trimRight;
-
-        options = arguments.length > 1 ? opt : {};
-        if (typeof options.indent === 'undefined') {
-            options.indent = '    ';
-        }
-        if (typeof options.openbrace === 'string') {
-            openbracesuffix = (options.openbrace === 'end-of-line');
-        }
-        if (typeof options.autosemicolon === 'boolean') {
-            autosemicolon = options.autosemicolon;
-        }
-
-        function isWhitespace(c) {
-            return (c === ' ') || (c === '\n') || (c === '\t') || (c === '\r') || (c === '\f');
-        }
-
-        function isQuote(c) {
-            return (c === '\'') || (c === '"');
-        }
-
-        // FIXME: handle Unicode characters
-        function isName(c) {
-            return (ch >= 'a' && ch <= 'z') ||
-                (ch >= 'A' && ch <= 'Z') ||
-                (ch >= '0' && ch <= '9') ||
-                '-_*.:#[]'.indexOf(c) >= 0;
-        }
-
-        function appendIndent() {
-            var i;
-            for (i = depth; i > 0; i -= 1) {
-                formatted += options.indent;
-            }
-        }
-
-        function openBlock() {
-            formatted = trimRight(formatted);
-            if (openbracesuffix) {
-                formatted += ' {';
-            } else {
-                formatted += '\n';
-                appendIndent();
-                formatted += '{';
-            }
-            if (ch2 !== '\n') {
-                formatted += '\n';
-            }
-            depth += 1;
-        }
-
-        function closeBlock() {
-            var last;
-            depth -= 1;
-            formatted = trimRight(formatted);
-
-            if (formatted.length > 0 && autosemicolon) {
-                last = formatted.charAt(formatted.length - 1);
-                if (last !== ';' && last !== '{') {
-                    formatted += ';';
-                }
-            }
-
-            formatted += '\n';
-            appendIndent();
-            formatted += '}';
-            blocks.push(formatted);
-            formatted = '';
-        }
-
-        if (String.prototype.trimRight) {
-            trimRight = function (s) {
-                return s.trimRight();
-            };
-        } else {
-            // old Internet Explorer
-            trimRight = function (s) {
-                return s.replace(/\s+$/, '');
-            };
-        }
-
-        State = {
-            Start: 0,
-            AtRule: 1,
-            Block: 2,
-            Selector: 3,
-            Ruleset: 4,
-            Property: 5,
-            Separator: 6,
-            Expression: 7,
-            URL: 8
-        };
-
-        depth = 0;
-        state = State.Start;
-        comment = false;
-        blocks = [];
-
-        // We want to deal with LF (\n) only
-        style = style.replace(/\r\n/g, '\n');
-
-        while (index < length) {
-            ch = style.charAt(index);
-            ch2 = style.charAt(index + 1);
-            index += 1;
-
-            // Inside a string literal?
-            if (isQuote(quote)) {
-                formatted += ch;
-                if (ch === quote) {
-                    quote = null;
-                }
-                if (ch === '\\' && ch2 === quote) {
-                    // Don't treat escaped character as the closing quote
-                    formatted += ch2;
-                    index += 1;
-                }
-                continue;
-            }
-
-            // Starting a string literal?
-            if (isQuote(ch)) {
-                formatted += ch;
-                quote = ch;
-                continue;
-            }
-
-            // Comment
-            if (comment) {
-                formatted += ch;
-                if (ch === '*' && ch2 === '/') {
-                    comment = false;
-                    formatted += ch2;
-                    index += 1;
-                }
-                continue;
-            }
-            if (ch === '/' && ch2 === '*') {
-                comment = true;
-                formatted += ch;
-                formatted += ch2;
-                index += 1;
-                continue;
-            }
-
-            if (state === State.Start) {
-
-                if (blocks.length === 0) {
-                    if (isWhitespace(ch) && formatted.length === 0) {
-                        continue;
-                    }
-                }
-
-                // Copy white spaces and control characters
-                if (ch <= ' ' || ch.charCodeAt(0) >= 128) {
-                    state = State.Start;
-                    formatted += ch;
-                    continue;
-                }
-
-                // Selector or at-rule
-                if (isName(ch) || (ch === '@')) {
-
-                    // Clear trailing whitespaces and linefeeds.
-                    str = trimRight(formatted);
-
-                    if (str.length === 0) {
-                        // If we have empty string after removing all the trailing
-                        // spaces, that means we are right after a block.
-                        // Ensure a blank line as the separator.
-                        if (blocks.length > 0) {
-                            formatted = '\n\n';
-                        }
-                    } else {
-                        // After finishing a ruleset or directive statement,
-                        // there should be one blank line.
-                        if (str.charAt(str.length - 1) === '}' ||
-                                str.charAt(str.length - 1) === ';') {
-
-                            formatted = str + '\n\n';
-                        } else {
-                            // After block comment, keep all the linefeeds but
-                            // start from the first column (remove whitespaces prefix).
-                            while (true) {
-                                ch2 = formatted.charAt(formatted.length - 1);
-                                if (ch2 !== ' ' && ch2.charCodeAt(0) !== 9) {
-                                    break;
-                                }
-                                formatted = formatted.substr(0, formatted.length - 1);
-                            }
-                        }
-                    }
-                    formatted += ch;
-                    state = (ch === '@') ? State.AtRule : State.Selector;
-                    continue;
-                }
-            }
-
-            if (state === State.AtRule) {
-
-                // ';' terminates a statement.
-                if (ch === ';') {
-                    formatted += ch;
-                    state = State.Start;
-                    continue;
-                }
-
-                // '{' starts a block
-                if (ch === '{') {
-                    str = trimRight(formatted);
-                    openBlock();
-                    state = (str === '@font-face') ? State.Ruleset : State.Block;
-                    continue;
-                }
-
-                formatted += ch;
-                continue;
-            }
-
-            if (state === State.Block) {
-
-                // Selector
-                if (isName(ch)) {
-
-                    // Clear trailing whitespaces and linefeeds.
-                    str = trimRight(formatted);
-
-                    if (str.length === 0) {
-                        // If we have empty string after removing all the trailing
-                        // spaces, that means we are right after a block.
-                        // Ensure a blank line as the separator.
-                        if (blocks.length > 0) {
-                            formatted = '\n\n';
-                        }
-                    } else {
-                        // Insert blank line if necessary.
-                        if (str.charAt(str.length - 1) === '}') {
-                            formatted = str + '\n\n';
-                        } else {
-                            // After block comment, keep all the linefeeds but
-                            // start from the first column (remove whitespaces prefix).
-                            while (true) {
-                                ch2 = formatted.charAt(formatted.length - 1);
-                                if (ch2 !== ' ' && ch2.charCodeAt(0) !== 9) {
-                                    break;
-                                }
-                                formatted = formatted.substr(0, formatted.length - 1);
-                            }
-                        }
-                    }
-
-                    appendIndent();
-                    formatted += ch;
-                    state = State.Selector;
-                    continue;
-                }
-
-                // '}' resets the state.
-                if (ch === '}') {
-                    closeBlock();
-                    state = State.Start;
-                    continue;
-                }
-
-                formatted += ch;
-                continue;
-            }
-
-            if (state === State.Selector) {
-
-                // '{' starts the ruleset.
-                if (ch === '{') {
-                    openBlock();
-                    state = State.Ruleset;
-                    continue;
-                }
-
-                // '}' resets the state.
-                if (ch === '}') {
-                    closeBlock();
-                    state = State.Start;
-                    continue;
-                }
-
-                formatted += ch;
-                continue;
-            }
-
-            if (state === State.Ruleset) {
-
-                // '}' finishes the ruleset.
-                if (ch === '}') {
-                    closeBlock();
-                    state = State.Start;
-                    if (depth > 0) {
-                        state = State.Block;
-                    }
-                    continue;
-                }
-
-                // Make sure there is no blank line or trailing spaces inbetween
-                if (ch === '\n') {
-                    formatted = trimRight(formatted);
-                    formatted += '\n';
-                    continue;
-                }
-
-                // property name
-                if (!isWhitespace(ch)) {
-                    formatted = trimRight(formatted);
-                    formatted += '\n';
-                    appendIndent();
-                    formatted += ch;
-                    state = State.Property;
-                    continue;
-                }
-                formatted += ch;
-                continue;
-            }
-
-            if (state === State.Property) {
-
-                // ':' concludes the property.
-                if (ch === ':') {
-                    formatted = trimRight(formatted);
-                    formatted += ': ';
-                    state = State.Expression;
-                    if (isWhitespace(ch2)) {
-                        state = State.Separator;
-                    }
-                    continue;
-                }
-
-                // '}' finishes the ruleset.
-                if (ch === '}') {
-                    closeBlock();
-                    state = State.Start;
-                    if (depth > 0) {
-                        state = State.Block;
-                    }
-                    continue;
-                }
-
-                formatted += ch;
-                continue;
-            }
-
-            if (state === State.Separator) {
-
-                // Non-whitespace starts the expression.
-                if (!isWhitespace(ch)) {
-                    formatted += ch;
-                    state = State.Expression;
-                    continue;
-                }
-
-                // Anticipate string literal.
-                if (isQuote(ch2)) {
-                    state = State.Expression;
-                }
-
-                continue;
-            }
-
-            if (state === State.Expression) {
-
-                // '}' finishes the ruleset.
-                if (ch === '}') {
-                    closeBlock();
-                    state = State.Start;
-                    if (depth > 0) {
-                        state = State.Block;
-                    }
-                    continue;
-                }
-
-                // ';' completes the declaration.
-                if (ch === ';') {
-                    formatted = trimRight(formatted);
-                    formatted += ';\n';
-                    state = State.Ruleset;
-                    continue;
-                }
-
-                formatted += ch;
-
-                if (ch === '(') {
-                    if (formatted.charAt(formatted.length - 2) === 'l' &&
-                            formatted.charAt(formatted.length - 3) === 'r' &&
-                            formatted.charAt(formatted.length - 4) === 'u') {
-
-                        // URL starts with '(' and closes with ')'.
-                        state = State.URL;
-                        continue;
-                    }
-                }
-
-                continue;
-            }
-
-            if (state === State.URL) {
-
-
-                // ')' finishes the URL (only if it is not escaped).
-                if (ch === ')' && formatted.charAt(formatted.length - 1 !== '\\')) {
-                    formatted += ch;
-                    state = State.Expression;
-                    continue;
-                }
-            }
-
-            // The default action is to copy the character (to prevent
-            // infinite loop).
-            formatted += ch;
-        }
-
-        formatted = blocks.join('') + formatted;
-
-        return formatted;
-    }
-
-    if (typeof exports !== 'undefined') {
-        // Node.js module.
-        module.exports = exports = cssbeautify;
-    } else if (typeof window === 'object') {
-        // Browser loading.
-        window.cssbeautify = cssbeautify;
-    }
-
-}());
diff --git a/node_modules/cssbeautify/cssbeautify.sublime-project b/node_modules/cssbeautify/cssbeautify.sublime-project
deleted file mode 100644
index 89ea1f1..0000000
--- a/node_modules/cssbeautify/cssbeautify.sublime-project
+++ /dev/null
@@ -1,8 +0,0 @@
-{
-	"folders":
-	[
-		{
-			"path": "/Users/ariyahidayat/dev/sencha/cssbeautify"
-		}
-	]
-}
diff --git a/node_modules/cssbeautify/cssbeautify.sublime-workspace b/node_modules/cssbeautify/cssbeautify.sublime-workspace
deleted file mode 100644
index 0b4baf7..0000000
--- a/node_modules/cssbeautify/cssbeautify.sublime-workspace
+++ /dev/null
@@ -1,179 +0,0 @@
-{
-	"auto_complete":
-	{
-		"selected_items":
-		[
-		]
-	},
-	"buffers":
-	[
-		{
-			"contents": "/*\n Copyright (C) 2013 Sencha Inc.\n Copyright (C) 2012 Sencha Inc.\n Copyright (C) 2011 Sencha Inc.\n\n Author: Ariya Hidayat.\n\n Permission is hereby granted, free of charge, to any person obtaining a copy\n of this software and associated documentation files (the \"Software\"), to deal\n in the Software without restriction, including without limitation the rights\n to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n copies of the Software, and to permit persons to whom the Software is\n furnished to do so, subject to the following conditions:\n\n The above copyright notice and this permission notice shall be included in\n all copies or substantial portions of the Software.\n\n THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n THE SOFTWARE.\n*/\n\n/*jslint continue: true, indent: 4 */\n/*global exports:true, module:true, window:true */\n\n(function () {\n\n    'use strict';\n\n    function cssbeautify(style, opt) {\n\n        var options, index = 0, length = style.length, blocks, formatted = '',\n            ch, ch2, str, state, State, depth, quote, comment,\n            openbracesuffix = true,\n            autosemicolon = false,\n            trimRight;\n\n        options = arguments.length > 1 ? opt : {};\n        if (typeof options.indent === 'undefined') {\n            options.indent = '    ';\n        }\n        if (typeof options.openbrace === 'string') {\n            openbracesuffix = (options.openbrace === 'end-of-line');\n        }\n        if (typeof options.autosemicolon === 'boolean') {\n            autosemicolon = options.autosemicolon;\n        }\n\n        function isWhitespace(c) {\n            return (c === ' ') || (c === '\\n') || (c === '\\t') || (c === '\\r') || (c === '\\f');\n        }\n\n        function isQuote(c) {\n            return (c === '\\'') || (c === '\"');\n        }\n\n        // FIXME: handle Unicode characters\n        function isName(c) {\n            return (ch >= 'a' && ch <= 'z') ||\n                (ch >= 'A' && ch <= 'Z') ||\n                (ch >= '0' && ch <= '9') ||\n                '-_*.:#'.indexOf(c) >= 0;\n        }\n\n        function appendIndent() {\n            var i;\n            for (i = depth; i > 0; i -= 1) {\n                formatted += options.indent;\n            }\n        }\n\n        function openBlock() {\n            formatted = trimRight(formatted);\n            if (openbracesuffix) {\n                formatted += ' {';\n            } else {\n                formatted += '\\n';\n                appendIndent();\n                formatted += '{';\n            }\n            if (ch2 !== '\\n') {\n                formatted += '\\n';\n            }\n            depth += 1;\n        }\n\n        function closeBlock() {\n            var ch;\n            depth -= 1;\n            formatted = trimRight(formatted);\n\n            if (autosemicolon) {\n                ch = formatted.charAt(formatted.length - 1);\n                if (ch !== ';' && ch !== '{') {\n                    formatted += ';';\n                }\n            }\n\n            formatted += '\\n';\n            appendIndent();\n            formatted += '}';\n            blocks.push(formatted);\n            formatted = '';\n        }\n\n        if (String.prototype.trimRight) {\n            trimRight = function (s) {\n                return s.trimRight();\n            };\n        } else {\n            // old Internet Explorer\n            trimRight = function (s) {\n                return s.replace(/\\s+$/, '');\n            };\n        }\n\n        State = {\n            Start: 0,\n            AtRule: 1,\n            Block: 2,\n            Selector: 3,\n            Ruleset: 4,\n            Property: 5,\n            Separator: 6,\n            Expression: 7,\n            URL: 8\n        };\n\n        depth = 0;\n        state = State.Start;\n        comment = false;\n        blocks = [];\n\n        // We want to deal with LF (\\n) only\n        style = style.replace(/\\r\\n/g, '\\n');\n\n        while (index < length) {\n            ch = style.charAt(index);\n            ch2 = style.charAt(index + 1);\n            index += 1;\n\n            // Inside a string literal?\n            if (isQuote(quote)) {\n                formatted += ch;\n                if (ch === quote) {\n                    quote = null;\n                }\n                if (ch === '\\\\' && ch2 === quote) {\n                    // Don't treat escaped character as the closing quote\n                    formatted += ch2;\n                    index += 1;\n                }\n                continue;\n            }\n\n            // Starting a string literal?\n            if (isQuote(ch)) {\n                formatted += ch;\n                quote = ch;\n                continue;\n            }\n\n            // Comment\n            if (comment) {\n                formatted += ch;\n                if (ch === '*' && ch2 === '/') {\n                    comment = false;\n                    formatted += ch2;\n                    index += 1;\n                }\n                continue;\n            } else {\n                if (ch === '/' && ch2 === '*') {\n                    comment = true;\n                    formatted += ch;\n                    formatted += ch2;\n                    index += 1;\n                    continue;\n                }\n            }\n\n            if (state === State.Start) {\n\n                if (blocks.length === 0) {\n                    if (isWhitespace(ch) && formatted.length === 0) {\n                        continue;\n                    }\n                }\n\n                // Copy white spaces and control characters\n                if (ch <= ' ' || ch.charCodeAt(0) >= 128) {\n                    state = State.Start;\n                    formatted += ch;\n                    continue;\n                }\n\n                // Selector or at-rule\n                if (isName(ch) || (ch === '[') || (ch === '@')) {\n\n                    // Clear trailing whitespaces and linefeeds.\n                    str = trimRight(formatted);\n\n                    if (str.length === 0) {\n                        // If we have empty string after removing all the trailing\n                        // spaces, that means we are right after a block.\n                        // Ensure a blank line as the separator.\n                        if (blocks.length > 0) {\n                            formatted = '\\n\\n';\n                        }\n                    } else {\n                        // After finishing a ruleset or directive statement,\n                        // there should be one blank line.\n                        if (str.charAt(str.length - 1) === '}' ||\n                                str.charAt(str.length - 1) === ';') {\n\n                            formatted = str + '\\n\\n';\n                        } else {\n                            // After block comment, keep all the linefeeds but\n                            // start from the first column (remove whitespaces prefix).\n                            while (true) {\n                                ch2 = formatted.charAt(formatted.length - 1);\n                                if (ch2 !== ' ' && ch2.charCodeAt(0) !== 9) {\n                                    break;\n                                }\n                                formatted = formatted.substr(0, formatted.length - 1);\n                            }\n                        }\n                    }\n                    formatted += ch;\n                    state = (ch === '@') ? State.AtRule : State.Selector;\n                    continue;\n                }\n            }\n\n            if (state === State.AtRule) {\n\n                // ';' terminates a statement.\n                if (ch === ';') {\n                    formatted += ch;\n                    state = State.Start;\n                    continue;\n                }\n\n                // '{' starts a block\n                if (ch === '{') {\n                    str = trimRight(formatted);\n                    openBlock();\n                    state = (str === '@font-face') ? State.Ruleset : State.Block;\n                    continue;\n                }\n\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Block) {\n\n                // Selector\n                if (isName(ch)) {\n\n                    // Clear trailing whitespaces and linefeeds.\n                    str = trimRight(formatted);\n\n                    if (str.length === 0) {\n                        // If we have empty string after removing all the trailing\n                        // spaces, that means we are right after a block.\n                        // Ensure a blank line as the separator.\n                        if (blocks.length > 0) {\n                            formatted = '\\n\\n';\n                        }\n                    } else {\n                        // Insert blank line if necessary.\n                        if (str.charAt(str.length - 1) === '}') {\n                            formatted = str + '\\n\\n';\n                        } else {\n                            // After block comment, keep all the linefeeds but\n                            // start from the first column (remove whitespaces prefix).\n                            while (true) {\n                                ch2 = formatted.charAt(formatted.length - 1);\n                                if (ch2 !== ' ' && ch2.charCodeAt(0) !== 9) {\n                                    break;\n                                }\n                                formatted = formatted.substr(0, formatted.length - 1);\n                            }\n                        }\n                    }\n\n                    appendIndent();\n                    formatted += ch;\n                    state = State.Selector;\n                    continue;\n                }\n\n                // '}' resets the state.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    continue;\n                }\n\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Selector) {\n\n                // '{' starts the ruleset.\n                if (ch === '{') {\n                    openBlock();\n                    state = State.Ruleset;\n                    continue;\n                }\n\n                // '}' resets the state.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    continue;\n                }\n\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Ruleset) {\n\n                // '}' finishes the ruleset.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    if (depth > 0) {\n                        state = State.Block;\n                    }\n                    continue;\n                }\n\n                // Make sure there is no blank line or trailing spaces inbetween\n                if (ch === '\\n') {\n                    formatted = trimRight(formatted);\n                    formatted += '\\n';\n                    continue;\n                }\n\n                // property name\n                if (!isWhitespace(ch)) {\n                    formatted = trimRight(formatted);\n                    formatted += '\\n';\n                    appendIndent();\n                    formatted += ch;\n                    state = State.Property;\n                    continue;\n                }\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Property) {\n\n                // ':' concludes the property.\n                if (ch === ':') {\n                    formatted = trimRight(formatted);\n                    formatted += ': ';\n                    state = State.Expression;\n                    if (isWhitespace(ch2)) {\n                        state = State.Separator;\n                    }\n                    continue;\n                }\n\n                // '}' finishes the ruleset.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    if (depth > 0) {\n                        state = State.Block;\n                    }\n                    continue;\n                }\n\n                formatted += ch;\n                continue;\n            }\n\n            if (state === State.Separator) {\n\n                // Non-whitespace starts the expression.\n                if (!isWhitespace(ch)) {\n                    formatted += ch;\n                    state = State.Expression;\n                    continue;\n                }\n\n                // Anticipate string literal.\n                if (isQuote(ch2)) {\n                    state = State.Expression;\n                }\n\n                continue;\n            }\n\n            if (state === State.Expression) {\n\n                // '}' finishes the ruleset.\n                if (ch === '}') {\n                    closeBlock();\n                    state = State.Start;\n                    if (depth > 0) {\n                        state = State.Block;\n                    }\n                    continue;\n                }\n\n                // ';' completes the declaration.\n                if (ch === ';') {\n                    formatted = trimRight(formatted);\n                    formatted += ';\\n';\n                    state = State.Ruleset;\n                    continue;\n                }\n\n                formatted += ch;\n\n                if (ch === '(') {\n                    if (formatted.charAt(formatted.length - 2) === 'l' &&\n                            formatted.charAt(formatted.length - 3) === 'r' &&\n                            formatted.charAt(formatted.length - 4) === 'u') {\n\n                        // URL starts with '(' and closes with ')'.\n                        state = State.URL;\n                        continue;\n                    }\n                }\n\n                continue;\n            }\n\n            if (state === State.URL) {\n\n\n                // ')' finishes the URL (only if it is not escaped).\n                if (ch === ')' && formatted.charAt(formatted.length - 1 !== '\\\\')) {\n                    formatted += ch;\n                    state = State.Expression;\n                    continue;\n                }\n            }\n\n            // The default action is to copy the character (to prevent\n            // infinite loop).\n            formatted += ch;\n        }\n\n        formatted = blocks.join('') + formatted;\n\n        return formatted;\n    }\n\n    if (typeof exports !== 'undefined') {\n        // Node.js module.\n        module.exports = exports = cssbeautify;\n    } else if (typeof window === 'object') {\n        // Browser loading.\n        window.cssbeautify = cssbeautify;\n    }\n\n}());\n",
-			"file": "cssbeautify.js",
-			"file_size": 15117,
-			"file_write_time": 1363040172000000,
-			"settings":
-			{
-				"buffer_size": 15117,
-				"line_ending": "Unix"
-			}
-		}
-	],
-	"build_system": "",
-	"command_palette":
-	{
-		"height": 0.0,
-		"selected_items":
-		[
-		],
-		"width": 0.0
-	},
-	"console":
-	{
-		"height": 0.0
-	},
-	"distraction_free":
-	{
-		"menu_visible": true,
-		"show_minimap": false,
-		"show_open_files": false,
-		"show_tabs": false,
-		"side_bar_visible": false,
-		"status_bar_visible": false
-	},
-	"file_history":
-	[
-		"/Users/ariyahidayat/dev/sencha/cssbeautify/package.json",
-		"/Users/ariyahidayat/dev/sencha/cssbeautify/cssbeautify.sublime-workspace",
-		"/Users/ariyahidayat/dev/sencha/cssbeautify/cssbeautify.js"
-	],
-	"find":
-	{
-		"height": 0.0
-	},
-	"find_in_files":
-	{
-		"height": 0.0,
-		"where_history":
-		[
-		]
-	},
-	"find_state":
-	{
-		"case_sensitive": false,
-		"find_history":
-		[
-		],
-		"highlight": true,
-		"in_selection": false,
-		"preserve_case": false,
-		"regex": false,
-		"replace_history":
-		[
-		],
-		"reverse": false,
-		"show_context": true,
-		"use_buffer2": true,
-		"whole_word": false,
-		"wrap": true
-	},
-	"groups":
-	[
-		{
-			"selected": 0,
-			"sheets":
-			[
-				{
-					"buffer": 0,
-					"file": "cssbeautify.js",
-					"settings":
-					{
-						"buffer_size": 15117,
-						"regions":
-						{
-						},
-						"selection":
-						[
-							[
-								10743,
-								10743
-							]
-						],
-						"settings":
-						{
-							"syntax": "Packages/JavaScript/JavaScript.tmLanguage",
-							"tab_size": 4,
-							"translate_tabs_to_spaces": true
-						},
-						"translation.x": 0.0,
-						"translation.y": 0.0,
-						"zoom_level": 1.0
-					},
-					"type": "text"
-				}
-			]
-		}
-	],
-	"incremental_find":
-	{
-		"height": 0.0
-	},
-	"input":
-	{
-		"height": 0.0
-	},
-	"layout":
-	{
-		"cells":
-		[
-			[
-				0,
-				0,
-				1,
-				1
-			]
-		],
-		"cols":
-		[
-			0.0,
-			1.0
-		],
-		"rows":
-		[
-			0.0,
-			1.0
-		]
-	},
-	"menu_visible": true,
-	"replace":
-	{
-		"height": 0.0
-	},
-	"save_all_on_build": true,
-	"select_file":
-	{
-		"height": 0.0,
-		"selected_items":
-		[
-			[
-				"pac",
-				"package.json"
-			]
-		],
-		"width": 0.0
-	},
-	"select_project":
-	{
-		"height": 0.0,
-		"selected_items":
-		[
-		],
-		"width": 0.0
-	},
-	"show_minimap": true,
-	"show_open_files": false,
-	"show_tabs": true,
-	"side_bar_visible": true,
-	"side_bar_width": 206.0,
-	"status_bar_visible": true
-}
diff --git a/node_modules/cssbeautify/package.json b/node_modules/cssbeautify/package.json
deleted file mode 100644
index fbd8395..0000000
--- a/node_modules/cssbeautify/package.json
+++ /dev/null
@@ -1,42 +0,0 @@
-{
-  "name": "cssbeautify",
-  "description": "Reindent and reformat CSS.",
-  "version": "0.3.1",
-  "homepage": "http://cssbeautify.com",
-  "author": {
-    "name": "Ariya Hidayat",
-    "email": "ariya@sencha.com"
-  },
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/senchalabs/cssbeautify"
-  },
-  "bugs": {
-    "url": "https://github.com/senchalabs/cssbeautify/issues"
-  },
-  "licenses": [
-    {
-      "type": "MIT",
-      "url": "https://github.com/senchalabs/cssbeautify/blob/master/README.md"
-    }
-  ],
-  "main": "cssbeautify.js",
-  "bin": {
-    "cssbeautify": "bin/cssbeautify"
-  },
-  "engines": {
-    "node": "*"
-  },
-  "scripts": {
-    "test": "node test/runner.js"
-  },
-  "keywords": [
-    "cssbeautify",
-    "css",
-    "formatter"
-  ],
-  "readme": "# CSS Beautify #\n\nCSS Beautify is a JavaScript implementation of reindenter and reformatter for styles written in [CSS](http://www.w3.org/Style/CSS/).\n\nGiven the following style:\n\n```css\nmenu{color:red} navigation{background-color:#333}\n```\n\nCSS Beautify will produce:\n\n```css\nmenu {\n    color: red\n}\n\nnavigation {\n    background-color: #333\n}\n```\n\nTry it online at [cssbeautify.com](http://cssbeautify.com). For the\ncommand-line use, install Node.js [cssbeautify](https://npmjs.org/package/cssbeautify) package.\n\nFor more examples, see also its [test suite](http://cssbeautify.com/test/).\n\n## Using cssbeautify() function ##\n\nSince CSS Beautify is written in pure JavaScript, it can run anywhere that JavaScript can run.\n\nThe API is very simple:\n\n```javascript\nvar result = cssbeautify(style, options);\n```\n\n**options** is an optional object to adjust the formatting. Known options so far are:\n\n  *  <code>indent</code> is a string used for the indentation of the declaration (default is 4 spaces)\n  *  <code>openbrace</code> defines the placement of open curly brace, either *end-of-line* (default) or *separate-line*.\n  *  <code>autosemicolon</code> always inserts a semicolon after the last ruleset (default is *false*)\n\nExample call:\n\n```javascript\nvar beautified = cssbeautify('menu{opacity:.7}', {\n    indent: '  ',\n    openbrace: 'separate-line',\n    autosemicolon: true\n});\n```\n\n## Contributing ##\n\nContributions are welcomed! Please read the [Contribution Guide](https://github.com/senchalabs/cssbeautify/blob/master/CONTRIBUTING.md) for more info.\n\n## License ##\n\nCopyright (C) 2012 Sencha Inc.\nCopyright (C) 2011 Sencha Inc.\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in\nall copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\nTHE SOFTWARE.\n",
-  "readmeFilename": "README.md",
-  "_id": "cssbeautify@0.3.1",
-  "_from": "cssbeautify@"
-}

From 2786143669479ff69883ed6bf61be78c740d48c1 Mon Sep 17 00:00:00 2001
From: Hardmath123 <hardmath123@gmail.com>
Date: Mon, 4 Nov 2013 18:52:33 -0800
Subject: [PATCH 8/8] Fixed clicking bug and added changes to the COMPARE page.

---
 compare.html | 40 ++++++++++++++++++----------------------
 js/IO.js     |  1 +
 js/Sprite.js |  7 ++++---
 player.css   |  2 +-
 4 files changed, 24 insertions(+), 26 deletions(-)

diff --git a/compare.html b/compare.html
index 1e89b26..fd4b25c 100644
--- a/compare.html
+++ b/compare.html
@@ -7,16 +7,9 @@ header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past
     <head>
         <title>Scratch HTML5 vs. Flash</title>
         <meta charset="utf-8">
-        <style type="text/css">
-            body {
-                background: #222;
-                color: #fff;
-                margin: 0;
-            }
-        </style>
         <link href="player.css" type="text/css" rel="stylesheet" />
-        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
-        <script src="//ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
+        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
+        <script src="http://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
         <script src="js/util/Timer.js"></script>
         <script src="js/util/OffsetBuffer.js"></script>
         <script src="js/util/Color.js"></script>
@@ -89,14 +82,23 @@ header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past
     </head>
     <body>
     <div style="display: inline-block;">
-        <div id="up">&nbsp;</div>
-        <div id="left">&nbsp;</div>
-        <div id="overContainer">
-            <div id="greenSlide"><div id="greenSlideFg"><img src="img/greenflag.png"></div></div>
-            <div id="container"></div>
+        <div id="up">&#x25B2;</div>
+        <div id="ui-top">
+            <div id="info">Loading&hellip;</div>
+            <button id="trigger_stop">&#9632;</button>
+            <button id="trigger_green_flag">&#9873;</button>
+            <div class="clearer"></div>
         </div>
-        <div id="right">&nbsp;</div>
-        <div id="down">&nbsp;</div>
+        <div id="left">&#x25c0;</div>
+        <div id="overContainer">
+          <div id="greenSlide"><div id="greenSlideFg"><img src="img/greenflag.png"></div></div>
+          <div id="container"></div>
+        </div>
+        <div id="right">&#x25b6;</div>
+        <div id="ui-bottom">
+            <span id="address-hint">http://scratch.mit.edu/projects/</span><input type="text" name="project_id" id="project_id" placeholder="10000160" /><button id='go_project'>&rarr;</button></div>
+        <div id="down">&#x25BC;</div>
+
     </div>
     <div style="display: inline-block;">
         <div id="flashScratch" style="text-align:center;visibility:hidden;">
@@ -106,11 +108,5 @@ header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past
             </a>
         </div>
     </div>
-        <div id="info">Loading...</div>
-
-        <button id="trigger_green_flag">Green flag</button>
-        <button id="trigger_stop">Stop</button>
-
-        <input type="text" name="project_id" id="project_id" /><button id='go_project'>Go!</button>
     </body>
 </html>
diff --git a/js/IO.js b/js/IO.js
index b9a726c..bcb336b 100644
--- a/js/IO.js
+++ b/js/IO.js
@@ -27,6 +27,7 @@ var IO = function() {
     // In production, simply use the local path (no proxy)
     // since we won't be hampered by the same-origin policy.
     this.base = 'proxy.php?resource=internalapi/';
+    //this.base = 'http://scratch.mit.edu/internalapi/'; // Final base
     this.project_base = this.base + 'project/';
     this.project_suffix = '/get/';
     this.asset_base = this.base + 'asset/';
diff --git a/js/Sprite.js b/js/Sprite.js
index 48a1a64..e9eb141 100644
--- a/js/Sprite.js
+++ b/js/Sprite.js
@@ -196,9 +196,10 @@ Sprite.prototype.updateCostume = function() {
 
 Sprite.prototype.onClick = function(evt) {
     // TODO - needs work!!
-    var boxOffset = $('#container').offset();
-    var mouseX = runtime.mousePos[0] + 240 + boxOffset.left;
-    var mouseY = 180 - runtime.mousePos[1] + boxOffset.top;
+
+    // We don't need boxOffset anymore.
+    var mouseX = runtime.mousePos[0] + 240;
+    var mouseY = 180 - runtime.mousePos[1];
 
     if (this.mesh.src.indexOf('.svg') == -1) {
         // HACK - if the image SRC doesn't indicate it's an SVG,
diff --git a/player.css b/player.css
index fc91ea4..f64944b 100644
--- a/player.css
+++ b/player.css
@@ -2,7 +2,7 @@ body {
     background: #fff;
     color: #333;
     margin: 0;
-    padding: 30px;
+    padding: 0px;
     font-family: sans-serif;
 }
 /* Wrapper wraps the entire player, and the text below and above. Ideally,