aboutsummaryrefslogtreecommitdiff
path: root/js/lib
diff options
context:
space:
mode:
Diffstat (limited to 'js/lib')
-rwxr-xr-xjs/lib/NJUtils.js112
1 files changed, 92 insertions, 20 deletions
diff --git a/js/lib/NJUtils.js b/js/lib/NJUtils.js
index f2785081..90aebb84 100755
--- a/js/lib/NJUtils.js
+++ b/js/lib/NJUtils.js
@@ -5,16 +5,15 @@ No rights, expressed or implied, whatsoever to this software are provided by Mot
5</copyright> */ 5</copyright> */
6 6
7var Montage = require("montage/core/core").Montage, 7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component,
8 Uuid = require("montage/core/uuid").Uuid, 9 Uuid = require("montage/core/uuid").Uuid,
9 ElementModel = require("js/models/element-model").ElementModel, 10 ElementModel = require("js/models/element-model").ElementModel,
10 Properties3D = require("js/models/properties-3d").Properties3D, 11 Properties3D = require("js/models/properties-3d").Properties3D,
11 ShapeModel = require("js/models/shape-model").ShapeModel, 12 ShapeModel = require("js/models/shape-model").ShapeModel,
12 ControllerFactory = require("js/controllers/elements/controller-factory").ControllerFactory; 13 ControllerFactory = require("js/controllers/elements/controller-factory").ControllerFactory;
13 14
14exports.NJUtils = Object.create(Object.prototype, { 15exports.NJUtils = Montage.create(Component, {
15 16
16
17
18 /* =============== DOM Access ================ */ 17 /* =============== DOM Access ================ */
19 18
20 ///// Quick "getElementById" 19 ///// Quick "getElementById"
@@ -56,13 +55,25 @@ exports.NJUtils = Object.create(Object.prototype, {
56 return document.createTextNode(text); 55 return document.createTextNode(text);
57 } 56 }
58 }, 57 },
59 58
60 ///// Quick "createElement" function "attr" can be classname or object 59 ///// Quick "createElement" function "attr" can be classname or object
61 ///// with attribute key/values 60 ///// with attribute key/values
62 ///// Suppor for data attributes 61 ///// Support for data attributes
63 make : { 62 ///// Support user/ninja document
64 value: function(tag, attr) { 63 make: {
65 var el = document.createElement(tag); 64 value: function(tag, attr, doc) {
65 var _doc, el;
66
67 _doc = doc ? doc._document : document;
68 el = _doc.createElement(tag);
69 this.decor(el, attr);
70
71 return el;
72 }
73 },
74
75 decor: {
76 value: function(el, attr) {
66 if (typeof attr === 'object') { 77 if (typeof attr === 'object') {
67 for (var a in attr) { 78 for (var a in attr) {
68 if (attr.hasOwnProperty(a)) { 79 if (attr.hasOwnProperty(a)) {
@@ -76,19 +87,82 @@ exports.NJUtils = Object.create(Object.prototype, {
76 } else if (typeof attr === 'string') { 87 } else if (typeof attr === 'string') {
77 el.className = (el.className + ' ' + attr).trim(); 88 el.className = (el.className + ' ' + attr).trim();
78 } 89 }
79
80 return el;
81 } 90 }
82 }, 91 },
83 92
84 ///// Element factory function for Ninja Elements 93 createModel: {
85 ///// selection is the string displayed in the PI 94 value: function(el) {
86 makeNJElement: { 95 el.elementModel = Montage.create(ElementModel).initialize(el);
87 value: function(tag, selection, controller, attr, isShape) { 96 }
88 var el = this.make(tag, attr); 97 },
89 this.makeElementModel(el, selection, controller, isShape);
90 98
91 return el; 99 createModelWithShape: {
100 value: function(el, selection) {
101 el.elementModel = Montage.create(ElementModel).initialize(el, true, selection);
102 }
103 },
104
105 createModelWithSelection: {
106 value: function(el, selection) {
107 el.elementModel = Montage.create(ElementModel).initialize(el, false, selection);
108 }
109 },
110
111 createModelForComponent: {
112 value: function(el, selection) {
113 el.elementModel = Montage.create(ElementModel).initialize(el, false, selection, true);
114 }
115 },
116
117 // TODO: Find a better place for this method
118 stylesFromDraw: {
119 value: function(element, width, height, drawData, pos) {
120 var styles = {};
121
122 styles['position'] = pos ? pos: "absolute";
123 styles['left'] = (Math.round(drawData.midPt[0] - 0.5 * width)) - this.application.ninja.currentSelectedContainer.offsetLeft + 'px';
124 styles['top'] = (Math.round(drawData.midPt[1] - 0.5 * height)) - this.application.ninja.currentSelectedContainer.offsetTop + 'px';
125 styles['width'] = width + 'px';
126 styles['height'] = height + 'px';
127
128 // TODO: Check why Canvas has different tranform styles from default.
129 if(!MathUtils.isIdentityMatrix(drawData.planeMat)) {
130 styles['-webkit-transform-style'] = 'preserve-3d';
131 styles['-webkit-transform'] = this.getElementMatrix(drawData.planeMat, drawData.midPt);
132 }
133
134 if(element.nodeName === "CANVAS") {
135 element.width = width;
136 element.height = height;
137 delete styles['width'];
138 delete styles['height'];
139
140 styles['-webkit-transform-style'] = 'preserve-3d';
141 }
142
143 return styles;
144 }
145 },
146
147 // Get the matrix for the actual element being added to the user document.
148 // TODO: Find a better place for this method
149 getElementMatrix: {
150 value: function(planeMat, midPt) {
151 var divMat, flatMat, flatMatSafe;
152 // we should not need to worry about divide by zero below since we snapped to the point
153 divMat = planeMat.slice(0);
154 divMat[12] = 0.0;
155 divMat[13] = 0.0;
156 //divMat[14] = 0.0;
157 divMat[14] = midPt[2];
158
159 // set the left and top of the element such that the center of the rectangle is at the mid point
160 this.application.ninja.stage.setStageAsViewport();
161
162 flatMat = divMat;
163 flatMatSafe = MathUtils.scientificToDecimal(flatMat, 10);
164
165 return "matrix3d(" + flatMatSafe + ")";
92 } 166 }
93 }, 167 },
94 168
@@ -96,8 +170,6 @@ exports.NJUtils = Object.create(Object.prototype, {
96 ///// TODO: find a different place for this function 170 ///// TODO: find a different place for this function
97 makeElementModel: { 171 makeElementModel: {
98 value: function(el, selection, controller, isShape) { 172 value: function(el, selection, controller, isShape) {
99 //el.elementModel = Montage.create(ElementModel).initialize(el.nodeName, selection, controller, isShape);
100
101 var p3d = Montage.create(Properties3D); 173 var p3d = Montage.create(Properties3D);
102 174
103 var shapeProps = null; 175 var shapeProps = null;