From 8966fc4903f0eec61816d9b9bdbcac9b7d99c320 Mon Sep 17 00:00:00 2001
From: Armen Kesablyan
Date: Mon, 2 Jul 2012 13:19:00 -0700
Subject: Bug: Font Name & Size not updating text tool

Signed-off-by: Armen Kesablyan <armen@motorola.com>
---
 .../text-properties.reel/text-properties.css       |   4 +
 .../text-properties.reel/text-properties.html      | 120 +++++-----
 .../text-properties.reel/text-properties.js        | 261 +++++----------------
 3 files changed, 112 insertions(+), 273 deletions(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.css b/js/components/tools-properties/text-properties.reel/text-properties.css
index 586cdcd5..7ab3ae9a 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.css
+++ b/js/components/tools-properties/text-properties.reel/text-properties.css
@@ -39,6 +39,10 @@
     width: 160px;
 }
 
+.optionsTextTool .montage-button:hover {
+    color:#FFF;
+}
+
 .fontColorChipContainer {
     margin-left: 10px !important;
     margin-right: 0px;
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index 8899ff3c..6a94cf0a 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -11,79 +11,87 @@
 
         <script type="text/montage-serialization">
         {
-
             "owner": {
                 "prototype": "js/components/tools-properties/text-properties.reel",
                 "properties": {
                     "element": {"#": "textProperties"},
-                    "className": {"@": "className"},
-                    "tagType": {"@": "tagType"},
-                    "fontSelection": {"@": "fontSelection"},
-                    "fontSettings": {"@": "fontSettings"},
-                    "fontSize": {"@": "fontSize"},
+
+                    "fontName": {"@": "fontname"},
+                    "fontSize": {"@": "fontsize"},
                     "fontColor": {"#": "fontColorCtrl"},
+
                     "btnBold": {"@": "btnBold"},
                     "btnItalic": {"@": "btnItalic"},
                     "btnUnderline": {"@": "btnUnderline"},
                     "btnStrikethrough": {"@": "btnStrikethrough"},
+
                     "alignLeft": {"@": "alignLeft"},
                     "alignCenter": {"@": "alignCenter"},
                     "alignRight": {"@": "alignRight"},
                     "alignJustify": {"@": "alignJustify"},
+
                     "indent": {"@": "indent"},
                     "outdent": {"@": "outdent"},
+
                     "numberedList": {"@": "numberedList"},
                     "bulletedList": {"@": "bulletedList"}
                 }
             },
-            "className": {
-                "prototype": "js/components/textfield.reel[TextField]",
+
+            "fontname": {
+                "prototype": "montage/ui/native/select.reel",
                 "properties": {
-                    "element": {"#": "className"}
+                    "element": {"#": "fontname"},
+                    "preventFocus": true,
+                    "contentController": {"@": "fontnameController"}
                 }
             },
-            "tagType": {
-                "prototype": "js/components/combobox.reel",
+
+            "fontnameController": {
+                "prototype": "montage/ui/controller/array-controller",
                 "properties": {
-                    "element": {"#": "tagType"}
+                    "selectObjectsOnAddition": false,
+                    "content": [
+                        {"text" : "Arial", "value": "Arial"},
+                        {"text" : "Arial Black", "value": "Arial Black"},
+                        {"text" : "Courier New", "value": "Courier New"},
+                        {"text" : "Garamond", "value": "Garamond"},
+                        {"text" : "Georgia", "value": "Georgia"},
+                        {"text" : "Open Sans", "value": "Open Sans"},
+                        {"text" : "Tahoma", "value": "Tahoma"},
+                        {"text" : "Times New Roman", "value": "Times New Roman"},
+                        {"text" : "Times", "value": "Times"},
+                        {"text" : "Trebuchet", "value": "Trebuchet MS"},
+                        {"text" : "Verdana", "value": "Verdana"}
+                    ]
                 }
             },
-            "fontSelection": {
-                "prototype": "js/components/combobox.reel",
-                "properties": {
-                    "element": {"#": "fontSelection"},
-                    "identifier": "fontSelection"
-                },
-                "listeners": [
-                    {
-                        "type": "change",
-                        "listener": {"@": "owner"}
-                    }
-                ]
 
-            },
-            "fontSettings": {
-                "prototype": "montage/ui/button.reel",
+            "fontsize": {
+                "prototype": "montage/ui/native/select.reel",
                 "properties": {
-                    "element": {"#": "fontSettings"}
+                    "element": {"#": "fontSize"},
+                    "preventFocus" : true,
+                    "contentController" : {"@": "fontsizeController"}
                 }
             },
 
-            "fontSize": {
-                "prototype": "js/components/combobox.reel",
+            "fontsizeController": {
+                "prototype": "montage/ui/controller/array-controller",
                 "properties": {
-                    "element": {"#": "fontSize"},
-                    "identifier": "fontSize"
-                },
-                "listeners": [
-                    {
-                        "type": "change",
-                        "listener": {"@": "owner"}
-                    }
-                ]
-
+                    "selectObjectsOnAddition": false,
+                    "content": [
+                        {"text" : "8pt", "value": "1"},
+                        {"text" : "10pt", "value": "2"},
+                        {"text" : "12pt", "value": "3"},
+                        {"text" : "14pt", "value": "4"},
+                        {"text" : "18pt", "value": "5"},
+                        {"text" : "24pt", "value": "6"},
+                        {"text" : "36pt", "value": "7"}
+                    ]
+                }
             },
-        
+
             "btnBold": {
                 "prototype": "montage/ui/toggle-button.reel",
                 "properties": {
@@ -103,13 +111,7 @@
                     "identifier": "btnItalic",
                     "pressedLabel": "I",
                     "unpressedLabel": "I"
-                },
-                "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
-                ]
+                }
             },
             "btnUnderline": {
                 "prototype": "montage/ui/toggle-button.reel",
@@ -119,13 +121,7 @@
                     "identifier": "btnUnderline",
                     "pressedLabel": "U",
                     "unpressedLabel": "U"
-                },
-                "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
-                ]
+                }
             },
             "btnStrikethrough": {
                 "prototype": "montage/ui/toggle-button.reel",
@@ -135,13 +131,7 @@
                     "identifier": "btnStrikethrough",
                     "pressedLabel": "S",
                     "unpressedLabel": "S"
-                },
-                "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
-                ]
+                }
             },
             
             "alignLeft": {
@@ -276,12 +266,8 @@
 
     <body>
         <div data-montage-id="textProperties" class="subToolHolderPanel optionsTextTool toolOptionsFloatChildren">
-            <label class="label" style="display: none">Class:</label>
-            <input data-montage-id="className" style="display: none" />
-            <label class="label" style="display: none">Tag:</label>
-            <select data-montage-id="tagType" style="display: none"></select>
             <label class="label overrideMargin">Font:</label>
-            <select data-montage-id="fontSelection" class="nj-skinned fontSelection"></select>
+            <select data-montage-id="fontname" class="nj-skinned fontSelection"></select>
             <button data-montage-id="fontSettings" style="display: none"></button>
             <label class="label">Size:</label>
             <select data-montage-id="fontSize" class="nj-skinned"></select>
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.js b/js/components/tools-properties/text-properties.reel/text-properties.js
index c5729e98..4f944adf 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.js
+++ b/js/components/tools-properties/text-properties.reel/text-properties.js
@@ -8,13 +8,15 @@ var Montage = require("montage/core/core").Montage;
 var Component = require("montage/ui/component").Component;
 var ArrayController = require("montage/ui/controller/array-controller").ArrayController;
 var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties;
+var Converter = require("montage/core/converter/converter").Converter;
 
 exports.TextProperties = Montage.create(ToolProperties, {
-    className: {value: null, serializable: true},
-    tagType: {value: null, serializable: true},
-    fontSelection: {value: null, serializable: true},
-    fontSettings: {value: null, serializable: true},
+
+    fontName: {value: null, serializable: true},
     fontSize: {value: null, serializable: true},
+
+    fontSettings: {value: null, serializable: true}, // Note: Isn't used currently will need fontSettings Popup
+
     fontColor: {value: null, serializable: true},
     btnBold: {value: null, serializable: true},
     btnItalic: {value: null, serializable: true},
@@ -33,66 +35,59 @@ exports.TextProperties = Montage.create(ToolProperties, {
     fontTypes: {value: null, serializable: true},
     fontSizes: {value: null, serializable: true},
 
+    // Draw Cycle
     prepareForDraw: {
         value: function() {
-            // code commented out because montage ui element select-input is incomplete. Will switch back when they fix or actually complete the component
-//            this.fontTypes = Montage.create(ArrayController);
-//            this.fontTypes.content = [
-//                { value: "Arial", text: "Arial" },
-//                { value: "Arial Black", text: "Arial Black" },
-//                { value: "Courier New", text: "Courier New" },
-//                { value: "Garamond", text: "Garamond" },
-//                { value: "Georgia", text: "Georgia" },
-//                { value: "Open Sans", text: "Open Sans" },
-//                { value: "Tahoma", text: "Tahoma" },
-//                { value: "Times New Roman", text: "Times New Roman" },
-//                { value: "Trebuchet MS", text: "Trebuchet MS" },
-//                { value: "Verdana", text: "Verdana" }
-//            ];
-
-            //this.fontSelection.contentController = this.fontTypes;
-//
-//            this.fontSizes = Montage.create(ArrayController);
-//            this.fontSizes.content = [
-//                { value: 1, text: "8pt" },
-//                { value: 2, text: "10pt" },
-//                { value: 3, text: "12pt" },
-//                { value: 4, text: "14pt" },
-//                { value: 5, text: "18pt" },
-//                { value: 6, text: "24pt" },
-//                { value: 7, text: "36pt" }
-//            ];
-//            this.fontSize.contentController = this.fontSizes;
-            
-            this.fontSelection.items = ["Arial", "Arial Black", "Courier New", "Garamond", "Georgia",  "Open Sans", "Tahoma", "Times New Roman", "Trebuchet MS", "Verdana"];
-            this.fontSize.items = ["8pt","10pt","12pt","14pt","18pt","24pt","36pt"];
-            this.tagType.items = ["div", "span", "p", "section", "article", "h1", "h2", "h3", "h4", "h5", "h6"];
-        }
-    },
 
+            this.fontColor.props = {side: 'top', align: 'center', wheel: true, palette: true, gradient: false, image: false, nocolor: true, offset: -80};
+            this.application.ninja.colorController.addButton("chip", this.fontColor);
+            this.fontColor.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 0, g: 0, b: 0}, css: 'rgb(0,0,0)'});
+            this.fontColor.addEventListener("change",this.handleFontColorChange.bind(this),false);
+
+            this.application.ninja.stage.textTool.addEventListener("editorSelect", this.handleEditorSelect.bind(this), false);
+
+            //Bind to Rich Text editor that lives on the stage component
+            Object.defineBinding(this.application.ninja.stage.textTool, "fontName", {
+                boundObject: this.fontName,
+                boundObjectPropertyPath: "value",
+                oneway: false
+            });
+
+            Object.defineBinding(this.application.ninja.stage.textTool, "fontSize", {
+                boundObject: this.fontSize,
+                boundObjectPropertyPath: "value",
+                oneway: false
+            });
+
+            Object.defineBinding(this.btnBold, "pressed", {
+                boundObject: this.application.ninja.stage.textTool,
+                boundObjectPropertyPath: "bold",
+                oneway: false
+            });
+
+            Object.defineBinding(this.btnItalic, "pressed", {
+                boundObject: this.application.ninja.stage.textTool,
+                boundObjectPropertyPath: "italic",
+                oneway: false
+            });
+
+            Object.defineBinding(this.btnUnderline, "pressed", {
+                boundObject: this.application.ninja.stage.textTool,
+                boundObjectPropertyPath: "underline",
+                oneway: false
+            });
+
+            Object.defineBinding(this.btnStrikethrough, "pressed", {
+                boundObject: this.application.ninja.stage.textTool,
+                boundObjectPropertyPath: "strikeThrough",
+                oneway: false
+            });
+        }
+    },
+
+    // Events
     handleEditorSelect: {
         value: function(e) {
-            //this.application.ninja.stage.textTool.updateStates();
-//            this.fontSelection.value = this.application.ninja.stage.textTool.states.fontname;
-//
-//            for( var i = 0; i < this.fontSize.items.length; i++) {
-//                if (this.application.ninja.stage.textTool.states.fontsize == i + 1) {
-//                    this.fontSize.value = this.fontSize.items[i]
-//                    break;
-//                }
-//            }
-        }
-    },
-
-    _subPrepare: {
-        value: function() {
-            //this.divElement.addEventListener("click", this, false);
-        }
-    },
-
-    handleClick: {
-        value: function(event) {
-           // this.selectedElement = event._event.target.id;
 
         }
     },
