Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(98)

Side by Side Diff: chrome/browser/resources/ntp4/tile_page.js

Issue 2691883002: Uprefix CSS transitions in ui/ and chrome/ styles (Closed)
Patch Set: transitions only Created 3 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
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 102 matching lines...) Expand 10 before | Expand all | Expand 10 after
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 132 matching lines...) Expand 10 before | Expand all | Expand 10 after
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 1028 matching lines...) Expand 10 before | Expand all | Expand 10 after
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 });
OLDNEW
« no previous file with comments | « chrome/browser/resources/ntp4/tile_page.css ('k') | chrome/browser/resources/options/browser_options.css » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698