Merge pull request #503 from TomaszLukawskiSam/merge-tau-1.0.19-into-…

…tau-1.1

Merge TAU 1.0.19 into TAU 1.1

Gruntfile.js

@@ -104,7 +104,7 @@ module.exports = function (grunt) {
 				outputFileName: "tau.i3d.js",
 				outputDir: "libs"
 			}
-		}
+		},
 
 		files = {
 			js: {

examples/mobile/UIComponents/components/controls/dimmer.js

@@ -1,3 +1,4 @@
+/* global tau */
 (function () {
 	var page = document.getElementById("dimmer-page"),
 		dimmer = document.getElementById("dimmer"),

examples/mobile/UIComponents/components/gallery/gallery.html

@@ -5,6 +5,10 @@
 	<meta content="width=device-width, user-scalable=no" name="viewport" />
 	<link href="../../lib/tau/mobile/theme/default/tau.css" rel="stylesheet" />
 	<link href="../../css/style.css" rel="stylesheet" />
+	<link href="images/add0.jpg" />
+	<link href="images/add1.jpg" />
+	<link href="images/add2.jpg" />
+	<link href="images/add3.jpg" />
 	<script data-build-remove="false" src="../../lib/tau/mobile/js/tau.js">
 	</script>
 </head>

examples/mobile/UIComponents/components/list/gridview/gridview-with-move.html

@@ -165,7 +165,7 @@ <h1>
 			</ul>
 		</div>
 		<script type="text/javascript">
-			(function(tau) {
+			(function (tau) {
 				/**
 				 * elPage - Grid view page element
 				 * elGrid - Grid view element
@@ -182,7 +182,7 @@ <h1>
 				 * pageshow event handler
 				 * Do preparatory works and adds event listeners
 				 */
-				elPage.addEventListener("pageshow", function() {
+				elPage.addEventListener("pageshow", function () {
 					gridList = tau.widget.GridView(elGrid);
 					if (window.screen.orientation.type === "portrait-primary") {
 						gridList.option("cols", 4);
@@ -194,7 +194,7 @@ <h1>
 					window.addEventListener("pagebeforehide", unbindEvents);
 				});
 
-				bindEvents = function() {
+				bindEvents = function () {
 
 					if (gridList.options.cols === 4) {
 						gridList.option("cols", 7);
@@ -205,7 +205,7 @@ <h1>
 					}
 				};
 
-				unbindEvents = function() {
+				unbindEvents = function () {
 					window.removeEventListener("orientationchange", bindEvents);
 					window.removeEventListener("pagebeforehide", unbindEvents);
 				};

examples/mobile/UIComponents/components/list/gridview/gridview-within-popup.html

@@ -92,7 +92,7 @@ <h1>
 				</div>
 			</div>
 			<script>
-				(function(tau) {
+				(function (tau) {
 					/**
 					 * page - Panel page element
 					 * panelChanger - Panel changer element
@@ -106,7 +106,7 @@ <h1>
 					 * pagebeforeshow event handler
 					 * Do preparatory works and adds event listeners
 					 */
-					page.addEventListener("pageshow", function() {
+					page.addEventListener("pageshow", function () {
 						tau.openPopup("2btn_popup");
 					});
 

examples/mobile/UIComponents/components/popup/gridview.html

@@ -92,7 +92,7 @@ <h1>
 				</div>
 			</div>
 			<script>
-				(function(tau) {
+				(function (tau) {
 					/**
 					 * page - Panel page element
 					 * panelChanger - Panel changer element
@@ -106,7 +106,7 @@ <h1>
 					 * pagebeforeshow event handler
 					 * Do preparatory works and adds event listeners
 					 */
-					page.addEventListener("pageshow", function() {
+					page.addEventListener("pageshow", function () {
 						tau.openPopup("2btn_popup");
 					});
 

examples/mobile/UIComponents/components/popup/gridviewmultiple.html

@@ -116,7 +116,7 @@ <h1>
 				</div>
 			</div>
 			<script>
-				(function(tau) {
+				(function (tau) {
 					/**
 					 * page - Panel page element
 					 * panelChanger - Panel changer element
@@ -130,7 +130,7 @@ <h1>
 					 * pagebeforeshow event handler
 					 * Do preparatory works and adds event listeners
 					 */
-					page.addEventListener("pageshow", function() {
+					page.addEventListener("pageshow", function () {
 						tau.openPopup("2btn_popup");
 					});
 

examples/tv/UIComponents/components/controls/dimmer.js

@@ -1,3 +1,4 @@
+/* global tau */
 (function () {
 	var page = document.getElementById("dimmer-page"),
 		dimmer = document.getElementById("dimmer"),

examples/wearable/UIComponents/contents/controls/dimmer.js

@@ -1,3 +1,4 @@
+/* global tau */
 (function () {
 	var page = document.getElementById("dimmer-page"),
 		elSlider = document.getElementById("slider"),

examples/wearable/UIComponents/contents/list/list_marquee_style.js

@@ -19,7 +19,7 @@
 
 		if (elScroller && list || !window.tau.support.shape.circle) {
 			listHelper = tau.helper.SnapListMarqueeStyle.create(list, {
-				marqueeDelay: 1000,
+				marqueeDelay: 600,
 				marqueeStyle: "endToEnd",
 				animate: "scale"
 			});

examples/wearable/UIComponents/contents/navcontrols/indexscrollbar/indexScrollbar.js

@@ -13,7 +13,7 @@
 	 */
 	page.addEventListener("pageshow", function () {
 		var indexScrollbarElement = document.getElementById("indexscrollbar"),
-			listDividers = listviewElement.getElementsByClassName("ui-listview-divider"),	// list dividers
+			listDividers = tau.engine.getBinding(listviewElement).getDividers(),	// list dividers
 			dividers = {},	// collection of list dividers
 			indices = [],	// index list
 			divider,

src/js/core/util.js

@@ -131,6 +131,39 @@
 				window.clearTimeout(currentFrame);
 			};
 
+			/**
+			 * Remove animation callbacks added by requestAnimationFrame
+			 * @method cancelAnimationFrames
+			 * @static
+			 * @member ns.util
+			 * @param {*} animationId value for identify animation in queue
+			 */
+			util.cancelAnimationFrames = function (animationId) {
+				var found = 0,
+					len = waitingFrames.length,
+					i = 0;
+
+				if (animationId) {
+					// remove selected requests
+					while (len > 0 && found > -1) {
+						found = -1;
+						for (; i < len; i++) {
+							if (waitingFrames[i].animationId === animationId) {
+								found = i;
+								break;
+							}
+						}
+
+						if (found > -1) {
+							waitingFrames.splice(found, 1);
+							len--;
+						}
+					}
+				} else {
+					ns.warn("cancelAnimationFrames() require one parameter for request identify");
+				}
+			};
+
 			util._getCancelAnimationFrame = function () {
 				return (window.cancelAnimationFrame ||
 					window.webkitCancelAnimationFrame ||

src/js/core/util/animation/animation.js

@@ -253,6 +253,8 @@
 				} else {
 					self._animationTimeout = self._calculateAnimate.bind(self, callback);
 				}
+				self._animationId = Math.random() + Date.now();
+				self._animationTimeout.animationId = self._animationId;
 				self._calculateAnimate(callback);
 				return self;
 			};
@@ -268,7 +270,9 @@
 				self._animate.chainIndex = 0;
 				// reset current animation config
 				self._animateConfig = null;
-			// clear timeout
+
+				ns.util.cancelAnimationFrames(self._animationId);
+				// clear timeout
 				self._animationTimeout = null;
 				return self;
 			};
@@ -283,11 +287,51 @@
 				}
 			};
 
+			/**
+			 * Method resets startTime for each animations to current time
+			 * @private
+			 * @param {*} animateConfig
+			 */
+			function resetStartTimeForAnimateConfig(animateConfig) {
+				var i,
+					len;
+
+				if (animateConfig) {
+					len = animateConfig.length;
+					for (i = 0; i < len; i++) {
+						animateConfig[i].startTime = Date.now();
+					}
+				}
+			}
+
+			/**
+			 * Reset animations to initial position
+			 */
+			prototype.reset = function () {
+				var self = this,
+					restart = self.active;
+
+				if (restart) {
+					self.stop();
+				}
+
+				self._initAnimate();
+				resetStartTimeForAnimateConfig(self._animateConfig);
+				self._pausedTimeDiff = 0;
+				self._animate.chainIndex = 0;
+
+				self._calculateAnimate();
+
+				if (restart) {
+					self.start();
+				}
+			}
+
 			function calculateOption(option, time) {
 				var timeDiff,
 					current = null;
 
-				if (option && option.startTime < time) {
+				if (option && option.startTime <= time) {
 				// if option is not delayed
 					timeDiff = time - option.startTime;
 
@@ -374,7 +418,7 @@
 						self._tickFunction(self._object);
 					}
 					if (notFinishedAnimationsCount) {
-					// setting next loop state
+						// setting next loop state
 						if (self._animationTimeout) {
 							requestAnimationFrame(self._animationTimeout);
 						}

src/js/core/widget/BaseWidget.js

@@ -1293,8 +1293,7 @@
 			prototype._render = function (now) {
 				var self = this,
 					stateDOM = self._stateDOM,
-					element = self.element,
-					animation = self._animation;
+					element = self.element;
 
 				if (now === true) {
 					render(stateDOM, element, false);

src/js/core/widget/core/Marquee.js

@@ -337,6 +337,8 @@
 			prototype._build = function (element) {
 				var marqueeInnerElement = element.querySelector("." + classes.MARQUEE_CONTENT);
 
+				element.classList.add(CLASSES_PREFIX);
+
 				if (!marqueeInnerElement) {
 					marqueeInnerElement = document.createElement("div");
 
@@ -565,7 +567,6 @@
 				self._animation.stop();
 				self._animation.destroy();
 				self._animation = null;
-				self.element.classList.remove(classes.MARQUEE_GRADIENT);
 				self.element.style.webkitMaskImage = "";
 
 				marqueeInnerElement = self.element.querySelector("." + classes.MARQUEE_CONTENT);
@@ -617,10 +618,6 @@
 			 * @member ns.widget.core.Marquee
 			 */
 			prototype.stop = function () {
-				var self = this,
-					animation = self._animation;
-
-				animation.pause();
 				this.option("animation", "stopped");
 			};
 
@@ -642,12 +639,12 @@
 			 */
 			prototype.reset = function () {
 				var self = this,
-					stateDOM = self._stateDOM;
+					animation = self._animation;
 
-				this.option("animation", "stopped");
-				stateDOM.style.webkitMaskImage = (this.options.ellipsisEffect === "none") ? "" : GRADIENTS.RIGHT;
-				stateDOM.children[0].style.webkitTransform = "translateX(0)";
-				self._render(true);
+				animation.reset();
+
+				self.element.style.webkitMaskImage = (self.options.ellipsisEffect === "none") ?
+					"" : GRADIENTS.RIGHT;
 			};
 
 			Marquee.prototype = prototype;

src/js/profile/mobile/widget/mobile/TextInput.js

@@ -593,7 +593,7 @@
 				utilEvent.on(element, "focus", onFocusCallback);
 				utilEvent.on(element, "blur", onBlurCallback);
 				if (clearBtn) {
-					utilEvent.on(clearBtn, "click", onClearBtnClickCallback);
+					utilEvent.on(clearBtn, "mousedown", onClearBtnClickCallback);
 					utilEvent.on(clearBtn, eventName.ANIMATIONEND, onClearBtnAnimationEndCallback);
 				}
 
@@ -614,7 +614,7 @@
 				utilEvent.off(element, "focus", callbacks.onFocusCallback);
 				utilEvent.off(element, "blur", callbacks.onBlurCallback);
 				if (clearBtn) {
-					utilEvent.off(clearBtn, "click", callbacks.onClearBtnClickCallback);
+					utilEvent.off(clearBtn, "mousedown", callbacks.onClearBtnClickCallback);
 					utilEvent.off(clearBtn, eventName.ANIMATIONEND, callbacks.onClearBtnAnimationEndCallback);
 				}
 			};

src/js/profile/wearable/widget/wearable/ArcListview.js

@@ -1455,6 +1455,17 @@
 				});
 			}
 
+			/**
+			 * Return all dividers (category names in items' list)
+			 * @method getDividers
+			 * @memberof ns.widget.wearable.ArcListview
+			 */
+			prototype.getDividers = function () {
+				return this._items
+					.filter(function (elem) {
+						return elem.classList.contains(classes.DIVIDER);
+					});
+			}
 
 			/**
 			 * Widget init method

src/js/profile/wearable/widget/wearable/Selector.js

@@ -943,7 +943,7 @@
 				if (active) {
 					transform = active.style.transform || active.style.webkitTransform;
 					newTransformStyle = transform.replace(/scale[(][^)]+[)]/,
-							DEFAULT.ITEM_NORMAL_SCALE);
+						DEFAULT.ITEM_NORMAL_SCALE);
 					active.style.transform = newTransformStyle;
 					active.style.webkitTransform = newTransformStyle;
 					active.classList.remove(classes.ITEM_ACTIVE);

tests/js/core/widget/core/Marquee/Marquee.js

@@ -403,22 +403,20 @@
 				],
 
 				setAttribute: function () {}
-			}
+			};
 
-			marquee.stop = function () {
-				assert.ok(true, "stop was called");
+			marquee._animation = {
+				reset: function () {
+					assert.ok(true, "stop was called");
+				}
 			};
+
 			marquee.reset();
 
 			assert.equal(
-				marquee._stateDOM.style.webkitMaskImage,
-				"-webkit-linear-gradient(left, rgb(255, 255, 255) 0, rgb(255," +
-				" 255, 255) 85%, transparent 100%)",
-				"_stateDOM.style.webkitMaskImage is correctly set");
-			assert.equal(
-				marquee._stateDOM.children[0].style.webkitTransform,
-				"translateX(0)",
-				"_stateDOM.children[0].style.webkitTransform is correctly set");
+				marquee.element.style.webkitMaskImage,
+				"-webkit-linear-gradient(left, rgb(255, 255, 255) 0, rgb(255, 255, 255) 85%, transparent 100%)",
+				"marquee.element.style.webkitMaskImage is correctly set");
 		});
 	}