@@ -161,158 +156,12 @@ exports.TextProperties = Montage.create(ToolProperties, {
         }
     },
 
-    handleFontSizeChange: {
-        value: function(e) {
-            //We need the index of whats selected. This is a temporary solution til we can have a variable amount for font-size.
-            for( var i = 0; i < this.fontSize.items.length; i++) {
-                if (this.fontSize.value === this.fontSize.items[i]) {
-                    this.application.ninja.stage.textTool.doAction("fontsize", (i +1));
-                    break;
-                }
-            }
-        }
-    },
-
-    defineInitialProperties: {
-        value: function() {
-            if (!this.initialized) {
-
-                //Setup Font Selection tool
-                this.fontColor.props = {side: 'top', align: 'center', wheel: true, palette: true, gradient: false, image: false, nocolor: true, offset: -80};
-                this.application.ninja.colorController.addButton("chip", this.fontColor);
-                this.fontColor.color('rgb', {wasSetByCode: true, type: 'change', color: {r: 0, g: 0, b: 0}, css: 'rgb(0,0,0)'});
-                this.fontColor.addEventListener("change",this.handleFontColorChange.bind(this),false);
-
-                this.application.ninja.stage.textTool.addEventListener("editorSelect", this, false);
-
-                Object.defineBinding(this.btnBold, "pressed", {
-                  boundObject: this.application.ninja.stage.textTool,
-                  boundObjectPropertyPath: "bold",
-                  oneway: false
-                });
-
-                Object.defineBinding(this.btnItalic, "pressed", {
-                  boundObject: this.application.ninja.stage.textTool,
-                  boundObjectPropertyPath: "italic",
-                  oneway: false
-                });
-
-                Object.defineBinding(this.btnUnderline, "pressed", {
-                  boundObject: this.application.ninja.stage.textTool,
-                  boundObjectPropertyPath: "underline",
-                  oneway: false
-                });
-
-                Object.defineBinding(this.btnStrikethrough, "pressed", {
-                  boundObject: this.application.ninja.stage.textTool,
-                  boundObjectPropertyPath: "strikeThrough",
-                  oneway: false
-                });
-
-                Object.defineBinding(this.alignLeft, "pressed", {
-                  boundObject: this.application.ninja.stage.textTool,
-                  boundObjectPropertyPath: "justify",
-                  boundValueMutator: this.validateJustify,
-                  oneway: false
-                });
-//
-//                Object.defineBinding(this.alignCenter, "pressed", {
-//                  boundObject: this.application.ninja.stage.textTool,
-//                  boundObjectPropertyPath: "justifycenter",
-//                  boundValueMutator: this.validatePressed,
-//                  oneway: true
-//                });
-//
-//                Object.defineBinding(this.alignRight, "pressed", {
-//                  boundObject: this.application.ninja.stage.textTool,
-//                  boundObjectPropertyPath: "justifyright",
-//                  boundValueMutator: this.validatePressed,
-//                  oneway: true
-//                });
-//
-//                Object.defineBinding(this.alignJustify, "pressed", {
-//                  boundObject: this.application.ninja.stage.textTool,
-//                  boundObjectPropertyPath: "justifyfull",
-//                  boundValueMutator: this.validatePressed,
-//                  oneway: true
-//                });
-//
-//                Object.defineBinding(this.numberedList, "pressed", {
-//                  boundObject: this.application.ninja.stage.textTool,
-//                  boundObjectPropertyPath: "insertorderedlist",
-//                  boundValueMutator: this.validatePressed,
-//                  oneway: true
-//                });
-//
-//                Object.defineBinding(this.bulletedList, "pressed", {
-//                  boundObject: this.application.ninja.stage.textTool,
-//                  boundObjectPropertyPath: "insertunorderedlist",
-//                  boundValueMutator: this.validatePressed,
-//                  oneway: true
-//                });
-//
-//                Object.defineBinding(this.fontSelection, "value", {
-//                  boundObject: this.application.ninja.stage.textTool,
-//                  boundObjectPropertyPath: "fontname",
-//                  boundValueMutator: this.validateFont,
-//                  oneway: true
-//                });
-//
-//                Object.defineBinding(this.fontSize, "value", {
-//                  boundObject: this.application.ninja.stage.textTool,
-//                  boundObjectPropertyPath: "states.fontsize",
-//                  boundValueMutator: this.validateFontSize.bind(this),
-//                  oneway: true
-//                });
-
-                this.initialized = true;
-            }
-
-        }
-    },
-
-    validatePressed: {
-        value: function(val) {
-            if (val == "true") return true; else return false
-        }
-    },
-
-    validateFont: {
-        value: function(val) {
-            return val;
-        }
-    },
-
-    validateFontSize: {
-        value: function(val) {
-            val = parseInt(val);
-            return this.fontSize.items[val - 1];
-        }
-    },
-
-    initialized: {
-        value: false
-    },
-
-    handleFontSelectionChange: {
-        value: function(e) {
-            this.application.ninja.stage.textTool.element.focus();
-            this.application.ninja.stage.textTool.doAction("fontname", this.fontSelection.value);
-
-            //Note: Set Font Color on selection to ColorChip Component;
-            //this.this.application.ninja.stage.textTool.foreColor
-
-        }
-    },
 
     handleFontColorChange: {
         value: function(e) {
             this.application.ninja.stage.textTool.foreColor = e._event.color.css;
-            this.application.ninja.stage.textTool.element.focus();
-            //this.application.ninja.stage.textTool.doAction("forecolor",e._event.color.css);
-
         }
     }
 
