Merge "Adds user settings/preferences page"
This commit is contained in:
		@@ -82,6 +82,7 @@ limitations under the License.
 | 
			
		||||
              <div>[[account.email]]</div>
 | 
			
		||||
            </div>
 | 
			
		||||
          </li>
 | 
			
		||||
          <li><a href$="[[_computeRelativeURL('/settings')]]">Settings</a></li>
 | 
			
		||||
          <li><a href$="[[_computeRelativeURL('/switch-account')]]">Switch account</a></li>
 | 
			
		||||
          <li><a href$="[[_computeRelativeURL('/logout')]]">Sign out</a></li>
 | 
			
		||||
        </ul>
 | 
			
		||||
 
 | 
			
		||||
@@ -132,6 +132,16 @@
 | 
			
		||||
      }
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    page(/^\/settings\/?/, function(data) {
 | 
			
		||||
      restAPI.getLoggedIn().then(function(loggedIn) {
 | 
			
		||||
        if (loggedIn) {
 | 
			
		||||
          app.params = {view: 'gr-settings-view'};
 | 
			
		||||
        } else {
 | 
			
		||||
          page.show('/login/' + encodeURIComponent(data.canonicalPath));
 | 
			
		||||
        }
 | 
			
		||||
      });
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    page.start();
 | 
			
		||||
  });
 | 
			
		||||
})();
 | 
			
		||||
 
 | 
			
		||||
@@ -27,6 +27,7 @@ limitations under the License.
 | 
			
		||||
<link rel="import" href="./change-list/gr-dashboard-view/gr-dashboard-view.html">
 | 
			
		||||
<link rel="import" href="./change/gr-change-view/gr-change-view.html">
 | 
			
		||||
<link rel="import" href="./diff/gr-diff-view/gr-diff-view.html">
 | 
			
		||||
<link rel="import" href="./settings/gr-settings-view/gr-settings-view.html">
 | 
			
		||||
 | 
			
		||||
<link rel="import" href="./shared/gr-overlay/gr-overlay.html">
 | 
			
		||||
<link rel="import" href="./shared/gr-rest-api-interface/gr-rest-api-interface.html">
 | 
			
		||||
@@ -109,6 +110,9 @@ limitations under the License.
 | 
			
		||||
            params="[[params]]"
 | 
			
		||||
            change-view-state="{{_viewState.changeView}}"></gr-diff-view>
 | 
			
		||||
      </template>
 | 
			
		||||
      <template is="dom-if" if="[[_showSettingsView]]" restamp="true">
 | 
			
		||||
        <gr-settings-view></gr-settings-view>
 | 
			
		||||
      </template>
 | 
			
		||||
      <div id="errorView" class="errorView" hidden>
 | 
			
		||||
        <div class="errorEmoji">[[_lastError.emoji]]</div>
 | 
			
		||||
        <div class="errorText">[[_lastError.text]]</div>
 | 
			
		||||
 
 | 
			
		||||
@@ -40,6 +40,7 @@
 | 
			
		||||
      _showDashboardView: Boolean,
 | 
			
		||||
      _showChangeView: Boolean,
 | 
			
		||||
      _showDiffView: Boolean,
 | 
			
		||||
      _showSettingsView: Boolean,
 | 
			
		||||
      _viewState: Object,
 | 
			
		||||
      _lastError: Object,
 | 
			
		||||
    },
 | 
			
		||||
@@ -102,6 +103,7 @@
 | 
			
		||||
      this.set('_showDashboardView', view === 'gr-dashboard-view');
 | 
			
		||||
      this.set('_showChangeView', view === 'gr-change-view');
 | 
			
		||||
      this.set('_showDiffView', view === 'gr-diff-view');
 | 
			
		||||
      this.set('_showSettingsView', view === 'gr-settings-view');
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    _loadPlugins: function(plugins) {
 | 
			
		||||
@@ -130,6 +132,7 @@
 | 
			
		||||
        '_showDashboardView',
 | 
			
		||||
        '_showChangeView',
 | 
			
		||||
        '_showDiffView',
 | 
			
		||||
        '_showSettingsView',
 | 
			
		||||
      ].forEach(function(showProp) {
 | 
			
		||||
        this.set(showProp, false);
 | 
			
		||||
      }.bind(this));
 | 
			
		||||
 
 | 
			
		||||
