aboutsummaryrefslogtreecommitdiff
path: root/node_modules/ninja-components/photo-editor.reel/photo-editor.js
diff options
context:
space:
mode:
authorValerio Virgillito2012-02-14 11:22:21 -0800
committerValerio Virgillito2012-02-14 11:22:21 -0800
commitab1466b2627e40f58afcaa3d425d4145fa47525a (patch)
tree5c0de8b4db67b07b0e745e776e99eabff989d804 /node_modules/ninja-components/photo-editor.reel/photo-editor.js
parent33c805d441abb2f83fd1ac9ee2d3d4282acc009f (diff)
parentdf898049b2990f456a305eb18434b887468225cf (diff)
downloadninja-ab1466b2627e40f58afcaa3d425d4145fa47525a.tar.gz
Merge branch 'components' of https://github.com/mencio/ninja-internal into integration
Conflicts: js/io/document/html-document.js Signed-off-by: Valerio Virgillito <valerio@motorola.com>
Diffstat (limited to 'node_modules/ninja-components/photo-editor.reel/photo-editor.js')
-rwxr-xr-xnode_modules/ninja-components/photo-editor.reel/photo-editor.js415
1 files changed, 415 insertions, 0 deletions
diff --git a/node_modules/ninja-components/photo-editor.reel/photo-editor.js b/node_modules/ninja-components/photo-editor.reel/photo-editor.js
new file mode 100755
index 00000000..afead518
--- /dev/null
+++ b/node_modules/ninja-components/photo-editor.reel/photo-editor.js
@@ -0,0 +1,415 @@
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> */
6var Montage = require("montage").Montage;
7var Component = require("ui/component").Component;
8var dom = require("ui/dom");
9var Point = require("core/geometry/point").Point;
10var Effect = require("effect/effect").Effect;
11
12var DesaturateEffect = require("effect/desaturate-effect").DesaturateEffect;
13var InvertEffect = require("effect/invert-effect").InvertEffect;
14var SepiaEffect = require("effect/sepia-effect").SepiaEffect;
15var MultiplyEffect = require("effect/multiply-effect").MultiplyEffect;
16
17exports.PhotoEditor = Montage.create(Component, {
18
19 __image: {
20 enumerable: false,
21 value: null
22 },
23
24 _image: {
25 enumerable: false,
26 get: function() {
27 return this.__image;
28 },
29 set: function(value) {
30
31 if (this.__image === value) {
32 return;
33 }
34
35 if (this.__image) {
36 this.__image.element.removeEventListener("load", this, false);
37 }
38
39 this.__image = value;
40 this.__image.element.identifier = "editorImage";
41
42 if (this.__image) {
43 this.__image.element.addEventListener("load", this, false);
44 }
45
46 }
47 },
48
49 _canvas: {
50 enumerable: false,
51 value: null
52 },
53
54 _pointerIdentifier: {
55 enumerable: false,
56 value: null
57 },
58
59 prepareForActivationEvents: {
60 value: function() {
61 if (window.Touch) {
62 this._canvas.addEventListener("touchstart", this, false);
63 } else {
64 this._canvas.addEventListener("mousedown", this, false);
65 }
66 }
67 },
68
69 handleMousedown: {
70 value: function(event) {
71 event.preventDefault();
72 this._pointerIdentifier = "mouse";
73 this._canvas.addEventListener("mousemove", this, false);
74 document.addEventListener("mouseup", this, false);
75
76 this._pickColor(event.clientX, event.clientY);
77
78 this.needsDraw = true;
79 }
80 },
81
82 handleTouchstart: {
83 value: function(event) {
84
85 if (this._pointerIdentifier) {
86 return;
87 }
88
89 event.preventDefault();
90
91 var pickTouch = event.changedTouches[0];
92 this._pointerIdentifier = pickTouch.identifier;
93 this._canvas.addEventListener("touchmove", this, false);
94 document.addEventListener("touchend", this, false);
95 document.addEventListener("touchcancel", this, false);
96
97 this._pickColor(pickTouch.clientX, pickTouch.clientY);
98 }
99 },
100
101 handleMouseup: {
102 value: function() {
103 this._pointerIdentifier = null;
104 this._canvas.removeEventListener("mousemove", this, false);
105 document.removeEventListener("mouseup", this, false);
106
107 var colorPickEvent = document.createEvent("CustomEvent");
108 colorPickEvent.initCustomEvent("colorpickend", true, true, null);
109 document.application.dispatchEvent(colorPickEvent);
110
111 this.needsDraw = true;
112 }
113 },
114
115 handleMousemove: {
116 enumerable: false,
117 value: function(event) {
118
119 if (!this._pointerIdentifier) {
120 return;
121 }
122
123 this._pickColor(event.clientX, event.clientY);
124 }
125 },
126
127 handleTouchmove: {
128 enumerable: false,
129 value: function(event) {
130
131 var i = 0,
132 iTouch,
133 foundTouch = null
134
135 for(; (iTouch = event.changedTouches[i]); i++) {
136 if (iTouch.identifier === this._pointerIdentifier) {
137 foundTouch = iTouch;
138 break;
139 }
140 }
141
142 if (!foundTouch) {
143 return;
144 }
145
146 this._pickColor(foundTouch.clientX, foundTouch.clientY);
147 }
148 },
149
150 handleTouchend: {
151 value: function() {
152 var i = 0,
153 iTouch,
154 foundTouch = null
155
156 for(; (iTouch = event.changedTouches[i]); i++) {
157 if (iTouch.identifier === this._pointerIdentifier) {
158 foundTouch = iTouch;
159 break;
160 }
161 }
162
163 if (!foundTouch) {
164 return;
165 }
166
167 this._pointerIdentifier = null;
168 var colorPickEvent = document.createEvent("CustomEvent");
169 colorPickEvent.initCustomEvent("colorpickend", true, true, null);
170 document.application.dispatchEvent(colorPickEvent);
171 }
172 },
173
174 _pickColor: {
175 value: function(x, y) {
176 var gridExtent = 20,
177 halfGridExtent = 10,
178 canvas = this._canvas,
179 context = canvas.getContext('2d'),
180 canvasPoint = dom.convertPointFromPageToNode(canvas, Point.create().init(x, y)),
181 pickedPixel = context.getImageData(canvasPoint.x, canvasPoint.y, 1, 1),
182 focusGrid = context.getImageData(canvasPoint.x - halfGridExtent, canvasPoint.y - halfGridExtent, gridExtent, gridExtent),
183 colorPickEvent;
184
185 colorPickEvent = document.createEvent("CustomEvent");
186 colorPickEvent.initCustomEvent("colorpick", true, true, null);
187 colorPickEvent.color = pickedPixel.data;
188 colorPickEvent.focusGrid = focusGrid;
189 colorPickEvent.clientX = x;
190 colorPickEvent.clientY = y;
191 colorPickEvent.canvasX = canvasPoint.x;
192 colorPickEvent.canvasY = canvasPoint.y;
193
194 document.application.dispatchEvent(colorPickEvent);
195 }
196 },
197
198 _src: {
199 enumerable: false,
200 value: null
201 },
202
203 src: {
204 enumerable: false,
205 get: function() {