Add placing capability

Read description

**Uses keyboard; not likely to work on mobile**

##Notes
This *will* move if you are typing in a menu, but not in an alert.
Non-shifted presses will behave *unpredictably* if there are multiple pixels.
Shift-hold presses will behave more predictably. Using multiple pixels is not supported.
The pixel has a state of "solid" and a density of 2. It might be able to move through liquids and gases according to this density.

##Controls##
WASD to move
Z to shock
X to explode
Hold shift to repeat action
Hold alt with movement keys to place the current element
* It cannot place itself
* You can also use Alt+H to place on the right
Q to reset keys (current action, shift status, alt status) if they get stuck

mods/controllable_pixel_test.js

@@ -1,4 +1,28 @@
-sussyKey = null,
+sussyKey = null;
+isShift = false;
+isAlt = false;
+
+document.addEventListener("keydown", function(modifierDownListener) {
+    // User presses shift
+    if (modifierDownListener.keyCode == 16) {
+        isShift = true;
+    }
+    // User presses alt
+    if (modifierDownListener.keyCode == 18) {
+        isAlt = true;
+    }
+});
+
+document.addEventListener("keyup", function(modifierUpListener) {
+    // User releases shift
+    if (modifierUpListener.keyCode == 16) {
+        isShift = false;
+    }
+    // User releases alt
+    if (modifierUpListener.keyCode == 18) {
+        isAlt = false;
+    }
+});
 
 document.addEventListener("keyup", function(sussyListener) {
     switch (sussyListener.keyCode) {
@@ -23,49 +47,101 @@ document.addEventListener("keyup", function(sussyListener) {
         case 90:
             sussyKey = "Z";
             break;
+        case 72:
+            sussyKey = "H";
+            break;
     };
 });
 
+function tryCreatePixel(_element,_x,_y) {
+    if(!elements[_element]) {
+        throw new Error("Element " + _element + " doesn't exist!");
+    };
+    if(isEmpty(_x,_y)) {
+        createPixel(_element,_x,_y);
+        return true;
+    } else {
+        return false;
+    }
+}
+
+function controllablePixelTryCreatePixelNullCheck(_element,_x,_y) {
+    if(!elements[_element]) { //catch the null
+        return false;
+    };
+    if(isEmpty(_x,_y)) {
+        tryCreatePixel(_element,_x,_y);
+        return true;
+    } else {
+        return false;
+    }
+}
+
 elements.controllable_pixel = {
     color: "#FFFFFF",
     colorOn: "#FFFF00",
     behavior: behaviors.WALL,
     state: "solid",
     density: 2000,
+    maxSize: 1,
     conduct: 1,
     hardness: 1,
     tick: function(pixel) {
-        var xx = pixel.x
+        var xx = pixel.x;
-        var yy = pixel.y
+        var yy = pixel.y;
+        userElement = currentElement;
+        if(userElement === pixel.element) {
+            userElement = null;
+        };
+        if(isShift && !isAlt) {
+            sussyKey === "Z" ? pixel.color = "rgb(255,191,127)" : pixel.color = "rgb(255,127,127)";
+        }
+        if(isAlt && !isShift) {
+            sussyKey === "Z" ? pixel.color = "rgb(191,255,127)" : pixel.color = "rgb(127,255,127)";
+        }
+        if(isAlt && isShift) {
+            sussyKey === "Z" ? pixel.color = "rgb(255,255,0)" : pixel.color = "rgb(255,255,127)";
+        }
+        if(!isAlt && !isShift) {
+            sussyKey === "Z" ? pixel.color = "rgb(255,255,191)" : pixel.color = "rgb(255,255,255)";
+        }
         if(sussyKey !== null) {
             switch (sussyKey) {
                 case "W":
-                    tryMove(pixel,xx,yy-1)
+                    isAlt ? controllablePixelTryCreatePixelNullCheck(userElement,xx,yy-1) : tryMove(pixel,xx,yy-1);
-                    if(shiftDown === 0) {
+                    if(!isShift) {
                         sussyKey = null;
                     }
                     break;
                 case "A":
-                    tryMove(pixel,xx-1,yy)
+                    isAlt ? controllablePixelTryCreatePixelNullCheck(userElement,xx-1,yy) : tryMove(pixel,xx-1,yy);
-                    if(shiftDown === 0) {
+                    if(!isShift) {
                         sussyKey = null;
                     }
                     break;
                 case "S":
-                    tryMove(pixel,xx,yy+1)
+                    isAlt ? controllablePixelTryCreatePixelNullCheck(userElement,xx,yy+1) : tryMove(pixel,xx,yy+1);
-                    if(shiftDown === 0) {
+                    if(!isShift) {
                         sussyKey = null;
                     }
                     break;
                 case "D":
-                    tryMove(pixel,xx+1,yy)
+                    tryMove(pixel,xx+1,yy);
-                    if(shiftDown === 0) {
+                    if(!isShift) {
+                        sussyKey = null;
+                    }
+                    break;
+                case "H": //Alt+D is something else in some browsers.
+                    if(isAlt) {
+                        controllablePixelTryCreatePixelNullCheck(userElement,xx+1,yy);
+                    };
+                    if(!isShift) {
                         sussyKey = null;
                     }
                     break;
                 case "X":
-                    explodeAt(xx,yy,4)
+                    explodeAt(xx,yy,5)
-                    if(shiftDown === 0) {
+                    if(!isShift) {
                         sussyKey = null;
                     }
                     break;
@@ -73,12 +149,14 @@ elements.controllable_pixel = {
                     if (!pixel.charge && !pixel.chargeCD && !isEmpty(pixel.x,pixel.y,true)) {
                         pixel.charge = 1;
                     }
-                    if(shiftDown === 0) {
+                    if(!isShift === 0) {
                         sussyKey = null;
                     }
                     break;
-                case "Q":
+                case "Q": //Use if a key gets stuck
                     sussyKey = null;
+                    isShift = null;
+                    isAlt = null;
                     break;
             }
         }