Old and new about pages: simplify product logo animation code

chrome/browser/resources/help/help_page.js

 // Copyright 2014 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('help', function() {
   var Page = cr.ui.pageManager.Page;
   var PageManager = cr.ui.pageManager.PageManager;
 
   /**
    * Encapsulated handling of the About page. Called 'help' internally to avoid
@@ skipping 179 matching lines @@
           bubble.anchorNode = $('controlled-feature-icon');
           bubble.domSibling = $('controlled-feature-icon');
           bubble.arrowLocation = cr.ui.ArrowLocation.TOP_END;
           bubble.content = content;
           bubble.show();
         };
       }
 
       var logo = $('product-logo');
       logo.onclick = function(e) {
-        logo.classList.remove('spin');
-        // Force a style recalc that cancels the animation specified by "spin".
-        getComputedStyle(logo).getPropertyValue('animation-name');
-        logo.classList.add('spin');
+        logo.animate({
+          transform: ['none', 'rotate(-10turn)'],
+        }, /** @type {!KeyframeEffectOptions} */({
+          duration: 500,
+          easing: 'cubic-bezier(1, 0, 0, 1)',
+        }));
       };
 
       // Attempt to update.
       chrome.send('onPageLoaded');
     },
 
     /** @override */
     didClosePage: function() {
       this.setMoreInfoVisible_(false);
     },
@@ skipping 560 matching lines @@
   HelpPage.updateEolMessage = function(eolStatus, eolMessage) {
     assert(cr.isChromeOS);
     HelpPage.getInstance().updateEolMessage_(eolStatus, eolMessage);
   };
 
   // Export
   return {
     HelpPage: HelpPage
   };
 });