From 197a7646e472fcea616764685c8d03c6063e66f5 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Fri, 18 May 2012 14:05:06 -0700
Subject: CSS Panel - Add support for deleting style sheets

---
 js/panels/css-panel/css-panel.reel/css-panel.html  |  3 ++-
 js/panels/css-panel/css-style.reel/css-style.js    | 13 ++---------
 .../css-panel/style-sheet.reel/style-sheet.html    | 16 --------------
 .../css-panel/style-sheet.reel/style-sheet.js      | 21 +++++++-----------
 .../style-sheets-view.reel/style-sheets-view.html  | 24 +++++++--------------
 .../style-sheets-view.reel/style-sheets-view.js    | 25 ++++++++++++++++++++++
 .../styles-view-container.html                     |  1 +
 7 files changed, 46 insertions(+), 57 deletions(-)

(limited to 'js/panels/css-panel')

diff --git a/js/panels/css-panel/css-panel.reel/css-panel.html b/js/panels/css-panel/css-panel.reel/css-panel.html
index 5bc5c87d..54bb1fae 100644
--- a/js/panels/css-panel/css-panel.reel/css-panel.html
+++ b/js/panels/css-panel/css-panel.reel/css-panel.html
@@ -15,7 +15,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                 "name" : "CSSPanelNew",
                 "properties" : {
                     "element" : {"#" : "container"},
-                    "styleSheetsView": {"@": "styleSheetsView"}
+                    "styleSheetsView": {"@": "styleSheetsView"},
+                    "stylesViewContainer": {"@": "stylesViewContainer"}
                 }
             },
 
diff --git a/js/panels/css-panel/css-style.reel/css-style.js b/js/panels/css-panel/css-style.reel/css-style.js
index 3a07f8f1..1787665f 100644
--- a/js/panels/css-panel/css-style.reel/css-style.js
+++ b/js/panels/css-panel/css-style.reel/css-style.js
@@ -143,17 +143,8 @@ exports.CssStyle = Montage.create(Component, {
 
     getRule : {
         value: function() {
-            //var declarationComponent = this.treeView.parentComponent,
-            var declarationComponent = this.parentComponent.parentComponent.parentComponent,
-                rule;
-
-            if(declarationComponent.type === 'inline') {
-                rule = { style : declarationComponent.declaration }
-            } else {
-                rule = this.parentComponent.parentComponent.parentComponent.declaration.parentRule;
-            }
-
-            return rule;
+            var declarationComponent = this.parentComponent.parentComponent.parentComponent
+            return declarationComponent.rule;
         }
     },
 
diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.html b/js/panels/css-panel/style-sheet.reel/style-sheet.html
index ca24487d..788cafcc 100644
--- a/js/panels/css-panel/style-sheet.reel/style-sheet.html
+++ b/js/panels/css-panel/style-sheet.reel/style-sheet.html
@@ -20,7 +20,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                     "editButton": {"@": "editButton"},
                     "editView": {"#": "style-sheet-edit"},
                     "disableButton": {"@": "disableButton"},
-                    "importButton": {"@": "importButton"},
                     "deleteButton": {"@": "deleteButton"}
                 }
             },
@@ -74,20 +73,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                     "listener": {"@": "owner"}
                 }]
 
