src/chrome/common/extensions/docs/examples/api/browsingData/basic/popup.js

   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
   3 // found in the LICENSE file.
   4
   5 /**
   6  * This class wraps the popup's form, and performs the proper clearing of data
   7  * based on the user's selections. It depends on the form containing a single
   8  * select element with an id of 'timeframe', and a single button with an id of
   9  * 'button'. When you write actual code you should probably be a little more
  10  * accepting of variance, but this is just a sample app. :)
  11  *
  12  * Most of this is boilerplate binding the controller to the UI. The bits that
  13  * specifically will be useful when using the BrowsingData API are contained in
  14  * `parseMilliseconds_`, `handleCallback_`, and `handleClick_`.
  15  *
  16  * @constructor
  17  */
  18 var PopupController = function () {
  19   this.button_ = document.getElementById('button');
  20   this.timeframe_ = document.getElementById('timeframe');
  21   this.addListeners_();
  22 };
  23
  24 PopupController.prototype = {
  25   /**
  26    * A cached reference to the button element.
  27    *
  28    * @type {Element}
  29    * @private
  30    */
  31   button_: null,
  32
  33   /**
  34    * A cached reference to the select element.
  35    *
  36    * @type {Element}
  37    * @private
  38    */
  39   timeframe_: null,
  40
  41   /**
  42    * Adds event listeners to the button in order to capture a user's click, and
  43    * perform some action in response.
  44    *
  45    * @private
  46    */
  47   addListeners_: function () {
  48     this.button_.addEventListener('click', this.handleClick_.bind(this));
  49   },
  50
  51   /**
  52    * Given a string, return milliseconds since epoch. If the string isn't
  53    * valid, returns undefined.
  54    *
  55    * @param {string} timeframe One of 'hour', 'day', 'week', '4weeks', or
  56    *     'forever'.
  57    * @returns {number} Milliseconds since epoch.
  58    * @private
  59    */
  60   parseMilliseconds_: function (timeframe) {
  61     var now = new Date().getTime();
  62     var milliseconds = {
  63       'hour': 60 * 60 * 1000,
  64       'day': 24 * 60 * 60 * 1000,
  65       'week': 7 * 24 * 60 * 60 * 1000,
  66       '4weeks': 4 * 7 * 24 * 60 * 60 * 1000
  67     };
  68
  69     if (milliseconds[timeframe])
  70       return now - milliseconds[timeframe];
  71
  72     if (timeframe === 'forever')
  73       return 0;
  74
  75     return null;
  76   },
  77
  78   /**
  79    * Handle a success/failure callback from the `browsingData` API methods,
  80    * updating the UI appropriately.
  81    *
  82    * @private
  83    */
  84   handleCallback_: function () {
  85     var success = document.createElement('div');
  86     success.classList.add('overlay');
  87     success.setAttribute('role', 'alert');
  88     success.textContent = 'Data has been cleared.';
  89     document.body.appendChild(success);
  90
  91     setTimeout(function() { success.classList.add('visible'); }, 10);
  92     setTimeout(function() {
  93       if (close === false)
  94         success.classList.remove('visible');
  95       else
  96         window.close();
  97     }, 4000);
  98   },
  99
 100   /**
 101    * When a user clicks the button, this method is called: it reads the current
 102    * state of `timeframe_` in order to pull a timeframe, then calls the clearing
 103    * method with appropriate arguments.
 104    *
 105    * @private
 106    */
 107   handleClick_: function () {
 108     var removal_start = this.parseMilliseconds_(this.timeframe_.value);
 109     if (removal_start !== undefined) {
 110       this.button_.setAttribute('disabled', 'disabled');
 111       this.button_.innerText = 'Clearing...';
 112       chrome.browsingData.remove({ "since" : removal_start }, {
 113         "appcache": true,
 114         "cache": true,
 115         "cookies": true,
 116         "downloads": true,
 117         "fileSystems": true,
 118         "formData": true,
 119         "history": true,
 120         "indexedDB": true,
 121         "localStorage": true,
 122         "serverBoundCertificates": true,
 123         "pluginData": true,
 124         "passwords": true,
 125         "webSQL": true
 126       }, this.handleCallback_.bind(this));
 127     }
 128   }
 129 };
 130
 131 document.addEventListener('DOMContentLoaded', function () {
 132   window.PC = new PopupController();
 133 });