From 1433f2bdf2e5b8c5c18fed5e9c17fd983ab3606d Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Fri, 2 Mar 2012 10:55:51 -0800
Subject: CSS Panel - Updating components, created toolbar components, and
small changes to styles controller
---
js/components/toolbar.reel/toolbar.css | 14 ++++++++++++++
js/components/toolbar.reel/toolbar.html | 34 +++++++++++++++++++++++++++++++++
js/components/toolbar.reel/toolbar.js | 27 ++++++++++++++++++++++++++
3 files changed, 75 insertions(+)
create mode 100644 js/components/toolbar.reel/toolbar.css
create mode 100644 js/components/toolbar.reel/toolbar.html
create mode 100644 js/components/toolbar.reel/toolbar.js
(limited to 'js/components')
diff --git a/js/components/toolbar.reel/toolbar.css b/js/components/toolbar.reel/toolbar.css
new file mode 100644
index 00000000..1ffae912
--- /dev/null
+++ b/js/components/toolbar.reel/toolbar.css
@@ -0,0 +1,14 @@
+/* <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> */
+.toolbar-container {
+ background-color: #474747;
+ border-bottom: 1px solid #333;
+ border-top: 1px solid #505050;
+ box-shadow: 0 4px 8px 0px rgba(0,0,0,0.75);
+ height: 22px;
+ width: 100%;
+ -webkit-box-flex: 0;
+}
\ No newline at end of file
diff --git a/js/components/toolbar.reel/toolbar.html b/js/components/toolbar.reel/toolbar.html
new file mode 100644
index 00000000..8ccce126
--- /dev/null
+++ b/js/components/toolbar.reel/toolbar.html
@@ -0,0 +1,34 @@
+<!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" />
+ <link href="toolbar.css" rel="stylesheet" type="text/css">
+ <script type="text/montage-serialization">
+ {
+ "owner": {
+ "module" : "js/panels/css-panel/style-sheet.reel",
+ "name" : "StyleSheet",
+ "properties" : {
+ "element" : {"#" : "toolbar-container"}
+ }
+ },
+ "button": {
+ "module": "js/components/button.reel",
+ "name": "Button",
+ "properties": {
+
+ }
+ }
+ }
+ </script>
+</head>
+<body>
+<div id="toolbar-container" class="toolbar-container">
+</div>
+</body>
+</html>
\ No newline at end of file
diff --git a/js/components/toolbar.reel/toolbar.js b/js/components/toolbar.reel/toolbar.js
new file mode 100644
index 00000000..79e7ff1f
--- /dev/null
+++ b/js/components/toolbar.reel/toolbar.js
@@ -0,0 +1,27 @@
+/* <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.Toolbar = Montage.create(Component, {
+
+ deserializedFromTemplate : {
+ value: function() {
+ console.log("toolbar - deserialized");
+ }
+ },
+ prepareForDraw : {
+ value: function() {
+ console.log("toolbar - prepare for draw");
+ }
+ },
+ draw : {
+ value: function() {
+ console.log("toolbar - draw");
+ }
+ }
+});
\ No newline at end of file
--
cgit v1.2.3
From ec862af55e5c3d564b37eac2744a1a6815f81f4d Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 12 Mar 2012 15:28:40 -0700
Subject: Tree Node Component - Added method for handling source object set
---
js/components/treeview/tree-node.js | 4 ++++
1 file changed, 4 insertions(+)
(limited to 'js/components')
diff --git a/js/components/treeview/tree-node.js b/js/components/treeview/tree-node.js
index d7b864b5..fa6e1ba4 100644
--- a/js/components/treeview/tree-node.js
+++ b/js/components/treeview/tree-node.js
@@ -52,6 +52,10 @@ exports.TreeNode = Montage.create(Component, {
}, this);
}
this._sourceObject = object;
+
+ if(this.handleSourceObjectSet) {
+ this.handleSourceObjectSet();
+ }
}
},
childNodes : {
--
cgit v1.2.3
From 30e3f3d6c19025c37694127ac148146277681994 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Tue, 3 Apr 2012 14:43:52 -0700
Subject: CSS Panel - Stylesheet edit mode
---
js/components/toolbar.reel/toolbar.html | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
(limited to 'js/components')
diff --git a/js/components/toolbar.reel/toolbar.html b/js/components/toolbar.reel/toolbar.html
index 8ccce126..69eba194 100644
--- a/js/components/toolbar.reel/toolbar.html
+++ b/js/components/toolbar.reel/toolbar.html
@@ -18,7 +18,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
}
},
"button": {
- "module": "js/components/button.reel",
+ "module": "montage/ui/button.reel",
"name": "Button",
"properties": {
--
cgit v1.2.3
From 7246efab402664c75bd0de226c0b9a91b384839b Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Wed, 11 Apr 2012 16:45:23 -0700
Subject: CSS Style - Add disabled UI state. Added Hintable and editable UI
state.
---
js/components/editable.reel/editable.js | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
(limited to 'js/components')
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js
index 9c8946c4..ef4096fd 100644
--- a/js/components/editable.reel/editable.js
+++ b/js/components/editable.reel/editable.js
@@ -122,7 +122,7 @@ exports.Editable = Montage.create(Component, {
if(this.stopOnBlur) {
console.log('adding mousedown event listener');
///// Simulate blur on editable node by listening to the doc
- document.addEventListener('mouseup', this, false);
+ document.addEventListener('mousedown', this, false);
}
this._sendEvent('start');
@@ -179,7 +179,7 @@ exports.Editable = Montage.create(Component, {
this.accept();
}
this.stop();
- document.removeEventListener('mouseup', this, false);
+ document.removeEventListener('mousedown', this, false);
this._sendEvent('blur');
}
},
@@ -202,7 +202,7 @@ exports.Editable = Montage.create(Component, {
this._sendEvent('input');
}
},
- handleMouseup : {
+ handleMousedown : {
value : function(e) {
console.log('handle mouse down');
///// Listen for simulated blur event
--
cgit v1.2.3
From 0e1f95945434475adbf33b2073b6f8d7240aca91 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 23 Apr 2012 11:46:14 -0700
Subject: Editable - Pass event data with stop event
---
js/components/editable.reel/editable.js | 17 ++++++++++-------
1 file changed, 10 insertions(+), 7 deletions(-)
(limited to 'js/components')
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js
index ef4096fd..1ebe33f1 100644
--- a/js/components/editable.reel/editable.js
+++ b/js/components/editable.reel/editable.js
@@ -131,11 +131,11 @@ exports.Editable = Montage.create(Component, {
}
},
stop : {
- value: function() {
+ value: function(eventData) {
this._isEditable = this._element.contentEditable = false;
this._element.classList.remove(this.editingClass);
- this._sendEvent('stop');
+ this._sendEvent('stop', eventData);
///// if value is different than pre-edit val, call onchange method
if(this._preEditValue !== this.value) {
@@ -174,11 +174,11 @@ exports.Editable = Montage.create(Component, {
}
},
blur : {
- value : function() {
+ value : function(eventData) {
if(this._hint) {
this.accept();
}
- this.stop();
+ this.stop(eventData);
document.removeEventListener('mousedown', this, false);
this._sendEvent('blur');
}
@@ -207,7 +207,10 @@ exports.Editable = Montage.create(Component, {
console.log('handle mouse down');
///// Listen for simulated blur event
if(this.stopOnBlur && e._event.target !== this._element) {
- this.blur();
+ this.blur({
+ "originalEventType": "mousedown",
+ "originalEvent": e
+ });
}
}
},
@@ -221,9 +224,9 @@ exports.Editable = Montage.create(Component, {
}
},
_sendEvent : {
- value : function(type) {
+ value : function(type, data) {
var evt = document.createEvent("CustomEvent");
- evt.initCustomEvent(type, true, true);
+ evt.initCustomEvent(type, true, true, data);
this.dispatchEvent(evt);
}
},
--
cgit v1.2.3
From 4cefebd99813f05713deb2f72bba0a035dfcb508 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 23 Apr 2012 11:46:54 -0700
Subject: Toolbar - Add buttons to toolbar component
---
js/components/toolbar.reel/toolbar.css | 39 ++++++++++++++++++++++++++++++
js/components/toolbar.reel/toolbar.html | 43 +++++++++++++++++++++++++++++++--
js/components/toolbar.reel/toolbar.js | 40 ++++++++++++++++++++++++++----
3 files changed, 115 insertions(+), 7 deletions(-)
(limited to 'js/components')
diff --git a/js/components/toolbar.reel/toolbar.css b/js/components/toolbar.reel/toolbar.css
index 1ffae912..e63b043e 100644
--- a/js/components/toolbar.reel/toolbar.css
+++ b/js/components/toolbar.reel/toolbar.css
@@ -3,12 +3,51 @@
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> */
+
+/*---------------------
+ Toolbar Container
+-----------------------*/
+
.toolbar-container {
background-color: #474747;
border-bottom: 1px solid #333;
border-top: 1px solid #505050;
box-shadow: 0 4px 8px 0px rgba(0,0,0,0.75);
height: 22px;
+ overflow: hidden;
width: 100%;
-webkit-box-flex: 0;
+}
+.toolbar-container ul, .toolbar-container li {
+ margin: 0;
+ padding: 0;
+}
+
+/*---------------------
+ Button Types
+-----------------------*/
+
+.toolbar-add-button {
+ background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAQAAAC1%2BjfqAAAACXBIWXMAAAsTAAALEwEAmpwYAAADGGlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjaY2BgnuDo4uTKJMDAUFBUUuQe5BgZERmlwH6egY2BmYGBgYGBITG5uMAxIMCHgYGBIS8%2FL5UBFTAyMHy7xsDIwMDAcFnX0cXJlYE0wJpcUFTCwMBwgIGBwSgltTiZgYHhCwMDQ3p5SUEJAwNjDAMDg0hSdkEJAwNjAQMDg0h2SJAzAwNjCwMDE09JakUJAwMDg3N%2BQWVRZnpGiYKhpaWlgmNKflKqQnBlcUlqbrGCZ15yflFBflFiSWoKAwMD1A4GBgYGXpf8EgX3xMw8BSMDVQYqg4jIKAUICxE%2BCDEESC4tKoMHJQODAIMCgwGDA0MAQyJDPcMChqMMbxjFGV0YSxlXMN5jEmMKYprAdIFZmDmSeSHzGxZLlg6WW6x6rK2s99gs2aaxfWMPZ9%2FNocTRxfGFM5HzApcj1xZuTe4FPFI8U3mFeCfxCfNN45fhXyygI7BD0FXwilCq0A%2FhXhEVkb2i4aJfxCaJG4lfkaiQlJM8JpUvLS19QqZMVl32llyfvIv8H4WtioVKekpvldeqFKiaqP5UO6jepRGqqaT5QeuA9iSdVF0rPUG9V%2FpHDBYY1hrFGNuayJsym740u2C%2B02KJ5QSrOutcmzjbQDtXe2sHY0cdJzVnJRcFV3k3BXdlD3VPXS8Tbxsfd99gvwT%2F%2FID6wIlBS4N3hVwMfRnOFCEXaRUVEV0RMzN2T9yDBLZE3aSw5IaUNak30zkyLDIzs%2BZmX8xlz7PPryjYVPiuWLskq3RV2ZsK%2FcqSql01jLVedVPrHzbqNdU0n22VaytsP9op3VXUfbpXta%2Bx%2F%2B5Em0mzJ%2F%2BdGj%2Ft8AyNmf2zvs9JmHt6vvmCpYtEFrcu%2BbYsc%2Fm9lSGrTq9xWbtvveWGbZtMNm%2FZarJt%2Bw6rnft3u%2B45uy9s%2F4ODOYd%2BHmk%2FJn58xUnrU%2BfOJJ%2F9dX7SRe1LR68kXv13fc5Nm1t379TfU75%2F4mHeY7En%2B59lvhB5efB1%2Flv5dxc%2BNH0y%2Ffzq64Lv4T8Ffp360%2FrP8f9%2FAA0ADzT6lvFdAAAAIGNIUk0AAHolAACAgwAA%2Bf8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAADPSURBVHjadNC7TQNREIXh75oNCIlWG0JC7BJoAmrAIVAAIkRCog9ThFtwCYTrtS2vBBKbDcG%2BbLD%2F5GpGc885M8nAItZga5YcYx4tD6Fw3ncn40Aa36mLIwM94YRC%2FFHqqkVshCRwCz6QhGRjloZo%2F1nFYygmTlC1ptNsbOTgy7czsJYosq2nLuK1e%2Fx4o0u1Qza7cuMS5s%2BVXC68v4xWmUbZFzkqiUatAWWmtmzPkrpoqC27b82BQoU1NEqfvcXeJV%2FB7mDdvYG7Ie4%2BvwMA%2BFNeHV16KUYAAAAASUVORK5CYII%3D);
+}
+
+/*---------------------
+ Generic button styles
+-----------------------*/
+
+.toolbar-container .toolbar-button {
+ background-color: transparent;
+ background-repeat: no-repeat;
+ border-style: none;
+ border-radius: 4px;
+ height: 16px;
+ margin: 3px 5px 0 0;
+ padding: 0 2px;
+ opacity: .85;
+ text-indent: -9999999px;
+ width: 16px;
+ float: right;
+}
+.left-button {
+ float: left;
}
\ No newline at end of file
diff --git a/js/components/toolbar.reel/toolbar.html b/js/components/toolbar.reel/toolbar.html
index 69eba194..53c6627a 100644
--- a/js/components/toolbar.reel/toolbar.html
+++ b/js/components/toolbar.reel/toolbar.html
@@ -14,14 +14,50 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
"module" : "js/panels/css-panel/style-sheet.reel",
"name" : "StyleSheet",
"properties" : {
- "element" : {"#" : "toolbar-container"}
+ "element" : {"#" : "toolbar-container"},
+ "repetition": {"@": "buttonList" }
}
},
+
+ "buttonList": {
+ "module": "montage/ui/repetition.reel",
+ "name": "Repetition",
+ "properties": {
+ "element": {"#": "repetition"}
+ },
+ "bindings": {
+ "objects" : {
+ "boundObject": {"@": "owner"},
+ "boundObjectPropertyPath": "buttons",
+ "oneway": true
+ }
+
+ }
+ },
+
"button": {
"module": "montage/ui/button.reel",
"name": "Button",
"properties": {
-
+ "element": {"#": "button" },
+ "label": " "
+ },
+ "bindings": {
+ "label" : {
+ "boundObject": {"@": "buttonList"},
+ "boundObjectPropertyPath": "objectAtCurrentIteration.title",
+ "oneway": true
+ },
+ "identifier": {
+ "boundObject": {"@": "buttonList"},
+ "boundObjectPropertyPath": "objectAtCurrentIteration.identifier",
+ "oneway": true
+ },
+ "sourceObject": {
+ "boundObject": {"@": "buttonList"},
+ "boundObjectPropertyPath": "objectAtCurrentIteration",
+ "oneway": true
+ }
}
}
}
@@ -29,6 +65,9 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
</head>
<body>
<div id="toolbar-container" class="toolbar-container">
+ <ul data-montage-id="repetition">
+ <li><button data-montage-id="button" class="toolbar-button"></button></li>
+ </ul>
</div>
</body>
</html>
\ No newline at end of file
diff --git a/js/components/toolbar.reel/toolbar.js b/js/components/toolbar.reel/toolbar.js
index 79e7ff1f..03edf477 100644
--- a/js/components/toolbar.reel/toolbar.js
+++ b/js/components/toolbar.reel/toolbar.js
@@ -8,20 +8,50 @@ var Montage = require("montage/core/core").Montage,
Component = require("montage/ui/component").Component;
exports.Toolbar = Montage.create(Component, {
-
- deserializedFromTemplate : {
- value: function() {
- console.log("toolbar - deserialized");
+ _needsButtonProperties : {
+ value: null
+ },
+ _buttons : { value: null },
+ buttons : {
+ get: function() {
+ return this._buttons;
+ },
+ set: function(btns) {
+ this._buttons = btns;
+ this._needsButtonProperties = true;
+ console.log("buttons set");
}
},
prepareForDraw : {
value: function() {
console.log("toolbar - prepare for draw");
+ if(this._needsButtonProperties) {
+ this.repetition.childComponents.forEach(function(button) {
+ button.identifier = button.sourceObject.identifier;
+ button.addEventListener('action', this.delegate, false);
+ }, this);
+ }
}
},
draw : {
value: function() {
- console.log("toolbar - draw");
+ console.log("toolbar - draw - repetition ", this.repetition);
+ if(this._needsClass) {
+
+ this.repetition.childComponents.forEach(function(button) {
+ button.element.classList.add('toolbar-' + button.sourceObject.identifier + '-button');
+ }, this);
+ }
+
+ if(this._needsButtonProperties) {
+ this._needsClass = this.needsDraw = true;
+ this._needsButtonProperties = false;
+ }
+
+
}
+ },
+ _needsClass : {
+ value: null
}
});
\ No newline at end of file
--
cgit v1.2.3
From 76e4821c207736f9f0d88de91246e2cf08f5f6c0 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 30 Apr 2012 13:47:23 -0700
Subject: Editable - Add paste event handling/dispatching
---
js/components/editable.reel/editable.js | 14 +++++++++++---
1 file changed, 11 insertions(+), 3 deletions(-)
(limited to 'js/components')
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js
index 1ebe33f1..f2cf0e5d 100644
--- a/js/components/editable.reel/editable.js
+++ b/js/components/editable.reel/editable.js
@@ -39,7 +39,9 @@ exports.Editable = Montage.create(Component, {
this._element = el;
this._element.addEventListener('keydown', this, false);
this._element.addEventListener('input', this, false);
-
+ this._element.addEventListener('paste', this, false);
+
+
if(this.startOnEvent) {
this._element.addEventListener(this.startOnEvent, this, false);
}
@@ -136,7 +138,9 @@ exports.Editable = Montage.create(Component, {
this._element.classList.remove(this.editingClass);
this._sendEvent('stop', eventData);
-
+
+ document.removeEventListener('mousedown', this, false);
+
///// if value is different than pre-edit val, call onchange method
if(this._preEditValue !== this.value) {
this._sendEvent('change');
@@ -179,7 +183,6 @@ exports.Editable = Montage.create(Component, {
this.accept();
}
this.stop(eventData);
- document.removeEventListener('mousedown', this, false);
this._sendEvent('blur');
}
},
@@ -214,6 +217,11 @@ exports.Editable = Montage.create(Component, {
}
}
},
+ handlePaste : {
+ value: function(e) {
+ this._sendEvent('paste', e);
+ }
+ },
handleEvent : {
value : function(e) {
console.log("event type : " + e._event.type);
--
cgit v1.2.3
From ae94b22c27b9b155e94bf140631e7faf8f55c6c0 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 30 Apr 2012 13:47:42 -0700
Subject: Tree Controller -Delegate getter/setter
---
js/components/controllers/tree-controller.js | 10 ++++++++++
1 file changed, 10 insertions(+)
(limited to 'js/components')
diff --git a/js/components/controllers/tree-controller.js b/js/components/controllers/tree-controller.js
index 1e9222fd..cb95ca1d 100644
--- a/js/components/controllers/tree-controller.js
+++ b/js/components/controllers/tree-controller.js
@@ -23,6 +23,16 @@ var Montage = require("montage").Montage,
*/
var TreeController = exports.TreeController = Montage.create(ObjectController, /** @lends module:montage/ui/controller/tree-controller.TreeController# */ {
+ _delegate : { value: null },
+ delegate : {
+ get: function() {
+ return this._delegate;
+ },
+ set: function(value) {
+ this._delegate = value;
+ }
+ },
+
rootKey : {
value: null
},
--
cgit v1.2.3
From 8bea1e0807f36595d762592c030d4810396ada85 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Wed, 2 May 2012 15:30:27 -0700
Subject: CSS Panel - Add focus management to styles view delegate
---
js/components/treeview/treeview.reel/treeview.js | 5 +++++
1 file changed, 5 insertions(+)
(limited to 'js/components')
diff --git a/js/components/treeview/treeview.reel/treeview.js b/js/components/treeview/treeview.reel/treeview.js
index ebbfe685..9f78d36d 100644
--- a/js/components/treeview/treeview.reel/treeview.js
+++ b/js/components/treeview/treeview.reel/treeview.js
@@ -11,6 +11,7 @@ exports.Treeview = Montage.create(Component, {
substitution : { value : null },
data : { value : null },
+ rootBranch : { value : null },
_hasBeenDeserialized: {
value: false,
@@ -54,6 +55,8 @@ exports.Treeview = Montage.create(Component, {
this.slot.content = rootBranch;
rootBranch.sourceObject = this.contentController.root;
rootBranch.needsDraw = true;
+ this.rootBranch = rootBranch;
+
this.needsDraw = true;
}
@@ -85,6 +88,8 @@ exports.Treeview = Montage.create(Component, {
if (this._contentController) {
+//this._initializeRootBranch();
+
// And bind what we need from the new contentController
var selectedIndexesBindingDescriptor;
--
cgit v1.2.3
From fc104084e964023263332dbf2d916bf00d525e8b Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Thu, 3 May 2012 11:48:46 -0700
Subject: Panel Toolbar - Support hiding and showing of buttons
---
js/components/toolbar.reel/toolbar.css | 13 ++++++--
js/components/toolbar.reel/toolbar.js | 55 ++++++++++++++++++++++++++++++++++
2 files changed, 66 insertions(+), 2 deletions(-)
(limited to 'js/components')
diff --git a/js/components/toolbar.reel/toolbar.css b/js/components/toolbar.reel/toolbar.css
index e63b043e..b765f636 100644
--- a/js/components/toolbar.reel/toolbar.css
+++ b/js/components/toolbar.reel/toolbar.css
@@ -18,7 +18,13 @@
width: 100%;
-webkit-box-flex: 0;
}
-.toolbar-container ul, .toolbar-container li {
+.toolbar-container ul {
+ padding: 0 5px;
+ margin: 0;
+}
+.toolbar-container li {
+ display: inline-block;
+ float: right;
margin: 0;
padding: 0;
}
@@ -48,6 +54,9 @@
width: 16px;
float: right;
}
-.left-button {
+.toolbar-container .left-button {
float: left;
+}
+.toolbar-container .hide-button {
+ display: none;
}
\ No newline at end of file
diff --git a/js/components/toolbar.reel/toolbar.js b/js/components/toolbar.reel/toolbar.js
index 03edf477..dbff2db6 100644
--- a/js/components/toolbar.reel/toolbar.js
+++ b/js/components/toolbar.reel/toolbar.js
@@ -11,6 +11,8 @@ exports.Toolbar = Montage.create(Component, {
_needsButtonProperties : {
value: null
},
+ leftAlignClass : { value: "left-button" },
+ hideButtonClass : { value: "hide-button" },
_buttons : { value: null },
buttons : {
get: function() {
@@ -22,6 +24,44 @@ exports.Toolbar = Montage.create(Component, {
console.log("buttons set");
}
},
+
+ _buttonToHide : {
+ value: null
+ },
+ _buttonToShow : {
+ value: null
+ },
+ getButton : {
+ value: function(identifier) {
+ var buttons = this.repetition.childComponents,
+ buttonIds = buttons.map(function(component) {
+ return component.sourceObject.identifier;
+ });
+
+ return buttons[buttonIds.indexOf(identifier)];
+ }
+ },
+ hideButton : {
+ value: function(identifier) {
+ var button = this.getButton(identifier);
+
+ if(button) {
+ this._buttonToHide = button;
+ this.needsDraw = true;
+ }
+ }
+ },
+ showButton : {
+ value: function(identifier) {
+ var button = this.getButton(identifier);
+
+ if(button) {
+ this._buttonToShow = button;
+ this.needsDraw = true;
+ }
+ }
+ },
+
prepareForDraw : {
value: function() {
console.log("toolbar - prepare for draw");
@@ -40,7 +80,14 @@ exports.Toolbar = Montage.create(Component, {
this.repetition.childComponents.forEach(function(button) {
button.element.classList.add('toolbar-' + button.sourceObject.identifier + '-button');
+
+ ///// add left align class if specified in serialization
+ if(button.sourceObject.leftAlign) {
+ button.element.parentElement.classList.add(this.leftAlignClass);
+ }
}, this);
+
+ this._needsClass = false;
}
if(this._needsButtonProperties) {
@@ -48,6 +95,14 @@ exports.Toolbar = Montage.create(Component, {
this._needsButtonProperties = false;
}
+ if(this._buttonToHide) {
+ this._buttonToHide.element.classList.add(this.hideButtonClass);
+ this._buttonToHide = null;
+ }
+ if(this._buttonToShow) {
+ this._buttonToShow.element.classList.remove(this.hideButtonClass);
+ this._buttonToShow = null;
+ }
}
},
--
cgit v1.2.3
From b52222a0e165825bf507b4f69b33d51c84eb85d4 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Thu, 10 May 2012 15:11:40 -0700
Subject: CSS Panel - Fix errors from new Montage and remove logs.
---
js/components/toolbar.reel/toolbar.js | 3 ---
1 file changed, 3 deletions(-)
(limited to 'js/components')
diff --git a/js/components/toolbar.reel/toolbar.js b/js/components/toolbar.reel/toolbar.js
index dbff2db6..bc3cbd08 100644
--- a/js/components/toolbar.reel/toolbar.js
+++ b/js/components/toolbar.reel/toolbar.js
@@ -21,7 +21,6 @@ exports.Toolbar = Montage.create(Component, {
set: function(btns) {
this._buttons = btns;
this._needsButtonProperties = true;
- console.log("buttons set");
}
},
@@ -64,7 +63,6 @@ exports.Toolbar = Montage.create(Component, {
prepareForDraw : {
value: function() {
- console.log("toolbar - prepare for draw");
if(this._needsButtonProperties) {
this.repetition.childComponents.forEach(function(button) {
button.identifier = button.sourceObject.identifier;
@@ -75,7 +73,6 @@ exports.Toolbar = Montage.create(Component, {
},
draw : {
value: function() {
- console.log("toolbar - draw - repetition ", this.repetition);
if(this._needsClass) {
this.repetition.childComponents.forEach(function(button) {
--
cgit v1.2.3
From 43994432117686f18eb1783418ef83744ae01d79 Mon Sep 17 00:00:00 2001
From: Nivesh Rajbhandari
Date: Thu, 17 May 2012 15:43:40 -0700
Subject: Fixed border radius hot-text linking that was broken by update to
montage v.10.
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
---
.../rect-properties.reel/rect-properties.html | 49 ++++++++++++--
.../rect-properties.reel/rect-properties.js | 79 +++++++++-------------
2 files changed, 74 insertions(+), 54 deletions(-)
(limited to 'js/components')
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.html b/js/components/tools-properties/rect-properties.reel/rect-properties.html
index 42746caa..7aa91314 100755
--- a/js/components/tools-properties/rect-properties.reel/rect-properties.html
+++ b/js/components/tools-properties/rect-properties.reel/rect-properties.html
@@ -15,8 +15,19 @@
"prototype": "js/components/hottextunit.reel[HotTextUnit]",
"properties": {
"element": {"#": "TLRadiusControl"},
- "acceptableUnits" : ["px", "pt", "%"]
- }
+ "acceptableUnits" : ["px", "pt", "%"],
+ "identifier": "TLRadiusControl"
+ },
+ "listeners": [
+ {
+ "type": "change",
+ "listener": {"@": "owner"}
+ },
+ {
+ "type": "changing",
+ "listener": {"@": "owner"}
+ }
+ ]
},
"hottext2": {
@@ -25,7 +36,13 @@
"element": {"#": "TRRadiusControl"},
"acceptableUnits" : ["px", "pt", "%"],
"enabled": false
- }
+ },
+ "listeners": [
+ {
+ "type": "change",
+ "listener": {"@": "owner"}
+ }
+ ]
},
"hottext3": {
@@ -34,7 +51,13 @@
"element": {"#": "BLRadiusControl"},
"acceptableUnits" : ["px", "pt", "%"],
"enabled": false
- }
+ },
+ "listeners": [
+ {
+ "type": "change",
+ "listener": {"@": "owner"}
+ }
+ ]
},
"hottext4": {
@@ -43,7 +66,13 @@
"element": {"#": "BRRadiusControl"},
"acceptableUnits" : ["px", "pt", "%"],
"enabled": false
- }
+ },
+ "listeners": [
+ {
+ "type": "change",
+ "listener": {"@": "owner"}
+ }
+ ]
},
"lockButton": {
@@ -53,8 +82,14 @@
"pressed": true,
"pressedClass": "lockUp",
"preventFocus": true,
- "identifier": "ratio"
- }
+ "identifier": "lockButton"
+ },
+ "listeners": [
+ {
+ "type": "action",
+ "listener": {"@": "owner"}
+ }
+ ]
},
"owner": {
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.js b/js/components/tools-properties/rect-properties.reel/rect-properties.js
index c1cb3945..2f8ea4dd 100755
--- a/js/components/tools-properties/rect-properties.reel/rect-properties.js
+++ b/js/components/tools-properties/rect-properties.reel/rect-properties.js
@@ -19,12 +19,6 @@ exports.RectProperties = Montage.create(ToolProperties, {
_subPrepare: {
value: function() {
- this.lockButton.identifier = "lockButton";
- this.lockButton.addEventListener("action", this, false);
-
- this._setBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]);
- this._setCap([this.TLRadiusControl,this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]);
-
}
},
@@ -33,11 +27,8 @@ exports.RectProperties = Montage.create(ToolProperties, {
this.TRRadiusControl.enabled = this.BLRadiusControl.enabled = this.BRRadiusControl.enabled = !this.lockButton.pressed;
if(this.lockButton.pressed) {
- this._setBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]);
- } else {
- this._removeBindings([this.TRRadiusControl, this.BLRadiusControl, this.BRRadiusControl]);
+ this._syncRadii(this.TLRadiusControl.value, this.TLRadiusControl.units);
}
-
}
},
@@ -80,57 +71,51 @@ exports.RectProperties = Montage.create(ToolProperties, {
get: function() { return this.base._fillMaterial.value; }
},
- _setBindings: {
- value: function(els) {
- var that = this;
- els.forEach(function(el) {
- Object.defineBinding(el, "value", {
- boundObject: that.TLRadiusControl,
- boundObjectPropertyPath: "value",
- boundValueMutator: function(value) {
- if (typeof value === "string") {
- return parseFloat(value);
- }
-
- return value;
- }
- });
-
- Object.defineBinding(el, "units", {
- boundObject: that.TLRadiusControl,
- boundObjectPropertyPath: "units"
- });
- });
- }
- },
+ handleChanging: {
+ value: function(event) {
+ if(event.wasSetByCode) {
+ return;
+ }
- _removeBindings: {
- value: function(els) {
- els.forEach(function(el) {
- Object.deleteBindings(el);
- });
+ this._setBorderRadius(event);
}
},
- _setCap: {
- value: function(els) {
- var that = this;
- els.forEach(function(el) {
- el.addEventListener("change", that, false);
- });
+ handleChange: {
+ value: function(event) {
+ if(event.wasSetByCode) {
+ return;
+ }
+
+ this._setBorderRadius(event);
}
},
- handleChange: {
+ _setBorderRadius: {
value: function(event) {
var hotTxt = event.currentTarget;
if(hotTxt.units === "%") {
if(hotTxt.value > 50) {
hotTxt.maxValue = 50;
}
- return hotTxt.value;
}
-
+
+ if(this.lockButton.pressed && (this.TLRadiusControl === hotTxt)) {
+ this._syncRadii(hotTxt.value, hotTxt.units);
+ }
+ }
+ },
+
+ _syncRadii: {
+ value: function(value, units) {
+ this.TRRadiusControl.value = value;
+ this.BLRadiusControl.value = value;
+ this.BRRadiusControl.value = value;
+
+ this.TRRadiusControl.units = units;
+ this.BLRadiusControl.units = units;
+ this.BRRadiusControl.units = units;
}
}
+
});
\ No newline at end of file
--
cgit v1.2.3
From 6636b2729b421740e49142b7e8b1a76540508306 Mon Sep 17 00:00:00 2001
From: Nivesh Rajbhandari
Date: Thu, 17 May 2012 15:46:56 -0700
Subject: Removed unneeded identifier.
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
---
.../tools-properties/rect-properties.reel/rect-properties.html | 3 +--
1 file changed, 1 insertion(+), 2 deletions(-)
(limited to 'js/components')
diff --git a/js/components/tools-properties/rect-properties.reel/rect-properties.html b/js/components/tools-properties/rect-properties.reel/rect-properties.html
index 7aa91314..a7bf6a7c 100755
--- a/js/components/tools-properties/rect-properties.reel/rect-properties.html
+++ b/js/components/tools-properties/rect-properties.reel/rect-properties.html
@@ -15,8 +15,7 @@
"prototype": "js/components/hottextunit.reel[HotTextUnit]",
"properties": {
"element": {"#": "TLRadiusControl"},
- "acceptableUnits" : ["px", "pt", "%"],
- "identifier": "TLRadiusControl"
+ "acceptableUnits" : ["px", "pt", "%"]
},
"listeners": [
{
--
cgit v1.2.3
From 4e23fee56acb23bf36e6638641dfa5071e2f458a Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Thu, 17 May 2012 16:04:57 -0700
Subject: Editable - remove formatting on paste
---
js/components/editable.reel/editable.js | 2 ++
1 file changed, 2 insertions(+)
(limited to 'js/components')
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js
index b7fdd707..b385d916 100644
--- a/js/components/editable.reel/editable.js
+++ b/js/components/editable.reel/editable.js
@@ -229,6 +229,8 @@ exports.Editable = Montage.create(Component, {
},
handlePaste : {
value: function(e) {
+ e.preventDefault();
+ document.execCommand('insertHTML', null, e._event.clipboardData.getData("Text"));
this._sendEvent('paste', e);
}
},
--
cgit v1.2.3
From 8f2d3226220d83dff5f2dd7463aede02de8e31be Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Thu, 17 May 2012 19:52:09 -0700
Subject: Editable - Trigger change event after stop event
---
js/components/editable.reel/editable.js | 7 +++----
1 file changed, 3 insertions(+), 4 deletions(-)
(limited to 'js/components')
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js
index b385d916..a6350359 100644
--- a/js/components/editable.reel/editable.js
+++ b/js/components/editable.reel/editable.js
@@ -140,15 +140,14 @@ exports.Editable = Montage.create(Component, {
value: function(eventData) {
this._isEditable = this._element.contentEditable = false;
this._element.classList.remove(this.editingClass);
-
- this._sendEvent('stop', eventData);
-
- document.removeEventListener('mousedown', this, false);
///// if value is different than pre-edit val, call onchange method
if(this._preEditValue !== this.value) {
this._sendEvent('change');
}
+
+ this._sendEvent('stop', eventData);
+ document.removeEventListener('mousedown', this, false);
}
},
selectAll : {
--
cgit v1.2.3
From 7a94696e19b14e15261df516e2ba75e693b1313d Mon Sep 17 00:00:00 2001
From: Valerio Virgillito
Date: Fri, 18 May 2012 00:21:56 -0700
Subject: enabling basic document switching
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
---
js/components/layout/document-entry.reel/document-entry.js | 4 ++--
1 file changed, 2 insertions(+), 2 deletions(-)
(limited to 'js/components')
diff --git a/js/components/layout/document-entry.reel/document-entry.js b/js/components/layout/document-entry.reel/document-entry.js
index ad0236c6..50b3624c 100755
--- a/js/components/layout/document-entry.reel/document-entry.js
+++ b/js/components/layout/document-entry.reel/document-entry.js
@@ -121,8 +121,8 @@ exports.DocumentEntry = Montage.create(Component, {
if(event._event.target.nodeName === "IMG") {
this.application.ninja.documentController.closeFile(this.application.ninja.documentController._findDocumentByUUID(this._uuid));
} else {
- if(!this._document.isActive) {
- this.application.ninja.stage.stageView.switchDocument(this.application.ninja.documentController._findDocumentByUUID(this._uuid));
+ if(!this.active) {
+ this.application.ninja.documentController.switchDocuments(this.application.ninja.currentDocument, this.application.ninja.documentController._findDocumentByUUID(this._uuid));
}
}
}
--
cgit v1.2.3
From 8247cddcc7ddce25a6282e97d304cad9a0f0c4f3 Mon Sep 17 00:00:00 2001
From: Valerio Virgillito
Date: Fri, 18 May 2012 01:06:31 -0700
Subject: fixed the shape subtool not refreshing the icon
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
---
js/components/layout/tool-button.reel/tool-button.html | 4 ++++
js/components/layout/tool-button.reel/tool-button.js | 11 -----------
js/components/layout/tools-list.reel/tools-list.html | 12 ++----------
3 files changed, 6 insertions(+), 21 deletions(-)
(limited to 'js/components')
diff --git a/js/components/layout/tool-button.reel/tool-button.html b/js/components/layout/tool-button.reel/tool-button.html
index 84a6d34e..a329f646 100755
--- a/js/components/layout/tool-button.reel/tool-button.html
+++ b/js/components/layout/tool-button.reel/tool-button.html
@@ -16,6 +16,10 @@
"prototype": "js/components/layout/tool-button.reel",
"properties": {
"element": {"#": "toolBarButton"}
+ },
+ "bindings": {
+ "selected": {"<<->": "@owner.data.selected"},
+ "subselected": {"<-": "@owner.data.subtools.selected"}
}
}
}
diff --git a/js/components/layout/tool-button.reel/tool-button.js b/js/components/layout/tool-button.reel/tool-button.js
index 6cea0dc3..6008c4ec 100755
--- a/js/components/layout/tool-button.reel/tool-button.js
+++ b/js/components/layout/tool-button.reel/tool-button.js
@@ -48,19 +48,8 @@ exports.ToolButton = Montage.create(Component, {
this.element.addEventListener("mousedown", this, false);
this.element.addEventListener("dblclick", this, false);
- Object.defineBinding(this, "selected", {
- boundObject: this.data,
- boundObjectPropertyPath: "selected",
- oneway: false
- });
-
if(this.data.container) {
this.element.title = this.data.subtools[this._subselected].toolTip;
- Object.defineBinding(this, "subselected", {
- boundObject: this.data.subtools,
- boundObjectPropertyPath: "selected",
- oneway: true
- });
}
this.element.classList.add(this.data.id)
diff --git a/js/components/layout/tools-list.reel/tools-list.html b/js/components/layout/tools-list.reel/tools-list.html
index d5c33624..df603bf8 100755
--- a/js/components/layout/tools-list.reel/tools-list.html
+++ b/js/components/layout/tools-list.reel/tools-list.html
@@ -16,11 +16,7 @@
"element": {"#": "toolbutton"}
},
"bindings": {
- "data": {
- "boundObject": {"@": "repetition1"},
- "boundObjectPropertyPath": "objectAtCurrentIteration",
- "oneway": true
- }
+ "data": {"<-": "@repetition1.objectAtCurrentIteration"}
}
},
@@ -30,11 +26,7 @@
"element": {"#": "groupLine"}
},
"bindings": {
- "condition": {
- "boundObject": {"@": "repetition1"},
- "boundObjectPropertyPath": "objectAtCurrentIteration.lastInGroup",
- "oneway": true
- }
+ "condition": {"<-": "@repetition1.objectAtCurrentIteration.lastInGroup"}
}
},
--
cgit v1.2.3
From a396caf12a9e1fc84b984d39f8e671c335d2f5d5 Mon Sep 17 00:00:00 2001
From: Nivesh Rajbhandari
Date: Fri, 18 May 2012 14:36:53 -0700
Subject: File Input control in materials panel was not working because of the
change from id to data-montage-id.
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
---
js/components/ui/file-input.reel/file-input.js | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
(limited to 'js/components')
diff --git a/js/components/ui/file-input.reel/file-input.js b/js/components/ui/file-input.reel/file-input.js
index b57f7c21..584380ec 100755
--- a/js/components/ui/file-input.reel/file-input.js
+++ b/js/components/ui/file-input.reel/file-input.js
@@ -38,7 +38,7 @@ var FileInput = exports.FileInput = Montage.create(Component, {
{
value:function(event)
{
- if(event.currentTarget.id === "fileInputControl")
+ if(event.currentTarget.type === "file")
{
this.filePath = this.inputField.value;
}
--
cgit v1.2.3
From 3e22b0940bb7752e292e485d8a393f215cae05de Mon Sep 17 00:00:00 2001
From: Nivesh Rajbhandari
Date: Fri, 18 May 2012 15:14:36 -0700
Subject: Fixed Materials Popup to work with new changes to repetition
bindings.
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
---
js/components/ui/input-group.reel/input-group.html | 3 ++-
js/components/ui/property-control.reel/property-control.js | 12 ++++++++++--
2 files changed, 12 insertions(+), 3 deletions(-)
(limited to 'js/components')
diff --git a/js/components/ui/input-group.reel/input-group.html b/js/components/ui/input-group.reel/input-group.html
index ba85c089..7da4a855 100755
--- a/js/components/ui/input-group.reel/input-group.html
+++ b/js/components/ui/input-group.reel/input-group.html
@@ -25,7 +25,8 @@
"bindings": {
"data": {
"boundObject": {"@": "propList"},
- "boundObjectPropertyPath": "objectAtCurrentIteration"
+ "boundObjectPropertyPath": "objectAtCurrentIteration",
+ "oneway": true
}
},
"listeners": [
diff --git a/js/components/ui/property-control.reel/property-control.js b/js/components/ui/property-control.reel/property-control.js
index c28979a9..20ec173e 100755
--- a/js/components/ui/property-control.reel/property-control.js
+++ b/js/components/ui/property-control.reel/property-control.js
@@ -120,8 +120,13 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, {
set: function (data) {
if (data !== this._data) {
this._data = data;
- this.label = data.label;
- this.controlType = data.controlType;
+ if(data) {
+ this._label = data.label;
+ this._controlType = data.controlType;
+ } else {
+ this._label = "";
+ this._controlType = null;
+ }
this.needsDraw = true;
}
}
@@ -143,6 +148,9 @@ var PropertyControl = exports.PropertyControl = Montage.create(Component, {
{
value:function(event)
{
+ if(event.wasSetByCode) {
+ return;
+ }
this._dispatchPropEvent(event);
}
},
--
cgit v1.2.3
From fdfba499f0b84360b96096fa866a981e96e8756c Mon Sep 17 00:00:00 2001
From: Valerio Virgillito
Date: Fri, 18 May 2012 16:35:56 -0700
Subject: fixing the color chip for the document root
Signed-off-by: Valerio Virgillito <valerio@motorola.com>
---
js/components/ui/color-chip.reel/color-chip.js | 13 +++++++++++--
1 file changed, 11 insertions(+), 2 deletions(-)
(limited to 'js/components')
diff --git a/js/components/ui/color-chip.reel/color-chip.js b/js/components/ui/color-chip.reel/color-chip.js
index 4e64b2e8..630dcd4b 100755
--- a/js/components/ui/color-chip.reel/color-chip.js
+++ b/js/components/ui/color-chip.reel/color-chip.js
@@ -33,6 +33,11 @@ var ColorChip = exports.ColorChip = Montage.create(Component, {
value: {r:0, g:0, b:0, a:1, css:'rgb(0,0,0)', mode:'rgb'}
},
+ chipBtn: {
+ serializable: true,
+ value: null
+ },
+
changeDelegate: {
value: function(event) {
this.color = event._event.color;
@@ -60,7 +65,7 @@ var ColorChip = exports.ColorChip = Montage.create(Component, {
this.icon.style.display = "none";
}
- this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, offset: this.offset};
+ this.chipBtn.props = {side: 'right', align: 'top', wheel: true, palette: true, gradient: true, image: true, nocolor: true, offset: this.offset};
this.application.ninja.colorController.addButton(this.mode, this.chipBtn);
}
@@ -80,9 +85,13 @@ var ColorChip = exports.ColorChip = Montage.create(Component, {
b = colorObj.value.b;
a = colorObj.value.a;
css = colorObj.css;
+ this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css});
+ } else {
+ mode = "nocolor";
+ this.chipBtn.color(mode, null);
+
}
- this.chipBtn.color(mode, {wasSetByCode: true, type: 'change', color: {r: r, g: g, b: b}, css: css});
this.chipBtn.addEventListener("change", this, false);
}
}
--
cgit v1.2.3
From ca70f18a62a2a2b5670be132361e3a3f5907d920 Mon Sep 17 00:00:00 2001
From: Nivesh Rajbhandari
Date: Fri, 18 May 2012 17:12:37 -0700
Subject: Fixing radio control in the PI.
Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
---
js/components/radio.reel/radio.html | 9 +++++++--
js/components/radio.reel/radio.js | 24 +++++++++++++++---------
2 files changed, 22 insertions(+), 11 deletions(-)
(limited to 'js/components')
diff --git a/js/components/radio.reel/radio.html b/js/components/radio.reel/radio.html
index 01b76b92..cee4c369 100755
--- a/js/components/radio.reel/radio.html
+++ b/js/components/radio.reel/radio.html
@@ -11,13 +11,18 @@
"owner": {
"prototype": "js/components/radio.reel",
"properties": {
- "element": {"#": "ch_comp"}
+ "element": {"#": "radio_comp"},
+ "labelField": {"#": "labelField"},
+ "radioField": {"#": "radioField"}
}
}
}
</script>
</head>
<body>
- <input data-montage-id="ch_comp" class="nj-skinned" type="radio">
+ <div data-montage-id="radio_comp">
+ <input data-montage-id="radioField" class="nj-skinned" type="radio">
+ <label data-montage-id="labelField" class="nj-skinned"></label>
+ </div>
</body>
</html>
\ No newline at end of file
diff --git a/js/components/radio.reel/radio.js b/js/components/radio.reel/radio.js
index c661ec11..cec4f52e 100755
--- a/js/components/radio.reel/radio.js
+++ b/js/components/radio.reel/radio.js
@@ -62,7 +62,7 @@ exports.RadioGroup = Montage.create(Component, {
{
value:function(radio)
{
- radio.element.setAttribute("name", this.name);
+ radio.radioField.setAttribute("name", this.name);
radio.addEventListener("change", this, false);
this.radios.push(radio);
}
@@ -104,6 +104,14 @@ exports.Radio = Montage.create(Component, {
value: null
},
+ labelField: {
+ value: null
+ },
+
+ radioField: {
+ value: null
+ },
+
_checked: {
enumerable: false,
value: false
@@ -140,13 +148,13 @@ exports.Radio = Montage.create(Component, {
{
this._valueSyncedWithInputField = true;
this._wasSetByCode = false;
- this.checked = this.element.checked;
+ this.checked = this.radioField.checked;
}
},
handleClick: {
value: function() {
this._wasSetByCode = false;
- this.checked = !this.element.checked;
+ this.checked = !this.radioField.checked;
}
},
@@ -154,7 +162,7 @@ exports.Radio = Montage.create(Component, {
value: function() {
if(!this._valueSyncedWithInputField)
{
- this.element.checked = this._checked;
+ this.radioField.checked = this._checked;
}
this._valueSyncedWithInputField = false;
}
@@ -163,15 +171,13 @@ exports.Radio = Montage.create(Component, {
prepareForDraw: {
value: function() {
if (this.label !== null) {
- var b = document.createElement("label");
- b.innerHTML = this.label;
- this.element.appendChild(b);
- b.addEventListener("click", this, false);
+ this.labelField.innerHTML = this.label;
}
+ this.element.addEventListener("click", this, false);
if (this.group !== null) {
this.group.addRadio(this);
}
- this.element.addEventListener("change", this, false);
+ this.radioField.addEventListener("change", this, false);
}
}
--
cgit v1.2.3
From a8e97144c832e355de7f8177ce38644119248e87 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 21 May 2012 09:30:24 -0700
Subject: Style sheets view - Fixed drawing of toolbar and "no sheets" message
---
js/components/toolbar.reel/toolbar.html | 8 +++-----
js/components/toolbar.reel/toolbar.js | 2 +-
2 files changed, 4 insertions(+), 6 deletions(-)
(limited to 'js/components')
diff --git a/js/components/toolbar.reel/toolbar.html b/js/components/toolbar.reel/toolbar.html
index 53c6627a..b33c4665 100644
--- a/js/components/toolbar.reel/toolbar.html
+++ b/js/components/toolbar.reel/toolbar.html
@@ -11,8 +11,7 @@ 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-sheet.reel",
- "name" : "StyleSheet",
+ "prototype" : "js/components/toolbar.reel",
"properties" : {
"element" : {"#" : "toolbar-container"},
"repetition": {"@": "buttonList" }
@@ -36,8 +35,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
},
"button": {
- "module": "montage/ui/button.reel",
- "name": "Button",
+ "prototype": "montage/ui/button.reel",
"properties": {
"element": {"#": "button" },
"label": " "
@@ -64,7 +62,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
</script>
</head>
<body>
-<div id="toolbar-container" class="toolbar-container">
+<div data-montage-id="toolbar-container" class="toolbar-container">
<ul data-montage-id="repetition">
<li><button data-montage-id="button" class="toolbar-button"></button></li>
</ul>
diff --git a/js/components/toolbar.reel/toolbar.js b/js/components/toolbar.reel/toolbar.js
index bc3cbd08..8f93aa2b 100644
--- a/js/components/toolbar.reel/toolbar.js
+++ b/js/components/toolbar.reel/toolbar.js
@@ -20,7 +20,7 @@ exports.Toolbar = Montage.create(Component, {
},
set: function(btns) {
this._buttons = btns;
- this._needsButtonProperties = true;
+ this._needsButtonProperties = this.needsDraw = true;;
}
},
--
cgit v1.2.3
From f71e8f853605f0eb4deaf16263124aac1aad9ee1 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 21 May 2012 12:02:08 -0700
Subject: CSS Panel - Allow ":" to be used in selector field
---
js/components/editable.reel/editable.js | 6 +++--
js/components/hintable.reel/hintable.js | 46 +++------------------------------
2 files changed, 7 insertions(+), 45 deletions(-)
(limited to 'js/components')
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js
index a6350359..eab73993 100644
--- a/js/components/editable.reel/editable.js
+++ b/js/components/editable.reel/editable.js
@@ -195,6 +195,7 @@ exports.Editable = Montage.create(Component, {
handleKeydown : {
value : function(e) {
var k = e.keyCode;
+ console.log("editable - keycode", k);
}
},
@@ -269,10 +270,11 @@ exports.Editable = Montage.create(Component, {
},
keyActions : {
value : {
- stop : [27,9,13,186],
+ stop : [27,9,13],
revert : [27],
backsp : [8]
- }
+ },
+ distinct: true
}
});
\ No newline at end of file
diff --git a/js/components/hintable.reel/hintable.js b/js/components/hintable.reel/hintable.js
index 6e3b2aaf..803770db 100644
--- a/js/components/hintable.reel/hintable.js
+++ b/js/components/hintable.reel/hintable.js
@@ -327,48 +327,8 @@ exports.Hintable = Montage.create(Editable, {
revert : [27],
backsp : [8]
}
- }
+ },
+ distinct: true
}
-});
-
-// suggest : {
-// value : function(hint) {
-// ///// if no hint argument passed, clear suggestions
-// if(!hint) {
-// this.clearHint();
-// return false;
-// }
-//
-// this._hint = hint;
-//
-// ///// append span with suggested hint
-// if(this.hintElement) {
-// this.clearHint();
-//
-// ///// Set the hint element's text
-// this._getFirstTextNode(this.hintElement).textContent = hint;
-//
-// ///// if hintElement was removed from the DOM, the object still
-// ///// exists, so it needs to be re-appended
-// if(this.hintElement.parentNode === null) {
-// this._element.appendChild(this.hintElement);
-// }
-// } else {
-// /// Remove the phantom "<BR>" element that is generated when
-// /// content editable element is empty
-// this._children(this._element, function(item) {
-// return item.nodeName === 'BR';
-// }).forEach(function(item) {
-// this._element.removeChild(item);
-// }, this);
-//
-// this.hintElement = document.createElement('span');
-// this.hintElement.classList.add(this.suggestClass);
-// this.hintElement.appendChild(document.createTextNode(hint));
-// this._element.appendChild(this.hintElement);
-// }
-//
-// this._hint = hint;
-// }
-// },
\ No newline at end of file
+});
\ No newline at end of file
--
cgit v1.2.3
From 1e6f46ba556ca3270c89fb848d93856804dd1cc8 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Mon, 21 May 2012 12:40:05 -0700
Subject: CSS Style Component - Moved unit identification to local change
handler instead of delegate
---
js/components/editable.reel/editable.js | 1 -
1 file changed, 1 deletion(-)
(limited to 'js/components')
diff --git a/js/components/editable.reel/editable.js b/js/components/editable.reel/editable.js
index eab73993..103e418f 100644
--- a/js/components/editable.reel/editable.js
+++ b/js/components/editable.reel/editable.js
@@ -195,7 +195,6 @@ exports.Editable = Montage.create(Component, {
handleKeydown : {
value : function(e) {
var k = e.keyCode;
- console.log("editable - keycode", k);
}
},
--
cgit v1.2.3
From 1c3da2901f454ad2c18e20216bb2517740a1c080 Mon Sep 17 00:00:00 2001
From: Eric Guzman
Date: Tue, 22 May 2012 14:28:00 -0700
Subject: CSS Panel - Update components to use new serialization format
---
js/components/toolbar.reel/toolbar.html | 24 +++---------------------
js/components/toolbar.reel/toolbar.js | 20 +++++++++++++++++---
2 files changed, 20 insertions(+), 24 deletions(-)
(limited to 'js/components')
diff --git a/js/components/toolbar.reel/toolbar.html b/js/components/toolbar.reel/toolbar.html
index b33c4665..d2c5972a 100644
--- a/js/components/toolbar.reel/toolbar.html
+++ b/js/components/toolbar.reel/toolbar.html
@@ -25,12 +25,7 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
"element": {"#": "repetition"}
},
"bindings": {
- "objects" : {
- "boundObject": {"@": "owner"},
- "boundObjectPropertyPath": "buttons",
- "oneway": true
- }
-
+ "objects": {"<-": "@owner.buttons"}
}
},
@@ -41,21 +36,8 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
"label": " "
},
"bindings": {
- "label" : {
- "boundObject": {"@": "buttonList"},
- "boundObjectPropertyPath": "objectAtCurrentIteration.title",
- "oneway": true
- },
- "identifier": {
- "boundObject": {"@": "buttonList"},
- "boundObjectPropertyPath": "objectAtCurrentIteration.identifier",
- "oneway": true
- },
- "sourceObject": {
- "boundObject": {"@": "buttonList"},
- "boundObjectPropertyPath": "objectAtCurrentIteration",
- "oneway": true
- }
+ "label": {"<-": "@buttonList.objectAtCurrentIteration.title"},
+ "sourceObject": {"<-": "@buttonList.objectAtCurrentIteration"}
}
}
}
diff --git a/js/components/toolbar.reel/toolbar.js b/js/components/toolbar.reel/toolbar.js
index 8f93aa2b..2ccdb2c5 100644
--- a/js/components/toolbar.reel/toolbar.js
+++ b/js/components/toolbar.reel/toolbar.js
@@ -11,17 +11,31 @@ exports.Toolbar = Montage.create(Component, {
_needsButtonProperties : {
value: null
},
+ _sourceObject : {
+ value: null
+ },
+ sourceObject : {
+ get: function() {
+ return this._sourceObject;
+ },
+ set: function(value) {
+ if(value === this._sourceObject) { return; }
+ this._sourceObject = value;
+ },
+ serializable: true
+ },
leftAlignClass : { value: "left-button" },
hideButtonClass : { value: "hide-button" },
- _buttons : { value: null },
+ _buttons : { value: [], distinct: true },
buttons : {
get: function() {
return this._buttons;
},
set: function(btns) {
this._buttons = btns;
- this._needsButtonProperties = this.needsDraw = true;;
- }
+ this._needsButtonProperties = this.needsDraw = true;
+ },
+ serializable: true
},
_buttonToHide : {
--
cgit v1.2.3