Commits

Anonymous committed dcfbc05

Get fancy, with gradients and shadows.

Comments (0)

Files changed (1)

javascript/drag.js

     this.draw = function() {
       ctx.clearRect(0, 0, canvas.width, canvas.height);
 
+      ctx.shadowOffsetX = 10;
+      ctx.shadowOffsetY = 10;
+      ctx.shadowBlur = 15;
+
       for (var i = 0; i < boxes.length; i++) {
         var box = boxes[i];
-        ctx.fillStyle = box[4];
-        ctx.beginPath();
-        ctx.rect(box[0], box[1], box[2], box[3]);
-        ctx.closePath();
-        ctx.fill();
+        ctx.shadowColor = "black";
         if (i === selected) {
-          ctx.lineWidth = "3";
-          ctx.strokeStyle = "black";
-          ctx.rect(box[0], box[1], box[2], box[3]);
-          ctx.closePath();
-          ctx.stroke();
+          var max = box[2] > box[3] ? box[2] : box[3];
+          var gradient = ctx.createLinearGradient(
+            box[0], box[1], box[0]+max, box[1]+max
+          );
+          gradient.addColorStop(0, box[4]);
+          gradient.addColorStop(0.5, "white");
+          gradient.addColorStop(1, box[4]);
+          ctx.fillStyle = gradient;
+        } else {
+          ctx.fillStyle = box[4];
         }
+        ctx.fillRect(box[0], box[1], box[2], box[3]);
+
+        ctx.lineWidth = "1";
+        ctx.strokeStyle = "black";
+        ctx.shadowColor = "transparent";
+        ctx.strokeRect(box[0], box[1], box[2], box[3]);
       }
     };
 
Tip: Filter by directory path e.g. /media app.js to search for public/media/app.js.
Tip: Use camelCasing e.g. ProjME to search for ProjectModifiedEvent.java.
Tip: Filter by extension type e.g. /repo .js to search for all .js files in the /repo directory.
Tip: Separate your search with spaces e.g. /ssh pom.xml to search for src/ssh/pom.xml.
Tip: Use ↑ and ↓ arrow keys to navigate and return to view the file.
Tip: You can also navigate files with Ctrl+j (next) and Ctrl+k (previous) and view the file with Ctrl+o.
Tip: You can also navigate files with Alt+j (next) and Alt+k (previous) and view the file with Alt+o.