+});
 
-});
\ No newline at end of file
-- 
cgit v1.2.3


From 3d3e37c55e96b74c6c0a2841574fb03814d52999 Mon Sep 17 00:00:00 2001
From: Armen Kesablyan
Date: Tue, 3 Jul 2012 12:19:56 -0700
Subject: Text Tool 2

Signed-off-by: Armen Kesablyan <armen@motorola.com>
---
 .../text-properties.reel/text-properties.html      |  73 ++++--------
 .../text-properties.reel/text-properties.js        | 128 +++++++++++++--------
 2 files changed, 108 insertions(+), 93 deletions(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index 6a94cf0a..e0edfdd6 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -139,31 +139,28 @@
                 "properties": {
                     "element": {"#": "alignLeft"},
                     "pressedClass": "active",
-                    "identifier": "alignLeft",
+                    "identifier": "justifyLeft",
                     "pressedLabel": "",
-                    "unpressedLabel": ""
+                    "unpressedLabel": "",
+                    "pressed": false
                 },
                 "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
+                    { "type": "action", "listener": {"@": "owner"} }
                 ]
             },
+
             "alignCenter": {
                 "prototype": "montage/ui/toggle-button.reel",
                 "properties": {
                     "element": {"#": "alignCenter"},
                     "pressedClass": "active",
-                    "identifier": "alignCenter",
+                    "identifier": "justifyCenter",
                     "pressedLabel": "",
-                    "unpressedLabel": ""
+                    "unpressedLabel": "",
+                    "pressed": false
                 },
                 "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
+                    { "type": "action", "listener": {"@": "owner"} }
                 ]
             },
             "alignRight": {
@@ -171,15 +168,13 @@
                 "properties": {
                     "element": {"#": "alignRight"},
                     "pressedClass": "active",
-                    "identifier": "alignRight",
+                    "identifier": "justifyRight",
                     "pressedLabel": "",
-                    "unpressedLabel": ""
+                    "unpressedLabel": "",
+                    "pressed": false
                 },
                 "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
+                    { "type": "action", "listener": {"@": "owner"} }
                 ]
             },
             "alignJustify": {
@@ -187,43 +182,33 @@
                 "properties": {
                     "element": {"#": "alignJustify"},
                     "pressedClass": "active",
-                    "identifier": "alignJustify",
+                    "identifier": "justify",
                     "pressedLabel": "",
-                    "unpressedLabel": ""
+                    "unpressedLabel": "",
+                    "pressed": false
                 },
                 "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
+                    { "type": "action", "listener": {"@": "owner"} }
                 ]
             },
             "indent": {
                 "prototype": "montage/ui/button.reel",
                 "properties": {
                     "element": {"#": "indent"},
-                    "identifier": "indent",
-                    "value": ">>"
+                    "identifier": "indent"
                 },
                 "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
+                    { "type": "action", "listener": {"@": "owner"} }
                 ]
             },
             "outdent": {
                 "prototype": "montage/ui/button.reel",
                 "properties": {
                     "element": {"#": "outdent"},
-                    "identifier": "outdent",
-                    "value": "<<"
+                    "identifier": "outdent"
                 },
                 "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
+                    { "type": "action", "listener": {"@": "owner"} }
                 ]
             },
             "bulletedList": {
@@ -236,10 +221,7 @@
                     "unpressedLabel": "• • •"
                 },
                 "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
