Merge pull request #323 from dhg637/binding

Binding View - Binding Tool & Binding Panel

1 files changed, 34 insertions, 14 deletions

diff --git a/js/tools/TextTool.js b/js/tools/TextTool.js
index 0aef6c1c..aa79b8bc 100755
--- a/js/tools/TextTool.js
+++ b/js/tools/TextTool.js
@@ -6,7 +6,6 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
 
 var Montage = require("montage/core/core").Montage,
     DrawingTool = require("js/tools/drawing-tool").DrawingTool,
-    //RichTextEditor = ("node_modules/labs/rich-text-editor.reel").RichTextEditor,
     ElementsMediator = require("js/mediators/element-mediator").ElementMediator;
 
 exports.TextTool = Montage.create(DrawingTool, {
@@ -23,24 +22,32 @@ exports.TextTool = Montage.create(DrawingTool, {
             return this._selectedElement;
         },
         set: function(val) {
+            //Set Selected Element
             if (this._selectedElement !== null) {
-                this.selectedElement.innerHTML = this.application.ninja.stage.textTool.value;
-                this.application.ninja.stage.textTool.value = "";
-                this.application.ninja.stage.textTool.element.style.display = "none";
-                ElementsMediator.setProperty(this.application.ninja.selectedElements, "color", [window.getComputedStyle(this.application.ninja.stage.textTool.element.firstChild)["color"]], "Change", "textTool");
+                this.applyStyle();
             }
-            //Set Selected Element
             this._selectedElement = val;
-            if(val !== null) {
+            if(this._selectedElement !== null) {
                 this.drawTextTool();
                 this.handleScroll();
                 this.application.ninja.stage._iframeContainer.addEventListener("scroll", this, false);
             } else {
                 this.application.ninja.stage._iframeContainer.removeEventListener("scroll", this);
             }
+
         }
     },
 
+    applyStyle: {
+        value: function() {
+            this.selectedElement.innerHTML = this.application.ninja.stage.textTool.value;
+            this.application.ninja.stage.textTool.value = "";
+            this.application.ninja.stage.textTool.element.style.display = "none";
+            //ElementsMediator.setProperty([this.selectedElement], "color", [window.getComputedStyle(this.application.ninja.stage.textTool.element)["color"]], "Change", "textTool");
+        }
+
+    },
+
     HandleLeftButtonDown: {
         value: function(event) {
             this.selectedElement = null;
@@ -96,6 +103,22 @@ exports.TextTool = Montage.create(DrawingTool, {
         }
     },
 
+    getSelectedElement: {
+        value: function(editor) {
+            var element = editor._selectedRange.startContainer;
+            if (element.nodeType == 3) {
+                element = element.parentNode;
+            }
+            return element;
+        }
+    },
+
+    getStyleOfSelectedElement: {
+        value: function(editor) {
+            return window.getComputedStyle(this.getSelectedElement(editor));
+        }
+    },
+
     applyElementStyles : {
         value: function(fromElement, toElement, styles) {
             styles.forEach(function(style) {
@@ -108,11 +131,11 @@ exports.TextTool = Montage.create(DrawingTool, {
     drawTextTool: {
         value: function() {
             var self = this;
-
             this.application.ninja.stage.textTool.value = this.selectedElement.innerHTML;
             if(this.application.ninja.stage.textTool.value === "") { this.application.ninja.stage.textTool.value = " "; }
             this.selectedElement.innerHTML = "";
 
+
             //Styling Options for text tool to look identical to the text you are manipulating.
             this.application.ninja.stage.textTool.element.style.display = "block";
             this.application.ninja.stage.textTool.element.style.position = "absolute";
@@ -124,14 +147,11 @@ exports.TextTool = Montage.create(DrawingTool, {
             // Set font styling (Size, Style, Weight)
             this.application.ninja.stage.textTool.didDraw = function() {
                 self.applyElementStyles(self.selectedElement, self.application.ninja.stage.textTool.element, ["overflow"]);
-                self.applyElementStyles(self.selectedElement, self.application.ninja.stage.textTool.element.firstChild, ["font","padding-left","padding-top","padding-right","padding-bottom", "color"]);
-                var range = document.createRange(),
-                sel   = window.getSelection();
-                sel.removeAllRanges();
-                range.selectNodeContents(self.application.ninja.stage.textTool.element.firstChild);
-                sel.addRange(range);
+                self.applyElementStyles(self.selectedElement, self.application.ninja.stage.textTool.element, ["font","padding-left","padding-top","padding-right","padding-bottom", "color"]);
+                this.selectAll();
                 this.didDraw = function() {};
             }
+
         }
     },