chrome/browser/resources/help/help.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 <include src="../uber/uber_utils.js">
   6
   7 cr.define('help', function() {
   8   /**
   9    * Encapsulated handling of the help page.
  10    */
  11   function HelpPage() {}
  12
  13   cr.addSingletonGetter(HelpPage);
  14
  15   HelpPage.prototype = {
  16     __proto__: help.HelpBasePage.prototype,
  17
  18     /**
  19      * True if after update powerwash button should be displayed.
  20      * @private
  21      */
  22     powerwashAfterUpdate_: false,
  23
  24     /**
  25      * List of the channels names.
  26      * @private
  27      */
  28     channelList_: ['dev-channel', 'beta-channel', 'stable-channel'],
  29
  30     /**
  31      * Bubble for error messages and notifications.
  32      * @private
  33      */
  34     bubble_: null,
  35
  36     /**
  37      * Name of the channel the device is currently on.
  38      * @private
  39      */
  40     currentChannel_: null,
  41
  42     /**
  43      * Name of the channel the device is supposed to be on.
  44      * @private
  45      */
  46     targetChannel_: null,
  47
  48     /**
  49      * Perform initial setup.
  50      */
  51     initialize: function() {
  52       help.HelpBasePage.prototype.initialize.call(this, 'help-page');
  53
  54       var self = this;
  55
  56       uber.onContentFrameLoaded();
  57
  58       // Set the title.
  59       var title = loadTimeData.getString('helpTitle');
  60       uber.invokeMethodOnParent('setTitle', {title: title});
  61
  62       $('product-license').innerHTML = loadTimeData.getString('productLicense');
  63       if (cr.isChromeOS) {
  64         $('product-os-license').innerHTML =
  65             loadTimeData.getString('productOsLicense');
  66       }
  67
  68       var productTOS = $('product-tos');
  69       if (productTOS)
  70         productTOS.innerHTML = loadTimeData.getString('productTOS');
  71
  72       $('get-help').onclick = function() {
  73         chrome.send('openHelpPage');
  74       };
  75 <if expr="pp_ifdef('_google_chrome')">
  76       $('report-issue').onclick = function() {
  77         chrome.send('openFeedbackDialog');
  78       };
  79 </if>
  80
  81       this.maybeSetOnClick_($('more-info-expander'),
  82           this.toggleMoreInfo_.bind(this));
  83
  84       this.maybeSetOnClick_($('promote'), function() {
  85         chrome.send('promoteUpdater');
  86       });
  87       this.maybeSetOnClick_($('relaunch'), function() {
  88         chrome.send('relaunchNow');
  89       });
  90       if (cr.isChromeOS) {
  91         this.maybeSetOnClick_($('relaunch-and-powerwash'), function() {
  92           chrome.send('relaunchAndPowerwash');
  93         });
  94
  95         this.channelTable_ = {
  96           'stable-channel': {
  97               'name': loadTimeData.getString('stable'),
  98               'label': loadTimeData.getString('currentChannelStable'),
  99           },
 100           'beta-channel': {
 101               'name': loadTimeData.getString('beta'),
 102               'label': loadTimeData.getString('currentChannelBeta')
 103           },
 104           'dev-channel': {
 105               'name': loadTimeData.getString('dev'),
 106               'label': loadTimeData.getString('currentChannelDev')
 107           }
 108         };
 109       }
 110
 111       var channelChanger = $('channel-changer');
 112       if (channelChanger) {
 113         channelChanger.onchange = function(event) {
 114           self.setChannel_(event.target.value, false);
 115         };
 116       }
 117
 118       if (cr.isChromeOS) {
 119         help.ChannelChangePage.getInstance().initialize();
 120         this.registerOverlay(help.ChannelChangePage.getInstance());
 121
 122         cr.ui.overlay.setupOverlay($('overlay-container'));
 123         cr.ui.overlay.globalInitialization();
 124         $('overlay-container').addEventListener('cancelOverlay', function() {
 125           self.closeOverlay();
 126         });
 127         $('change-channel').onclick = function() {
 128           self.showOverlay('channel-change-page');
 129         };
 130
 131         var channelChangeDisallowedError = document.createElement('div');
 132         channelChangeDisallowedError.className = 'channel-change-error-bubble';
 133
 134         var channelChangeDisallowedIcon = document.createElement('div');
 135         channelChangeDisallowedIcon.classList.add('help-page-icon-large');
 136         channelChangeDisallowedIcon.classList.add('channel-change-error-icon');
 137         channelChangeDisallowedError.appendChild(channelChangeDisallowedIcon);
 138
 139         var channelChangeDisallowedText = document.createElement('div');
 140         channelChangeDisallowedText.className = 'channel-change-error-text';
 141         channelChangeDisallowedText.textContent =
 142             loadTimeData.getString('channelChangeDisallowedMessage');
 143         channelChangeDisallowedError.appendChild(channelChangeDisallowedText);
 144
 145         $('channel-change-disallowed-icon').onclick = function() {
 146             self.showBubble_(channelChangeDisallowedError,
 147                              $('help-container'),
 148                              $('channel-change-disallowed-icon'),
 149                              cr.ui.ArrowLocation.TOP_END);
 150         };
 151       }
 152
 153       cr.ui.FocusManager.disableMouseFocusOnButtons();
 154       help.HelpFocusManager.getInstance().initialize();
 155
 156       // Attempt to update.
 157       chrome.send('onPageLoaded');
 158     },
 159
 160     /**
 161      * Shows the bubble.
 162      * @param {HTMLDivElement} content The content of the bubble.
 163      * @param {HTMLElement} target The element at which the bubble points.
 164      * @param {HTMLElement} domSibling The element after which the bubble is
 165      *     added to the DOM.
 166      * @param {cr.ui.ArrowLocation} location The arrow location.
 167      * @private
 168      */
 169     showBubble_: function(content, domSibling, target, location) {
 170       if (!cr.isChromeOS)
 171         return;
 172       this.hideBubble_();
 173       var bubble = new cr.ui.AutoCloseBubble;
 174       bubble.anchorNode = target;
 175       bubble.domSibling = domSibling;
 176       bubble.arrowLocation = location;
 177       bubble.content = content;
 178       bubble.show();
 179       this.bubble_ = bubble;
 180     },
 181
 182     /**
 183      * Hides the bubble.
 184      * @private
 185      */
 186     hideBubble_: function() {
 187       if (!cr.isChromeOS)
 188         return;
 189       if (this.bubble_)
 190         this.bubble_.hide();
 191     },
 192
 193     /**
 194      * Toggles the visible state of the 'More Info' section.
 195      * @private
 196      */
 197     toggleMoreInfo_: function() {
 198       var moreInfo = $('more-info-container');
 199       var visible = moreInfo.className == 'visible';
 200       moreInfo.className = visible ? '' : 'visible';
 201       moreInfo.style.height = visible ? '' : moreInfo.scrollHeight + 'px';
 202       moreInfo.addEventListener('webkitTransitionEnd', function(event) {
 203         $('more-info-expander').textContent = visible ?
 204             loadTimeData.getString('showMoreInfo') :
 205             loadTimeData.getString('hideMoreInfo');
 206       });
 207     },
 208
 209     /**
 210      * Assigns |method| to the onclick property of |el| if |el| exists.
 211      * @private
 212      */
 213     maybeSetOnClick_: function(el, method) {
 214       if (el)
 215         el.onclick = method;
 216     },
 217
 218     /**
 219      * @private
 220      */
 221     setUpdateImage_: function(state) {
 222       $('update-status-icon').className = 'help-page-icon ' + state;
 223     },
 224
 225     /**
 226      * @return {boolean} True, if new channel switcher UI is used,
 227      *    false otherwise.
 228      * @private
 229      */
 230     isNewChannelSwitcherUI_: function() {
 231       return !loadTimeData.valueExists('disableNewChannelSwitcherUI');
 232     },
 233
 234     /**
 235      * @return {boolean} True if target and current channels are not
 236      *     null and not equals
 237      * @private
 238      */
 239     channelsDiffer_: function() {
 240       var current = this.currentChannel_;
 241       var target = this.targetChannel_;
 242       return (current != null && target != null && current != target);
 243     },
 244
 245     /**
 246      * @private
 247      */
 248     setUpdateStatus_: function(status, message) {
 249       if (cr.isMac &&
 250           $('update-status-message') &&
 251           $('update-status-message').hidden) {
 252         // Chrome has reached the end of the line on this system. The
 253         // update-obsolete-system message is displayed. No other auto-update
 254         // status should be displayed.
 255         return;
 256       }
 257
 258       var channel = this.targetChannel_;
 259       if (status == 'checking') {
 260         this.setUpdateImage_('working');
 261         $('update-status-message').innerHTML =
 262             loadTimeData.getString('updateCheckStarted');
 263       } else if (status == 'updating') {
 264         this.setUpdateImage_('working');
 265         if (this.channelsDiffer_()) {
 266           $('update-status-message').innerHTML =
 267               loadTimeData.getStringF('updatingChannelSwitch',
 268                                       this.channelTable_[channel].label);
 269         } else {
 270           $('update-status-message').innerHTML =
 271               loadTimeData.getStringF('updating');
 272         }
 273       } else if (status == 'nearly_updated') {
 274         this.setUpdateImage_('up-to-date');
 275         if (this.channelsDiffer_()) {
 276           $('update-status-message').innerHTML =
 277               loadTimeData.getString('successfulChannelSwitch');
 278         } else {
 279           $('update-status-message').innerHTML =
 280               loadTimeData.getString('updateAlmostDone');
 281         }
 282       } else if (status == 'updated') {
 283         this.setUpdateImage_('up-to-date');
 284         $('update-status-message').innerHTML =
 285             loadTimeData.getString('upToDate');
 286       } else if (status == 'failed') {
 287         this.setUpdateImage_('failed');
 288         $('update-status-message').innerHTML = message;
 289       }
 290
 291       // Following invariant must be established at the end of this function:
 292       // { ~$('relaunch_and_powerwash').hidden -> $('relaunch').hidden }
 293       var relaunchAndPowerwashHidden = true;
 294       if ($('relaunch-and-powerwash')) {
 295         // It's allowed to do powerwash only for customer devices,
 296         // when user explicitly decides to update to a more stable
 297         // channel.
 298         relaunchAndPowerwashHidden =
 299             !this.powerwashAfterUpdate_ || status != 'nearly_updated';
 300         $('relaunch-and-powerwash').hidden = relaunchAndPowerwashHidden;
 301       }
 302
 303       var container = $('update-status-container');
 304       if (container) {
 305         container.hidden = status == 'disabled';
 306         $('relaunch').hidden =
 307             (status != 'nearly_updated') || !relaunchAndPowerwashHidden;
 308
 309         if (!cr.isMac)
 310           $('update-percentage').hidden = status != 'updating';
 311       }
 312     },
 313
 314     /**
 315      * @private
 316      */
 317     setProgress_: function(progress) {
 318       $('update-percentage').innerHTML = progress + '%';
 319     },
 320
 321     /**
 322      * @private
 323      */
 324     setAllowedConnectionTypesMsg_: function(message) {
 325       $('allowed-connection-types-message').innerText = message;
 326     },
 327
 328     /**
 329      * @private
 330      */
 331     showAllowedConnectionTypesMsg_: function(visible) {
 332       $('allowed-connection-types-message').hidden = !visible;
 333     },
 334
 335     /**
 336      * @private
 337      */
 338     setPromotionState_: function(state) {
 339       if (state == 'hidden') {
 340         $('promote').hidden = true;
 341       } else if (state == 'enabled') {
 342         $('promote').disabled = false;
 343         $('promote').hidden = false;
 344       } else if (state == 'disabled') {
 345         $('promote').disabled = true;
 346         $('promote').hidden = false;
 347       }
 348     },
 349
 350     /**
 351      * @private
 352      */
 353     setObsoleteSystem_: function(obsolete) {
 354       if (cr.isMac && $('update-obsolete-system-container')) {
 355         $('update-obsolete-system-container').hidden = !obsolete;
 356       }
 357     },
 358
 359     /**
 360      * @private
 361      */
 362     setObsoleteSystemEndOfTheLine_: function(endOfTheLine) {
 363       if (cr.isMac &&
 364           $('update-obsolete-system-container') &&
 365           !$('update-obsolete-system-container').hidden &&
 366           $('update-status-message')) {
 367         $('update-status-message').hidden = endOfTheLine;
 368         if (endOfTheLine) {
 369           this.setUpdateImage_('failed');
 370         }
 371       }
 372     },
 373
 374     /**
 375      * @private
 376      */
 377     setOSVersion_: function(version) {
 378       if (!cr.isChromeOS)
 379         console.error('OS version unsupported on non-CrOS');
 380
 381       $('os-version').parentNode.hidden = (version == '');
 382       $('os-version').textContent = version;
 383     },
 384
 385     /**
 386      * @private
 387      */
 388     setOSFirmware_: function(firmware) {
 389       if (!cr.isChromeOS)
 390         console.error('OS firmware unsupported on non-CrOS');
 391
 392       $('firmware').parentNode.hidden = (firmware == '');
 393       $('firmware').textContent = firmware;
 394     },
 395
 396     /**
 397      * Updates name of the current channel, i.e. the name of the
 398      * channel the device is currently on.
 399      * @param {string} channel The name of the current channel
 400      * @private
 401      */
 402     updateCurrentChannel_: function(channel) {
 403       if (this.channelList_.indexOf(channel) < 0)
 404         return;
 405       $('current-channel').textContent = loadTimeData.getStringF(
 406           'currentChannel', this.channelTable_[channel].label);
 407       this.currentChannel_ = channel;
 408       help.ChannelChangePage.updateCurrentChannel(channel);
 409     },
 410
 411     /**
 412      * |enabled| is true if the release channel can be enabled.
 413      * @private
 414      */
 415     updateEnableReleaseChannel_: function(enabled) {
 416       this.updateChannelChangerContainerVisibility_(enabled);
 417       $('change-channel').disabled = !enabled;
 418       $('channel-change-disallowed-icon').hidden = enabled;
 419     },
 420
 421     /**
 422      * Sets the device target channel.
 423      * @param {string} channel The name of the target channel
 424      * @param {boolean} isPowerwashAllowed True iff powerwash is allowed
 425      * @private
 426      */
 427     setChannel_: function(channel, isPowerwashAllowed) {
 428       this.powerwashAfterUpdate_ = isPowerwashAllowed;
 429       this.targetChannel_ = channel;
 430       chrome.send('setChannel', [channel, isPowerwashAllowed]);
 431       $('channel-change-confirmation').hidden = false;
 432       $('channel-change-confirmation').textContent = loadTimeData.getStringF(
 433           'channel-changed', this.channelTable_[channel].name);
 434     },
 435
 436     /**
 437      * Sets the value of the "Build Date" field of the "More Info" section.
 438      * @param {string} buildDate The date of the build.
 439      * @private
 440      */
 441     setBuildDate_: function(buildDate) {
 442       $('build-date-container').classList.remove('empty');
 443       $('build-date').textContent = buildDate;
 444     },
 445
 446     /**
 447      * Updates channel-change-page-container visibility according to
 448      * internal state.
 449      * @private
 450      */
 451     updateChannelChangePageContainerVisibility_: function() {
 452       if (!this.isNewChannelSwitcherUI_()) {
 453         $('channel-change-page-container').hidden = true;
 454         return;
 455       }
 456       $('channel-change-page-container').hidden =
 457           !help.ChannelChangePage.isPageReady();
 458     },
 459
 460     /**
 461      * Updates channel-changer dropdown visibility if |visible| is
 462      * true and new channel switcher UI is disallowed.
 463      * @param {boolean} visible True if channel-changer should be
 464      *     displayed, false otherwise.
 465      * @private
 466      */
 467     updateChannelChangerContainerVisibility_: function(visible) {
 468       if (this.isNewChannelSwitcherUI_()) {
 469         $('channel-changer').hidden = true;
 470         return;
 471       }
 472       $('channel-changer').hidden = !visible;
 473     },
 474   };
 475
 476   HelpPage.setUpdateStatus = function(status, message) {
 477     HelpPage.getInstance().setUpdateStatus_(status, message);
 478   };
 479
 480   HelpPage.setProgress = function(progress) {
 481     HelpPage.getInstance().setProgress_(progress);
 482   };
 483
 484   HelpPage.setAndShowAllowedConnectionTypesMsg = function(message) {
 485     HelpPage.getInstance().setAllowedConnectionTypesMsg_(message);
 486     HelpPage.getInstance().showAllowedConnectionTypesMsg_(true);
 487   };
 488
 489   HelpPage.showAllowedConnectionTypesMsg = function(visible) {
 490     HelpPage.getInstance().showAllowedConnectionTypesMsg_(visible);
 491   };
 492
 493   HelpPage.setPromotionState = function(state) {
 494     HelpPage.getInstance().setPromotionState_(state);
 495   };
 496
 497   HelpPage.setObsoleteSystem = function(obsolete) {
 498     HelpPage.getInstance().setObsoleteSystem_(obsolete);
 499   };
 500
 501   HelpPage.setObsoleteSystemEndOfTheLine = function(endOfTheLine) {
 502     HelpPage.getInstance().setObsoleteSystemEndOfTheLine_(endOfTheLine);
 503   };
 504
 505   HelpPage.setOSVersion = function(version) {
 506     HelpPage.getInstance().setOSVersion_(version);
 507   };
 508
 509   HelpPage.setOSFirmware = function(firmware) {
 510     HelpPage.getInstance().setOSFirmware_(firmware);
 511   };
 512
 513   HelpPage.showOverlay = function(name) {
 514     HelpPage.getInstance().showOverlay(name);
 515   };
 516
 517   HelpPage.cancelOverlay = function() {
 518     HelpPage.getInstance().closeOverlay();
 519   };
 520
 521   HelpPage.getTopmostVisiblePage = function() {
 522     return HelpPage.getInstance().getTopmostVisiblePage();
 523   };
 524
 525   HelpPage.updateIsEnterpriseManaged = function(isEnterpriseManaged) {
 526     if (!cr.isChromeOS)
 527       return;
 528     help.ChannelChangePage.updateIsEnterpriseManaged(isEnterpriseManaged);
 529   };
 530
 531   HelpPage.updateCurrentChannel = function(channel) {
 532     if (!cr.isChromeOS)
 533       return;
 534     HelpPage.getInstance().updateCurrentChannel_(channel);
 535   };
 536
 537   HelpPage.updateTargetChannel = function(channel) {
 538     if (!cr.isChromeOS)
 539       return;
 540     help.ChannelChangePage.updateTargetChannel(channel);
 541   };
 542
 543   HelpPage.updateEnableReleaseChannel = function(enabled) {
 544     HelpPage.getInstance().updateEnableReleaseChannel_(enabled);
 545   };
 546
 547   HelpPage.setChannel = function(channel, isPowerwashAllowed) {
 548     HelpPage.getInstance().setChannel_(channel, isPowerwashAllowed);
 549   };
 550
 551   HelpPage.setBuildDate = function(buildDate) {
 552     HelpPage.getInstance().setBuildDate_(buildDate);
 553   };
 554
 555   HelpPage.updateChannelChangePageContainerVisibility = function() {
 556     HelpPage.getInstance().updateChannelChangePageContainerVisibility_();
 557   };
 558
 559   // Export
 560   return {
 561     HelpPage: HelpPage
 562   };
 563 });
 564
 565 /**
 566  * onload listener to initialize the HelpPage.
 567  */
 568 window.onload = function() {
 569   help.HelpPage.getInstance().initialize();
 570 };