Implement the 'Clear Browser Data' dom-ui overlay....

chrome/browser/resources/options/clear_browser_data_overlay.js

Index: chrome/browser/resources/options/clear_browser_data_overlay.js
===================================================================
--- chrome/browser/resources/options/clear_browser_data_overlay.js	(revision 53227)
+++ chrome/browser/resources/options/clear_browser_data_overlay.js	(working copy)
@@ -13,6 +13,8 @@
                    'clearBrowserDataOverlay');
 }
 
+ClearBrowserDataOverlay.throbIntervalId = 0;
+
 cr.addSingletonGetter(ClearBrowserDataOverlay);
 
 ClearBrowserDataOverlay.prototype = {
@@ -26,6 +28,47 @@
     // Call base class implementation to starts preference initialization.
     OptionsPage.prototype.initializePage.call(this);
 
-    // TODO(csilv): add any initialization here or delete method and/or class.
+    // Setup option values for the time period select control.
+    $('clearBrowsingDataTimePeriod').initializeValues(
+        templateData.clearBrowsingDataTimeList)
+
+    // Setup click handler for the clear(Ok) button.
+    $('clearBrowsingDataCommit').onclick = function(event) {
+      chrome.send('performClearBrowserData');
+    };
   }
 };
+
+//
+// Chrome callbacks
+//
+function clearBrowserDataSetClearingState(state) {
+  $('deleteBrowsingHistoryCheckbox').disabled = state;
+  $('deleteDownloadHistoryCheckbox').disabled = state;
+  $('deleteCacheCheckbox').disabled = state;
+  $('deleteCookiesCheckbox').disabled = state;
+  $('deletePasswordsCheckbox').disabled = state;
+  $('deleteFormDataCheckbox').disabled = state;
+  $('clearBrowsingDataTimePeriod').disabled = state;
+  $('clearBrowsingDataCommit').disabled = state;
+  $('clearBrowsingDataDismiss').disabled = state;
+  $('cbdThrobber').style.visibility = state ? 'visible' : 'hidden';
+
+  function advanceThrobber() {
+    var throbber = $('cbdThrobber');
+    // TODO(csilv): make this smoother using time-based animation?
+    throbber.style.backgroundPositionX =
+        ((parseInt(getComputedStyle(throbber).backgroundPositionX, 10) - 16) %
+        576) + 'px';
+  }
+  if (state) {
+    ClearBrowserDataOverlay.throbIntervalId = setInterval(advanceThrobber, 30);
+  } else {
+    clearInterval(ClearBrowserDataOverlay.throbIntervalId);
+  }
+}
+
+function clearBrowserDataDismiss() {
+  OptionsPage.clearOverlays();
+  clearBrowserDataSetClearingState(false);
+}