From 486842239c71e7964f38a09aacda4970f2a82e1a Mon Sep 17 00:00:00 2001
From: Nivesh Rajbhandari
Date: Tue, 7 Feb 2012 10:58:14 -0800
Subject: Updated tools and PI to get/set materials by binding to appModel's
 materials property.  This requires us to add FlatMaterial to the list of
 materials in the MaterialsLibrary.

Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
---
 .../fill-properties.reel/fill-properties.html      | 11 ++++-
 .../fill-properties.reel/fill-properties.js        |  6 ++-
 .../ink-bottle-properties.html                     | 12 ++++-
 .../ink-bottle-properties.js                       |  6 ++-
 .../line-properties.reel/line-properties.js        | 14 ++++--
 .../oval-properties.reel/oval-properties.js        | 14 ++++--
 .../rect-properties.reel/rect-properties.js        | 14 ++++--
 .../shape-properties.reel/shape-properties.css     |  6 +--
 .../shape-properties.reel/shape-properties.html    | 35 +++++++++-----
 .../shape-properties.reel/shape-properties.js      | 53 +++++++++++++---------
 10 files changed, 116 insertions(+), 55 deletions(-)

(limited to 'js/components/tools-properties')

diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.html b/js/components/tools-properties/fill-properties.reel/fill-properties.html
index d09b7f44..a35f9b15 100644
--- a/js/components/tools-properties/fill-properties.reel/fill-properties.html
+++ b/js/components/tools-properties/fill-properties.reel/fill-properties.html
@@ -11,6 +11,15 @@
 
         <script type="text/montage-serialization">
         {
+            "_fillMaterialCB": {
+                "module": "js/components/combobox.reel",
+                "name": "Combobox",
+                "properties": {
+                    "element": {"#": "fillMaterialCB"},
+                    "labelField": "_name",
+                    "dataField": "_name"
+                }
+            },
             "owner": {
                 "module": "js/components/tools-properties/fill-properties.reel",
                 "name": "FillProperties",
@@ -18,7 +27,7 @@
                     "element": {"#": "fillProperties"},
                     "_useWebGL": {"#": "useWebGLCH"},
                     "_materialsContainer": {"#": "materialsContainer"},
-                    "_fillMaterial": {"#": "fillMaterialCB"}
+                    "_fillMaterial": {"@": "_fillMaterialCB"}
                 }
             }
     	}
diff --git a/js/components/tools-properties/fill-properties.reel/fill-properties.js b/js/components/tools-properties/fill-properties.reel/fill-properties.js
index 3b77d72e..61b667d7 100644
--- a/js/components/tools-properties/fill-properties.reel/fill-properties.js
+++ b/js/components/tools-properties/fill-properties.reel/fill-properties.js
@@ -14,7 +14,11 @@ exports.FillProperties = Montage.create(ToolProperties, {
     
     _subPrepare: {
         value: function() {
-            ShapesController.DisplayMaterials(this._fillMaterial);
+            Object.defineBinding(this._fillMaterial, "items", {
+                boundObject: this.application.ninja.appModel,
+                boundObjectPropertyPath: "materials",
+                oneway: false
+            });
 
             this.handleChange(null);
             this._useWebGL.addEventListener("change", this, false);
diff --git a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html
index b98a7b4c..1602e793 100644
--- a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html
+++ b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.html
@@ -36,6 +36,16 @@
                 }
             },
 
+            "_strokeMaterialCB": {
+                "module": "js/components/combobox.reel",
+                "name": "Combobox",
+                "properties": {
+                    "element": {"#": "strokeMaterialIBCB"},
+                    "labelField": "_name",
+                    "dataField": "_name"
+                }
+            },
+
             "owner": {
                 "module": "js/components/tools-properties/ink-bottle-properties.reel",
                 "name": "InkBottleProperties",
@@ -49,7 +59,7 @@
 
                     "_useWebGL": {"#": "useWebGLCHIB"},
                     "_materialsContainer": {"#": "materialsContainerIB"},
-                    "_strokeMaterial": {"#": "strokeMaterialIBCB"}
+                    "_strokeMaterial": {"@": "_strokeMaterialCB"}
                 }
             }
         }
