diff options
Diffstat (limited to 'js/mediators')
-rw-r--r-- | js/mediators/drag-drop-mediator.js | 172 | ||||
-rw-r--r-- | js/mediators/element-mediator.js | 677 | ||||
-rw-r--r-- | js/mediators/keyboard-mediator.js | 240 | ||||
-rw-r--r-- | js/mediators/mouse-mediator.js | 31 |
4 files changed, 1120 insertions, 0 deletions
diff --git a/js/mediators/drag-drop-mediator.js b/js/mediators/drag-drop-mediator.js new file mode 100644 index 00000000..07e4a50c --- /dev/null +++ b/js/mediators/drag-drop-mediator.js | |||
@@ -0,0 +1,172 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage, | ||
8 | Component = require("montage/ui/component").Component, | ||
9 | NJUtils = require("js/lib/NJUtils").NJUtils; | ||
10 | |||
11 | exports.DragDropMediator = Montage.create(Component, { | ||
12 | dropTarget: { | ||
13 | value: null, | ||
14 | writable: true | ||
15 | }, | ||
16 | |||
17 | baseX: { | ||
18 | value: null, | ||
19 | writable: true | ||
20 | }, | ||
21 | |||
22 | baseY: { | ||
23 | value: null, | ||
24 | writable: true | ||
25 | }, | ||
26 | |||
27 | deserializedFromTemplate: { | ||
28 | value: function() { | ||
29 | this.eventManager.addEventListener("appLoaded", this, false); | ||
30 | } | ||
31 | }, | ||
32 | |||
33 | handleAppLoaded: { | ||
34 | value: function() { | ||
35 | this.dropTarget = this.application.ninja.stage.drawingCanvas; | ||
36 | |||
37 | this.dropTarget.addEventListener("dragover", this, false); | ||
38 | this.dropTarget.addEventListener("dragend", this, false); | ||
39 | this.dropTarget.addEventListener("drop", this, false); | ||
40 | } | ||
41 | }, | ||
42 | |||
43 | handleEvent: { | ||
44 | value: function(event){ | ||
45 | event.preventDefault(); | ||
46 | event.stopImmediatePropagation(); | ||
47 | |||
48 | switch(event.type) { | ||
49 | case "dragover": | ||
50 | return false; | ||
51 | case "dragend": | ||
52 | return false; | ||
53 | case "drop": | ||
54 | this.handleDropEvent(event); | ||
55 | break; | ||
56 | default: | ||
57 | console.log("Default"); | ||
58 | break; | ||
59 | } | ||
60 | } | ||
61 | }, | ||
62 | |||
63 | handleDropEvent: { | ||
64 | value: function(evt){ | ||
65 | var xferString, component; | ||
66 | |||
67 | this.baseX = evt.offsetX - this.application.ninja.stage.userContentLeft; | ||
68 | this.baseY = evt.offsetY - this.application.ninja.stage.userContentTop; | ||
69 | |||
70 | xferString = evt.dataTransfer.getData("text/plain"); | ||
71 | if(xferString) { | ||
72 | |||
73 | if(xferString.lastIndexOf("-Component") !== -1) { | ||
74 | component = xferString.substring(0, xferString.lastIndexOf("-Component")); | ||
75 | NJevent( "executeAddComponent", { "component": component, "dropX": this.baseX, "dropY": this.baseY }); | ||
76 | // ComponentPanelModule.ComponentsPanelBase.addComponentToStage(componentStr.substring(0, compInd), this.baseX, this.baseY); | ||
77 | } | ||
78 | return; | ||
79 | } | ||
80 | |||
81 | // Verify that browser supports FileReader API. | ||
82 | if (typeof(window.FileReader) === "undefined") { | ||
83 | alert("File API and FileReader APIs are not supported."); | ||
84 | // Exit function since there isn't anything else we can do. | ||
85 | return; | ||
86 | } | ||
87 | |||
88 | var file; | ||
89 | const files = evt.dataTransfer.files; | ||
90 | var idx; | ||
91 | const len = files.length; | ||
92 | |||
93 | |||
94 | // Loop over all dragged files... | ||
95 | for (idx = 0; idx < len; idx++) { | ||
96 | file = files[idx]; | ||
97 | // Only do anything if the current file is an image (or has an image mime-type. | ||
98 | if (file.type.match("^image/")) { | ||
99 | var reader = new FileReader(); | ||
100 | // Create a LoadHandler to access each outer file var | ||
101 | reader.onload = this.createLoadHandler(file, this.baseX, this.baseY); | ||
102 | |||
103 | if(file.type.match("^image/svg\\+xml")) {// this is SVG | ||
104 | reader.readAsText(file); | ||
105 | } else{ | ||
106 | reader.readAsDataURL(file); | ||
107 | } | ||
108 | |||
109 | } | ||
110 | } | ||
111 | |||
112 | return false; | ||
113 | } | ||
114 | }, | ||
115 | |||
116 | createLoadHandler: { | ||
117 | value: function(file, baseX, baseY) { | ||
118 | return function(evt2) { | ||
119 | var domElem = null; | ||
120 | |||
121 | if(file.type.match("^image/svg\\+xml")){ // this is an SVG file | ||
122 | var tempElem = document.createElement("div"); | ||
123 | tempElem.innerHTML = evt2.currentTarget.result; | ||
124 | domElem = tempElem.children[0]; | ||
125 | |||
126 | NJUtils.makeElementModel(domElem, "SVG", "block"); | ||
127 | } else { // treat as a regular image | ||
128 | domElem = NJUtils.makeNJElement("image", "Image", "block"); | ||
129 | domElem.src = evt2.currentTarget.result; | ||
130 | } | ||
131 | |||
132 | |||
133 | // Not sure we need an ID for the image | ||
134 | /* | ||
135 | // Use the Image filename if valid for the id | ||
136 | var filename = file.fileName.substr(0, file.fileName.lastIndexOf('.')) || file.fileName; | ||
137 | filename = filename.replace(/ /g,"_"); | ||
138 | |||
139 | |||
140 | if(this.isValidFilename(filename)) { | ||
141 | //domElem.id = filename; | ||
142 | } else { | ||
143 | //domElem.id = DocumentControllerModule.DocumentController.CreateElementID(img.tagName); | ||
144 | } | ||
145 | */ | ||
146 | |||
147 | var rules = { | ||
148 | 'position': 'absolute', | ||
149 | 'top' : baseY + 'px', | ||
150 | 'left' : baseX + 'px', | ||
151 | '-webkit-transform-style' : 'preserve-3d', | ||
152 | '-webkit-transform' : 'perspective(1400) matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1)' | ||
153 | }; | ||
154 | |||
155 | NJevent("elementAdding", {el: domElem, data:rules}); | ||
156 | }; | ||
157 | } | ||
158 | }, | ||
159 | |||
160 | isValidFilename: { | ||
161 | value: function(id){ | ||
162 | if(id && id !== "") { | ||
163 | var regexID = /^([a-zA-Z])+([a-zA-Z0-9_\.\:\-])+/; | ||
164 | return(regexID.test(id)) | ||
165 | } else { | ||
166 | return false; | ||
167 | } | ||
168 | } | ||
169 | } | ||
170 | |||
171 | |||
172 | }); | ||
diff --git a/js/mediators/element-mediator.js b/js/mediators/element-mediator.js new file mode 100644 index 00000000..91b09475 --- /dev/null +++ b/js/mediators/element-mediator.js | |||
@@ -0,0 +1,677 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage, | ||
8 | NJComponent = require("js/lib/nj-base").NJComponent; | ||
9 | |||
10 | var ElementController = require("js/controllers/elements/element-controller").ElementController, | ||
11 | Command = require("js/controllers/undo-controller").Command, | ||
12 | GroupCommand = require("js/controllers/undo-controller").GroupCommand, | ||
13 | NJUtils = require("js/lib/NJUtils").NJUtils; | ||
14 | |||
15 | exports.ElementMediator = Montage.create(NJComponent, { | ||
16 | |||
17 | deleteDelegate: { | ||
18 | value: null | ||
19 | }, | ||
20 | |||
21 | deserializedFromTemplate: { | ||
22 | value: function () { | ||
23 | this.eventManager.addEventListener("elementAdding", this, false); | ||
24 | this.eventManager.addEventListener("deleting", this, false); | ||
25 | } | ||
26 | }, | ||
27 | |||
28 | // TODO use the specific controller to be able to subclass the functionality | ||
29 | handleElementAdding: { | ||
30 | value: function(event) { | ||
31 | /* | ||
32 | var cmd = ElementControllerCommands.addElementCommand(event.detail.el, event.detail.data); | ||
33 | NJevent("sendToUndo", cmd); | ||
34 | cmd.execute(); | ||
35 | */ | ||
36 | this.addElement(event.detail.el, event.detail.data); | ||
37 | |||
38 | } | ||
39 | }, | ||
40 | |||
41 | handleDeleting: { | ||
42 | value: function(event) { | ||
43 | if(this.deleteDelegate && (typeof this.deleteDelegate.handleDelete === 'function')) { | ||
44 | this.deleteDelegate.handleDelete(); | ||
45 | } else { | ||
46 | // Add the Undo/Redo | ||
47 | var els = []; | ||
48 | |||
49 | if(this.application.ninja.selectedElements.length > 0) { | ||
50 | for(var i=0, item; item = this.application.ninja.selectedElements[i]; i++) { | ||
51 | ElementController.removeElement(item._element); | ||
52 | els.push(item._element); | ||
53 | } | ||
54 | |||
55 | NJevent( "deleteSelection", els ); | ||
56 | } | ||
57 | } | ||
58 | } | ||
59 | }, | ||