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

Side by Side Diff: chrome/browser/resources/history/history.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 // <include src="../uber/uber_utils.js"> 5 // <include src="../uber/uber_utils.js">
6 // <include src="history_focus_manager.js"> 6 // <include src="history_focus_manager.js">
7 7
8 /////////////////////////////////////////////////////////////////////////////// 8 ///////////////////////////////////////////////////////////////////////////////
9 // Globals: 9 // Globals:
10 /** @const */ var RESULTS_PER_PAGE = 150; 10 /** @const */ var RESULTS_PER_PAGE = 150;
(...skipping 1754 matching lines...) Expand 10 before | Expand all | Expand 10 after
1765 var entry = findAncestorByClass(/** @type {Element} */(e.target), 1765 var entry = findAncestorByClass(/** @type {Element} */(e.target),
1766 'site-entry'); 1766 'site-entry');
1767 var innerResultList = entry.querySelector('.site-results'); 1767 var innerResultList = entry.querySelector('.site-results');
1768 1768
1769 if (entry.classList.contains('expand')) { 1769 if (entry.classList.contains('expand')) {
1770 innerResultList.style.height = 0; 1770 innerResultList.style.height = 0;
1771 innerResultList.setAttribute('aria-hidden', 'true'); 1771 innerResultList.setAttribute('aria-hidden', 'true');
1772 } else { 1772 } else {
1773 innerResultList.setAttribute('aria-hidden', 'false'); 1773 innerResultList.setAttribute('aria-hidden', 'false');
1774 innerResultList.style.height = 'auto'; 1774 innerResultList.style.height = 'auto';
1775 // -webkit-transition does not work on height:auto elements so first set 1775 // transition does not work on height:auto elements so first set
1776 // the height to auto so that it is computed and then set it to the 1776 // the height to auto so that it is computed and then set it to the
1777 // computed value in pixels so the transition works properly. 1777 // computed value in pixels so the transition works properly.
1778 var height = innerResultList.clientHeight; 1778 var height = innerResultList.clientHeight;
1779 innerResultList.style.height = 0; 1779 innerResultList.style.height = 0;
1780 setTimeout(function() { 1780 setTimeout(function() {
1781 innerResultList.style.height = height + 'px'; 1781 innerResultList.style.height = height + 'px';
1782 }, 0); 1782 }, 0);
1783 } 1783 }
1784 1784
1785 entry.classList.toggle('expand'); 1785 entry.classList.toggle('expand');
(...skipping 538 matching lines...) Expand 10 before | Expand all | Expand 10 after
2324 * Triggers a fade-out animation, and then removes |node| from the DOM. 2324 * Triggers a fade-out animation, and then removes |node| from the DOM.
2325 * @param {Node} node The node to be removed. 2325 * @param {Node} node The node to be removed.
2326 * @param {Function?} onRemove A function to be called after the node 2326 * @param {Function?} onRemove A function to be called after the node
2327 * has been removed from the DOM. 2327 * has been removed from the DOM.
2328 * @param {*=} opt_scope An optional scope object to call |onRemove| with. 2328 * @param {*=} opt_scope An optional scope object to call |onRemove| with.
2329 */ 2329 */
2330 function removeNode(node, onRemove, opt_scope) { 2330 function removeNode(node, onRemove, opt_scope) {
2331 node.classList.add('fade-out'); // Trigger CSS fade out animation. 2331 node.classList.add('fade-out'); // Trigger CSS fade out animation.
2332 2332
2333 // Delete the node when the animation is complete. 2333 // Delete the node when the animation is complete.
2334 node.addEventListener('webkitTransitionEnd', function(e) { 2334 node.addEventListener('transitionend', function(e) {
2335 node.parentNode.removeChild(node); 2335 node.parentNode.removeChild(node);
2336 2336
2337 // In case there is nested deletion happening, prevent this event from 2337 // In case there is nested deletion happening, prevent this event from
2338 // being handled by listeners on ancestor nodes. 2338 // being handled by listeners on ancestor nodes.
2339 e.stopPropagation(); 2339 e.stopPropagation();
2340 2340
2341 if (onRemove) 2341 if (onRemove)
2342 onRemove.call(opt_scope); 2342 onRemove.call(opt_scope);
2343 }); 2343 });
2344 } 2344 }
(...skipping 65 matching lines...) Expand 10 before | Expand all | Expand 10 after
2410 historyView.reload(); 2410 historyView.reload();
2411 } 2411 }
2412 2412
2413 // Add handlers to HTML elements. 2413 // Add handlers to HTML elements.
2414 document.addEventListener('DOMContentLoaded', load); 2414 document.addEventListener('DOMContentLoaded', load);
2415 2415
2416 // This event lets us enable and disable menu items before the menu is shown. 2416 // This event lets us enable and disable menu items before the menu is shown.
2417 document.addEventListener('canExecute', function(e) { 2417 document.addEventListener('canExecute', function(e) {
2418 e.canExecute = true; 2418 e.canExecute = true;
2419 }); 2419 });
OLDNEW
« no previous file with comments | « chrome/browser/resources/history/history.css ('k') | chrome/browser/resources/history/history_mobile.css » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698