aboutsummaryrefslogtreecommitdiff
path: root/js/tools
diff options
context:
space:
mode:
authorArmen Kesablyan2012-02-07 16:30:47 -0800
committerArmen Kesablyan2012-02-07 16:30:47 -0800
commitd7ead10b566e7de121b2cd2c99fecca8469d63b8 (patch)
tree3e91822410c9834b269e59c4a0b9962ef0a12b04 /js/tools
parent2082fa6912eec2ffabd2081b7706e8e1b88a9711 (diff)
downloadninja-d7ead10b566e7de121b2cd2c99fecca8469d63b8.tar.gz
Initial Text tool completion.
Diffstat (limited to 'js/tools')
-rw-r--r--js/tools/TextTool.js47
1 files changed, 22 insertions, 25 deletions
diff --git a/js/tools/TextTool.js b/js/tools/TextTool.js
index 8b48ff4f..28e7ddf3 100644
--- a/js/tools/TextTool.js
+++ b/js/tools/TextTool.js
@@ -17,10 +17,20 @@ exports.TextTool = Montage.create(DrawingTool, {
17 return this._selectedElement; 17 return this._selectedElement;
18 }, 18 },
19 set: function(val) { 19 set: function(val) {
20 if(this._selectedElement !== null) { 20 if (this._selectedElement !== null) {
21 21 this.selectedElement.innerHTML = this.application.ninja.stage.textTool.value;
22 this.application.ninja.stage.textTool.value = "";
23 this.application.ninja.stage.textTool.element.style.display = "none";
22 } 24 }
25 //Set Selected Element
23 this._selectedElement = val; 26 this._selectedElement = val;
27 if(val !== null) {
28 this.drawTextTool();
29 this.handleScroll();
30 this.application.ninja.stage._iframeContainer.addEventListener("scroll", this, false);
31 } else {
32 this.application.ninja.stage._iframeContainer.removeEventListener("scroll", this);
33 }
24 } 34 }
25 }, 35 },
26 36
@@ -29,11 +39,19 @@ exports.TextTool = Montage.create(DrawingTool, {
29 39
30 HandleLeftButtonDown: { 40 HandleLeftButtonDown: {
31 value: function(event) { 41 value: function(event) {
32 this.deselectText();
33 this.startDraw(event); 42 this.startDraw(event);
34 } 43 }
35 }, 44 },
36 45
46 handleScroll: {
47 value: function(e) {
48 // Set Top & Left Positions
49 var textToolCoordinates = this.application.ninja.stage.toViewportCoordinates(this.selectedElement.offsetLeft, this.selectedElement.offsetTop);
50 this.application.ninja.stage.textTool.element.style.left = textToolCoordinates[0] + "px";
51 this.application.ninja.stage.textTool.element.style.top = textToolCoordinates[1] + "px";
52 }
53 },
54
37 HandleMouseMove: { 55 HandleMouseMove: {
38 value: function(event) { 56 value: function(event) {
39 if(this._escape) { 57 if(this._escape) {
@@ -73,12 +91,9 @@ exports.TextTool = Montage.create(DrawingTool, {
73 this.endDraw(event); 91 this.endDraw(event);
74 } else { 92 } else {
75 this.doSelection(event); 93 this.doSelection(event);
76 console.log("im here");
77 if (this.application.ninja.selectedElements.length !== 0 ) { 94 if (this.application.ninja.selectedElements.length !== 0 ) {
78 this.selectedElement = this.application.ninja.selectedElements[0]._element; 95 this.selectedElement = this.application.ninja.selectedElements[0]._element;
79 this.drawTextTool();
80 } 96 }
81
82 this._isDrawing = false; 97 this._isDrawing = false;
83 } 98 }
84 } 99 }
@@ -88,7 +103,6 @@ exports.TextTool = Montage.create(DrawingTool, {
88 value: function(fromElement, toElement, styles) { 103 value: function(fromElement, toElement, styles) {
89 styles.forEach(function(style) { 104 styles.forEach(function(style) {
90 var styleCamelCase = style.replace(/(\-[a-z])/g, function($1){return $1.toUpperCase().replace('-','');}); 105 var styleCamelCase = style.replace(/(\-[a-z])/g, function($1){return $1.toUpperCase().replace('-','');});
91 console.log(styleCamelCase, style, window.getComputedStyle(fromElement)[style]);
92 toElement.style[styleCamelCase] = window.getComputedStyle(fromElement)[style]; 106 toElement.style[styleCamelCase] = window.getComputedStyle(fromElement)[style];
93 }, this); 107 }, this);
94 } 108 }
@@ -96,7 +110,6 @@ exports.TextTool = Montage.create(DrawingTool, {
96 110
97 drawTextTool: { 111 drawTextTool: {
98 value: function() { 112 value: function() {
99 console.log(" now im here");
100 this.application.ninja.stage.textTool.value = this.selectedElement.innerHTML; 113 this.application.ninja.stage.textTool.value = this.selectedElement.innerHTML;
101 if(this.application.ninja.stage.textTool.value === "") { this.application.ninja.stage.textTool.value = " "; } 114 if(this.application.ninja.stage.textTool.value === "") { this.application.ninja.stage.textTool.value = " "; }
102 this.selectedElement.innerHTML = ""; 115 this.selectedElement.innerHTML = "";
@@ -105,11 +118,6 @@ exports.TextTool = Montage.create(DrawingTool, {
105 this.application.ninja.stage.textTool.element.style.display = "block"; 118 this.application.ninja.stage.textTool.element.style.display = "block";
106 this.application.ninja.stage.textTool.element.style.position = "absolute"; 119 this.application.ninja.stage.textTool.element.style.position = "absolute";
107 120
108 // Set Top & Left Positions
109 var textToolCoordinates = this.application.ninja.stage.toViewportCoordinates(this.selectedElement.offsetLeft, this.selectedElement.offsetTop);
110 this.application.ninja.stage.textTool.element.style.left = textToolCoordinates[0] + "px";
111 this.application.ninja.stage.textTool.element.style.top = textToolCoordinates[1] + "px";
112
113 // Set Width, Height 121 // Set Width, Height
114 this.application.ninja.stage.textTool.element.style.width = this.selectedElement.offsetWidth + "px"; 122 this.application.ninja.stage.textTool.element.style.width = this.selectedElement.offsetWidth + "px";
115 this.application.ninja.stage.textTool.element.style.height = this.selectedElement.offsetHeight + "px"; 123 this.application.ninja.stage.textTool.element.style.height = this.selectedElement.offsetHeight + "px";
@@ -127,18 +135,7 @@ exports.TextTool = Montage.create(DrawingTool, {
127 range.selectNodeContents(this.application.ninja.stage.textTool.element.firstChild); 135 range.selectNodeContents(this.application.ninja.stage.textTool.element.firstChild);
128 sel.addRange(range); 136 sel.addRange(range);
129 this.didDraw = function() {}; 137 this.didDraw = function() {};
130 console.log("im drew here");
131 } 138 }
132 console.log("i end here");
133 }
134 },
135
136
137 deselectText: {
138 value: function() {
139 this.application.ninja.stage.textTool.element.style.display = "none";
140 this.selectedElement.innerHTML = this.application.ninja.stage.textTool.value;
141 this.application.ninja.stage.textTool.value = "";
142 } 139 }
143 }, 140 },
144 141
@@ -162,7 +159,7 @@ exports.TextTool = Montage.create(DrawingTool, {
162 NJevent("enableStageMove"); 159 NJevent("enableStageMove");
163 this.application.ninja.stage.stageDeps.snapManager.setupDragPlaneFromPlane( workingPlane ); 160 this.application.ninja.stage.stageDeps.snapManager.setupDragPlaneFromPlane( workingPlane );
164 } else { 161 } else {
165 this.deselectText(); 162 this.selectedElement = null;
166 NJevent("disableStageMove"); 163 NJevent("disableStageMove");
167 } 164 }
168 } 165 }