diff --git a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.js b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.js
index 61ea808a..e3ffc359 100644
--- a/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.js
+++ b/js/components/tools-properties/ink-bottle-properties.reel/ink-bottle-properties.js
@@ -14,7 +14,11 @@ exports.InkBottleProperties = Montage.create(ToolProperties, {
 
     _subPrepare: {
         value: function() {
-            ShapesController.DisplayMaterials(this._strokeMaterial);
+            Object.defineBinding(this._strokeMaterial, "items", {
+                boundObject: this.application.ninja.appModel,
+                boundObjectPropertyPath: "materials",
+                oneway: false
+            });
 
             this.handleChange(null);
             this._useWebGL.addEventListener("change", this, false);
diff --git a/js/components/tools-properties/line-properties.reel/line-properties.js b/js/components/tools-properties/line-properties.reel/line-properties.js
index 694e4326..e1ecf790 100644
--- a/js/components/tools-properties/line-properties.reel/line-properties.js
+++ b/js/components/tools-properties/line-properties.reel/line-properties.js
@@ -33,18 +33,24 @@ exports.LineProperties = Montage.create(ToolProperties, {
     },
 
     strokeStyle : {
-        get: function() { return this.base._strokeStyle.options[this.base._strokeStyle.value].text; }
+        get: function() {
+//            return this.base._strokeStyle.options[this.base._strokeStyle.value].text;
+            return "Solid";
+        }
     },
 
     strokeStyleIndex : {
-        get: function() { return this.base._strokeStyle.options[this.base._strokeStyle.value].value; }
+        get: function() {
+//            return this.base._strokeStyle.options[this.base._strokeStyle.value].value;
+            return 1;
+        }
     },
 
     strokeMaterial: {
-        get: function() { return this.base._strokeMaterial.options[this.base._strokeMaterial.value].value; }
+        get: function() { return this.base._strokeMaterial.value; }
     },
 
     fillMaterial: {
-        get: function() { return this.base._fillMaterial.options[this.base._fillMaterial.value].value; }
+        get: function() { return this.base._fillMaterial.value; }
     }
 });
\ No newline at end of file
diff --git a/js/components/tools-properties/oval-properties.reel/oval-properties.js b/js/components/tools-properties/oval-properties.reel/oval-properties.js
index c88f7799..ddeb64ee 100644
--- a/js/components/tools-properties/oval-properties.reel/oval-properties.js
+++ b/js/components/tools-properties/oval-properties.reel/oval-properties.js
@@ -33,19 +33,25 @@ exports.OvalProperties = Montage.create(ToolProperties, {
     },
     
     strokeStyle : {
-        get: function() { return this.base._strokeStyle.options[this.base._strokeStyle.value].text; }
+        get: function() {
+//            return this.base._strokeStyle.options[this.base._strokeStyle.value].text;
+            return "Solid";
+        }
     },
 
     strokeStyleIndex : {
-        get: function() { return this.base._strokeStyle.options[this.base._strokeStyle.value].value; }
+        get: function() {
+//            return this.base._strokeStyle.options[this.base._strokeStyle.value].value;
+            return 1;
+        }
     },
 
     strokeMaterial: {
-        get: function() { return this.base._strokeMaterial.options[this.base._strokeMaterial.value].value; }
+        get: function() { return this.base._strokeMaterial.value; }
     },
 
     fillMaterial: {
-        get: function() { return this.base._fillMaterial.options[this.base._fillMaterial.value].value; }
+        get: function() { return this.base._fillMaterial.value; }
     }
 
 
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 1e717f88..b2de6ff7 100644
--- a/js/components/tools-properties/rect-properties.reel/rect-properties.js
+++ b/js/components/tools-properties/rect-properties.reel/rect-properties.js
@@ -55,19 +55,25 @@ exports.RectProperties = Montage.create(ToolProperties, {
     },
 
     strokeStyle : {
-        get: function() { return this.base._strokeStyle.options[this.base._strokeStyle.value].text; }
+        get: function() {
+//            return this.base._strokeStyle.options[this.base._strokeStyle.value].text;
+            return "Solid";
+        }
     },
 
     strokeStyleIndex : {
-        get: function() { return this.base._strokeStyle.options[this.base._strokeStyle.value].value; }
+        get: function() {
+//            return this.base._strokeStyle.options[this.base._strokeStyle.value].value;
+            return 1;
+        }
     },
 
     strokeMaterial: {
-        get: function() { return this.base._strokeMaterial.options[this.base._strokeMaterial.value].value; }
+        get: function() { return this.base._strokeMaterial.value; }
     },
 
     fillMaterial: {
-        get: function() { return this.base._fillMaterial.options[this.base._fillMaterial.value].value; }
+        get: function() { return this.base._fillMaterial.value; }
     },
 
     _setBindings: {
diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.css b/js/components/tools-properties/shape-properties.reel/shape-properties.css
index 1e36b0bd..0441c1cf 100644
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.css
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.css
@@ -2,8 +2,4 @@
  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> */
-
-#strokeIcon {
-    float: left;
-}
\ No newline at end of file
+ </copyright> */
\ No newline at end of file
diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html
index 52502d47..64840b17 100644
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.html
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html
@@ -53,6 +53,26 @@
                 }
             },
 
+            "_strokeMaterial1": {
+                "module": "js/components/combobox.reel",
+                "name": "Combobox",
+                "properties": {
+                    "element": {"#": "strokeMaterialCB"},
+                    "labelField": "_name",
+                    "dataField": "_name"
+                }
+            },
+
+            "_fillMaterial1": {
+                "module": "js/components/combobox.reel",
+                "name": "Combobox",
+                "properties": {
+                    "element": {"#": "fillMaterialCB"},
+                    "labelField": "_name",
+                    "dataField": "_name"
+                }
+            },
+
             "toolbutton1": {
                 "module": "js/components/layout/subtool-button.reel",
                 "name": "SubToolButton",
@@ -89,10 +109,9 @@
                 "name": "ShapeProperties",
                 "properties": {
                     "element": {"#": "shapeProperties"},
-                    "_strokeStyle": {"#": "strokeStyleCB"},
-                    "_strokeMaterial": {"#": "strokeMaterialCB"},
+                    "_strokeMaterial": {"@": "_strokeMaterial1"},
                     "_fillIcon": {"#": "fillIcon"},
-                    "_fillMaterial": {"#": "fillMaterialCB"},
+                    "_fillMaterial": {"@": "_fillMaterial1"},
 
                     "_useWebGL": {"#": "useWebGLCH"},
                     "_materialLabel": {"#": "materialLabel"},
@@ -125,14 +144,6 @@
             <label class="label">Stroke:</label>
             <div id="strokeControl" class="label"></div>
 
-            <label class="label">Style:</label>
-            <select id="strokeStyleCB" class="selectBox">
-                <option value="0">Hairline</option>
-                <option value="1" selected>Solid</option>
-                <option value="2">Dashed</option>
-                <option value="3">Dotted</option>
-            </select>
-
             <div id="customProperties">
                 <div id="ovalProperties" class="label"></div>
                 <div id="rectProperties" class="label"></div>
@@ -142,7 +153,7 @@
             <label class="label subOption optionLabel"><input id="useWebGLCH" type="checkbox" name="useWebGLControl" class="checkBoxAlign"/>Use WebGL</label>
 
             <label id="materialLabel" class="label">Material:</label>
-            <div id="strokeIcon" class="pencilToolUp"></div>
+            <div id="strokeIcon" class="pencilToolUp" style="float: left;"></div>
 
             <select class="selectBox" id="strokeMaterialCB">
             </select>
diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.js b/js/components/tools-properties/shape-properties.reel/shape-properties.js
index b0d674cc..345e361c 100644
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.js
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.js
@@ -16,8 +16,17 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
         value: function() {
             this.rectProperties.visible = true;
 
-            ShapesController.DisplayMaterials(this._strokeMaterial);
-            ShapesController.DisplayMaterials(this._fillMaterial);
+            Object.defineBinding(this._strokeMaterial, "items", {
+                boundObject: this.application.ninja.appModel,
+                boundObjectPropertyPath: "materials",
+                oneway: false
+            });
+
+            Object.defineBinding(this._fillMaterial, "items", {
+                boundObject: this.application.ninja.appModel,
+                boundObjectPropertyPath: "materials",
+                oneway: false
+            });
 
             this.handleChange(null);
             this._useWebGL.addEventListener("change", this, false);
@@ -36,13 +45,13 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
                 this._selectedSubTool = value;
                 this[this._selectedSubTool.properties].visible = true;
 
-                if(this._selectedSubTool.id === "LineTool") {
-                    this._fillIcon.style["display"] = "none";
-                    this._fillMaterial.style["display"] = "none";
-                } else {
-                    this._fillIcon.style["display"] = "";
-                    this._fillMaterial.style["display"] = "";
-                }
+//                if(this._selectedSubTool.id === "LineTool") {
+//                    this._fillIcon.style["display"] = "none";
+//                    this._fillMaterial.style["display"] = "none";
+//                } else {
+//                    this._fillIcon.style["display"] = "";
+//                    this._fillMaterial.style["display"] = "";
+//                }
                 
             }
         }
@@ -53,23 +62,23 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
             if(this._useWebGL.checked)
             {
                 this._use3D = true;
-                this._materialLabel.style["display"] = "";
-                this._strokeIcon.style["display"] = "";
-                this._strokeMaterial.style["display"] = "";
-                if(this.selectedSubTool.id !== "LineTool")
-                {
-                    this._fillIcon.style["display"] = "";
-                    this._fillMaterial.style["display"] = "";
-                }
+//                this._materialLabel.style["display"] = "";
+//                this._strokeIcon.style["display"] = "";
+//                this._strokeMaterial.style["display"] = "";
+//                if(this.selectedSubTool.id !== "LineTool")
+//                {
+//                    this._fillIcon.style["display"] = "";
+//                    this._fillMaterial.style["display"] = "";
+//                }
             }
             else
             {
                 this._use3D = false;
-                this._materialLabel.style["display"] = "none";
-                this._strokeIcon.style["display"] = "none";
-                this._strokeMaterial.style["display"] = "none";
-                this._fillIcon.style["display"] = "none";
-                this._fillMaterial.style["display"] = "none";
+//                this._materialLabel.style["display"] = "none";
+//                this._strokeIcon.style["display"] = "none";
+//                this._strokeMaterial.style["display"] = "none";
+//                this._fillIcon.style["display"] = "none";
+//                this._fillMaterial.style["display"] = "none";
             }
         }
     }
-- 
cgit v1.2.3


From 329a859e2666716c3a1d99c6bd2679e10c81fc8d Mon Sep 17 00:00:00 2001
From: Nivesh Rajbhandari
Date: Tue, 7 Feb 2012 15:25:11 -0800
Subject: Added ability to toggle combobox's visibility so we can show/hide
 materials comboboxes in the tool options.

Signed-off-by: Nivesh Rajbhandari <mqg734@motorola.com>
---
 .../shape-properties.reel/shape-properties.js      | 43 ++++++++++++----------
 1 file changed, 23 insertions(+), 20 deletions(-)

(limited to 'js/components/tools-properties')

diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.js b/js/components/tools-properties/shape-properties.reel/shape-properties.js
index 345e361c..79567453 100644
--- a/js/components/tools-properties/shape-properties.reel/shape-properties.js
+++ b/js/components/tools-properties/shape-properties.reel/shape-properties.js
@@ -45,13 +45,16 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
                 this._selectedSubTool = value;
                 this[this._selectedSubTool.properties].visible = true;
 
-//                if(this._selectedSubTool.id === "LineTool") {
-//                    this._fillIcon.style["display"] = "none";
-//                    this._fillMaterial.style["display"] = "none";
-//                } else {
-//                    this._fillIcon.style["display"] = "";
-//                    this._fillMaterial.style["display"] = "";
-//                }
+                if(this._useWebGL.checked)
+                {
+                    if(this._selectedSubTool.id === "LineTool") {
+                        this._fillIcon.style["display"] = "none";
+                        this._fillMaterial.visible = false;
+                    } else {
+                        this._fillIcon.style["display"] = "";
+                        this._fillMaterial.visible = true;
+                    }
+                }
                 
             }
         }
