2 files changed, 167 insertions, 0 deletions
diff --git a/js/panels/css-panel/rule-list-container.reel/rule-list-container.html b/js/panels/css-panel/rule-list-container.reel/rule-list-container.html
new file mode 100644
index 00000000..6c6ecfed
--- /dev/null
+++ b/js/panels/css-panel/rule-list-container.reel/rule-list-container.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<!-- <copyright>
+This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+(c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+</copyright> -->
+<html lang="en">
+<head>
+    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
+    <script type="text/montage-serialization">
+        {
+            "owner": {
+                "module" : "js/panels/css-panel/rule-list-container.reel",
+                "name" : "RuleListContainer",
+                "properties" : {
+                    "element" : {"#" : "container"},
+                    "ruleListComponent": {"@": "ruleList"}
+                }
+            },
+            "ruleList": {
+                "module" : "js/panels/css-panel/rule-list.reel",
+                "name": "RuleList",
+                "properties": {
+                    "supportedRules" : {
+                        "1"  : {"@": "cssStyleRule"},
+                        "3"  : {"@": "cssImportRule"},
+                        "4"  : {"@": "cssMediaRule"},
+                        "5"  : {"@": "cssFontFaceRule"},
+                        "6"  : {"@": "cssPageRule"},
+                        "10" : {"@": "namespaceRule"}
+                    }
+                }
+            },
+            "cssStyleRule": {
+                "module": "js/panels/css-panel/rule-components/css-style-rule.reel",
+                "name": "CssStyleRule"
+            }
+        }
+    </script>
+</head>
+<body>
+<div id="container" class="rule-list-container"></div>
+</body>
+</html>
+\ No newline at end of file
diff --git a/js/panels/css-panel/rule-list-container.reel/rule-list-container.js b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js
new file mode 100644
index 00000000..04689602
--- /dev/null
+++ b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js
@@ -0,0 +1,123 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+ </copyright> */
+var Montage = require("montage/core/core").Montage,
+    Component = require("montage/ui/component").Component;
+exports.RuleListContainer = Montage.create(Component, {
+    ruleListComponent : {
+        value: null
+    },
+    templateDidLoad: {
+        value: function() {
+            console.log('rule list container - tempalte did load');
+        }
+    },
+    _getRuleList : {
+        value: function(s) {
+            var ruleListsOfType, i, list, matchesAll;
+            ruleListsOfType = this.ruleLists.filter(function(list) {
+                return list.selectionType = s.selectionType;
+            });
+            for(i = 0; i<ruleListsOfType.length; i++) {
+                list = ruleListsOfType[i];
+                if(s.selectionType === 'elements') {
+                    matchesAll = list.selection.every(function(element, index, array) {
+                        return array.indexOf(element) !== 0;
+                    });
+                    if(matchesAll) {
+                        break;
+                    }
+                } else {
+                    ///// Selection (single element or stylesheet) is the same,
+                    ///// Use the existing rule list
+                    if(list.selection === s.selection) {
+                        break;
+                    }
+                }
+            }
+            return list;
+        }
+    },
+    ruleLists : {
+        value: []
+    },
+    add : {
+        value: function(type, selection) {
+            console.log("Rule List Container : add()");
+            var stylesController = this.application.ninja.stylesController,
+                listInstance = Montage.create(this.ruleListComponent),
+                container = document.createElement('div'),
+                rules;
+            if(type === 'ELEMENT') {
+                rules = stylesController.getMatchingRules(selection);
+            }
+            //listInstance.element = container;
+            this._instanceToAdd = listInstance;
+            listInstance.rules = rules;
+            this.appendElement = container;
+        }
+    },
+    _instanceToAdd : {
+        value: null
+    },
+    _appendElement : {
+        value: null
+    },
+    appendElement : {
+        get: function() {
+            return this._appendElement;
+        },
+        set: function(el) {
+            this._appendElement = el;
+            this.needsDraw = true;
+        }
+    },
+    _lastDisplayedList : {
+        value: null
+    },
+    _displayedList : {
+        value: null
+    },
+    displayedList : {
+        get: function() {
+            return this._displayedList;
+        },
+        set: function(list) {
+            this._lastDisplayedList = this._displayedList;
+            this._displayedList = list;
+            this.needsDraw = true;
+        }
+    },
+    draw : {
+        value: function() {
+            if(this._lastDisplayedList) {
+                this._lastDisplayedList.style.display = 'none';
+                if(this._displayedList.element) {
+                    this._displayedList.style.display = null;
+                }
+            }
+            if(this._appendElement) {
+                this.element.appendChild(this._appendElement);
+                this._instanceToAdd.element = this._appendElement;
+                this._appendElement = null;
+            }
+        }
+    }
+});
+\ No newline at end of file

diff --git a/js/panels/css-panel/rule-list-container.reel/rule-list-container.html b/js/panels/css-panel/rule-list-container.reel/rule-list-container.html new file mode 100644 index 00000000..6c6ecfed --- /dev/null +++ b/js/panels/css-panel/rule-list-container.reel/rule-list-container.html
@@ -0,0 +1,44 @@
	1	<!DOCTYPE html>
	2	<!-- <copyright>
	3	This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
	4	No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
	5	(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
	6	</copyright> -->
	7	<html lang="en">
	8	<head>
	9	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
	10	<script type="text/montage-serialization">
	11	{
	12	"owner": {
	13	"module" : "js/panels/css-panel/rule-list-container.reel",
	14	"name" : "RuleListContainer",
	15	"properties" : {
	16	"element" : {"#" : "container"},
	17	"ruleListComponent": {"@": "ruleList"}
	18	}
	19	},
	20	"ruleList": {
	21	"module" : "js/panels/css-panel/rule-list.reel",
	22	"name": "RuleList",
	23	"properties": {
	24	"supportedRules" : {
	25	"1" : {"@": "cssStyleRule"},
	26	"3" : {"@": "cssImportRule"},
	27	"4" : {"@": "cssMediaRule"},
	28	"5" : {"@": "cssFontFaceRule"},
	29	"6" : {"@": "cssPageRule"},
	30	"10" : {"@": "namespaceRule"}
	31	}
	32	}
	33	},
	34	"cssStyleRule": {
	35	"module": "js/panels/css-panel/rule-components/css-style-rule.reel",
	36	"name": "CssStyleRule"
	37	}
	38	}
	39	</script>
	40	</head>
	41	<body>
	42	<div id="container" class="rule-list-container"></div>
	43	</body>
	44	</html> \ No newline at end of file


diff --git a/js/panels/css-panel/rule-list-container.reel/rule-list-container.js b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js new file mode 100644 index 00000000..04689602 --- /dev/null +++ b/js/panels/css-panel/rule-list-container.reel/rule-list-container.js
@@ -0,0 +1,123 @@
	1	/* <copyright>
	2	This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
	3	No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
	4	(c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved.
	5	</copyright> */
	6
	7	var Montage = require("montage/core/core").Montage,
	8	Component = require("montage/ui/component").Component;
	9
	10	exports.RuleListContainer = Montage.create(Component, {
	11	ruleListComponent : {
	12	value: null
	13	},
	14	templateDidLoad: {
	15	value: function() {
	16	console.log('rule list container - tempalte did load');
	17	}
	18	},
	19	_getRuleList : {
	20	value: function(s) {
	21	var ruleListsOfType, i, list, matchesAll;
	22
	23	ruleListsOfType = this.ruleLists.filter(function(list) {
	24	return list.selectionType = s.selectionType;
	25	});
	26
	27	for(i = 0; i<ruleListsOfType.length; i++) {
	28	list = ruleListsOfType[i];
	29
	30	if(s.selectionType === 'elements') {
	31	matchesAll = list.selection.every(function(element, index, array) {
	32	return array.indexOf(element) !== 0;
	33	});
	34
	35	if(matchesAll) {
	36	break;
	37	}
	38	} else {
	39	///// Selection (single element or stylesheet) is the same,
	40	///// Use the existing rule list
	41	if(list.selection === s.selection) {
	42	break;
	43	}
	44	}
	45	}
	46
	47	return list;
	48
	49	}
	50	},
	51	ruleLists : {
	52	value: []
	53	},
	54	add : {
	55	value: function(type, selection) {
	56	console.log("Rule List Container : add()");
	57
	58	var stylesController = this.application.ninja.stylesController,
	59	listInstance = Montage.create(this.ruleListComponent),
	60	container = document.createElement('div'),
	61	rules;
	62
	63	if(type === 'ELEMENT') {
	64	rules = stylesController.getMatchingRules(selection);
	65	}
	66
	67	//listInstance.element = container;
	68	this._instanceToAdd = listInstance;
	69	listInstance.rules = rules;
	70
	71	this.appendElement = container;
	72	}
	73	},
	74	_instanceToAdd : {
	75	value: null
	76	},
	77	_appendElement : {
	78	value: null
	79	},
	80	appendElement : {
	81	get: function() {
	82	return this._appendElement;
	83	},
	84	set: function(el) {
	85	this._appendElement = el;
	86	this.needsDraw = true;
	87	}
	88	},
	89	_lastDisplayedList : {
	90	value: null
	91	},
	92	_displayedList : {
	93	value: null
	94	},
	95	displayedList : {
	96	get: function() {
	97	return this._displayedList;
	98	},
	99	set: function(list) {
	100	this._lastDisplayedList = this._displayedList;
	101	this._displayedList = list;
	102	this.needsDraw = true;
	103	}
	104	},
	105	draw : {
	106	value: function() {
	107	if(this._lastDisplayedList) {
	108	this._lastDisplayedList.style.display = 'none';
	109
	110	if(this._displayedList.element) {
	111	this._displayedList.style.display = null;
	112	}
	113	}
	114
	115	if(this._appendElement) {
	116	this.element.appendChild(this._appendElement);
	117	this._instanceToAdd.element = this._appendElement;
	118	this._appendElement = null;
	119	}
	120
	121	}
	122	}
	123	}); \ No newline at end of file