From 7d3bdf39e6d1534de1848ca2744aed66dfeb5d2a Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Tue, 5 Jun 2012 23:13:03 -0700 Subject: Initial Text Tool Changes Signed-off-by: Armen Kesablyan --- js/tools/TextTool.js | 29 +++++++++++++++++++++-------- 1 file changed, 21 insertions(+), 8 deletions(-) (limited to 'js/tools/TextTool.js') diff --git a/js/tools/TextTool.js b/js/tools/TextTool.js index 024a92ce..cff3b6e3 100755 --- a/js/tools/TextTool.js +++ b/js/tools/TextTool.js @@ -27,7 +27,7 @@ exports.TextTool = Montage.create(DrawingTool, { 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"); + ElementsMediator.setProperty(this.application.ninja.selectedElements, "color", [window.getComputedStyle(this.application.ninja.stage.textTool.element)["color"]], "Change", "textTool"); } //Set Selected Element this._selectedElement = val; @@ -96,6 +96,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 +124,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 +140,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() {}; } + } }, -- cgit v1.2.3 From 23aec4144f9d4352ba6d10367288f51d57ba990f Mon Sep 17 00:00:00 2001 From: Armen Kesablyan Date: Sat, 23 Jun 2012 13:44:49 -0700 Subject: Text Tool Fix - Can Not Switch Document when Text Tool Initialized Signed-off-by: Armen Kesablyan --- js/tools/TextTool.js | 21 ++++++++++++++------- 1 file changed, 14 insertions(+), 7 deletions(-) (limited to 'js/tools/TextTool.js') diff --git a/js/tools/TextTool.js b/js/tools/TextTool.js index 7f82855b..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,22 +22,30 @@ 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)["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: { -- cgit v1.2.3