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>

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 @@
+/* <copyright>
+ This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
+ No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
+ (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
+ </copyright> */
+var Montage = require("montage").Montage;
+var Component = require("ui/component").Component;
+var dom = require("ui/dom");
+var Point = require("core/geometry/point").Point;
+var Effect = require("effect/effect").Effect;
+
+var DesaturateEffect = require("effect/desaturate-effect").DesaturateEffect;
+var InvertEffect = require("effect/invert-effect").InvertEffect;
+var SepiaEffect = require("effect/sepia-effect").SepiaEffect;
+var MultiplyEffect = require("effect/multiply-effect").MultiplyEffect;
+
+exports.PhotoEditor = Montage.create(Component, {
+
+    __image: {
+        enumerable: false,
+        value: null
+    },
+
+    _image: {
+        enumerable: false,
+        get: function() {
+            return this.__image;
+        },
+        set: function(value) {
+
+            if (this.__image === value) {
+                return;
+            }
+
+            if (this.__image) {
+                this.__image.element.removeEventListener("load", this, false);
+            }
+
+            this.__image = value;
+            this.__image.element.identifier = "editorImage";
+
+            if (this.__image) {
+                this.__image.element.addEventListener("load", this, false);
+            }
+
+        }
+    },
+
+    _canvas: {
+        enumerable: false,
+        value: null
+    },
+
+    _pointerIdentifier: {
+        enumerable: false,
+        value: null
+    },
+
+    prepareForActivationEvents: {
+        value: function() {
+            if (window.Touch) {
+                this._canvas.addEventListener("touchstart", this, false);
+            } else {
+                this._canvas.addEventListener("mousedown", this, false);
+            }
+        }
+    },
+
+    handleMousedown: {
+        value: function(event) {
+            event.preventDefault();
+            this._pointerIdentifier = "mouse";
+            this._canvas.addEventListener("mousemove", this, false);
+            document.addEventListener("mouseup", this, false);
+
+            this._pickColor(event.clientX, event.clientY);
+
+            this.needsDraw = true;
+        }
+    },
+
+    handleTouchstart: {
+        value: function(event) {
+
+            if (this._pointerIdentifier) {
+                return;
+            }
+
+            event.preventDefault();
+
+            var pickTouch = event.changedTouches[0];
+            this._pointerIdentifier = pickTouch.identifier;
+            this._canvas.addEventListener("touchmove", this, false);
+            document.addEventListener("touchend", this, false);
+            document.addEventListener("touchcancel", this, false);
+
+            this._pickColor(pickTouch.clientX, pickTouch.clientY);
+        }
+    },
+
+    handleMouseup: {
+        value: function() {
+            this._pointerIdentifier = null;
+            this._canvas.removeEventListener("mousemove", this, false);
+            document.removeEventListener("mouseup", this, false);
+
+            var colorPickEvent = document.createEvent("CustomEvent");
+            colorPickEvent.initCustomEvent("colorpickend", true, true, null);
+            document.application.dispatchEvent(colorPickEvent);
+
+            this.needsDraw = true;
+        }
+    },
+
+    handleMousemove: {
+        enumerable: false,
+        value: function(event) {
+
+            if (!this._pointerIdentifier) {
+                return;
+            }
+
+            this._pickColor(event.clientX, event.clientY);
+        }
+    },
+
+    handleTouchmove: {
+        enumerable: false,
+        value: function(event) {
+
+            var i = 0,
+                iTouch,
+                foundTouch = null
+
+            for(; (iTouch = event.changedTouches[i]); i++) {
+                if (iTouch.identifier === this._pointerIdentifier) {
+                    foundTouch = iTouch;
+                    break;
+                }
+            }
+
+            if (!foundTouch) {
+                return;
+            }
+
+            this._pickColor(foundTouch.clientX, foundTouch.clientY);
+        }
+    },
+
+    handleTouchend: {
+        value: function() {
+            var i = 0,
+                iTouch,
+                foundTouch = null
+
+            for(; (iTouch = event.changedTouches[i]); i++) {
+                if (iTouch.identifier === this._pointerIdentifier) {
+                    foundTouch = iTouch;
+                    break;
+                }
+            }
+
+            if (!foundTouch) {
+                return;
+            }
+
+            this._pointerIdentifier = null;
+            var colorPickEvent = document.createEvent("CustomEvent");
+            colorPickEvent.initCustomEvent("colorpickend", true, true, null);
+            document.application.dispatchEvent(colorPickEvent);
+        }
+    },
+
+    _pickColor: {
+        value: function(x, y) {
+            var gridExtent = 20,
+                halfGridExtent = 10,
+                canvas = this._canvas,
+                context = canvas.getContext('2d'),
+                canvasPoint = dom.convertPointFromPageToNode(canvas, Point.create().init(x, y)),
+                pickedPixel = context.getImageData(canvasPoint.x, canvasPoint.y, 1, 1),
+                focusGrid = context.getImageData(canvasPoint.x - halfGridExtent, canvasPoint.y - halfGridExtent, gridExtent, gridExtent),
+                colorPickEvent;
+
+            colorPickEvent = document.createEvent("CustomEvent");
+            colorPickEvent.initCustomEvent("colorpick", true, true, null);
+            colorPickEvent.color = pickedPixel.data;
+            colorPickEvent.focusGrid = focusGrid;
+            colorPickEvent.clientX = x;
+            colorPickEvent.clientY = y;
+            colorPickEvent.canvasX = canvasPoint.x;
+            colorPickEvent.canvasY = canvasPoint.y;
+
+            document.application.dispatchEvent(colorPickEvent);
+        }
+    },
+
+    _src: {
+        enumerable: false,
+        value: null
+    },
+
+    src: {
+        enumerable: false,
+        get: function() {