From db9d44fea7856a8fba9e9e306dafa8777f1eb015 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Fri, 13 Apr 2012 01:45:31 -0700
Subject: CSS Panel - Add drag and drop UI

---
 js/panels/css-panel/style.reel/style.js | 41 ++++++++++++++++++++++++++++++++-
 1 file changed, 40 insertions(+), 1 deletion(-)

(limited to 'js/panels/css-panel/style.reel/style.js')

diff --git a/js/panels/css-panel/style.reel/style.js b/js/panels/css-panel/style.reel/style.js
index 6ff102b2..c3e9efdf 100644
--- a/js/panels/css-panel/style.reel/style.js
+++ b/js/panels/css-panel/style.reel/style.js
@@ -28,7 +28,36 @@ exports.Style = Montage.create(TreeNode, {
             this.needsDraw = true;
         }
     },
+    handleEvent : {
+        value: function(e) {
+            console.log(e);
+        }
+    },
+
+    handleDragstart : {
+        value: function(e) {
+            e.dataTransfer.effectAllowed = 'move';
+            e.dataTransfer.setData('Text', 'my styles, baby!');
+            this.element.classList.add("dragged");
+        }
+    },
 
+    handleDragend : {
+        value: function(e) {
+            this.element.classList.remove("dragging");
+            this.element.classList.remove("dragged");
+        }
+    },
+    handleDrag : {
+        value: function(e) {
+            this.element.classList.add("dragging");
+        }
+    },
+    handleDrop : {
+        value: function(e) {
+            this.element.classList.remove("drag-enter");
+        }
+    },
     handleSourceObjectSet: {
         value: function() {
             //debugger;
@@ -41,7 +70,17 @@ exports.Style = Montage.create(TreeNode, {
             console.log("style - template did load");
         }
     },
-
+    prepareForDraw : {
+        value: function() {
+            console.log("style's prepare for draw");
+            this.element.addEventListener('dragstart', this, false);
+            this.element.addEventListener('drag', this, false);
+//            this.element.addEventListener('dragenter', this, false);
+//            this.element.addEventListener('dragleave', this, false);
+            this.element.addEventListener('dragend', this, false);
+            this.element.addEventListener('drop', this, false);
+        }
+    },
     draw : {
         value : function() {
             //debugger;
-- 
cgit v1.2.3