@@ -62,23 +65,23 @@ exports.ShapeProperties = Montage.create(ToolProperties, {
             if(this._useWebGL.checked)
             {
                 this._use3D = true;
-//                this._materialLabel.style["display"] = "";
-//                this._strokeIcon.style["display"] = "";
-//                this._strokeMaterial.style["display"] = "";
-//                if(this.selectedSubTool.id !== "LineTool")
-//                {
-//                    this._fillIcon.style["display"] = "";
-//                    this._fillMaterial.style["display"] = "";
-//                }
+                this._materialLabel.style["display"] = "";
+                this._strokeIcon.style["display"] = "";
+                this._strokeMaterial.visible = true;
+                if(this.selectedSubTool.id !== "LineTool")
+                {
+                    this._fillIcon.style["display"] = "";
+                    this._fillMaterial.visible = true;
+                }
             }
             else
             {
                 this._use3D = false;
-//                this._materialLabel.style["display"] = "none";
-//                this._strokeIcon.style["display"] = "none";
-//                this._strokeMaterial.style["display"] = "none";
-//                this._fillIcon.style["display"] = "none";
-//                this._fillMaterial.style["display"] = "none";
+                this._materialLabel.style["display"] = "none";
+                this._strokeIcon.style["display"] = "none";
+                this._strokeMaterial.visible = false;
+                this._fillIcon.style["display"] = "none";
+                this._fillMaterial.visible = false;
             }
         }
     }
-- 
cgit v1.2.3


From 9a404b8a717d0aac0eabb828a4d3cdc8c9c3eed8 Mon Sep 17 00:00:00 2001
From: Valerio Virgillito
Date: Tue, 7 Feb 2012 17:42:04 -0800
Subject: IKNINJA - 1084: Fixing the custom tag.

Signed-off-by: Valerio Virgillito <valerio@motorola.com>
---
 .../tools-properties/tag-properties.reel/tag-properties.html        | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'js/components/tools-properties')

diff --git a/js/components/tools-properties/tag-properties.reel/tag-properties.html b/js/components/tools-properties/tag-properties.reel/tag-properties.html
index c7588b9e..2b81bb71 100644
--- a/js/components/tools-properties/tag-properties.reel/tag-properties.html
+++ b/js/components/tools-properties/tag-properties.reel/tag-properties.html
@@ -56,9 +56,9 @@
                     <label class="label"> Tag Name:</label>
 
                     <select id="customTagCB" class="nj-skinned">
-                        <option>Article</option>
-                        <option>Aside</option>
-                        <option>Section</option>
+                        <option>article</option>
+                        <option>aside</option>
+                        <option>section</option>
                     </select>
                 </div>
 
-- 
cgit v1.2.3