Rework blocks (#258)

Implements a Blockly-like system of objects for blocks, scripts, and block attributes, and connects it to everything else. Fix a few other things in the process.

* rough beginnings of reworked block code

* add Attr constructor; transition from getOffset() to block.left() (etc.); rewrite json2html

* fix bug where sometimes blocks didn’t symbolically attach to parent

* bugfix: now you can add block to beginning of c-stack

* move some event listeners around, resolve #242 in the process

* fix duplicate functionality

* disable context menu on “body” element

* resolve error when rendering blank attributes

* start on file import/export

* bug fixes related to file import

* I got single-file export to work :D

* start fixing multiple html files

* fixed bugs in switching between multiple html files

* add CSS blocks and export

* finish file import

* make change described by @iamunknown2 (close #252)

* fix bug where imported files weren’t editable

* fix items sometimes reversing in order on drop (thanks @iamunknown2 for reporting)

* clean up coords code

* fix tutorial 2

* figured out the issues with CSS files

* limit context menu to blocks in script area

* fix issues with loose blocks not being JSON’d correctly

* rename a whole bunch of things

* add default blocks to new CSS files

* refactor dropdown code and add to rule block

* rename Attr to BlockAttribute to match other constructors’ snooty names

* remove old files

* move function blocksToJSON to block2json.js for obvious reasons

* remove default scriptingArea contents since they’re always generated programmatically

* bugfix: default blocks in new CSS files were marked inPalette

* clean up blocks2json a lil

* update zebra to use the new system

* tweaks

* switch from strings for block types to enum

* bug fix with enum

* remove a lot of old code and random nits

* remove duplicate code

* slightly simplify file import

* a naive attempt to clog potential memory leaks

* more attempt to plug memory leaks, p.s. this is miserable and I have no idea how to know if it works

* tpyo

* delEt aLL th1NGS

* everything is garbage

* bugfix that I don’t understand why it’s necessary but ok

* Made searchBar superimpose blocks (but not when they are held by the cursor) (#261)

* fix issue where tutorials scroll the page (resolves #254 and #259)

Author: Matthew

index.html

@@ -4,12 +4,9 @@
     <meta charset="utf-8">
     <title>UI v0.0.4 | Elemental</title>
     <link rel="stylesheet" href="resources/css/style.css">
-    <script src="resources/js/vendor/htmlparser.js"></script>
     <script src="resources/js/vendor/interact.min.js"></script>
     <script src="resources/js/vendor/jszip.min.js"></script>
     <script src="resources/js/vendor/filesaver.min.js"></script>
-    <script src="resources/js/vendor/cssjson.js"></script>
-    <script src="resources/js/vendor/htmljson.js"></script>
     <script src="resources/js/script.js"></script>
     <script src="resources/js/blockFilter.js"></script>
     <script src="resources/js/elemental-intro.js"></script>
@@ -190,26 +187,14 @@
             </div>
           </div>
         </div>
-        <div class="scriptingArea">
-          <!-- some test stuff... -->
-          <ul class="script">
-            <li class="hat">DOCTYPE html</li>
-            <ul class="c-wrapper e-body">
-                <li class="c-header">body</li>
-                <ul class="c-content">
-                </ul>
-                <li class="c-footer">&nbsp;</li>
-            </ul>
-          </ul>
-        </div>
+        <div class="scriptingArea"></div>
         <div class="trashCan" id="trashCan"></div>
 	<div class="trashCan2" id="trashCan2"></div>
       </div>
     </div>
   <script src='resources/js/files.js'></script>
-  <script src='resources/js/blocks.js'></script>
   <script src='resources/js/blockAttributes.js'></script>
-  <script src='resources/js/cssAttributes.js'></script>
+  <script src='resources/js/blocks.js'></script>
   <script src='resources/js/block2json.js'></script>
   <script src='resources/js/fileManagement.js'></script>
   </body>

resources/css/blocks.css

@@ -172,7 +172,7 @@ body {
     background-color: orange;
     border-radius: 10px;
     box-sizing: border-box;
-    display: inline-block;
+    display: inline-flex;
     padding: 3px;
     margin-right: 6px;
     .attr-dropdown,

resources/css/blocks.scss

@@ -166,7 +166,7 @@ body {
   background-color: orange;
   border-radius: 10px;
   box-sizing: border-box;
-  display: inline-block;
+  display: inline-flex;
   padding: 3px;
   margin-right: 6px; }
   .attr-holder .attr-dropdown,
@@ -550,7 +550,8 @@ html, body {
   width: 0px;
   padding-right: 4px;
   opacity: 0.7;
-  transition: width 0.2s, padding 0.2s; }
+  transition: width 0.2s, padding 0.2s;
+  z-index: 1; }
 
 #searchBar:hover, #searchBar:focus {
   opacity: 1; }
@@ -611,5 +612,3 @@ html, body {
 @media (max-width: 450px) {
   .advanceWrap {
     display: none; } }
-
-/*# sourceMappingURL=style.css.map */

resources/css/style.css

@@ -329,6 +329,7 @@ html, body {
     opacity: 0.7;
     transition: width 0.2s,
                          padding 0.2s;
+    z-index: 1;
 }
 
 #searchBar:hover, #searchBar:focus {