From a3024011a91d3941f81481dd4d600e9684eb0fd4 Mon Sep 17 00:00:00 2001
From: Valerio Virgillito
Date: Thu, 2 Feb 2012 00:11:51 -0800
Subject: upgrading to Montage v0.6

Signed-off-by: Valerio Virgillito <valerio@motorola.com>
---
 .../montage/ui/bluemoon/slider.reel/slider.css     | 255 +++++++++
 .../montage/ui/bluemoon/slider.reel/slider.html    |  82 +++
 .../montage/ui/bluemoon/slider.reel/slider.js      | 583 +++++++++++++++++++++
 3 files changed, 920 insertions(+)
 create mode 100644 node_modules/montage/ui/bluemoon/slider.reel/slider.css
 create mode 100644 node_modules/montage/ui/bluemoon/slider.reel/slider.html
 create mode 100644 node_modules/montage/ui/bluemoon/slider.reel/slider.js

(limited to 'node_modules/montage/ui/bluemoon/slider.reel')

diff --git a/node_modules/montage/ui/bluemoon/slider.reel/slider.css b/node_modules/montage/ui/bluemoon/slider.reel/slider.css
new file mode 100644
index 00000000..6a11d11c
--- /dev/null
+++ b/node_modules/montage/ui/bluemoon/slider.reel/slider.css
@@ -0,0 +1,255 @@
+/* <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> */
+
+.montage-slider {
+    padding: 16px 17px 16px 18px;
+    overflow: hidden;
+}
+
+.montage-slider > div {
+    position: relative;
+    width: auto;
+    height: 23px;
+}
+
+.montage-slider .handlerbg,
+.montage-slider .handler,
+.montage-slider .handler2,
+.montage-slider .handler3,
+.montage-slider .handler4,
+.montage-slider .handlerDragArea {
+    left: 0;
+    right: 20px;
+    position: absolute;
+}
+
+.montage-slider .bghl {
+    position: absolute;
+    margin-top: 7px;
+    border-radius: 5px;
+    width: 100%;
+    height: 9px;
+    background: transparent;
+    -webkit-box-shadow: 0 1px rgba(255,255,255,.4), 0 -1px rgba(0,0,0,.1);
+}
+
+.montage-slider .bg {
+    position: absolute;
+    margin-top: 7px;
+    border-radius: 5px;
+    width: 100%;
+    height: 9px;
+    background: rgba(160,160,160,.4);
+    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.3);
+}
+
+.montage-slider .handlerbg div {
+    position: absolute;
+    margin-left: -17px;
+    margin-top: -15px;
+    border-radius: 27px;
+    width: 53px;
+    height: 53px;
+    background: rgba(128,128,128,.4);
+    -webkit-box-shadow: 0 1px rgba(255,255,255,.4), 0 -1px rgba(0,0,0,.1);
+    -webkit-transform: scale3d(.433962263, .433962263, 1);
+}
+
+.montage-slider .handler div {
+    position: absolute;
+    margin-left: -16px;
+    margin-top: -14px;
+    border-radius: 26px;
+    width: 51px;
+    height: 51px;
+    background: -webkit-gradient(linear, left top, left bottom, from(#FEFEFE), to(#E6E6E6));
+    -webkit-transform: scale3d(.411764705, .411764705, 1);
+}
+
+.montage-slider .crop {
+    position: absolute;
+    left: 5px;
+    right: 5px;
+    margin-top: 8px;
+    height: 7px;
+    overflow: hidden;
+}
+
+.montage-slider .line {
+    position: absolute;
+    margin-left: -100%;
+    width: 100%;
+    height: 7px;
+    background: -webkit-gradient(linear, left top, left bottom, from(#F8F8F8), to(#EFEFEF));
+}
+
+.montage-slider .scale {
+    position: absolute;
+    margin-left: 10000px;
+    width: 1px;
+    height: 1px;
+    visibility: hidden;
+}
+
+.montage-slider .line3 {
+    position: absolute;
+    margin-left: 1px;
+    margin-top: 8px;
+    border-radius: 4px;
+    width: 7px;
+    height: 7px;
+    background: -webkit-gradient(linear, left top, left bottom, from(#F8F8F8), to(#EFEFEF));
+}
+
+.montage-slider .line2 {
+    position: absolute;
+    margin-left: -100%;
+    margin-top: 2px;
+    width: 100%;
+    height: 3px;
+    background: -webkit-gradient(linear, left top, left bottom, from(#35C9FF), to(#0A9BCF));
+}
+
+.montage-slider .line4 {
+    position: absolute;
+    margin-left: 3px;
+    margin-top: 10px;
+    border-radius: 2px;
+    width: 3px;
+    height: 3px;
+    background: -webkit-gradient(linear, left top, left bottom, from(#35C9FF), to(#0A9BCF));
+}
+
+.montage-slider .handler2 div {
+    position: absolute;
+    margin-left: -2px;
+    border-radius: 12px;
+    width: 23px;
+    height: 23px;
+    background: #878787;
+    -webkit-transform: scale3d(.565217391, .565217391, 1);
+}
+
+.montage-slider .handler3 div {
+    position: absolute;
+    margin-left: -1px;
+    margin-top: 1px;
+    border-radius: 11px;
+    width: 21px;
+    height: 21px;
+    background: -webkit-gradient(linear, left top, left bottom, from(#14BCFA), to(#0AA4DC));
+    -webkit-transform: scale3d(.523809523, .523809523, 1);
+}
+
+.montage-slider .handler4 div {
+    position: absolute;
+    margin-left: 5px;
+    margin-top: 7px;
+    border-radius: 5px;
+    width: 9px;
+    height: 9px;
+    background: #07739A;
+    -webkit-box-shadow: inset 0 2px 1px #05506B;
+    -webkit-transform: scale3d(.555555555, .555555555, 1);
+}
+
+.montage-slider .handlerDragArea div {
+    position: absolute;
+    margin-left: -17px;
+    margin-top: -15px;
+    border-radius: 27px;
+    width: 53px;
+    height: 53px;
+}
+
+.montage-slider.pressed .handlerbg div {
+    -webkit-transform: scale3d(1, 1, 1);
+}
+
+.montage-slider.pressed .handler div {
+    background: -webkit-gradient(linear, left top, left bottom, from(#e5e5e5), to(#ffffff));
+    -webkit-transform: scale3d(1, 1, 1);
+}
+
+.montage-slider.pressed .handler2 div {
+    -webkit-transform: scale3d(1, 1, 1);
+}
+
+.montage-slider.pressed .handler3 div {
+    -webkit-transform: scale3d(1, 1, 1);
+}
+
+.montage-slider.pressed .handler4 div {
+    -webkit-transform: scale3d(1, 1, 1);
+}
+
+.montage-slider.pressed .line {
+    background: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#f3f3f3));
+}
+
+.montage-slider.dark .bghl {
+    background: transparent;
+    -webkit-box-shadow: 0 1px rgba(255,255,255,.2), 0 -1px rgba(0,0,0,.1);
+}
+
+.montage-slider.dark .bg {
+    background: -webkit-gradient(linear, left top, left bottom, from(rgba(40,40,40,.6)), to(rgba(40,40,40,.5)));
+    -webkit-box-shadow: none;
+}
+
+.montage-slider.dark .handlerbg div {
+    background: -webkit-gradient(linear, left top, left bottom, from(rgba(40,40,40,.7)), to(rgba(40,40,40,.6)));
+    -webkit-box-shadow: 0 1px rgba(255,255,255,.2), 0 -1px rgba(0,0,0,.1);
+}
+
+.montage-slider.dark .handler div {
+    background: -webkit-gradient(linear, left top, left bottom, from(#757575), to(#5c5c5c));
+}
+
+.montage-slider.dark .line {
+    background: -webkit-gradient(linear, left top, left bottom, from(#6f6f6f), to(#656565));
+}
+
+.montage-slider.dark .line2 {
+    background: -webkit-gradient(linear, left top, left bottom, from(#35C9FF), to(#0A9BCF));
+}
+
+.montage-slider.dark .line3 {
+    background: -webkit-gradient(linear, left top, left bottom, from(#6f6f6f), to(#656565));
+}
+
+.montage-slider.dark .line4 {
+    background: -webkit-gradient(linear, left top, left bottom, from(#35C9FF), to(#0A9BCF));
+}
+
+.montage-slider.dark .handler2 div {
+    background: #383838;
+}
+
+.montage-slider.dark .handler3 div {
+    background: -webkit-gradient(linear, left top, left bottom, from(#12BBF8), to(#0AA4DC));
+}
+
+.montage-slider.dark .handler4 div {
+    background: #07739A;
+    -webkit-box-shadow: inset 0 2px 1px #05506B;
+}
+
+.montage-slider.dark.pressed .handler div {
+    background: -webkit-gradient(linear, left top, left bottom, from(#5c5c5c), to(#757575));
+}
+
+.montage-slider.dark.pressed .handler2 div {
+    background: #2f2f2f;
+}
+
+.montage-slider.dark.pressed .handler3 div {
+    background: -webkit-gradient(linear, left top, left bottom, from(#10bcfc), to(#0AA2DA));
+}
+
+.montage-slider.dark.pressed .line {
+    background: -webkit-gradient(linear, left top, left bottom, from(#666666), to(#6a6a6a));
+}
diff --git a/node_modules/montage/ui/bluemoon/slider.reel/slider.html b/node_modules/montage/ui/bluemoon/slider.reel/slider.html
new file mode 100644
index 00000000..b4279a49
--- /dev/null
+++ b/node_modules/montage/ui/bluemoon/slider.reel/slider.html
@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<!-- <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> -->
+<html>
+<head>
+    <title></title>
+    <link rel="stylesheet" type="text/css" href="slider.css">
+    <script type="text/montage-serialization">
+{
+    "owner": {
+        "module": "montage/ui/bluemoon/slider.reel",
+        "name": "Slider",
+        "properties": {
+            "element": {
+                "#": "slider"
+            },
+            "_bghl": {
+                "#": "bghl"
+            },
+            "_handlerbg": {
+                "#": "handlerbg"
+            },
+            "_bg": {
+                "#": "bg"
+            },
+            "_handler": {
+                "#": "handler"
+            },
+            "_line": {
+                "#": "line"
+            },
+            "_scale": {
+                "#": "scale"
+            },
+            "_line2": {
+                "#": "line2"
+            },
+            "_handler2": {
+                "#": "handler2"
+            },
+            "_handler3": {
+                "#": "handler3"
+            },
+            "_handler4": {
+                "#": "handler4"
+            },
+            "_handlerDragArea": {
+                "#": "handlerDragArea"
+            }
+        }
+    }
+}
+    </script>
+
+</head>
+<body>
+    <div id="slider" class="montage-slider">
+        <div>
+            <div id="bghl" class="bghl"></div>
+            <div id="handlerbg" class="handlerbg"><div></div></div>
+            <div id="bg" class="bg"></div>
+            <div id="handler" class="handler"><div></div></div>
+            <div id="crop" class="crop">
+                <div id="line" class="line"></div>
+                <div id="scale" class="scale"></div>
+            </div>
+            <div id="line3" class="line3"></div>
+            <div id="crop" class="crop">
+                <div id="line2" class="line2"></div>
+            </div>
+            <div id="line4" class="line4"></div>
+            <div id="handler2" class="handler2"><div></div></div>
+            <div id="handler3" class="handler3"><div></div></div>
+            <div id="handler4" class="handler4"><div></div></div>
+            <div id="handlerDragArea" class="handlerDragArea"><div></div></div>
+        </div>
+    </div>
+</body>
+</html>
diff --git a/node_modules/montage/ui/bluemoon/slider.reel/slider.js b/node_modules/montage/ui/bluemoon/slider.reel/slider.js
new file mode 100644
index 00000000..56c4faa8
--- /dev/null
+++ b/node_modules/montage/ui/bluemoon/slider.reel/slider.js
@@ -0,0 +1,583 @@
+/* <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> */
+/**
+	@module "montage/ui/bluemoon/slider.reel"
+    @requires montage/core/core
+    @requires montage/ui/component
+*/
+var Montage = require("montage").Montage,
+    Component = require("ui/component").Component,
+    dom = require("ui/dom"),
+    Point = require("core/geometry/point").Point;
+
+/**
+ @class module:"montage/ui/bluemoon/slider.reel".Slider
+ @extends module:montage/ui/component.Component
+ */
+exports.Slider = Montage.create(Component,/** @lends module:"montage/ui/bluemoon/slider.reel".Slider# */ {
+    // Extra elements for rendering
+/**
+  Description TODO
+  @private
+*/
+    _bghl: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _handlerbg: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _bg: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _handler: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _line: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _scale: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _line2: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _handler2: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _handler3: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _handler4: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _handlerDragArea: {
+        enumerable: false,
+        value: null
+    },
+    // Slider properties
+/**
+  Description TODO
+  @private
+*/
+    _isDragging: {
+        enumerable: true,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _cursorPosition: {
+        enumerable: false,
+        value: null
+    },
+/**
+  Description TODO
+  @private
+*/
+    _width: {
+        enumerable: false,
+        value: 0
+    },
+/**
+  Description TODO
+  @private
+*/
+    _minValue: {
+        enumerable: false,
+        value: 0
+    },
+/**
+  Description TODO
+  @private
+*/
+    _hasTapBarToScroll: {
+        enumerable: false,
+        value: false
+    },
+/**
+        Description TODO
+        @type {Function}
+        @default {Boolean} false
+    */
+    hasTapBarToScroll: {
+        get: function () {
+            return this._hasTapBarToScroll;
+        },
+        set: function (value) {
+            this._hasTapBarToScroll = !!value;
+        }
+    },
+/**
+  Description TODO
+  @private
+*/
+    _hasClickBarToScroll: {
+        enumerable: false,
+        value: true
+    },
+/**
+        Description TODO
+        @type {Function}
+        @default {Boolean} true
+    */
+    hasClickBarToScroll: {
+        get: function () {
+            return this._hasClickBarToScroll;
+        },
+        set: function (value) {
+            this._hasClickBarToScroll = !!value;
+            if (this._hasClickBarToScroll) {
+                this.element.addEventListener("mousedown", this, false);
+            } else {
+                this.element.removeEventListener("mousedown", this, false);
+            }
+        }
+    },
+/**
+        Description TODO
+        @type {Function}
+        @default {Number} 0
+    */
+    minValue: {
+        serializable: true,
+        get: function () {
+            return this._minValue;
+        },
+        set: function (value) {
+            if (value !== this._minValue) {
+                this._minValue = value;
+                this._valueRange = null;
+                this.needsDraw = true;
+            }
+        }
+    },
+/**
+  Description TODO
+  @private
+*/
+    _maxValue: {
+        enumerable: false,
+        value: 100
+    },
+
+/**
+        Description TODO
+        @type {Function}
+        @default {Number} 100
+    */
+    maxValue: {
+        serializable: true,
+        get: function () {
+            return this._maxValue;
+        },
+        set: function (value) {
+            if (value !== this._maxValue) {
+                this._maxValue = value;
+                this._valueRange = null;
+                this.needsDraw = true;
+            }
+        }
+    },
+/**
+  Description TODO
+  @private
+*/
+    _valueRange: {
+        enumerable: false,
+        value: undefined
+    },
+ /**
+        Description TODO
+        @type {Function}
+        @default undefined
+    */
+    valueRange: {
+        enumerable: false,
+        get: function () {
+            if (!this._valueRange) {
+                this._valueRange = this._maxValue - this._minValue;
+            }
+            return this._valueRange;
+        }
+    },
+/**
+  Description TODO
+  @private
+*/
+    _value: {
+        enumerable: false,
+        value: 0
+    },
+/**
+  Description TODO
+  @private
+*/
+    _observedPointer: {
+        enumerable: false,
+        value: null
+    },
+/**
+        Description TODO
+        @type {Function}
+        @default {Number} 0
+    */
+    value: {
+        enumerable: true,
+        serializable: true,
+        get: function () {
+            if (this._value < this._minValue) {
+                return this._minValue;
+            } else if (this._value > this._maxValue) {
+                return this._maxValue;
+            }
+            return this._value;
+        },
+        set: function (value) {
+            if (!isNaN(value)) {
+                if (value !== this._value) {
+                    this._value = parseFloat(value);
+                    this.needsDraw = true;
+                }
+            }
+        }
+    },
+/**
+  Description TODO
+  @private
+*/
+    _pressed: {
+        enumerable: false,
+        value: false
+    },
+/**
+  Description TODO
+  @private
+*/
+    _scrollTo: {
+        enumerable: false,
+        value: null
+    },
+/**
+    Description TODO
+    @function
+    @param {Event} event TODO
+    */
+    handleTouchstart: {
+        value: function (event) {
+            this._pressedEnd = false;
+            this._pressedStart = true;
+            if (event.target === this._handlerDragArea.firstChild) {
+
+                this._observePointer(event.targetTouches[0].identifier);
+                if (this._value < this._minValue) {
+                    this._value = this._minValue;
+                } else if (this._value > this._maxValue) {
+                    this._value = this._maxValue;
+                }
+                document.addEventListener("touchmove", this, false);
+                document.addEventListener("touchend", this, false);
+                this._cursorPosition = event.targetTouches[0].clientX;
+                event.preventDefault();
+                event.stopPropagation();
+                this.needsDraw = true;
+            } else {
+                var zero = new WebKitPoint(0, 0), scale, elemPos;
+
+                this._observePointer(event.targetTouches[0].identifier);
+                scale = (dom.convertPointFromNodeToPage(this._scale, zero).x - dom.convertPointFromNodeToPage(this._scale.parentNode, zero).x) / 10000;
+                elemPos = dom.convertPointFromNodeToPage(this.element, zero);
+                var x = event.targetTouches[0].pageX - Math.ceil(elemPos.x / scale),
+                    y = event.targetTouches[0].pageY - Math.ceil(elemPos.y / scale);
+
+                if ((y >= 12) && (y < 45) && (x >= 19) && (x < this._width + 39)) {
+                    this._scrollTo = (x - 28) * this.valueRange;
+                    document.addEventListener("touchmove", this, false);
+                    document.addEventListener("touchend", this, false);
+                    this._cursorPosition = event.targetTouches[0].clientX;
+                    event.preventDefault();
+                    event.stopPropagation();
+                    this.needsDraw = true;
+                }
+            }
+        }
+    },
+/**
+    Description TODO
+    @function
+    @param {Event} event TODO
+    */
+    handleTouchmove: {
+        value: function (event) {
+            var i = 0, changedTouches = event.changedTouches, length = changedTouches.length;
+
+            while ((i < length) && (changedTouches[i].identifier !== this._observedPointer)) {
+                i++;
+            }
+            if (i < length) {
+                this.value = this._value + ((changedTouches[i].clientX - this._cursorPosition) * (this.valueRange)) / this._width;
+                this._cursorPosition = changedTouches[i].clientX;
+                event.preventDefault();
+                this.needsDraw = true;
+            }
+            this._pressedStart = false;
+        }
+    },
+/**
+    Description TODO
+    @function
+    */
+    handleTouchend: {
+        value: function () {
+            var i = 0, length = event.changedTouches.length;
+
+            while ((i < length) && (event.changedTouches[i].identifier !== this._observedPointer)) {
+                i++;
+            }
+            if (i < length) {
+                document.removeEventListener("touchmove", this, false);
+                document.removeEventListener("touchend", this, false);
+                this._releaseInterest();
+                this.needsDraw = true;
+                this._pressedStart = false;
+                this._pressedEnd = true;
+            }
+        }
+    },
+/**
+    Description TODO
+    @function
+    @param {Event} event TODO
+    */
+    handleMousedown: {
+        value: function (event) {
+            if (event.target === this._handlerDragArea.firstChild) {
+                if (this._value < this._minValue) {
+                    this._value = this._minValue;
+                } else if (this._value > this._maxValue) {
+                    this._value = this._maxValue;
+                }
+                this._observePointer("mouse");
+                document.addEventListener("mousemove", this, false);
+                document.addEventListener("mouseup", this, false);
+                this._cursorPosition = event.clientX;
+                event.preventDefault();
+                event.stopPropagation();
+                this._pressedEnd = false;
+                this._pressedStart = true;
+                this.needsDraw = true;
+            } else {
+                var zero = Point.create().init(0, 0),
+                    scale = (dom.convertPointFromNodeToPage(this._scale, zero).x - dom.convertPointFromNodeToPage(this._scale.parentNode, zero).x) / 10000,
+                    elemPos = dom.convertPointFromNodeToPage(this.element, zero);
+
+                var x = event.pageX - Math.ceil(elemPos.x / scale),
+                    y = event.pageY - Math.ceil(elemPos.y / scale);
+
+
+                if ((y >= 12) && (y < 45) && (x >= 19) && (x < this._width + 39)) {
+                    this._scrollTo = (x - 28) * this.valueRange;
+                    this._observePointer("mouse");
+                    document.addEventListener("mousemove", this, false);
+                    document.addEventListener("mouseup", this, false);
+                    this._cursorPosition = event.clientX;
+                    event.preventDefault();
+                    event.stopPropagation();
+                    this._pressedEnd = false;
+                    this._pressedStart = true;
+                    this.needsDraw = true;
+                }
+            }
+        }
+    },
+/**
+    Description TODO
+    @function
+    @param {Event} event TODO
+    */
+    handleMousemove: {
+        value: function (event) {
+            this.value = this._value + ((event.clientX - this._cursorPosition) * (this.valueRange)) / this._width;
+            this._cursorPosition = event.clientX;
+            event.preventDefault();
+            event.stopPropagation();
+            this._pressedStart = false;
+            this.needsDraw = true;
+        }
+    },
+/**
+    Description TODO
+    @function
+    */
+    handleMouseup: {
+        value: function () {
+            document.removeEventListener("mousemove", this, false);
+            document.removeEventListener("mouseup", this, false);
+
+            this._releaseInterest();
+
+            this.needsDraw = true;
+            this._pressedStart = false;
+            this._pressedEnd = true;
+        }
+    },
+/**
+    Description TODO
+    @function
+    @param {String} pointer TODO
+    @param {Component} demandingComponent TODO
+    @returns {Boolean} false
+    */
+    surrenderPointer: {
+        value: function(pointer, demandingComponent) {
+            return false;
+        }
+    },
+/**
+  Description TODO
+  @private
+*/
+    _observePointer: {
+        value: function(pointer) {
+            this.eventManager.claimPointer(pointer, this);
+            this._observedPointer = pointer;
+
+            var interactionStartEvent = document.createEvent("CustomEvent");
+            interactionStartEvent.initCustomEvent("montageinteractionstart", true, true, null);
+            this.dispatchEvent(interactionStartEvent);
+        }
+    },
+/**
+  Description TODO
+  @private
+*/
+    _releaseInterest: {
+        value: function() {
+            this.eventManager.forfeitPointer(this._observedPointer, this);
+            this._observedPointer = null;
+
+            var interactionEndEvent = document.createEvent("CustomEvent");
+            interactionEndEvent.initCustomEvent("montageinteractionend", true, true, null);
+            this.dispatchEvent(interactionEndEvent);
+        }
+    },
+/**
+    Description TODO
+    @function
+    */
+    prepareForActivationEvents: {
+        enumerable: false,
+        value: function() {
+            if (window.Touch) {
+                this._handlerDragArea.addEventListener("touchstart", this, false);
+                if (this._hasTapBarToScroll) {
+                    this.element.addEventListener("touchstart", this, false);
+                }
+            }
+            this._handlerDragArea.addEventListener("mousedown", this, false);
+            if (this._hasClickBarToScroll) {
+                this.element.addEventListener("mousedown", this, false);
+            }
+        }
+    },
+/**
+    Description TODO
+    @function
+    */
+    willDraw: {
+        enumerable: false,
+        value: function () {
+            this._width = this.element.offsetWidth - 55;
+            if (this._scrollTo !== null) {
+                this.value = this._minValue + (this._scrollTo / this._width);
+                this._scrollTo = null;
+            }
+        }
+    },
+/**
+    Description TODO
+    @function
+    */
+    draw: {
+        value: function() {
+
+            /*
+             ~~ is vastly faster then Math.floor
+
+             http://jsperf.com/math-floor-vs-math-round-vs-parseint/8
+             */
+            this._handlerbg.style.webkitTransform =
+                this._handler.style.webkitTransform =
+                    this._handler2.style.webkitTransform =
+                        this._handler3.style.webkitTransform =
+                            this._handler4.style.webkitTransform =
+                                this._line.style.webkitTransform =
+                                    this._line2.style.webkitTransform =
+                                        this._handlerDragArea.style.webkitTransform = "translate3d(" + (~~(((this.value - this._minValue) * this._width) / this.valueRange) * 100 / this._width) + "%, 0, 0)";
+
+            if (this._pressedStart) {
+                this.element.classList.add("pressed");
+                this._handlerbg.firstChild.style.webkitTransition =
+                    this._handler.firstChild.style.webkitTransition =
+                        this._handler2.firstChild.style.webkitTransition =
+                            this._handler3.firstChild.style.webkitTransition =
+                                this._handler4.firstChild.style.webkitTransition = "150ms all";
+            } else if (this._pressedEnd) {
+                this.element.classList.remove("pressed");
+            }
+        }
+    }
+});
-- 
cgit v1.2.3