+                    { "type": "action", "listener": {"@": "owner"} }
                 ]
             },
             "numberedList": {
@@ -251,12 +233,7 @@
                     "pressedLabel": "1 2 3",
                     "unpressedLabel": "1 2 3"
                 },
-                "listeners": [
-                    {
-                        "type": "action",
-                        "listener": {"@": "owner"}
-                    }
-                ]
+                "listeners": [ { "type": "action", "listener": {"@": "owner"} } ]
             }
 
     	}
@@ -285,8 +262,8 @@
                 <button data-montage-id="alignJustify" class="nj-skinned imageButton"><img src="../../../../images/optionsbar/text/AlignJustified.png"  class="unselectable"/></button>
             </div>
             <div class="btnGroup toolOptionsFloatChildren">
-                <button data-montage-id="indent" class="nj-skinned textButton"></button>
-                <button data-montage-id="outdent" class="nj-skinned textButton"></button>
+                <button data-montage-id="indent" class="nj-skinned textButton"><img src="../../../../images/optionsbar/text/IndentMore.png" class="unselectable" style="height:16px" /></button>
+                <button data-montage-id="outdent" class="nj-skinned textButton"><img src="../../../../images/optionsbar/text/IndentLess.png" class="unselectable" style="height:16px" /></button>
             </div>
             <div class="btnGroup toolOptionsFloatChildren">
                 <button data-montage-id="bulletedList" class="nj-skinned imageButton"><img src="../../../../images/optionsbar/text/BulletedList.png" /></button>
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.js b/js/components/tools-properties/text-properties.reel/text-properties.js
index 4f944adf..126665e2 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.js
+++ b/js/components/tools-properties/text-properties.reel/text-properties.js
@@ -8,32 +8,70 @@ var Montage = require("montage/core/core").Montage;
 var Component = require("montage/ui/component").Component;
 var ArrayController = require("montage/ui/controller/array-controller").ArrayController;
 var ToolProperties = require("js/components/tools-properties/tool-properties").ToolProperties;
