aboutsummaryrefslogtreecommitdiff
path: root/js/mediators/drag-drop-mediator.js
diff options
context:
space:
mode:
authorPierre Frisch2011-12-22 07:25:50 -0800
committerValerio Virgillito2012-01-27 11:18:17 -0800
commitb89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch)
tree0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /js/mediators/drag-drop-mediator.js
parent2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff)
downloadninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'js/mediators/drag-drop-mediator.js')
-rw-r--r--js/mediators/drag-drop-mediator.js172
1 files changed, 172 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
7var Montage = require("montage/core/core").Montage,
8 Component = require("montage/ui/component").Component,
9 NJUtils = require("js/lib/NJUtils").NJUtils;
10
11exports.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});