-            },
-            "importButton": {
-                "module": "montage/ui/button.reel",
-                "name": "Button",
-                "properties": {
-                    "element": {"#": "import-button"},
-                    "identifier": "importButton",
-                    "label": "Import"
-                },
-                "listeners": [{
-                    "type": "action",
-                    "listener": {"@": "owner"}
-                }]
-
             },
             "deleteButton": {
                 "module": "montage/ui/button.reel",
@@ -118,7 +103,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 
         <button data-montage-id="edit-button" class="ss-edit-button"></button>
         <button data-montage-id="delete-button" class="ss-delete-button nj-skinned"></button>
-        <button data-montage-id="import-button" class="ss-import-button nj-skinned"></button>
         <button data-montage-id="disable-button" class="ss-disable-button nj-skinned"></button>
 
     </div>
diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.js b/js/panels/css-panel/style-sheet.reel/style-sheet.js
index 0ff195d5..a3326275 100644
--- a/js/panels/css-panel/style-sheet.reel/style-sheet.js
+++ b/js/panels/css-panel/style-sheet.reel/style-sheet.js
@@ -11,6 +11,10 @@ exports.StyleSheet = Montage.create(Component, {
     _translateDistance: {
         value: null
     },
+    viewContainer : {
+        value: null,
+        serializable: true
+    },
 
     prepareForDraw : {
         value: function() {
@@ -43,14 +47,6 @@ exports.StyleSheet = Montage.create(Component, {
                 this.editView.style.removeProperty(transStr);
             }
 
-            if(this._readOnly) {
-                this._element.classList.add('ss-locked');
-                this.importButton.element.classList.remove('ss-invisible');
-            } else {
-                this._element.classList.remove('ss-locked');
-                this.importButton.element.classList.add('ss-invisible');
-            }
-
             if(this.default) {
                 this._element.classList.add('default-style-sheet');
             } else {
@@ -73,10 +69,7 @@ exports.StyleSheet = Montage.create(Component, {
             var nonBlurringElements = [
                 this.editView,
                 this.deleteButton.element,
-                this.disableButton.element,
-                this.importButton.element];
-
-            console.log("handle mousedown");
+                this.disableButton.element];
 
             if(nonBlurringElements.indexOf(e.target) === -1) {
                 this.editing = false;
@@ -112,7 +105,7 @@ exports.StyleSheet = Montage.create(Component, {
     handleDeleteButtonAction : {
         value: function(e) {
             e.stopPropagation();
-            debugger;
+            this.parentComponent.parentComponent.handleDeleteAction(this);
         }
     },
 
@@ -208,6 +201,8 @@ exports.StyleSheet = Montage.create(Component, {
             return this._source;
         },
         set: function(sheet) {
+            if(!sheet || sheet === this._source) { return; }
+
             console.log('sheet being set: ', this);
 
             this._extractData(sheet.ownerNode);
diff --git a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.html b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.html
index 6e1638a6..bbefc69b 100644
--- a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.html
+++ b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.html
@@ -11,16 +11,14 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
     <script type="text/montage-serialization">
         {
             "owner": {
-                "module" : "js/panels/css-panel/style-sheets-view.reel",
-                "name" : "StyleSheetsView",
+                "prototype" : "js/panels/css-panel/style-sheets-view.reel",
                 "properties" : {
                     "element" : {"#" : "style-sheets-view-container"},
                     "styleSheetList" : {"@" : "styleSheetList"}
                 }
             },
             "arrayController" : {
-                "module" : "montage/ui/controller/array-controller",
-                "name": "ArrayController",
+                "prototype" : "montage/ui/controller/array-controller",
                 "bindings": {
                     "content": {
                         "boundObject": {"@": "owner"},
@@ -30,16 +28,14 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                 }
             },
             "styleSheetList": {
-                "module" : "montage/ui/repetition.reel",
-                "name": "Repetition",
+                "prototype" : "montage/ui/repetition.reel",
                 "properties": {
                     "element": {"#": "sheet-list" },
                     "contentController": {"@": "arrayController"}
                 }
             },
             "sheet": {
-                "module": "js/panels/css-panel/style-sheet.reel",
-                "name": "StyleSheet",
+                "prototype": "js/panels/css-panel/style-sheet.reel",
                 "properties": {
                     "element": {"#": "sheet-item"}
                 },
@@ -52,8 +48,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                 }
             },
             "noDocumentCondition": {
-                "module": "montage/ui/condition.reel",
-                "name": "Condition",
+                "prototype": "montage/ui/condition.reel",
                 "properties": {
                     "element": {"#": "no-document-message" }
                 },
@@ -67,8 +62,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                 }
             },
             "showToolbarCondition": {
-                "module": "montage/ui/condition.reel",
-                "name": "Condition",
+                "prototype": "montage/ui/condition.reel",
                 "properties": {
                     "element": {"#": "style-sheets-toolbar-container" }
                 },
@@ -81,8 +75,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                 }
             },
             "toolbar": {
-                "module": "js/components/toolbar.reel",
-                "name": "Toolbar",
+                "prototype": "js/components/toolbar.reel",
                 "properties": {
                     "element": {"#": "style-sheets-toolbar"},
                     "delegate": {"@": "owner" },
@@ -95,8 +88,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                 }
             },
             "resizer": {
-                "module": "js/panels/resize-composer",
-                "name": "ResizeComposer",
+                "prototype": "js/panels/resize-composer",
                 "properties": {
                     "element": {"#": "resizeBar"},
                     "component": {"@": "owner"}
diff --git a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
index 7902f80a..383fc467 100644
--- a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
+++ b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
@@ -79,6 +79,13 @@ exports.StyleSheetsView = Montage.create(Component, {
         }
     },
 
+    handleDeleteAction : {
+        value: function(sheetComponent) {
+            this.stylesController.removeStyleSheet(sheetComponent.source);
+            this._dispatchChange();
+        }
+    },
+
     /// App event handlers
     /// --------------------------------
     
@@ -212,4 +219,22 @@ exports.StyleSheetsView = Montage.create(Component, {
             this.needsDraw = true;
         }
     },
+
+    ///// Utilities
+    //// -------------------------------------
+
+    _dispatchChange : {
+        value: function(category, type, data) {
+            this.application.ninja.stage.updatedStage = true;
+
+            category = category || 'elementChange';
+            type = type || 'styleSheetRemoved';
+
+            NJevent(category, {
+                type : type,
+                data: data,
+                redraw: null
+            });
+        }
+    }
 });
\ No newline at end of file
diff --git a/js/panels/css-panel/styles-view-container.reel/styles-view-container.html b/js/panels/css-panel/styles-view-container.reel/styles-view-container.html
index 29037278..1dd83468 100644
--- a/js/panels/css-panel/styles-view-container.reel/styles-view-container.html
+++ b/js/panels/css-panel/styles-view-container.reel/styles-view-container.html
@@ -18,6 +18,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
                     "ruleListContainer": {"@": "ruleListContainer" },
                     "computedStyleView": {"@": "computedStyleView" },
                     "substitution": {"@": "substitution" },
+                    "delegate": {"@": "stylesViewDelegate"},
                     "toolbar": {"@": "toolbar"}
                 }
             },
-- 
cgit v1.2.3