OLD | NEW |
1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. | 1 // Copyright (c) 2012 The Chromium Authors. All rights reserved. |
2 // Use of this source code is governed by a BSD-style license that can be | 2 // Use of this source code is governed by a BSD-style license that can be |
3 // found in the LICENSE file. | 3 // found in the LICENSE file. |
4 | 4 |
5 cr.define('ntp', function() { | 5 cr.define('ntp', function() { |
6 'use strict'; | 6 'use strict'; |
7 | 7 |
8 // We can't pass the currently dragging tile via dataTransfer because of | 8 // We can't pass the currently dragging tile via dataTransfer because of |
9 // http://crbug.com/31037 | 9 // http://crbug.com/31037 |
10 var currentlyDraggingTile = null; | 10 var currentlyDraggingTile = null; |
(...skipping 42 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
53 // 'real' as opposed to doppleganger. | 53 // 'real' as opposed to doppleganger. |
54 this.className = 'tile real'; | 54 this.className = 'tile real'; |
55 this.appendChild(contents); | 55 this.appendChild(contents); |
56 contents.tile = this; | 56 contents.tile = this; |
57 | 57 |
58 this.addEventListener('dragstart', this.onDragStart_); | 58 this.addEventListener('dragstart', this.onDragStart_); |
59 this.addEventListener('drag', this.onDragMove_); | 59 this.addEventListener('drag', this.onDragMove_); |
60 this.addEventListener('dragend', this.onDragEnd_); | 60 this.addEventListener('dragend', this.onDragEnd_); |
61 | 61 |
62 this.firstChild.addEventListener( | 62 this.firstChild.addEventListener( |
63 'webkitAnimationEnd', this.onContentsAnimationEnd_.bind(this)); | 63 'animationend', this.onContentsAnimationEnd_.bind(this)); |
64 | 64 |
65 this.eventTracker = new EventTracker(); | 65 this.eventTracker = new EventTracker(); |
66 }, | 66 }, |
67 | 67 |
68 get index() { | 68 get index() { |
69 return Array.prototype.indexOf.call(this.tilePage.tileElements_, this); | 69 return Array.prototype.indexOf.call(this.tilePage.tileElements_, this); |
70 }, | 70 }, |
71 | 71 |
72 get tilePage() { | 72 get tilePage() { |
73 return findAncestorByClass(this, 'tile-page'); | 73 return findAncestorByClass(this, 'tile-page'); |
(...skipping 39 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
113 e.dataTransfer.effectAllowed = 'copyMove'; | 113 e.dataTransfer.effectAllowed = 'copyMove'; |
114 this.firstChild.setDragData(e.dataTransfer); | 114 this.firstChild.setDragData(e.dataTransfer); |
115 | 115 |
116 // The drag clone is the node we use as a representation during the drag. | 116 // The drag clone is the node we use as a representation during the drag. |
117 // It's attached to the top level document element so that it floats above | 117 // It's attached to the top level document element so that it floats above |
118 // image masks. | 118 // image masks. |
119 this.dragClone = this.cloneNode(true); | 119 this.dragClone = this.cloneNode(true); |
120 this.dragClone.style.right = ''; | 120 this.dragClone.style.right = ''; |
121 this.dragClone.classList.add('drag-representation'); | 121 this.dragClone.classList.add('drag-representation'); |
122 $('card-slider-frame').appendChild(this.dragClone); | 122 $('card-slider-frame').appendChild(this.dragClone); |
123 this.eventTracker.add(this.dragClone, 'webkitTransitionEnd', | 123 this.eventTracker.add(this.dragClone, 'transitionend', |
124 this.onDragCloneTransitionEnd_.bind(this)); | 124 this.onDragCloneTransitionEnd_.bind(this)); |
125 | 125 |
126 this.classList.add('dragging'); | 126 this.classList.add('dragging'); |
127 // offsetLeft is mirrored in RTL. Un-mirror it. | 127 // offsetLeft is mirrored in RTL. Un-mirror it. |
128 var offsetLeft = isRTL() ? | 128 var offsetLeft = isRTL() ? |
129 this.parentNode.clientWidth - this.offsetLeft : | 129 this.parentNode.clientWidth - this.offsetLeft : |
130 this.offsetLeft; | 130 this.offsetLeft; |
131 this.dragOffsetX = e.x - offsetLeft - this.parentNode.offsetLeft; | 131 this.dragOffsetX = e.x - offsetLeft - this.parentNode.offsetLeft; |
132 this.dragOffsetY = e.y - this.offsetTop - | 132 this.dragOffsetY = e.y - this.offsetTop - |
133 // Unlike offsetTop, this value takes scroll position into account. | 133 // Unlike offsetTop, this value takes scroll position into account. |
(...skipping 97 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
231 for (var i = 0; i < clonelets.length; i++) { | 231 for (var i = 0; i < clonelets.length; i++) { |
232 clonelets[i].classList.remove('real'); | 232 clonelets[i].classList.remove('real'); |
233 } | 233 } |
234 | 234 |
235 this.appendChild(clone); | 235 this.appendChild(clone); |
236 this.doppleganger_ = clone; | 236 this.doppleganger_ = clone; |
237 | 237 |
238 if (isRTL()) | 238 if (isRTL()) |
239 x *= -1; | 239 x *= -1; |
240 | 240 |
241 this.doppleganger_.style.WebkitTransform = 'translate(' + x + 'px, ' + | 241 this.doppleganger_.style.transform = 'translate(' + x + 'px, ' + |
242 y + 'px)'; | 242 y + 'px)'; |
243 }, | 243 }, |
244 | 244 |
245 /** | 245 /** |
246 * Destroys the current doppleganger. | 246 * Destroys the current doppleganger. |
247 */ | 247 */ |
248 clearDoppleganger: function() { | 248 clearDoppleganger: function() { |
249 if (this.doppleganger_) { | 249 if (this.doppleganger_) { |
250 this.removeChild(this.doppleganger_); | 250 this.removeChild(this.doppleganger_); |
251 this.doppleganger_ = null; | 251 this.doppleganger_ = null; |
252 } | 252 } |
(...skipping 13 matching lines...) Expand all Loading... |
266 * the next drag starts (if the user starts a 2nd drag very quickly). | 266 * the next drag starts (if the user starts a 2nd drag very quickly). |
267 * @private | 267 * @private |
268 */ | 268 */ |
269 finalizeDrag_: function() { | 269 finalizeDrag_: function() { |
270 assert(this.classList.contains('dragging')); | 270 assert(this.classList.contains('dragging')); |
271 | 271 |
272 var clone = this.dragClone; | 272 var clone = this.dragClone; |
273 this.dragClone = null; | 273 this.dragClone = null; |
274 | 274 |
275 clone.parentNode.removeChild(clone); | 275 clone.parentNode.removeChild(clone); |
276 this.eventTracker.remove(clone, 'webkitTransitionEnd'); | 276 this.eventTracker.remove(clone, 'transitionend'); |
277 this.classList.remove('dragging'); | 277 this.classList.remove('dragging'); |
278 if (this.firstChild.finalizeDrag) | 278 if (this.firstChild.finalizeDrag) |
279 this.firstChild.finalizeDrag(); | 279 this.firstChild.finalizeDrag(); |
280 }, | 280 }, |
281 | 281 |
282 /** | 282 /** |
283 * Called when the drag representation node is done migrating to its final | 283 * Called when the drag representation node is done migrating to its final |
284 * resting spot. | 284 * resting spot. |
285 * @param {Event} e The transition end event. | 285 * @param {Event} e The transition end event. |
286 */ | 286 */ |
(...skipping 10 matching lines...) Expand all Loading... |
297 * @param {boolean=} opt_animate Whether the animation should be animated. | 297 * @param {boolean=} opt_animate Whether the animation should be animated. |
298 */ | 298 */ |
299 doRemove: function(opt_animate) { | 299 doRemove: function(opt_animate) { |
300 if (opt_animate) | 300 if (opt_animate) |
301 this.firstChild.classList.add('removing-tile-contents'); | 301 this.firstChild.classList.add('removing-tile-contents'); |
302 else | 302 else |
303 this.tilePage.removeTile(this, false); | 303 this.tilePage.removeTile(this, false); |
304 }, | 304 }, |
305 | 305 |
306 /** | 306 /** |
307 * Callback for the webkitAnimationEnd event on the tile's contents. | 307 * Callback for the animationend event on the tile's contents. |
308 * @param {Event} e The event object. | 308 * @param {Event} e The event object. |
309 */ | 309 */ |
310 onContentsAnimationEnd_: function(e) { | 310 onContentsAnimationEnd_: function(e) { |
311 if (this.firstChild.classList.contains('new-tile-contents')) | 311 if (this.firstChild.classList.contains('new-tile-contents')) |
312 this.firstChild.classList.remove('new-tile-contents'); | 312 this.firstChild.classList.remove('new-tile-contents'); |
313 if (this.firstChild.classList.contains('removing-tile-contents')) | 313 if (this.firstChild.classList.contains('removing-tile-contents')) |
314 this.tilePage.removeTile(this, true); | 314 this.tilePage.removeTile(this, true); |
315 }, | 315 }, |
316 }; | 316 }; |
317 | 317 |
(...skipping 997 matching lines...) Expand 10 before | Expand all | Expand 10 after Loading... |
1315 }; | 1315 }; |
1316 | 1316 |
1317 return { | 1317 return { |
1318 getCurrentlyDraggingTile: getCurrentlyDraggingTile, | 1318 getCurrentlyDraggingTile: getCurrentlyDraggingTile, |
1319 setCurrentDropEffect: setCurrentDropEffect, | 1319 setCurrentDropEffect: setCurrentDropEffect, |
1320 // Not used outside, just for usage in JSDoc inside this file. | 1320 // Not used outside, just for usage in JSDoc inside this file. |
1321 Tile: Tile, | 1321 Tile: Tile, |
1322 TilePage: TilePage, | 1322 TilePage: TilePage, |
1323 }; | 1323 }; |
1324 }); | 1324 }); |
OLD | NEW |