@@ -0,0 +1,96 @@
 | 
			
		||||
<!--
 | 
			
		||||
Copyright (C) 2016 The Android Open Source Project
 | 
			
		||||
 | 
			
		||||
Licensed under the Apache License, Version 2.0 (the "License");
 | 
			
		||||
you may not use this file except in compliance with the License.
 | 
			
		||||
You may obtain a copy of the License at
 | 
			
		||||
 | 
			
		||||
http://www.apache.org/licenses/LICENSE-2.0
 | 
			
		||||
 | 
			
		||||
Unless required by applicable law or agreed to in writing, software
 | 
			
		||||
distributed under the License is distributed on an "AS IS" BASIS,
 | 
			
		||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 | 
			
		||||
See the License for the specific language governing permissions and
 | 
			
		||||
limitations under the License.
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<link rel="import" href="../../../bower_components/polymer/polymer.html">
 | 
			
		||||
<link rel="import" href="../../shared/gr-date-formatter/gr-date-formatter.html">
 | 
			
		||||
<link rel="import" href="../../shared/gr-rest-api-interface/gr-rest-api-interface.html">
 | 
			
		||||
 | 
			
		||||
<dom-module id="gr-settings-view">
 | 
			
		||||
  <template>
 | 
			
		||||
    <style>
 | 
			
		||||
      :host {
 | 
			
		||||
        background-color: var(--view-background-color);
 | 
			
		||||
        display: block;
 | 
			
		||||
      }
 | 
			
		||||
      fieldset {
 | 
			
		||||
        border: none;
 | 
			
		||||
        display: table;
 | 
			
		||||
      }
 | 
			
		||||
      section {
 | 
			
		||||
        display: table-row;
 | 
			
		||||
      }
 | 
			
		||||
      section:not(:first-of-type) {
 | 
			
		||||
        margin-top: 1em;
 | 
			
		||||
      }
 | 
			
		||||
      section:not(:first-of-type) .title,
 | 
			
		||||
      section:not(:first-of-type) .value {
 | 
			
		||||
        padding-top: .5em;
 | 
			
		||||
      }
 | 
			
		||||
      .title,
 | 
			
		||||
      .value {
 | 
			
		||||
        display: table-cell;
 | 
			
		||||
        vertical-align: top;
 | 
			
		||||
      }
 | 
			
		||||
      .title {
 | 
			
		||||
        color: #666;
 | 
			
		||||
        font-weight: bold;
 | 
			
		||||
        padding-right: .5em;
 | 
			
		||||
      }
 | 
			
		||||
      .loading {
 | 
			
		||||
        color: #666;
 | 
			
		||||
        padding: 1em var(--default-horizontal-margin);
 | 
			
		||||
      }
 | 
			
		||||
      @media only screen and (max-width: 50em) {
 | 
			
		||||
        .loading {
 | 
			
		||||
          padding: 0 var(--default-horizontal-margin);
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
    </style>
 | 
			
		||||
    <div class="loading" hidden$="[[!_loading]]">Loading...</div>
 | 
			
		||||
    <div hidden$="[[_loading]]" hidden>
 | 
			
		||||
      <h1>User Settings</h1>
 | 
			
		||||
      <h2>Profile</h2>
 | 
			
		||||
      <fieldset>
 | 
			
		||||
        <section>
 | 
			
		||||
          <span class="title">ID</span>
 | 
			
		||||
          <span class="value">[[account._account_id]]</span>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section>
 | 
			
		||||
          <span class="title">Name</span>
 | 
			
		||||
          <span class="value">[[account.name]]</span>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section>
 | 
			
		||||
          <span class="title">Email</span>
 | 
			
		||||
          <span class="value">[[account.email]]</span>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section hidden$="[[!account.username]]">
 | 
			
		||||
          <span class="title">Username</span>
 | 
			
		||||
          <span class="value">[[account.username]]</span>
 | 
			
		||||
        </section>
 | 
			
		||||
        <section>
 | 
			
		||||
          <span class="title">Registered</span>
 | 
			
		||||
          <span class="value">
 | 
			
		||||
            <gr-date-formatter
 | 
			
		||||
                date-str="[[account.registered_on]]"></gr-date-formatter>
 | 
			
		||||
          </span>
 | 
			
		||||
        </section>
 | 
			
		||||
      </fieldset>
 | 
			
		||||
    </div>
 | 
			
		||||
    <gr-rest-api-interface id="restAPI"></gr-rest-api-interface>
 | 
			
		||||
  </template>
 | 
			
		||||
  <script src="../../../scripts/util.js"></script>
 | 
			
		||||
  <script src="gr-settings-view.js"></script>
 | 
			
		||||
</dom-module>
 | 
			
		||||
@@ -0,0 +1,56 @@
 | 
			
		||||
// Copyright (C) 2016 The Android Open Source Project
 | 
			
		||||
//
 | 
			
		||||
// Licensed under the Apache License, Version 2.0 (the "License");
 | 
			
		||||
// you may not use this file except in compliance with the License.
 | 
			
		||||
// You may obtain a copy of the License at
 | 
			
		||||
//
 | 
			
		||||
// http://www.apache.org/licenses/LICENSE-2.0
 | 
			
		||||
//
 | 
			
		||||
// Unless required by applicable law or agreed to in writing, software
 | 
			
		||||
// distributed under the License is distributed on an "AS IS" BASIS,
 | 
			
		||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 | 
			
		||||
// See the License for the specific language governing permissions and
 | 
			
		||||
// limitations under the License.
 | 
			
		||||
(function() {
 | 
			
		||||
  'use strict';
 | 
			
		||||
 | 
			
		||||
  Polymer({
 | 
			
		||||
    is: 'gr-settings-view',
 | 
			
		||||
 | 
			
		||||
    properties: {
 | 
			
		||||
      account: {
 | 
			
		||||
        type: Object,
 | 
			
		||||
        value: function() { return {}; },
 | 
			
		||||
      },
 | 
			
		||||
      prefs: {
 | 
			
		||||
        type: Object,
 | 
			
		||||
        value: function() { return {}; },
 | 
			
		||||
      },
 | 
			
		||||
      _loading: {
 | 
			
		||||
        type: Boolean,
 | 
			
		||||
        value: true,
 | 
			
		||||
      },
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    attached: function() {
 | 
			
		||||
      var promises = [];
 | 
			
		||||
 | 
			
		||||
      promises.push(this.$.restAPI.getAccount().then(function(account) {
 | 
			
		||||
        this.account = account;
 | 
			
		||||
      }.bind(this)));
 | 
			
		||||
 | 
			
		||||
      promises.push(this.$.restAPI.getPreferences().then(function(prefs) {
 | 
			
		||||
        this.prefs = prefs;
 | 
			
		||||
      }.bind(this)));
 | 
			
		||||
 | 
			
		||||
      Promise.all(promises).then(function() {
 | 
			
		||||
        this._loading = false;
 | 
			
		||||
      }.bind(this));
 | 
			
		||||
    },
 | 
			
		||||
 | 
			
		||||
    _computeRegistered: function(registered) {
 | 
			
		||||
      if (!registered) { return ''; }
 | 
			
		||||
      return util.parseDate(registered).toGMTString();
 | 
			
		||||
    },
 | 
			
		||||
  });
 | 
			
		||||
})();
 | 
			
		||||
@@ -0,0 +1,83 @@
 | 
			
		||||
<!DOCTYPE html>
 | 
			
		||||
<!--
 | 
			
		||||
Copyright (C) 2016 The Android Open Source Project
 | 
			
		||||
 | 
			
		||||
Licensed under the Apache License, Version 2.0 (the "License");
 | 
			
		||||
you may not use this file except in compliance with the License.
 | 
			
		||||
You may obtain a copy of the License at
 | 
			
		||||
 | 
			
		||||
http://www.apache.org/licenses/LICENSE-2.0
 | 
			
		||||
 | 
			
		||||
Unless required by applicable law or agreed to in writing, software
 | 
			
		||||
distributed under the License is distributed on an "AS IS" BASIS,
 | 
			
		||||
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 | 
			
		||||
See the License for the specific language governing permissions and
 | 
			
		||||
limitations under the License.
 | 
			
		||||
-->
 | 
			
		||||
 | 
			
		||||
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
 | 
			
		||||
<title>gr-settings-view</title>
 | 
			
		||||
 | 
			
		||||
<script src="../../../bower_components/webcomponentsjs/webcomponents.min.js"></script>
 | 
			
		||||
<script src="../../../bower_components/web-component-tester/browser.js"></script>
 | 
			
		||||
 | 
			
		||||
<link rel="import" href="../../../bower_components/iron-test-helpers/iron-test-helpers.html">
 | 
			
		||||
<link rel="import" href="gr-settings-view.html">
 | 
			
		||||
 | 
			
		||||
<test-fixture id="basic">
 | 
			
		||||
  <template>
 | 
			
		||||
    <gr-settings-view></gr-settings-view>
 | 
			
		||||
  </template>
 | 
			
		||||
</test-fixture>
 | 
			
		||||
 | 
			
		||||
<script>
 | 
			
		||||
  suite('gr-settings-view tests', function() {
 | 
			
		||||
    var element;
 | 
			
		||||
    var account;
 | 
			
		||||
    var preferences;
 | 
			
		||||
 | 
			
		||||
    setup(function(done) {
 | 
			
		||||
      account = {
 | 
			
		||||
        _account_id: 123,
 | 
			
		||||
        name: 'user name',
 | 
			
		||||
        email: 'user@email',
 | 
			
		||||
        username: 'user username',
 | 
			
		||||
        registered: '2000-01-01 00:00:00.000000000',
 | 
			
		||||
      };
 | 
			
		||||
      preferences = {time_format: 'HHMM_12'};
 | 
			
		||||
 | 
			
		||||
      stub('gr-rest-api-interface', {
 | 
			
		||||
        getLoggedIn: function() { return Promise.resolve(true); },
 | 
			
		||||
        getAccount: function() { return Promise.resolve(account); },
 | 
			
		||||
        getPreferences: function() { return Promise.resolve(preferences); },
 | 
			
		||||
      });
 | 
			
		||||
      element = fixture('basic');
 | 
			
		||||
 | 
			
		||||
      // Allow the element to render.
 | 
			
		||||
      element.async(done, 1);
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    test('render', function() {
 | 
			
		||||
      assert.isFalse(element._loading);
 | 
			
		||||
 | 
			
		||||
      var sections = element.$$('fieldset').querySelectorAll('section');
 | 
			
		||||
 | 
			
		||||
      function valueOf(title) {
 | 
			
		||||
        var titleEl;
 | 
			
		||||
        for (var i = 0; i < sections.length; i++) {
 | 
			
		||||
          titleEl = sections[i].querySelector('.title');
 | 
			
		||||
          if (titleEl.textContent === title) {
 | 
			
		||||
            return sections[i].querySelector('.value').textContent;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      assert.equal(valueOf('ID'), account._account_id);
 | 
			
		||||
      assert.equal(valueOf('Name'), account.name);
 | 
			
		||||
      assert.equal(valueOf('Email'), account.email);
 | 
			
		||||
      assert.equal(valueOf('Username'), account.username);
 | 
			
		||||
      assert.equal(element._computeRegistered(element.account.registered),
 | 
			
		||||
          'Sat, 01 Jan 2000 00:00:00 GMT');
 | 
			
		||||
    });
 | 
			
		||||
  });
 | 
			
		||||
</script>
 | 
			
		||||
@@ -52,6 +52,7 @@ limitations under the License.
 | 
			
		||||
    'diff/gr-diff/gr-diff_test.html',
 | 
			
		||||
    'diff/gr-patch-range-select/gr-patch-range-select_test.html',
 | 
			
		||||
    'diff/gr-selection-action-box/gr-selection-action-box_test.html',
 | 
			
		||||
    'settings/gr-settings-view/gr-settings-view_test.html',
 | 
			
		||||
    'shared/gr-account-label/gr-account-label_test.html',
 | 
			
		||||
    'shared/gr-account-link/gr-account-link_test.html',
 | 
			
		||||
    'shared/gr-alert/gr-alert_test.html',
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user