javascript/options.js

   1 // Copyright 2011 Google Inc. All Rights Reserved.
   2
   3 /**
   4  * @fileoverview Script for the options page.
   5  * @author arunjit@google.com (Arunjit Singh)
   6  */
   7
   8 window.addEventListener('load', init, false);
   9
  10 //Get the constants from the background page
  11 var CONSTANTS = chrome.extension.getBackgroundPage().CONSTANTS;
  12
  13 /**
  14  * Initializes the i18n strings.
  15  * Loads values from localStorage and applies them to the elements
  16  */
  17 function init() {
  18   // Localize strings:
  19   CONSTANTS.TIMES.forEach(function(time) {
  20     var selector = 'input[name=time][value="{t}"], .opt-label#opt-{t}'
  21                    .supplant({t: time});
  22     var elements = $(selector);
  23     time = getUnitsForTime(time);
  24     var message = (time.time === -1) ?
  25                   chrome.i18n.getMessage('optionsTimeAll') :
  26                   chrome.i18n.getMessage('optionsTime',
  27                                          [time.time, time.units]);
  28     elements[0].title = message;
  29     elements[1].innerText = message;
  30   });
  31
  32   $('#optionsTitle')[0].innerText = chrome.i18n.getMessage('optionsTitle');
  33   $('#optionsHeader')[0].innerText = chrome.i18n.getMessage('optionsHeader');
  34   $('#optionsPrompt')[0].innerText = chrome.i18n.getMessage('optionsPrompt');
  35   $('#optionsTimeFor')[0].innerText = chrome.i18n.getMessage('optionsTimeFor');
  36   $('#optionsSaved > b')[0].innerText = chrome.i18n.getMessage('optionsSaved');
  37
  38   // Bind all the callbacks
  39   $('#opt-time input.opt-chk[type=radio]').forEach(function(e) {
  40     e.onclick = toggle;
  41   });
  42   $('#opt-prompt input.opt-chk[type=checkbox]').forEach(function(e) {
  43     e.onclick = setPrompt;
  44   });
  45
  46   // Load or set localStorage data
  47   var time = ~~(localStorage['time']) ||
  48              (localStorage['time'] = CONSTANTS.DEFAULT_TIME);
  49   var showPrompt = localStorage['prompt'] ||
  50                    (localStorage['prompt'] = CONSTANTS.YES);
  51
  52   $('input[name=time][value="' + time + '"]')[0].checked = true;
  53   $('input[name=prompt]')[0].checked = (showPrompt === CONSTANTS.YES);
  54 }
  55
  56 /**
  57  * Toggles the value in localStorage for the element selected
  58  * @this {HTMLInputElement} The element (radio button) that was clicked.
  59  */
  60 function toggle() {
  61   localStorage['time'] = this.value;
  62   optionSaved();
  63 }
  64
  65 /**
  66  * Sets the {@code localStorage.prompt} property when selected
  67  * @this {HTMLInputElement} The element (checkbox) that was clicked.
  68  */
  69 function setPrompt() {
  70   localStorage['prompt'] = this.checked ? CONSTANTS.YES : CONSTANTS.NO;
  71   optionSaved();
  72 }
  73
  74 // For rapid changes/saves
  75 var isSaving = null;
  76 /**
  77  * Updates the UI to indicate save completed
  78  */
  79 function optionSaved() {
  80   var element = $('#optionsSaved')[0];
  81   element.classList.add('show');
  82   clearTimeout(isSaving);
  83   isSaving = setTimeout(function() {
  84     element.classList.remove('show');
  85   }, 1000);
  86 }