-var Converter = require("montage/core/converter/converter").Converter;
 
 exports.TextProperties = Montage.create(ToolProperties, {
 
     fontName: {value: null, serializable: true},
     fontSize: {value: null, serializable: true},
-
-    fontSettings: {value: null, serializable: true}, // Note: Isn't used currently will need fontSettings Popup
-
     fontColor: {value: null, serializable: true},
+
     btnBold: {value: null, serializable: true},
     btnItalic: {value: null, serializable: true},
     btnUnderline: {value: null, serializable: true},
     btnStrikethrough: {value: null, serializable: true},
-    txtLink: {value: null, serializable: true},
-    linkTarget: {value: null, serializable: true},
+
     alignLeft: {value: null, serializable: true},
     alignCenter: {value: null, serializable: true},
     alignRight: {value: null, serializable: true},
     alignJustify: {value: null, serializable: true},
+
     indent: {value: null, serializable: true},
     outdent: {value: null, serializable: true},
+
     numberedList: {value: null, serializable: true},
     bulletedList: {value: null, serializable: true},
-    fontTypes: {value: null, serializable: true},
-    fontSizes: {value: null, serializable: true},
+
+    // Events
+    handleEditorSelect: {
+        value: function(e) {
+            this.alignLeft.pressed = false;
+            this.alignCenter.pressed = false;
+            this.alignRight.pressed = false;
+            this.alignJustify.pressed = false;
+            this.bulletedList.pressed = false;
+            this.numberedList.pressed = false;
+
+
+            switch(this.application.ninja.stage.textTool.justify) {
+                case "left":
+                    this.alignLeft.pressed = true;
+                    break;
+                case "center":
+                    this.alignCenter.pressed = true;
+                    break;
+                case "right":
+                    this.alignRight.pressed = true;
+                    break;
+                case "full":
+                    this.alignJustify.pressed = true;
+            }
+
+            switch(this.application.ninja.stage.textTool.listStyle) {
+                case "ordered":
+                    this.numberedList.pressed = true;
+                    break;
+                case "unordered":
+                    this.bulletedList.pressed = true;
+            }
+        }
+    },
+
+    handleEditorBlur: {
+        value: function(e) {
+
+        }
+    },
+
 
     // Draw Cycle
     prepareForDraw: {
@@ -46,6 +84,7 @@ exports.TextProperties = Montage.create(ToolProperties, {
 
             this.application.ninja.stage.textTool.addEventListener("editorSelect", this.handleEditorSelect.bind(this), false);
 
+
             //Bind to Rich Text editor that lives on the stage component
             Object.defineBinding(this.application.ninja.stage.textTool, "fontName", {
                 boundObject: this.fontName,
@@ -85,83 +124,82 @@ exports.TextProperties = Montage.create(ToolProperties, {
         }
     },
 
-    // Events
-    handleEditorSelect: {
-        value: function(e) {
-
-        }
-    },
-    
-    handleAlignLeftAction: {
+    // Actions
+    handleJustifyLeftAction: {
         value: function(e) {
-            //this.alignLeft.value = false;
-            this.alignCenter.value = false;
-            this.alignRight.value = false;
-            this.alignJustify.value = false;
-            this.application.ninja.stage.textTool.doAction("justifyleft");
+            this.alignCenter.pressed = false;
+            this.alignRight.pressed = false;
+            this.alignJustify.pressed = false;
+            this.application.ninja.stage.textTool.justify = "left";
         }
     },
 
-    handleAlignCenterAction: {
+    handleJustifyCenterAction: {
         value: function(e) {
-            this.alignLeft.value = false;
-            //this.alignCenter.value = false;
-            this.alignRight.value = false;
-            this.alignJustify.value = false;
-            this.application.ninja.stage.textTool.doAction("justifycenter");
+            this.alignLeft.pressed = false;
+            this.alignRight.pressed = false;
+            this.alignJustify.pressed = false;
+            this.application.ninja.stage.textTool.justify = "center"
         }
     },
 
-    handleAlignRightAction: {
+    handleJustifyRightAction: {
         value: function(e) {
-            this.alignLeft.value = false;
-            this.alignCenter.value = false;
-            //this.alignRight.value = false;
-            this.alignJustify.value = false;
-            this.application.ninja.stage.textTool.doAction("justifyright");
+            this.alignLeft.pressed = false;
+            this.alignCenter.pressed = false;
+            this.alignJustify.pressed = false;
+            this.application.ninja.stage.textTool.justify = "right";
         }
     },
 
-    handleAlignJustifyAction: {
+    handleJustifyAction: {
         value: function(e) {
-            this.alignLeft.value = false;
-            this.alignCenter.value = false;
-            this.alignRight.value = false;
-            //this.alignJustify.value = false;
-            this.application.ninja.stage.textTool.doAction("justifyfull");
+            this.alignLeft.pressed = false;
+            this.alignCenter.pressed = false;
+            this.alignRight.pressed = false;
+            this.application.ninja.stage.textTool.justify = "full";
         }
     },
 
     handleIndentAction: {
         value: function(e) {
-            this.application.ninja.stage.textTool.doAction("indent");
+            this.application.ninja.stage.textTool.indent();
         }
     },
 
     handleOutdentAction: {
         value: function(e) {
-            this.application.ninja.stage.textTool.doAction("outdent");
+            this.application.ninja.stage.textTool.outdent();
         }
     },
 
     handleBulletedListAction: {
         value: function(e) {
-            this.application.ninja.stage.textTool.doAction("insertunorderedlist");
+            this.numberedList.pressed = false;
+            if(e._currentTarget.pressed) {
+                this.application.ninja.stage.textTool.listStyle = "unordered";
+            } else {
+                this.application.ninja.stage.textTool.listStyle = "none";
+            }
         }
     },
 
     handleNumberedListAction: {
         value: function(e) {
-            this.application.ninja.stage.textTool.doAction("insertorderedlist");
+            this.bulletedList.pressed = false;
+            if(e._currentTarget.pressed) {
+                this.application.ninja.stage.textTool.listStyle = "ordered";
+            } else {
+                this.application.ninja.stage.textTool.listStyle = "none";
+            }
         }
     },
 
 
     handleFontColorChange: {
         value: function(e) {
-            this.application.ninja.stage.textTool.foreColor = e._event.color.css;
+            this.application.ninja.stage.textTool.element.style.color = e._event.color.css;
         }
     }
 
 });
-
-- 
cgit v1.2.3


From 648ee61ae84216d0236e0dbc211addc13b2cfa3a Mon Sep 17 00:00:00 2001
From: Kris Kowal
Date: Fri, 6 Jul 2012 11:52:06 -0700
Subject: Expand tabs

---
 .../tools-properties/text-properties.reel/text-properties.html        | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index 6784e41c..6465227f 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -293,8 +293,8 @@ POSSIBILITY OF SUCH DAMAGE.
                 ]
             }
 
-    	}
-	    </script>
+        }
+        </script>
 
     </head>
 
-- 
cgit v1.2.3


From 04343eda8c2f870b0da55cfdc8003c99fe1cc4de Mon Sep 17 00:00:00 2001
From: Kris Kowal
Date: Fri, 6 Jul 2012 11:53:10 -0700
Subject: Remove trailing spaces

---
 .../tools-properties/text-properties.reel/text-properties.js          | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.js b/js/components/tools-properties/text-properties.reel/text-properties.js
index 0cfa6c4c..a3adbb1d 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.js
+++ b/js/components/tools-properties/text-properties.reel/text-properties.js
@@ -87,7 +87,7 @@ exports.TextProperties = Montage.create(ToolProperties, {
 //                { value: 7, text: "36pt" }
 //            ];
 //            this.fontSize.contentController = this.fontSizes;
-            
+
             this.fontSelection.items = ["Arial", "Arial Black", "Courier New", "Garamond", "Georgia",  "Open Sans", "Tahoma", "Times New Roman", "Trebuchet MS", "Verdana"];
             this.fontSize.items = ["8pt","10pt","12pt","14pt","18pt","24pt","36pt"];
             this.tagType.items = ["div", "span", "p", "section", "article", "h1", "h2", "h3", "h4", "h5", "h6"];
@@ -120,7 +120,7 @@ exports.TextProperties = Montage.create(ToolProperties, {
 
         }
     },
-    
+
     handleAlignLeftAction: {
         value: function(e) {
             //this.alignLeft.value = false;
-- 
cgit v1.2.3


From 6803c0abd279fcb640c38b3881b751bab982cbe0 Mon Sep 17 00:00:00 2001
From: Kris Kowal
Date: Fri, 6 Jul 2012 12:42:16 -0700
Subject: Remove trailing spaces

---
 .../tools-properties/text-properties.reel/text-properties.html        | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index 6465227f..a8b27c2f 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -107,7 +107,7 @@ POSSIBILITY OF SUCH DAMAGE.
                 ]
 
             },
-        
+
             "btnBold": {
                 "prototype": "montage/ui/toggle-button.reel",
                 "properties": {
@@ -167,7 +167,7 @@ POSSIBILITY OF SUCH DAMAGE.
                     }
                 ]
             },
-            
+
             "alignLeft": {
                 "prototype": "montage/ui/toggle-button.reel",
                 "properties": {
-- 
cgit v1.2.3


From 9461e7731f91dd03a15b0a62667e722a60c84721 Mon Sep 17 00:00:00 2001
From: Kris Kowal
Date: Fri, 6 Jul 2012 12:44:57 -0700
Subject: Remove byte order markers (BOM)

---
 .../tools-properties/text-properties.reel/text-properties.html          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index a8b27c2f..ae76cb1d 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -1,4 +1,4 @@
-<!DOCTYPE HTML>
+<!DOCTYPE HTML>
 <!-- <copyright>
 Copyright (c) 2012, Motorola Mobility, Inc
 All Rights Reserved.
-- 
cgit v1.2.3


From 40c6eb2c06b34f65a74d59ef9687251952858bab Mon Sep 17 00:00:00 2001
From: Kris Kowal
Date: Fri, 6 Jul 2012 12:47:27 -0700
Subject: Normalize HTML doctype

---
 .../tools-properties/text-properties.reel/text-properties.html          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index ae76cb1d..b4a0f1ae 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -1,4 +1,4 @@
-<!DOCTYPE HTML>
+<!doctype html>
 <!-- <copyright>
 Copyright (c) 2012, Motorola Mobility, Inc
 All Rights Reserved.
-- 
cgit v1.2.3


From fdbec324dad4ab33d97282ab021d2c1661bc097c Mon Sep 17 00:00:00 2001
From: Kris Kowal
Date: Mon, 9 Jul 2012 16:27:52 -0700
Subject: BSD License

---
 .../text-properties.reel/text-properties.css       | 23 +++++++++++-----------
 .../text-properties.reel/text-properties.html      | 23 +++++++++++-----------
 .../text-properties.reel/text-properties.js        | 23 +++++++++++-----------
 3 files changed, 36 insertions(+), 33 deletions(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.css b/js/components/tools-properties/text-properties.reel/text-properties.css
index 9e562f68..fc421035 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.css
+++ b/js/components/tools-properties/text-properties.reel/text-properties.css
@@ -1,24 +1,25 @@
 /* <copyright>
-Copyright (c) 2012, Motorola Mobility, Inc
+Copyright (c) 2012, Motorola Mobility LLC.
 All Rights Reserved.
-BSD License.
 
 Redistribution and use in source and binary forms, with or without
 modification, are permitted provided that the following conditions are met:
 
-  - Redistributions of source code must retain the above copyright notice,
-    this list of conditions and the following disclaimer.
-  - Redistributions in binary form must reproduce the above copyright
-    notice, this list of conditions and the following disclaimer in the
-    documentation and/or other materials provided with the distribution.
-  - Neither the name of Motorola Mobility nor the names of its contributors
-    may be used to endorse or promote products derived from this software
-    without specific prior written permission.
+* Redistributions of source code must retain the above copyright notice,
+  this list of conditions and the following disclaimer.
+
+* Redistributions in binary form must reproduce the above copyright notice,
+  this list of conditions and the following disclaimer in the documentation
+  and/or other materials provided with the distribution.
+
+* Neither the name of Motorola Mobility LLC nor the names of its
+  contributors may be used to endorse or promote products derived from this
+  software without specific prior written permission.
 
 THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
 AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
 IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
-ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
+ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
 LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
 CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
 SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index 89659477..37735032 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -1,25 +1,26 @@
 <!doctype html>
 <!-- <copyright>
-Copyright (c) 2012, Motorola Mobility, Inc
+Copyright (c) 2012, Motorola Mobility LLC.
 All Rights Reserved.
-BSD License.
 
 Redistribution and use in source and binary forms, with or without
 modification, are permitted provided that the following conditions are met:
 
-  - Redistributions of source code must retain the above copyright notice,
-    this list of conditions and the following disclaimer.
-  - Redistributions in binary form must reproduce the above copyright
-    notice, this list of conditions and the following disclaimer in the
-    documentation and/or other materials provided with the distribution.
-  - Neither the name of Motorola Mobility nor the names of its contributors
-    may be used to endorse or promote products derived from this software
-    without specific prior written permission.
+* Redistributions of source code must retain the above copyright notice,
+  this list of conditions and the following disclaimer.
+
+* Redistributions in binary form must reproduce the above copyright notice,
+  this list of conditions and the following disclaimer in the documentation
+  and/or other materials provided with the distribution.
+
+* Neither the name of Motorola Mobility LLC nor the names of its
+  contributors may be used to endorse or promote products derived from this
+  software without specific prior written permission.
 
 THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
 AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
 IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
-ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
+ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
 LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
 CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
 SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
diff --git a/js/components/tools-properties/text-properties.reel/text-properties.js b/js/components/tools-properties/text-properties.reel/text-properties.js
index 911b4b19..36aa3ce8 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.js
+++ b/js/components/tools-properties/text-properties.reel/text-properties.js
@@ -1,24 +1,25 @@
 /* <copyright>
-Copyright (c) 2012, Motorola Mobility, Inc
+Copyright (c) 2012, Motorola Mobility LLC.
 All Rights Reserved.
-BSD License.
 
 Redistribution and use in source and binary forms, with or without
 modification, are permitted provided that the following conditions are met:
 
-  - Redistributions of source code must retain the above copyright notice,
-    this list of conditions and the following disclaimer.
-  - Redistributions in binary form must reproduce the above copyright
-    notice, this list of conditions and the following disclaimer in the
-    documentation and/or other materials provided with the distribution.
-  - Neither the name of Motorola Mobility nor the names of its contributors
-    may be used to endorse or promote products derived from this software
-    without specific prior written permission.
+* Redistributions of source code must retain the above copyright notice,
+  this list of conditions and the following disclaimer.
+
+* Redistributions in binary form must reproduce the above copyright notice,
+  this list of conditions and the following disclaimer in the documentation
+  and/or other materials provided with the distribution.
+
+* Neither the name of Motorola Mobility LLC nor the names of its
+  contributors may be used to endorse or promote products derived from this
+  software without specific prior written permission.
 
 THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
 AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
 IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE
-ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE
+ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE
 LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR
 CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF
 SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS
-- 
cgit v1.2.3


From 21a9603fb5522467776409972be21a87964c244d Mon Sep 17 00:00:00 2001
From: Kris Kowal
Date: Mon, 9 Jul 2012 16:56:43 -0700
Subject: Normalize HTML DOCTYPE

Was lower-case. Now upper-case.

Also fixed BOMs, trailing white-space, DOS line terminators. Did not
expand tabs to spaces.
---
 .../tools-properties/text-properties.reel/text-properties.html          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index 37735032..183a9910 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -1,4 +1,4 @@
-<!doctype html>
+<!DOCTYPE HTML>
 <!-- <copyright>
 Copyright (c) 2012, Motorola Mobility LLC.
 All Rights Reserved.
-- 
cgit v1.2.3


From 6eb2603a0772bd4f0aad94398fd8eb3a245a3e75 Mon Sep 17 00:00:00 2001
From: John Mayhew
Date: Mon, 9 Jul 2012 17:49:01 -0700
Subject: fixed incorrect capitalization for DOCTYPE html

---
 .../tools-properties/text-properties.reel/text-properties.html          | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'js/components/tools-properties/text-properties.reel')

diff --git a/js/components/tools-properties/text-properties.reel/text-properties.html b/js/components/tools-properties/text-properties.reel/text-properties.html
index 183a9910..e84e1646 100755
--- a/js/components/tools-properties/text-properties.reel/text-properties.html
+++ b/js/components/tools-properties/text-properties.reel/text-properties.html
@@ -1,4 +1,4 @@
-<!DOCTYPE HTML>
+<!DOCTYPE html>
 <!-- <copyright>
 Copyright (c) 2012, Motorola Mobility LLC.
 All Rights Reserved.
-- 
cgit v1.2.3