From 1c528b42f9b1c9be9197921586388c3a3bdc5c17 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Wed, 22 Feb 2012 23:16:23 -0800
Subject: CSS Panel Update - Adding montage objects for css panel
---
js/panels/css-panel/css-panel-container.js | 15 +++++
js/panels/css-panel/css-panel.reel/css-panel.css | 0
js/panels/css-panel/css-panel.reel/css-panel.html | 45 +++++++++++++
js/panels/css-panel/css-panel.reel/css-panel.js | 33 ++++++++++
.../css-panel/style-sheet.reel/style-sheet.css | 0
.../css-panel/style-sheet.reel/style-sheet.html | 42 ++++++++++++
.../css-panel/style-sheet.reel/style-sheet.js | 52 +++++++++++++++
.../style-sheets-view.reel/style-sheets-view.css | 0
.../style-sheets-view.reel/style-sheets-view.html | 68 ++++++++++++++++++++
.../style-sheets-view.reel/style-sheets-view.js | 45 +++++++++++++
.../styles-view-container.css | 11 ++++
.../styles-view-container.html | 75 ++++++++++++++++++++++
.../styles-view-container.js | 35 ++++++++++
13 files changed, 421 insertions(+)
create mode 100644 js/panels/css-panel/css-panel-container.js
create mode 100644 js/panels/css-panel/css-panel.reel/css-panel.css
create mode 100644 js/panels/css-panel/css-panel.reel/css-panel.html
create mode 100644 js/panels/css-panel/css-panel.reel/css-panel.js
create mode 100644 js/panels/css-panel/style-sheet.reel/style-sheet.css
create mode 100644 js/panels/css-panel/style-sheet.reel/style-sheet.html
create mode 100644 js/panels/css-panel/style-sheet.reel/style-sheet.js
create mode 100644 js/panels/css-panel/style-sheets-view.reel/style-sheets-view.css
create mode 100644 js/panels/css-panel/style-sheets-view.reel/style-sheets-view.html
create mode 100644 js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
create mode 100644 js/panels/css-panel/styles-view-container.reel/styles-view-container.css
create mode 100644 js/panels/css-panel/styles-view-container.reel/styles-view-container.html
create mode 100644 js/panels/css-panel/styles-view-container.reel/styles-view-container.js
diff --git a/js/panels/css-panel/css-panel-container.js b/js/panels/css-panel/css-panel-container.js
new file mode 100644
index 00000000..aeaa2d13
--- /dev/null
+++ b/js/panels/css-panel/css-panel-container.js
@@ -0,0 +1,15 @@
+/*
+ This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ */
+
+var Montage = require("montage/core/core").Montage;
+var PanelBase = require("js/panels/PanelBase").PanelBase;
+var Content = require("js/panels/css-panel/css-panel.reel").CSSPanelNew;
+
+exports.CSSPanelContainer = Montage.create(PanelBase, {
+ panelName : { value: "CSSPanelNew" },
+ minHeight : { value: 200 },
+ content : { value: Content }
+});
\ No newline at end of file
diff --git a/js/panels/css-panel/css-panel.reel/css-panel.css b/js/panels/css-panel/css-panel.reel/css-panel.css
new file mode 100644
index 00000000..e69de29b
diff --git a/js/panels/css-panel/css-panel.reel/css-panel.html b/js/panels/css-panel/css-panel.reel/css-panel.html
new file mode 100644
index 00000000..cc1876c3
--- /dev/null
+++ b/js/panels/css-panel/css-panel.reel/css-panel.html
@@ -0,0 +1,45 @@
+
+
+
+
+
+
+
+
+
+
+ Style Sheets
+
+ Styles
+
+
+
+
\ No newline at end of file
diff --git a/js/panels/css-panel/css-panel.reel/css-panel.js b/js/panels/css-panel/css-panel.reel/css-panel.js
new file mode 100644
index 00000000..a593f1c4
--- /dev/null
+++ b/js/panels/css-panel/css-panel.reel/css-panel.js
@@ -0,0 +1,33 @@
+/*
+ This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ */
+
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.CSSPanelNew = Montage.create(Component, {
+ hasTemplate: {
+ value: true
+ },
+ condition: {
+ value: false
+ },
+ templateDidLoad : {
+ value: function() {
+ console.log("css panel : template did load");
+ //this.condition = true;
+ }
+ },
+ prepareForDraw : {
+ value: function() {
+ console.log("css panel : prepare for draw");
+ }
+ },
+ draw : {
+ value: function() {
+ console.log("css panel : draw");
+ }
+ }
+});
diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.css b/js/panels/css-panel/style-sheet.reel/style-sheet.css
new file mode 100644
index 00000000..e69de29b
diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.html b/js/panels/css-panel/style-sheet.reel/style-sheet.html
new file mode 100644
index 00000000..4fb94335
--- /dev/null
+++ b/js/panels/css-panel/style-sheet.reel/style-sheet.html
@@ -0,0 +1,42 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/js/panels/css-panel/style-sheet.reel/style-sheet.js b/js/panels/css-panel/style-sheet.reel/style-sheet.js
new file mode 100644
index 00000000..daa614c2
--- /dev/null
+++ b/js/panels/css-panel/style-sheet.reel/style-sheet.js
@@ -0,0 +1,52 @@
+/*
+ This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ */
+
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.StyleSheet = Montage.create(Component, {
+ deserializedFromTemplate : {
+ value: function() {
+ console.log("style sheet view - deserialized");
+ }
+ },
+ prepareForDraw : {
+ value: function() {
+ console.log("style sheet view - prepare for draw");
+ }
+ },
+ draw : {
+ value: function() {
+ console.log("styles sheet view - draw");
+ }
+ },
+ _name: {
+ value: null
+ },
+ name : {
+ get: function() {
+ return this._name;
+ },
+ set: function(text) {
+ this._name = text;
+ }
+ },
+ _styleSheet : {
+ value: null
+ },
+ styleSheet : {
+ get: function() {
+ return this._styleSheet;
+ },
+ set: function(sheet) {
+ if(sheet.href) {
+ this.name = sheet.href.substring(sheet.href.lastIndexOf('/'));
+ } else {
+ this.name = 'Style Tag';
+ }
+ }
+ }
+});
\ No newline at end of file
diff --git a/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.css b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.css
new file mode 100644
index 00000000..e69de29b
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
new file mode 100644
index 00000000..78836f21
--- /dev/null
+++ b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.html
@@ -0,0 +1,68 @@
+
+
+
+
+
+
+
+
+
+
No document loaded. Please Open or Create a new document.
+
+
+
+
\ No newline at end of file
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
new file mode 100644
index 00000000..f93de830
--- /dev/null
+++ b/js/panels/css-panel/style-sheets-view.reel/style-sheets-view.js
@@ -0,0 +1,45 @@
+/*
+ This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ */
+
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.StyleSheetsView = Montage.create(Component, {
+ noDocumentCondition : {
+ value: true
+ },
+ styleSheets : {
+ value: []
+ },
+ stylesController : {
+ value: null
+ },
+ deserializedFromTemplate : {
+ value: function() {
+ console.log("style sheet view - deserialized");
+
+ this.stylesController = this.application.ninja.stylesController;
+
+ this.eventManager.addEventListener("styleSheetsReady", this, false);
+ }
+ },
+ handleStyleSheetsReady : {
+ value: function(e) {
+ //this.styleSheets = null;
+ this.styleSheets = this.stylesController.userStyleSheets;
+ }
+ },
+ prepareForDraw : {
+ value: function() {
+ console.log("style sheet view - prepare for draw");
+ }
+ },
+ draw : {
+ value: function() {
+ console.log("styles sheet view - draw");
+ }
+ }
+});
\ No newline at end of file
diff --git a/js/panels/css-panel/styles-view-container.reel/styles-view-container.css b/js/panels/css-panel/styles-view-container.reel/styles-view-container.css
new file mode 100644
index 00000000..1d3baa5c
--- /dev/null
+++ b/js/panels/css-panel/styles-view-container.reel/styles-view-container.css
@@ -0,0 +1,11 @@
+.styles-view-container h3 {
+ background-color: rgba(255,255,255, 0.1);
+ border: 1px dashed rgba(255,255,255, 0.2);
+ border-radius: 4px;
+ color: #CCC;
+ font-size: 11px;
+ font-weight: normal;
+ margin: 5px;
+ padding: 10px;
+ text-shadow: 1px 1px 0px #333;
+}
\ 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
new file mode 100644
index 00000000..4b2bf60a
--- /dev/null
+++ b/js/panels/css-panel/styles-view-container.reel/styles-view-container.html
@@ -0,0 +1,75 @@
+
+
+
+
+
+
+
+
+
+
No document loaded. Please Open or Create a new document.
+
+
+
\ No newline at end of file
diff --git a/js/panels/css-panel/styles-view-container.reel/styles-view-container.js b/js/panels/css-panel/styles-view-container.reel/styles-view-container.js
new file mode 100644
index 00000000..41e16192
--- /dev/null
+++ b/js/panels/css-panel/styles-view-container.reel/styles-view-container.js
@@ -0,0 +1,35 @@
+/*
+ This file contains proprietary software owned by Motorola Mobility, Inc.
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.
+ (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
+ */
+
+var Montage = require("montage/core/core").Montage,
+ Component = require("montage/ui/component").Component;
+
+exports.StylesViewContainer = Montage.create(Component, {
+ noDocumentCondition : {
+ value: true
+ },
+ contentPanel : {
+ value: 'rules'
+ },
+ displayedList : {
+ value: null
+ },
+ deserializedFromTemplate : {
+ value: function() {
+ console.log("styles view container - deserialized");
+ }
+ },
+ prepareForDraw : {
+ value: function() {
+ console.log("styles view container - prepare for draw");
+ }
+ },
+ draw : {
+ value: function() {
+ console.log("styles view container - draw");
+ }
+ }
+});
\ No newline at end of file
--
cgit v1.2.3
From a5ee11857f923d3e49b44c0a8c480e9d0b026d5b Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Wed, 22 Feb 2012 23:18:12 -0800
Subject: CSS Panel Update
---
js/controllers/styles-controller.js | 11 ++++++++--
js/lib/NJUtils.js | 10 +++++----
.../PanelContainer.reel/PanelContainer.js | 4 +++-
js/panels/css-panel/css-panel.reel/css-panel.html | 4 ++--
.../css-panel/style-sheet.reel/style-sheet.html | 3 ++-
.../css-panel/style-sheet.reel/style-sheet.js | 8 ++++---
.../style-sheets-view.reel/style-sheets-view.html | 25 +++++++++++++++-------
.../style-sheets-view.reel/style-sheets-view.js | 8 +++++--
.../styles-view-container.html | 8 ++++---
9 files changed, 55 insertions(+), 26 deletions(-)
diff --git a/js/controllers/styles-controller.js b/js/controllers/styles-controller.js
index 44ca50e1..aa5a4e7f 100755
--- a/js/controllers/styles-controller.js
+++ b/js/controllers/styles-controller.js
@@ -94,11 +94,18 @@ var stylesController = exports.StylesController = Montage.create(Component, {
// Returns null if sheet not found (as in non-ninja projects)
// Setter will handle null case
this.defaultStylesheet = this.getSheetFromElement(this.CONST.DEFAULT_SHEET_ID);
-
- //debugger;
+
+ this.userStyleSheets = nj.toArray(document._document.styleSheets).filter(function(sheet) {
+ return sheet !== this._stageStylesheet;
+ }, this);
+
+ NJevent('styleSheetsReady', this);
},
enumerable : false
},
+ userStyleSheets : {
+ value : null
+ },
_stageStylesheet : {
value : null
},
diff --git a/js/lib/NJUtils.js b/js/lib/NJUtils.js
index 887743c5..49dfd706 100755
--- a/js/lib/NJUtils.js
+++ b/js/lib/NJUtils.js
@@ -19,16 +19,18 @@ exports.NJUtils = Object.create(Object.prototype, {
///// Quick "getElementById"
$ : {
- value: function(id) {
- return document.getElementById(id);
+ value: function(id, doc) {
+ doc = doc || document;
+ return doc.getElementById(id);
}
},
///// Quick "getElementsByClassName" which also returns as an Array
///// Can return as NodeList by passing true as second argument
$$ : {
- value: function(className, asNodeList) {
- var list = document.getElementsByClassName(className);
+ value: function(className, asNodeList, doc) {
+ doc = doc || document;
+ var list = doc.getElementsByClassName(className);
return (asNodeList) ? list : this.toArray(list);
}
},
diff --git a/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js b/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js
index b8223471..db0f494b 100755
--- a/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js
+++ b/js/panels/PanelContainer/PanelContainer.reel/PanelContainer.js
@@ -16,6 +16,7 @@ var ComponentsPanel = require("js/panels/Components/ComponentsPanel").Components
var ProjectPanel = require("js/panels/Project/ProjectPanel").ProjectPanel;
var MaterialsPanel = require("js/panels/Materials/MaterialsPanel").MaterialsPanel;
var PresetsPanel = require("js/panels/presets/presets-panel").PresetsPanel;
+var CSSPanelNew = require("js/panels/css-panel/css-panel-container").CSSPanelContainer;
exports.PanelContainer = Montage.create(Component, {
lastOffset: {
@@ -45,7 +46,7 @@ exports.PanelContainer = Montage.create(Component, {
},
initPanelOrder: {
- value: ['PropertiesPanel','ColorPanel','ComponentsPanel','ProjectPanel','CSSPanel','MaterialsPanel','PresetsPanel']
+ value: ['CSSPanelNew','PropertiesPanel','ColorPanel','ComponentsPanel','ProjectPanel','CSSPanel','MaterialsPanel','PresetsPanel']
},
panelOrder: {
@@ -101,6 +102,7 @@ exports.PanelContainer = Montage.create(Component, {
this.addEventListener("change@appModel.CSSPanel", this, false);
this.addEventListener("change@appModel.MaterialsPanel", this, false);
this.addEventListener("change@appModel.PresetsPanel", this, false);
+ this.addEventListener("change@appModel.CSSPanelNew", this, false);
}
},
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 cc1876c3..86bfbbb7 100644
--- a/js/panels/css-panel/css-panel.reel/css-panel.html
+++ b/js/panels/css-panel/css-panel.reel/css-panel.html
@@ -26,9 +26,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
},
"stylesViewContainer": {
"module" : "js/panels/css-panel/styles-view-container.reel",
- "name": "StyleSheetView",
+ "name": "StylesViewContainer",
"properties": {
- "element": {"#": "css-styles-view" }
+ "element": {"#": "styles-view-container" }
}
}
}
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 4fb94335..43ffec6f 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,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
"module": "montage/ui/dynamic-text.reel",
"name": "DynamicText",
"properties": {
- "element": {"#": "sheet-name"}
+ "element": {"#": "sheet-name"},
+ "defaultText": "Style sheet"
},
"bindings": {
"value": {
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 daa614c2..a4fe5960 100644
--- a/js/panels/css-panel/style-sheet.reel/style-sheet.js
+++ b/js/panels/css-panel/style-sheet.reel/style-sheet.js
@@ -34,19 +34,21 @@ exports.StyleSheet = Montage.create(Component, {
this._name = text;
}
},
- _styleSheet : {
+ _source : {
value: null
},
- styleSheet : {
+ source : {
get: function() {
- return this._styleSheet;
+ return this._source;
},
set: function(sheet) {
+ console.log('sheet being set');
if(sheet.href) {
this.name = sheet.href.substring(sheet.href.lastIndexOf('/'));
} else {
this.name = 'Style Tag';
}
+ this._source = sheet;
}
}
});
\ No newline at end of file
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 78836f21..d1dbfa2b 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
@@ -16,22 +16,31 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
"element" : {"#" : "style-sheet-view-container"}
}
},
+ "arrayController" : {
+ "module" : "montage/ui/controller/array-controller",
+ "name": "ArrayController",
+ "bindings": {
+ "content": {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "styleSheets",
+ "oneway": true
+ }
+ }
+ },
"styleSheetList": {
"module" : "montage/ui/list.reel",
"name": "List",
"properties": {
- "element": {"#": "sheet-list" }
- },
- "bindings": {
- "content": {
- "boundObject": {"@": "owner" },
- "boundObjectPropertyPath": "styleSheets"
- }
+ "element": {"#": "sheet-list" },
+ "contentController": {"@": "arrayController"}
}
},
"sheet": {
"module": "js/panels/css-panel/style-sheet.reel",
"name": "StyleSheet",
+ "properties": {
+ "element": {"#": "sheet-item"}
+ },
"bindings": {
"source": {
"boundObject": {"@": "styleSheetList"},
@@ -61,7 +70,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
No document loaded. Please Open or Create a new document.
-
-
No document loaded. Please Open or Create a new document.
+
+
+
No document loaded. Please Open or Create a new document.
+