Display material design policies grouped by tags.

chrome/browser/resources/md_policy/md_policy.js

Index: chrome/browser/resources/md_policy/md_policy.js
diff --git a/chrome/browser/resources/md_policy/md_policy.js b/chrome/browser/resources/md_policy/md_policy.js
new file mode 100644
index 0000000000000000000000000000000000000000..171ba2e9a9dddc35f09554c02ba0153738739dfd
--- /dev/null
+++ b/chrome/browser/resources/md_policy/md_policy.js
@@ -0,0 +1,125 @@
+// Copyright 2015 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/**
+ * @fileoverview
+ * 'cr-policy-ui' is the main MD element, combining the UI and models.
+ *
+ * Example:
+ *
+ *    <cr-policy-ui></cr-policy-ui>
+ *
+ * @group Chrome Policy Elements
+ * @element cr-policy-ui
+ */
+Polymer({
+  is: 'cr-policy-ui',
+
+  /** @override */
+  created: function() {
+    this.tagGroups = [];
+  },
+
+  /** @override */
+  ready: function() {
+    this.introduction = {
+      title: loadTimeData.getString('title'),
+      // TODO(fhorschig): i18n! Replace sample text with reviewed message.
+      text:
+      'Your device and your user account are managed which means that ' +
+      'some of your settings are fixed by your administrator.\n' +
+      'The cards below explain how the administrator\'s choices may ' +
+      'impact your privacy or security.'
+    };
+
+    // Set this element as receiver of calls to the Page.
+    policy.Page = this;
+
+    // Notify the browser that the page has loaded, causing it to send the
+    // list of all known policies, the current policy values and the cloud
+    // policy status.
+    chrome.send('initialized');
+  },
+
+  /**
+   * Creates CrPolicyGroup and inserts it to list of known tags.
+   * @private
+   * @param {string} tag Name of the tag (included in i18n strings).
+   */
+  createTagGroup_: function(tag) {
+    var domNode = new CrPolicyGroup(loadTimeData.getString(tag));
+    this.tagGroups.push({
+      name: tag,
+      element: domNode
+    });
+    this.$.groups.appendChild(domNode);
+  },
+
+  /**
+   * Receives an list of known tags and creates an empty policy list for each.
+   * @param {Array} tagObject List of tags.
+   */
+  setPolicyGroups: function(tags) {
+    this.clearGroups_();
+    tags.forEach(this.createTagGroup_.bind(this));
+  },
+
+  /**
+   * Creates UI elements for tagged policies within the passed |names| object.
+   * @param {Object} names Dictionary of policy names mapping to tags.
+   */
+  setPolicyNames: function(names) {
+    for (var name in names.chromePolicyNames) {
+      names.chromePolicyNames[name].forEach(
+          this.addNameToTagGroup_.bind(this, name));
+    }
+  },
+
+  /**
+   * Receives a list of current values that it hands down to children.
+   * @param {Object} values Dictionary containing the current policy values.
+   */
+  setPolicyValues: function(values) {
+    // TODO(fhorschig): Update or notify |this.tagGroups|.
+  },
+
+  /**
+   * Receives an object with meta data about the currently set policies.
+   * @param {Object} status Dictionary containing meta data about set policies.
+   */
+  setStatus: function(status) {
+    // TODO(fhorschig): Update |this.$.introduction| with status information.
+    // text according to policy status.
+  },
+
+  /**
+   * Looks for the existing CrPolicyGroup matching the |tag| and triggers adding
+   * the policy to it.
+   * @private
+   * @param {string} name Name of the policy.
+   * @param {string} tag Name of the policy's tag.
+   */
+  addNameToTagGroup_: function(name, tag) {
+    var pos = 0;
+    while (pos < this.tagGroups.length &&
+           this.tagGroups[pos].name != tag)
+      ++pos;
+    this.tagGroups[pos].element.addPolicy(name);
+  },
+
+  /**
+   * Removes DOM Elements and empties list of known tags.
+   * @private
+   */
+  clearGroups_: function() {
+    this.tagGroups = [];
+    while (this.$.groups.firstChild)
+        this.$.groups.removeChild(this.$.groups.firstChild);
+  }
+});
+
+// Define a global entry point that will be set when the page is initialized.
+cr.define('policy', function() {
+  return { Page: null };
+});