src/chrome/browser/resources/components.js

   1 // Copyright 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 'use strict';
   6
   7 /**
   8  * Takes the |componentsData| input argument which represents data about the
   9  * currently installed components and populates the html jstemplate with
  10  * that data. It expects an object structure like the above.
  11  * @param {Object} componentsData Detailed info about installed components.
  12  *      Same expected format as returnComponentsData().
  13  */
  14 function renderTemplate(componentsData) {
  15   // This is the javascript code that processes the template:
  16   var input = new JsEvalContext(componentsData);
  17   var output = $('component-template').cloneNode(true);
  18   $('component-placeholder').innerHTML = '';
  19   $('component-placeholder').appendChild(output);
  20   jstProcess(input, output);
  21   output.removeAttribute('hidden');
  22 }
  23
  24 /**
  25  * Asks the C++ ComponentsDOMHandler to get details about the installed
  26  * components.
  27  * The ComponentsDOMHandler should reply to returnComponentsData() (below).
  28  */
  29 function requestComponentsData() {
  30   chrome.send('requestComponentsData');
  31 }
  32
  33 /**
  34  * Called by the WebUI to re-populate the page with data representing the
  35  * current state of installed components.
  36  * @param {Object} componentsData Detailed info about installed components. The
  37  *     template expects each component's format to match the following
  38  *     structure to correctly populate the page:
  39  *   {
  40  *     components: [
  41  *       {
  42  *          name: 'Component1',
  43  *          version: '1.2.3',
  44  *       },
  45  *       {
  46  *          name: 'Component2',
  47  *          version: '4.5.6',
  48  *       },
  49  *     ]
  50  *   }
  51  */
  52 function returnComponentsData(componentsData) {
  53   var bodyContainer = $('body-container');
  54   var body = document.body;
  55
  56   bodyContainer.style.visibility = 'hidden';
  57   body.className = '';
  58
  59   renderTemplate(componentsData);
  60
  61   // Add handlers to dynamically created HTML elements.
  62   var links = document.getElementsByClassName('button-check-update');
  63   for (var i = 0; i < links.length; i++) {
  64     links[i].onclick = function(e) {
  65       handleCheckUpdate(this);
  66       e.preventDefault();
  67     };
  68   }
  69
  70   // Disable some controls for Guest in ChromeOS.
  71   if (cr.isChromeOS)
  72     uiAccountTweaks.UIAccountTweaks.applyGuestModeVisibility(document);
  73
  74   bodyContainer.style.visibility = 'visible';
  75   body.className = 'show-tmi-mode-initial';
  76 }
  77
  78 /**
  79  * This event function is called from component UI indicating changed state
  80  * of component updater service.
  81  * @param {Object} eventArgs Contains event and component ID. Component ID is
  82  * optional.
  83  */
  84 function onComponentEvent(eventArgs) {
  85   if (eventArgs['id']) {
  86     var id = eventArgs['id'];
  87     $('status-' + id).textContent = eventArgs['event'];
  88   }
  89 }
  90
  91 /**
  92  * Handles an 'enable' or 'disable' button getting clicked.
  93  * @param {HTMLElement} node The HTML element representing the component
  94  *     being checked for update.
  95  */
  96 function handleCheckUpdate(node) {
  97   $('status-' + String(node.id)).textContent =
  98       loadTimeData.getString('checkingLabel');
  99
 100   // Tell the C++ ComponentssDOMHandler to check for update.
 101   chrome.send('checkUpdate', [String(node.id)]);
 102 }
 103
 104 // Get data and have it displayed upon loading.
 105 document.addEventListener('DOMContentLoaded', requestComponentsData);