diff options
Diffstat (limited to 'chrome/browser/resources/policy.js')
-rw-r--r-- | chrome/browser/resources/policy.js | 175 |
1 files changed, 152 insertions, 23 deletions
diff --git a/chrome/browser/resources/policy.js b/chrome/browser/resources/policy.js index db4f404..c86611d 100644 --- a/chrome/browser/resources/policy.js +++ b/chrome/browser/resources/policy.js @@ -2,13 +2,17 @@ // Use of this source code is governed by a BSD-style license that can be // found in the LICENSE file. -var localStrings = new LocalStrings(); - /** * This variable structure is here to document the structure that the template * expects to correctly populate the page. */ -var policyDataformat = { +var policyDataFormat = { + // Whether any of the policies in 'policies' have a value. + 'anyPoliciesSet': true, + + // False if the policy information is being sent due to an initial page load + // and true if it is being sent due to a change of policy values. + 'isPolicyUpdate': false, 'policies': [ { 'level': 'managed', @@ -16,10 +20,22 @@ var policyDataformat = { 'set': true, 'sourceType': 'Device', 'status': 'ok', - 'value': true, - }, + 'value': true + } ], - 'anyPoliciesSet': true + 'status': { + 'deviceFetchInterval': '8min', + 'deviceId': 'D2AC39A2-3C8FC-E2C0-E45D2DC3782C', + 'deviceLastFetchTime': '9:50 PM', + 'devicePolicyDomain': 'google.com', + 'deviceStatusMessage': 'OK', + 'displayStatusSection': true, + 'user': 'simo@google.com', + 'userFetchInterval': '8min', + 'userId': 'D2AC39A2-3C8FC-E2C0-E45D2DC3782C', + 'userLastFetchTime': '9:50 PM', + 'userStatusMessage': 'OK' + } }; cr.define('policies', function() { @@ -45,23 +61,28 @@ cr.define('policies', function() { searchTerm_: '', /** - * Takes the |policyData| input argument which represents data about the - * policies supported by the device/client and populates the html jstemplate - * with that data. It expects an object structure like the above. - * @param {Object} policyData Detailed info about policies + * Takes the |policyData| argument and populates the page with this data. It + * expects an object structure like the policyDataFormat above. + * @param {Object} policyData Detailed info about policies. */ renderTemplate: function(policyData) { this.noActivePolicies_ = !policyData.anyPoliciesSet; + if (this.noActivePolicies_) + $('no-policies').hidden = false; + if (policyData.status.displayStatusSection) + $('status-section').hidden = false;; + // This is the javascript code that processes the template: var input = new JsEvalContext(policyData); - var output = $('policiesTemplate'); + var output = $('data-template'); jstProcess(input, output); + this.setToggleEventHandlers_(); }, /** * Filters the table of policies by name. - * @param {string} term The search string + * @param {string} term The search string. */ filterTable: function(term) { this.searchTerm_ = term.toLowerCase(); @@ -104,41 +125,149 @@ cr.define('policies', function() { // Filter table again in case a search was active. this.filterTable(this.searchTerm_); + }, + + /** + * Set event handlers for the "Show more"/"Hide" links generated by + * jstemplate. + * @private + */ + setToggleEventHandlers_: function() { + var toggles = document.querySelectorAll('.policy-set * .toggler'); + for (var i = 0; i < toggles.length; i++) { + toggles[i].onclick = function() { + Policy.getInstance().toggleCellExpand_(this); + }; + } + }, + + /** + * Expands or collapses a table cell that has overflowing text. + * @param {Object} toggler The toggler that was clicked on. + * @private + */ + toggleCellExpand_: function(toggler) { + var tableCell = toggler.parentElement; + var textContainer = tableCell.querySelector('.text-container'); + + if (textContainer.collapsed) + this.expandCell_(textContainer); + else + this.collapseCell_(textContainer); + + textContainer.collapsed = !textContainer.collapsed; + var expand = tableCell.querySelector('.expand'); + var collapse = tableCell.querySelector('.collapse'); + expand.style.display = textContainer.collapsed ? '' : 'none'; + collapse.style.display = textContainer.collapsed ? 'none' : ''; + }, + + /** + * Collapses all expanded table cells and updates the visibility of the + * toggles accordingly. Should be called before the policy information in + * the table is updated. + */ + collapseExpandedCells: function() { + var toggles = document.querySelectorAll('.policy-set * .toggler'); + for (var i = 0; i < toggles.length; i++) + toggles[i].style.display = 'none'; + + var textContainers = document.querySelectorAll('.expanded'); + for (var i = 0; i < textContainers.length; i++) + this.collapseCell_(textContainers[i]); + }, + + /** + * Expands a table cell so that all the text it contains is visible. + * @param {Object} textContainer The cell's div element that contains the + * text. + * @private + */ + expandCell_: function(textContainer) { + textContainer.classList.remove('collapsed'); + textContainer.classList.add('expanded'); + }, + + /** + * Collapses a table cell so that overflowing text is hidden. + * @param {Object} textContainer The cell's div element that contains the + * text. + * @private + */ + collapseCell_: function(textContainer) { + textContainer.classList.remove('expanded'); + textContainer.classList.add('collapsed'); } }; /** - * Asks the C++ PolicyUIHandler to get details about policies. The - * PolicyDOMHandler should reply to returnPolicyData() (below). + * Asks the C++ PolicyUIHandler to get details about policies and status + * information. The PolicyUIHandler should reply to returnData() (below). */ - Policy.requestPolicyData = function() { - chrome.send('requestPolicyData'); + Policy.requestData = function() { + chrome.send('requestData'); }; /** - * Called by the C++ PolicyUIHandler when it has the requested policy data. + * Called by the C++ PolicyUIHandler when it has the requested data. + * @param {Object} policyData The policy information in the format described + * by the policyDataFormat. */ - Policy.returnPolicyData = function(policyData) { - Policy.getInstance().renderTemplate(policyData); + Policy.returnData = function(policyData) { + if (policyData.isPolicyUpdate) { + Policy.getInstance().collapseExpandedCells(); + Policy.getInstance().renderTemplate(policyData); + Policy.getInstance().updatePolicyVisibility(); + } else { + Policy.getInstance().renderTemplate(policyData); + } + }; + + /** + * Asks the C++ PolicyUIHandler to re-fetch policy information. + */ + Policy.triggerPolicyFetch = function() { + chrome.send('fetchPolicy'); }; /** * Determines whether a policy should be visible or not. - * @param {policy} policy information in the format given by above the - * PolicyDataFormat + * @param {Object} policy An entry in the 'policies' array given by the above + * PolicyDataFormat. */ Policy.shouldDisplayPolicy = function(policy) { return $('toggle-unsent-policies').checked || policy.set; }; /** - * Initializes the page and loads the list of policies. + * Returns true if the "Show more" toggle should appear in a table cell and + * false if not. + * @param {Object} expandToggle The "Show more" DOM element. + */ + Policy.shouldShowExpand = function(expandToggle) { + var textContainer = + expandToggle.parentNode.querySelector('.text-container'); + textContainer.collapsed = true; + var cellText = textContainer.querySelector('.cell-text'); + + // If the text is wider than the text container, the expand toggler should + // appear. + return textContainer.offsetWidth < cellText.offsetWidth; + }; + + /** + * Initializes the page and loads the list of policies and the policy + * status data. */ Policy.initialize = function() { i18nTemplate.process(document, templateData); - Policy.requestPolicyData(); + Policy.requestData(); // Set HTML event handlers. + $('fetch-policies-button').onclick = function(event) { + Policy.triggerPolicyFetch(); + } + $('toggle-unsent-policies').onchange = function(event) { Policy.getInstance().updatePolicyVisibility(); }; |