Home | History | Annotate | Download | only in chromeos
      1 // Copyright (c) 2013 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 cr.define('chargerReplacement', function() {
      6 
      7   /**
      8    * Enumeration of charger selection.
      9    * @enum {int}
     10    */
     11   var CHARGER_SELECTION = {
     12     NONE: 0,
     13     GOOD_CHARGER: 1,
     14     ORIGINAL_CHARGER: 2
     15   };
     16 
     17   /**
     18    * Enumeration of html pages.
     19    * @enum {int}
     20    */
     21   var PAGES = {
     22     CHECK_CHARGER: 0,
     23     CONFIRM_SAFE_CHARGER: 1,
     24     CHARGER_UPDATE: 2,
     25     ORDER_CHARGER_ONLINE: 3,
     26     CONFIRM_ONLINE_ORDER: 4,
     27     FINISH_NOT_ORDER_CHARGER: 5,
     28     ORDER_CHARGER_OFFLINE: 6,
     29     CHARGER_STILL_BAD: 7,
     30   };
     31 
     32   /**
     33    *  Enumeration of the user's choice for order new charger or not.
     34    */
     35   var USER_CHOICE_FOR_CHARGER_UPDATE = {
     36     ORDER_NEW_CHARGER: 0,
     37     NOT_ORDER_NEW_CHARGER: 1,
     38   };
     39 
     40   /**
     41    *  Enumeration of messages sent from iFrame order form.
     42    */
     43   var ORDER_CHARGER_IFRAME_MESSAGE = {
     44     FORM_OPEN: 'FORM_OPEN',
     45     SUBMIT: 'SUBMIT',
     46     SUCCESS: 'SUCCESS',
     47     FAILURE: 'FAILURE',
     48     LINK: 'LINK',
     49   };
     50 
     51   /**
     52    *  Enumeration of countries where user might purchase the device.
     53    */
     54   var COUNTRY = {
     55     AU: 'au',
     56     CA: 'ca',
     57     IRE: 'ire',
     58     UK: 'uk',
     59     US: 'us',
     60   };
     61 
     62   /**
     63    *  Dialog argument passed from chrome to indicate whether user has ordered
     64    *  new charger.
     65    */
     66   var NEW_CHARGER_ORDERED = '1';
     67 
     68   /**
     69    *  Charger order form iFrame url.
     70    */
     71   var ORDER_CHARGER_IFRAME_URL = 'https://chromesafetycheck.appspot.com';
     72 
     73   /**
     74    *  maximum delay in milliseconds for loading the online charger order form
     75    *  into iFrame.
     76    */
     77   var ONLINE_ORDER_FORM_LOADING_DELAY = 30000;
     78 
     79   /**
     80    *  maximum delay in milliseconds for server to respond after user submits
     81    *  the order form.
     82    */
     83   var ONLINE_ORDER_SUBMISSION_DELAY = 60000;
     84 
     85   /**
     86    *  urls of href links on UI.
     87    */
     88   var CHARGER_FAQ_LINK = 'http://chromebook.com/hp11charger/';
     89   var PRIVACY_POLICY_LINK = 'http://www.google.com/policies/privacy';
     90 
     91   var onlineOrderSubmitTimer;
     92 
     93   /**
     94    *  flag for whether the online charger order form is loaded.
     95    */
     96   var isOrderFormLoaded = false;
     97 
     98   /**
     99    *  flag for whether user's online charger order form submission has been
    100    *  recevied by Google. True if the server responds with SUCCESSS or
    101    *  FAILURE. FAILURE indicate user has some input error in form and should
    102    *  submit again.
    103    */
    104   var isOrderSubmissionReceived = false;
    105 
    106   /**
    107    * charger selection by user.
    108    */
    109   var chargerSelection = CHARGER_SELECTION.NONE;
    110 
    111   /**
    112    * Set window the specified size and center it to screen.
    113    */
    114   function setWindowSizeAndCenter(width, height) {
    115     window.resizeTo(width, height);
    116     window.moveTo(window.screen.width / 2 - width / 2,
    117                   window.screen.height / 2 - height / 2);
    118   }
    119 
    120   /**
    121    * Show a particular page.
    122    */
    123   function showPage(page) {
    124     switch (page) {
    125       case PAGES.CHECK_CHARGER:
    126         setWindowSizeAndCenter(500, 590);
    127         break;
    128       case PAGES.CONFIRM_SAFE_CHARGER:
    129         setWindowSizeAndCenter(400, 325);
    130         break;
    131       case PAGES.CHARGER_UPDATE:
    132         setWindowSizeAndCenter(510, 505);
    133         $('not-order-charger-checkbox-strip').style.visibility = 'hidden';
    134         break;
    135       case PAGES.ORDER_CHARGER_ONLINE:
    136         $('charger-order-form').src = ORDER_CHARGER_IFRAME_URL;
    137         setWindowSizeAndCenter(1150, 550);
    138         setTimeout(checkOnlineOrderFormLoaded, ONLINE_ORDER_FORM_LOADING_DELAY);
    139         break;
    140       case PAGES.CONFIRM_ONLINE_ORDER:
    141         setWindowSizeAndCenter(420, 380);
    142         break;
    143       case PAGES.FINISH_NOT_ORDER_CHARGER:
    144         setWindowSizeAndCenter(430, 350);
    145         break;
    146       case PAGES.ORDER_CHARGER_OFFLINE:
    147         setWindowSizeAndCenter(750, 600);
    148         break;
    149       case PAGES.CHARGER_STILL_BAD:
    150         setWindowSizeAndCenter(430, 380);
    151         break;
    152     }
    153     document.body.setAttribute('page', page);
    154   }
    155 
    156   /**
    157    *  Select a country from the drop down list.
    158    */
    159   function selectCountry() {
    160     var country = $('select-device-country').value;
    161     if (country == COUNTRY.US || country == COUNTRY.CA) {
    162       $('new-charger').src = $('new-charger-us').src;
    163       $('original-charger').src = $('original-charger-us').src;
    164     } else if (country == COUNTRY.AU) {
    165       $('new-charger').src = $('new-charger-au').src;
    166       $('original-charger').src = $('original-charger-au').src;
    167     } else {
    168       $('new-charger').src = $('new-charger-uk').src;
    169       $('original-charger').src = $('original-charger-uk').src;
    170     }
    171     $('charger-selection-strip').style.visibility = 'visible';
    172   }
    173 
    174   /**
    175    *  Toggle charger box border color based on if it is selected.
    176    */
    177   function ToggleChargerSelection(charger, selected) {
    178     charger.classList.toggle('selected-charger', selected);
    179     charger.classList.toggle('de-selected-charger', !selected);
    180   }
    181 
    182   /**
    183    * Select a charger, either original or good charger with green sticker.
    184    */
    185   function selectCharger(selection) {
    186     if (selection == CHARGER_SELECTION.NONE)
    187       return;
    188 
    189     chargerSelection = selection;
    190     $('check-charger-next-step').disabled = false;
    191     if (chargerSelection == CHARGER_SELECTION.GOOD_CHARGER) {
    192       var selectedCharger = $('new-charger-box');
    193       var notSelectedCharger = $('original-charger-box');
    194     } else {
    195       var selectedCharger = $('original-charger-box');
    196       var notSelectedCharger = $('new-charger-box');
    197     }
    198     ToggleChargerSelection(selectedCharger, true);
    199     ToggleChargerSelection(notSelectedCharger, false);
    200   }
    201 
    202   /**
    203    * Process the flow after user select a charger.
    204    */
    205   function afterSelectCharger(dialogArg) {
    206     if (chargerSelection == CHARGER_SELECTION.NONE)
    207       return;
    208 
    209     if (chargerSelection == CHARGER_SELECTION.GOOD_CHARGER) {
    210       showPage(PAGES.CONFIRM_SAFE_CHARGER);
    211     } else {
    212       if (dialogArg == NEW_CHARGER_ORDERED)
    213         showPage(PAGES.CHARGER_STILL_BAD);
    214       else
    215         showPage(PAGES.CHARGER_UPDATE);
    216     }
    217   }
    218 
    219   /**
    220    *  Proceed to next step after user make the choice for charger update.
    221    */
    222   function nextStepForChargerUpdate() {
    223     var radios = document.getElementsByName('order-new-charger');
    224     if (radios[USER_CHOICE_FOR_CHARGER_UPDATE.ORDER_NEW_CHARGER].checked) {
    225       if (navigator.onLine)
    226         showPage(PAGES.ORDER_CHARGER_ONLINE);
    227       else
    228         showPage(PAGES.ORDER_CHARGER_OFFLINE);
    229     } else {
    230       showPage(PAGES.FINISH_NOT_ORDER_CHARGER);
    231     }
    232   }
    233 
    234   /**
    235    *  Update the UI after user confirms the choice for charger update.
    236    */
    237   function afterUserConfirmationForChargerUpdate() {
    238     if ($('order-new-charger').checked) {
    239       $('not-order-charger-checkbox-strip').style.visibility = 'hidden';
    240       $('next-to-charger-update').disabled = false;
    241     } else {
    242       $('not-order-charger-checkbox-strip').style.visibility = 'visible';
    243       $('next-to-charger-update').disabled =
    244           !$('confirm-not-order-charger').checked;
    245     }
    246   }
    247 
    248   /**
    249    *  Check if the online order form has been loaded in iFrame.
    250    */
    251   function checkOnlineOrderFormLoaded() {
    252     if (!isOrderFormLoaded)
    253       showPage(PAGES.ORDER_CHARGER_OFFLINE);
    254   }
    255 
    256   /**
    257    *  Check if the online charger order has been successful or not.
    258    */
    259   function checkOnlineOrderSubmissionResponse() {
    260     if (!isOrderSubmissionReceived)
    261       showPage(PAGES.ORDER_CHARGER_OFFLINE);
    262   }
    263 
    264   /**
    265    *  Handle the messages posted by the iFrame for online order form.
    266    */
    267   function handleWindowMessage(e) {
    268     if (e.origin != ORDER_CHARGER_IFRAME_URL)
    269       return;
    270 
    271     var type = e.data['type'];
    272     if (type == ORDER_CHARGER_IFRAME_MESSAGE.FORM_OPEN) {
    273       isOrderFormLoaded = true;
    274     } else if (type == ORDER_CHARGER_IFRAME_MESSAGE.SUBMIT) {
    275       if (onlineOrderSubmitTimer)
    276         clearTimeout(onlineOrderSubmitTimer);
    277       onlineOrderSubmitTimer = setTimeout(checkOnlineOrderSubmissionResponse,
    278                                           ONLINE_ORDER_SUBMISSION_DELAY);
    279     } else if (type == ORDER_CHARGER_IFRAME_MESSAGE.SUCCESS) {
    280       isOrderSubmissionReceived = true;
    281       showPage(PAGES.CONFIRM_ONLINE_ORDER);
    282     } else if (type == ORDER_CHARGER_IFRAME_MESSAGE.FAILURE) {
    283       isOrderSubmissionReceived = true;
    284     } else if (type == ORDER_CHARGER_IFRAME_MESSAGE.LINK) {
    285       chrome.send('showLink', [e.data['link']]);
    286     }
    287   }
    288 
    289   /**
    290    *  Page loaded.
    291    */
    292   function load() {
    293     var dialogArg = chrome.getVariableValue('dialogArguments');
    294     showPage(PAGES.CHECK_CHARGER);
    295     $('check-charger-next-step').disabled = true;
    296     $('charger-selection-strip').style.visibility = 'hidden';
    297     $('order-new-charger').checked = true;
    298     $('finish-offline-order').disabled = true;
    299     $('check-charger-next-step').onclick = function() {
    300       afterSelectCharger(dialogArg);
    301     };
    302     $('select-device-country').onchange = function() {
    303       selectCountry();
    304     };
    305     $('new-charger').onclick = function() {
    306       selectCharger(CHARGER_SELECTION.GOOD_CHARGER);
    307     };
    308     $('original-charger').onclick = function() {
    309       selectCharger(CHARGER_SELECTION.ORIGINAL_CHARGER);
    310     };
    311     $('back-to-check-charger').onclick = function() {
    312       showPage(PAGES.CHECK_CHARGER);
    313     };
    314     $('finish-safe-charger').onclick = function() {
    315       chrome.send('confirmSafeCharger');
    316       chrome.send('DialogClose');
    317     };
    318     $('back-to-check-charger-from-charger-update').onclick = function() {
    319       showPage(PAGES.CHECK_CHARGER);
    320     };
    321     $('next-to-charger-update').onclick = function() {
    322       nextStepForChargerUpdate();
    323     };
    324     $('order-new-charger').onclick = function() {
    325       afterUserConfirmationForChargerUpdate();
    326     };
    327     $('not-order-new-charger').onclick = function() {
    328       afterUserConfirmationForChargerUpdate();
    329     };
    330     $('confirm-not-order-charger').onclick = function() {
    331       afterUserConfirmationForChargerUpdate();
    332     };
    333     $('finish-not-order-new-charger').onclick = function() {
    334       chrome.send('confirmNotOrderNewCharger');
    335       chrome.send('DialogClose');
    336     };
    337     $('finish-online-order').onclick = function() {
    338       chrome.send('confirmChargerOrderedOnline');
    339       chrome.send('DialogClose');
    340     };
    341     $('offline-order-confirm').onclick = function() {
    342       $('finish-offline-order').disabled = !$('offline-order-confirm').checked;
    343     };
    344     $('finish-offline-order').onclick = function() {
    345       chrome.send('confirmChargerOrderByPhone');
    346       chrome.send('DialogClose');
    347     };
    348     $('finish-still-bad-charger').onclick = function() {
    349       chrome.send('confirmStillUseBadCharger');
    350       chrome.send('DialogClose');
    351     };
    352 
    353     var links = document.getElementsByClassName('link');
    354     for (var i = 0; i < links.length; ++i) {
    355       if (links[i].id == 'privacy-link') {
    356         links[i].onclick = function() {
    357           chrome.send('showLink', [PRIVACY_POLICY_LINK]);
    358         };
    359       } else {
    360         links[i].onclick = function() {
    361           chrome.send('showLink', [CHARGER_FAQ_LINK]);
    362         };
    363       }
    364     }
    365 
    366     window.addEventListener('message', handleWindowMessage);
    367   }
    368 
    369   return {
    370     load: load
    371   };
    372 });
    373 
    374 document.addEventListener('DOMContentLoaded', chargerReplacement.load);
    375 
    376