| <!-- |
| Copyright (C) 2015 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="../behaviors/keyboard-shortcut-behavior.html"> |
| <link rel="import" href="../styles/app-theme.html"> |
| <link rel="import" href="gr-account-dropdown.html"> |
| <link rel="import" href="gr-ajax.html"> |
| <link rel="import" href="gr-change-list-view.html"> |
| <link rel="import" href="gr-change-view.html"> |
| <link rel="import" href="gr-dashboard-view.html"> |
| <link rel="import" href="gr-diff-view.html"> |
| <link rel="import" href="gr-keyboard-shortcuts-dialog.html"> |
| <link rel="import" href="gr-overlay.html"> |
| <link rel="import" href="gr-search-bar.html"> |
| |
| <script src="../bower_components/page/page.js"></script> |
| <script src="../scripts/app.js"></script> |
| <script src="../scripts/util.js"></script> |
| |
| <dom-module id="gr-app"> |
| <template> |
| <style> |
| :host { |
| background-color: var(--secondary-color); |
| display: flex; |
| min-height: 100vh; |
| flex-direction: column; |
| } |
| header, |
| footer { |
| background-color: var(--primary-color); |
| color: var(--primary-text-color); |
| padding: .5rem 1.25rem; |
| } |
| header { |
| align-items: center; |
| display: flex; |
| overflow: hidden; |
| } |
| main { |
| flex: 1; |
| } |
| .bigTitle { |
| color: var(--primary-text-color); |
| font-size: 1.75em; |
| text-decoration: none; |
| } |
| .bigTitle:hover { |
| text-decoration: underline; |
| } |
| .headerRightItems { |
| display: flex; |
| flex: 1; |
| justify-content: flex-end; |
| } |
| gr-search-bar { |
| margin-left: .5em; |
| width: 500px; |
| } |
| .accountContainer:not(.loggedIn):not(.loggedOut) .loginButton, |
| .accountContainer:not(.loggedIn):not(.loggedOut) gr-account-dropdown, |
| .accountContainer.loggedIn .loginButton, |
| .accountContainer.loggedOut gr-account-dropdown { |
| display: none; |
| } |
| .accountContainer { |
| align-items: center; |
| display: flex; |
| margin-left: var(--default-horizontal-margin); |
| white-space: nowrap; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| } |
| .feedback { |
| color: #b71c1c; |
| } |
| @media screen and (max-width: 60em) { |
| .bigTitle { |
| font-size: 14px; |
| font-weight: bold; |
| } |
| gr-search-bar { |
| display: none; |
| } |
| .accountContainer { |
| margin-left: .5em !important; |
| } |
| } |
| </style> |
| <gr-ajax auto url="/accounts/self/detail" last-response="{{account}}"></gr-ajax> |
| <gr-ajax auto url="/config/server/info" last-response="{{config}}"></gr-ajax> |
| <gr-ajax auto url="/config/server/version" last-response="{{version}}"></gr-ajax> |
| <gr-ajax id="diffPreferencesXHR" |
| url="/accounts/self/preferences.diff" |
| last-response="{{_diffPreferences}}"></gr-ajax> |
| <header role="banner"> |
| <a href="/" class="bigTitle">PolyGerrit</a> |
| <div class="headerRightItems"> |
| <gr-search-bar value="{{params.query}}" role="search"></gr-search-bar> |
| <div class="accountContainer" id="accountContainer"> |
| <a class="loginButton" href="/login" on-tap="_loginTapHandler">Login</a> |
| <gr-account-dropdown account="[[account]]"></gr-account-dropdown> |
| </div> |
| </div> |
| </header> |
| <main> |
| <template is="dom-if" if="{{_showChangeListView}}" restamp="true"> |
| <gr-change-list-view |
| params="[[params]]" |
| view-state="{{_viewState.changeListView}}" |
| logged-in="[[_computeLoggedIn(account)]]"></gr-change-list-view> |
| </template> |
| <template is="dom-if" if="{{_showDashboardView}}" restamp="true"> |
| <gr-dashboard-view |
| params="[[params]]" |
| view-state="{{_viewState.dashboardView}}"></gr-dashboard-view> |
| </template> |
| <template is="dom-if" if="{{_showChangeView}}" restamp="true"> |
| <gr-change-view |
| params="[[params]]" |
| server-config="[[config]]" |
| view-state="{{_viewState.changeView}}"></gr-change-view> |
| </template> |
| <template is="dom-if" if="{{_showDiffView}}" restamp="true"> |
| <gr-diff-view |
| params="[[params]]" |
| prefs="{{_diffPreferences}}" |
| change-view-state="{{_viewState.changeView}}"></gr-diff-view> |
| </template> |
| </main> |
| <footer role="contentinfo"> |
| Powered by <a href="https://www.gerritcodereview.com/" target="_blank">Gerrit Code Review</a> |
| ([[version]]) |
| <span hidden$="[[!config.gerrit.report_bug_url]]"> |
| | |
| <a href$="[[config.gerrit.report_bug_url]]" target="_blank"> |
| <span hidden$="[[!config.gerrit.report_bug_text]]"> |
| [[config.gerrit.report_bug_text]] |
| </span> |
| <span hidden$="[[config.gerrit.report_bug_text]]">Report Bug</span> |
| </a> |
| </span> |
| | |
| <a class="feedback" href="http://goo.gl/forms/ETHmIH2Kga" target="_blank"> |
| PolyGerrit Feedback |
| </a> |
| </footer> |
| <gr-overlay id="keyboardShortcuts" with-backdrop> |
| <gr-keyboard-shortcuts-dialog |
| view="[[params.view]]" |
| on-close="_handleKeyboardShortcutDialogClose"></gr-keyboard-shortcuts-dialog> |
| </gr-overlay> |
| </template> |
| <script> |
| (function() { |
| 'use strict'; |
| |
| Polymer({ |
| is: 'gr-app', |
| |
| properties: { |
| account: { |
| type: Object, |
| observer: '_accountChanged', |
| }, |
| accountReady: { |
| type: Object, |
| readOnly: true, |
| notify: true, |
| value: function() { |
| return new Promise(function(resolve) { |
| this._resolveAccountReady = resolve; |
| }.bind(this)); |
| }, |
| }, |
| config: { |
| type: Object, |
| observer: '_configChanged', |
| }, |
| configReady: { |
| type: Object, |
| readOnly: true, |
| notify: true, |
| value: function() { |
| return new Promise(function(resolve) { |
| this._resolveConfigReady = resolve; |
| }.bind(this)); |
| }, |
| }, |
| version: String, |
| params: Object, |
| keyEventTarget: { |
| type: Object, |
| value: function() { return document.body; }, |
| }, |
| |
| _diffPreferences: Object, |
| _showChangeListView: Boolean, |
| _showDashboardView: Boolean, |
| _showChangeView: Boolean, |
| _showDiffView: Boolean, |
| _viewState: Object, |
| }, |
| |
| listeners: { |
| 'title-change': '_handleTitleChange', |
| }, |
| |
| observers: [ |
| '_viewChanged(params.view)', |
| ], |
| |
| behaviors: [ |
| Gerrit.KeyboardShortcutBehavior, |
| ], |
| |
| get loggedIn() { |
| return !!(this.account && Object.keys(this.account).length > 0); |
| }, |
| |
| ready: function() { |
| this._viewState = { |
| changeView: { |
| changeNum: null, |
| patchNum: null, |
| selectedFileIndex: 0, |
| showReplyDialog: false, |
| }, |
| changeListView: { |
| query: null, |
| offset: 0, |
| selectedChangeIndex: 0, |
| }, |
| dashboardView: { |
| selectedChangeIndex: 0, |
| }, |
| }; |
| }, |
| |
| _accountChanged: function() { |
| this._resolveAccountReady(); |
| this.$.accountContainer.classList.toggle('loggedIn', this.loggedIn); |
| this.$.accountContainer.classList.toggle('loggedOut', !this.loggedIn); |
| if (this.loggedIn) { |
| this.$.diffPreferencesXHR.generateRequest(); |
| } else { |
| // These defaults should match the defaults in |
| // gerrit-extension-api/src/main/jcg/gerrit/extensions/client/DiffPreferencesInfo.java |
| // NOTE: There are some settings that don't apply to PolyGerrit |
| // (Render mode being at least one of them). |
| this._diffPreferences = { |
| auto_hide_diff_table_header: true, |
| context: 10, |
| cursor_blink_rate: 0, |
| ignore_whitespace: 'IGNORE_NONE', |
| intraline_difference: true, |
| line_length: 100, |
| show_line_endings: true, |
| show_tabs: true, |
| show_whitespace_errors: true, |
| syntax_highlighting: true, |
| tab_size: 8, |
| theme: 'DEFAULT', |
| }; |
| } |
| }, |
| |
| _configChanged: function(config) { |
| this._resolveConfigReady(config); |
| }, |
| |
| _viewChanged: function(view) { |
| this.set('_showChangeListView', view == 'gr-change-list-view'); |
| this.set('_showDashboardView', view == 'gr-dashboard-view'); |
| this.set('_showChangeView', view == 'gr-change-view'); |
| this.set('_showDiffView', view == 'gr-diff-view'); |
| }, |
| |
| _loginTapHandler: function(e) { |
| e.preventDefault(); |
| page.show('/login/' + encodeURIComponent( |
| window.location.pathname + window.location.hash)); |
| }, |
| |
| _computeLoggedIn: function(account) { // argument used for binding update only |
| return this.loggedIn; |
| }, |
| |
| _handleTitleChange: function(e) { |
| if (e.detail.title) { |
| document.title = e.detail.title + ' ยท Gerrit Code Review'; |
| } else { |
| document.title = ''; |
| } |
| }, |
| |
| _handleKey: function(e) { |
| if (this.shouldSupressKeyboardShortcut(e)) { return; } |
| |
| switch (e.keyCode) { |
| case 191: // '/' or '?' with shift key. |
| // TODO(andybons): Localization using e.key/keypress event. |
| if (!e.shiftKey) { break; } |
| this.$.keyboardShortcuts.open(); |
| } |
| }, |
| |
| _handleKeyboardShortcutDialogClose: function() { |
| this.$.keyboardShortcuts.close(); |
| }, |
| }); |
| })(); |
| </script> |
| </dom-module> |
