diff options
Diffstat (limited to 'polygerrit-ui/app/elements/diff')
8 files changed, 165 insertions, 457 deletions
diff --git a/polygerrit-ui/app/elements/diff/gr-diff-preferences-dialog/gr-diff-preferences-dialog.html b/polygerrit-ui/app/elements/diff/gr-diff-preferences-dialog/gr-diff-preferences-dialog.html new file mode 100644 index 0000000000..5cff316dda --- /dev/null +++ b/polygerrit-ui/app/elements/diff/gr-diff-preferences-dialog/gr-diff-preferences-dialog.html @@ -0,0 +1,80 @@ +<!-- +@license +Copyright (C) 2019 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="../../../styles/shared-styles.html"> +<link rel="import" href="../../shared/gr-button/gr-button.html"> +<link rel="import" href="../../shared/gr-diff-preferences/gr-preferences.html"> +<link rel="import" href="../../shared/gr-overlay/gr-overlay.html"> + +<dom-module id="gr-diff-preferences-dialog"> + <template> + <style include="shared-styles"> + .diffHeader, + .diffActions { + padding: 1em 1.5em; + } + .diffHeader, + .diffActions { + background-color: var(--dialog-background-color); + } + .diffHeader { + border-bottom: 1px solid var(--border-color); + font-weight: var(--font-weight-bold); + } + .diffActions { + border-top: 1px solid var(--border-color); + display: flex; + justify-content: flex-end; + } + .diffPrefsOverlay gr-button { + margin-left: 1em; + } + div.edited:after { + color: var(--deemphasized-text-color); + content: ' *'; + } + #diffPreferences { + display: flex; + padding: .35em 1.5em; + } + </style> + <gr-overlay id="diffPrefsOverlay" with-backdrop> + <div class$="diffHeader [[_computeHeaderClass(_diffPrefsChanged)]]">Diff Preferences</div> + <gr-diff-preferences + id="diffPreferences" + diff-prefs="{{diffPrefs}}" + has-unsaved-changes="{{_diffPrefsChanged}}"></gr-diff-preferences> + <div class="diffActions"> + <gr-button + id="cancelButton" + link + on-tap="_handleCancelDiff"> + Cancel + </gr-button> + <gr-button + id="saveButton" + link primary + on-tap="_handleSaveDiffPreferences" + disabled$="[[!_diffPrefsChanged]]"> + Save + </gr-button> + </div> + </gr-overlay> + </template> + <script src="gr-diff-preferences-dialog.js"></script> +</dom-module> diff --git a/polygerrit-ui/app/elements/diff/gr-diff-preferences-dialog/gr-diff-preferences-dialog.js b/polygerrit-ui/app/elements/diff/gr-diff-preferences-dialog/gr-diff-preferences-dialog.js new file mode 100644 index 0000000000..b50ef692ad --- /dev/null +++ b/polygerrit-ui/app/elements/diff/gr-diff-preferences-dialog/gr-diff-preferences-dialog.js @@ -0,0 +1,66 @@ +/** + * @license + * Copyright (C) 2019 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-diff-preferences-dialog', + + properties: { + /** @type {?} */ + diffPrefs: Object, + + _diffPrefsChanged: Boolean, + }, + + getFocusStops() { + return { + start: this.$.contextSelect, + end: this.$.saveButton, + }; + }, + + resetFocus() { + this.$.contextSelect.focus(); + }, + + _computeHeaderClass(changed) { + return changed ? 'edited' : ''; + }, + + _handleCancelDiff(e) { + e.stopPropagation(); + this.$.diffPrefsOverlay.close(); + }, + + open() { + this.$.diffPrefsOverlay.open().then(() => { + const focusStops = this.getFocusStops(); + this.$.diffPrefsOverlay.setFocusStops(focusStops); + this.resetFocus(); + }); + }, + + _handleSaveDiffPreferences() { + this.$.diffPreferences.save().then(() => { + this.fire('reload-diff-preference', null, {bubbles: false}); + + this.$.diffPrefsOverlay.close(); + }); + }, + }); +})(); diff --git a/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences.html b/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences.html deleted file mode 100644 index a22f689022..0000000000 --- a/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences.html +++ /dev/null @@ -1,173 +0,0 @@ -<!-- -@license -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="../../../bower_components/iron-input/iron-input.html"> -<link rel="import" href="../../shared/gr-button/gr-button.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"> -<link rel="import" href="../../shared/gr-storage/gr-storage.html"> -<link rel="import" href="../../../styles/shared-styles.html"> - -<dom-module id="gr-diff-preferences"> - <template> - <style include="shared-styles"> - :host { - display: block; - } - :host([disabled]) { - opacity: .5; - pointer-events: none; - } - input, - select { - font: inherit; - } - input[type="number"] { - width: 4em; - } - .header, - .actions { - padding: 1em 1.5em; - } - .header, - .mainContainer, - .actions { - background-color: var(--dialog-background-color); - } - .header { - border-bottom: 1px solid var(--border-color); - font-weight: var(--font-weight-bold); - } - .mainContainer { - padding: 1em 0; - } - .pref { - align-items: center; - display: flex; - padding: .35em 1.5em; - width: 25em; - } - .pref:hover { - background-color: var(--hover-background-color); - } - .pref label { - cursor: pointer; - flex: 1; - } - .actions { - border-top: 1px solid var(--border-color); - display: flex; - justify-content: flex-end; - } - gr-button { - margin-left: 1em; - } - </style> - <gr-overlay id="prefsOverlay" with-backdrop> - <div class="header"> - Diff View Preferences - </div> - <div class="mainContainer"> - <div class="pref"> - <label for="contextSelect">Context</label> - <select id="contextSelect" on-change="_handleContextSelectChange"> - <option value="3">3 lines</option> - <option value="10">10 lines</option> - <option value="25">25 lines</option> - <option value="50">50 lines</option> - <option value="75">75 lines</option> - <option value="100">100 lines</option> - <option value="-1">Whole file</option> - </select> - </div> - <div class="pref"> - <label for="lineWrappingInput">Fit to screen</label> - <input - is="iron-input" - type="checkbox" - id="lineWrappingInput" - on-tap="_handlelineWrappingTap"> - </div> - <div class="pref" id="columnsPref"> - <label for="columnsInput">Diff width</label> - <input is="iron-input" type="number" id="columnsInput" - prevent-invalid-input - allowed-pattern="[0-9]" - bind-value="{{_newPrefs.line_length}}"> - </div> - <div class="pref"> - <label for="tabSizeInput">Tab width</label> - <input is="iron-input" type="number" id="tabSizeInput" - prevent-invalid-input - allowed-pattern="[0-9]" - bind-value="{{_newPrefs.tab_size}}"> - </div> - <div class="pref" hidden$="[[!_newPrefs.font_size]]"> - <label for="fontSizeInput">Font size</label> - <input is="iron-input" type="number" id="fontSizeInput" - prevent-invalid-input - allowed-pattern="[0-9]" - bind-value="{{_newPrefs.font_size}}"> - </div> - <div class="pref"> - <label for="showTabsInput">Show tabs</label> - <input is="iron-input" type="checkbox" id="showTabsInput" - on-tap="_handleShowTabsTap"> - </div> - <div class="pref"> - <label for="showTrailingWhitespaceInput"> - Show trailing whitespace</label> - <input is="iron-input" type="checkbox" - id="showTrailingWhitespaceInput" - on-tap="_handleShowTrailingWhitespaceTap"> - </div> - <div class="pref"> - <label for="syntaxHighlightInput">Syntax highlighting</label> - <input is="iron-input" type="checkbox" id="syntaxHighlightInput" - on-tap="_handleSyntaxHighlightTap"> - </div> - <div class="pref"> - <label for="automaticReviewInput">Automatically mark viewed files reviewed</label> - <input - is="iron-input" - id="automaticReviewInput" - type="checkbox" - on-tap="_handleAutomaticReviewTap"> - </div> - <div class="pref"> - <label for="ignoreWhitespace">Ignore Whitespace</label> - <select id="ignoreWhitespace" on-change="_handleIgnoreWhitespaceChange"> - <option value="IGNORE_NONE">None</option> - <option value="IGNORE_TRAILING">Trailing</option> - <option value="IGNORE_LEADING_AND_TRAILING">Leading & trailing</option> - <option value="IGNORE_ALL">All</option> - </select> - </div> - </div> - <div class="actions"> - <gr-button id="cancelButton" link on-tap="_handleCancel"> - Cancel</gr-button> - <gr-button id="saveButton" link primary on-tap="_handleSave"> - Save</gr-button> - </div> - </gr-overlay> - <gr-rest-api-interface id="restAPI"></gr-rest-api-interface> - <gr-storage id="storage"></gr-storage> - </template> - <script src="gr-diff-preferences.js"></script> -</dom-module> diff --git a/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences.js b/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences.js deleted file mode 100644 index 8fc90b9815..0000000000 --- a/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences.js +++ /dev/null @@ -1,144 +0,0 @@ -/** - * @license - * 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-diff-preferences', - - properties: { - prefs: { - type: Object, - notify: true, - }, - localPrefs: { - type: Object, - notify: true, - }, - disabled: { - type: Boolean, - value: false, - reflectToAttribute: true, - }, - - /** @type {?} */ - _newPrefs: Object, - _newLocalPrefs: Object, - }, - - observers: [ - '_prefsChanged(prefs.*)', - '_localPrefsChanged(localPrefs.*)', - ], - - getFocusStops() { - return { - start: this.$.contextSelect, - end: this.$.saveButton, - }; - }, - - resetFocus() { - this.$.contextSelect.focus(); - }, - - _prefsChanged(changeRecord) { - const prefs = changeRecord.base; - // NOTE: Object.assign is NOT automatically a deep copy. If prefs adds - // an object as a value, it must be marked enumerable. - this._newPrefs = Object.assign({}, prefs); - this.$.contextSelect.value = prefs.context; - this.$.showTabsInput.checked = prefs.show_tabs; - this.$.showTrailingWhitespaceInput.checked = prefs.show_whitespace_errors; - this.$.lineWrappingInput.checked = prefs.line_wrapping; - this.$.syntaxHighlightInput.checked = prefs.syntax_highlighting; - this.$.automaticReviewInput.checked = !prefs.manual_review; - this.$.ignoreWhitespace.value = prefs.ignore_whitespace; - }, - - _localPrefsChanged(changeRecord) { - const localPrefs = changeRecord.base || {}; - this._newLocalPrefs = Object.assign({}, localPrefs); - }, - - _handleContextSelectChange(e) { - const selectEl = Polymer.dom(e).rootTarget; - this.set('_newPrefs.context', parseInt(selectEl.value, 10)); - }, - - _handleIgnoreWhitespaceChange(e) { - const selectEl = Polymer.dom(e).rootTarget; - this.set('_newPrefs.ignore_whitespace', selectEl.value); - }, - - _handleShowTabsTap(e) { - this.set('_newPrefs.show_tabs', Polymer.dom(e).rootTarget.checked); - }, - - _handleShowTrailingWhitespaceTap(e) { - this.set('_newPrefs.show_whitespace_errors', - Polymer.dom(e).rootTarget.checked); - }, - - _handleSyntaxHighlightTap(e) { - this.set('_newPrefs.syntax_highlighting', - Polymer.dom(e).rootTarget.checked); - }, - - _handlelineWrappingTap(e) { - this.set('_newPrefs.line_wrapping', Polymer.dom(e).rootTarget.checked); - }, - - _handleAutomaticReviewTap(e) { - this.set('_newPrefs.manual_review', !Polymer.dom(e).rootTarget.checked); - }, - - _handleSave(e) { - e.stopPropagation(); - this.prefs = this._newPrefs; - this.localPrefs = this._newLocalPrefs; - const el = Polymer.dom(e).rootTarget; - el.disabled = true; - this.$.storage.savePreferences(this._localPrefs); - this._saveDiffPreferences().then(response => { - el.disabled = false; - if (!response.ok) { return response; } - - this.$.prefsOverlay.close(); - }).catch(err => { - el.disabled = false; - }); - }, - - _handleCancel(e) { - e.stopPropagation(); - this.$.prefsOverlay.close(); - }, - - open() { - this.$.prefsOverlay.open().then(() => { - const focusStops = this.getFocusStops(); - this.$.prefsOverlay.setFocusStops(focusStops); - this.resetFocus(); - }); - }, - - _saveDiffPreferences() { - return this.$.restAPI.saveDiffPreferences(this.prefs); - }, - }); -})(); diff --git a/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences_test.html b/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences_test.html deleted file mode 100644 index d9e14c0265..0000000000 --- a/polygerrit-ui/app/elements/diff/gr-diff-preferences/gr-diff-preferences_test.html +++ /dev/null @@ -1,110 +0,0 @@ -<!DOCTYPE html> -<!-- -@license -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-diff-preferences</title> - -<script src="../../../bower_components/webcomponentsjs/webcomponents-lite.min.js"></script> -<script src="../../../bower_components/web-component-tester/browser.js"></script> -<link rel="import" href="../../../test/common-test-setup.html"/> -<link rel="import" href="gr-diff-preferences.html"> - -<script>void(0);</script> - -<test-fixture id="basic"> - <template> - <gr-diff-preferences></gr-diff-preferences> - </template> -</test-fixture> - -<script> - suite('gr-diff-preferences tests', () => { - let element; - let sandbox; - - setup(() => { - sandbox = sinon.sandbox.create(); - element = fixture('basic'); - }); - - teardown(() => { - sandbox.restore(); - }); - - test('model changes', () => { - element.prefs = { - context: 10, - font_size: 12, - line_length: 100, - show_tabs: true, - tab_size: 8, - show_whitespace_errors: true, - syntax_highlighting: true, - }; - assert.deepEqual(element.prefs, element._newPrefs); - - element.$.contextSelect.value = '50'; - element.fire('change', {}, {node: element.$.contextSelect}); - element.$.columnsInput.bindValue = 80; - element.$.fontSizeInput.bindValue = 10; - element.$.tabSizeInput.bindValue = 4; - MockInteractions.tap(element.$.showTabsInput); - MockInteractions.tap(element.$.showTrailingWhitespaceInput); - MockInteractions.tap(element.$.syntaxHighlightInput); - MockInteractions.tap(element.$.lineWrappingInput); - - assert.equal(element._newPrefs.context, 50); - assert.equal(element._newPrefs.font_size, 10); - assert.equal(element._newPrefs.line_length, 80); - assert.equal(element._newPrefs.tab_size, 4); - assert.isFalse(element._newPrefs.show_tabs); - assert.isFalse(element._newPrefs.show_whitespace_errors); - assert.isTrue(element._newPrefs.line_wrapping); - assert.isFalse(element._newPrefs.syntax_highlighting); - }); - - test('clicking save button calls _handleSave function', () => { - const savePrefs = sinon.stub(element, '_handleSave'); - MockInteractions.tap(element.$.saveButton); - flushAsynchronousOperations(); - assert(savePrefs.calledOnce); - savePrefs.restore(); - }); - - test('save button', () => { - element.prefs = { - font_size: '11', - }; - element._newPrefs = { - font_size: '12', - }; - const saveStub = sandbox.stub(element.$.restAPI, 'saveDiffPreferences', - () => { return Promise.resolve(); }); - - MockInteractions.tap(element.$$('gr-button[primary]')); - assert.deepEqual(element.prefs, element._newPrefs); - assert.deepEqual(saveStub.lastCall.args[0], element._newPrefs); - }); - - test('cancel button', () => { - const closeStub = sandbox.stub(element.$.prefsOverlay, 'close'); - MockInteractions.tap(element.$$('gr-button:not([primary])')); - assert.isTrue(closeStub.called); - }); - }); -</script> diff --git a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html index 0866849d37..06658da29f 100644 --- a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html +++ b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.html @@ -34,9 +34,9 @@ limitations under the License. <link rel="import" href="../../shared/revision-info/revision-info.html"> <link rel="import" href="../gr-comment-api/gr-comment-api.html"> <link rel="import" href="../gr-diff-cursor/gr-diff-cursor.html"> -<link rel="import" href="../gr-diff-mode-selector/gr-diff-mode-selector.html"> -<link rel="import" href="../gr-diff-preferences/gr-diff-preferences.html"> <link rel="import" href="../gr-diff-host/gr-diff-host.html"> +<link rel="import" href="../gr-diff-mode-selector/gr-diff-mode-selector.html"> +<link rel="import" href="../gr-diff-preferences-dialog/gr-diff-preferences-dialog.html"> <link rel="import" href="../gr-patch-range-select/gr-patch-range-select.html"> <dom-module id="gr-diff-view"> @@ -338,10 +338,11 @@ limitations under the License. is-blame-loaded="{{_isBlameLoaded}}" on-line-selected="_onLineSelected"> </gr-diff-host> - <gr-diff-preferences - id="diffPreferences" - prefs="{{_prefs}}" - local-prefs="{{_localPrefs}}"></gr-diff-preferences> + <gr-diff-preferences-dialog + id="diffPreferencesDialog" + diff-prefs="{{_prefs}}" + on-reload-diff-preference="_handleReloadingDiffPreference"> + </gr-diff-preferences-dialog> <gr-rest-api-interface id="restAPI"></gr-rest-api-interface> <gr-storage id="storage"></gr-storage> <gr-diff-cursor id="cursor"></gr-diff-cursor> diff --git a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.js b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.js index 095dc722c0..89ad2d2508 100644 --- a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.js +++ b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view.js @@ -258,7 +258,9 @@ }, _getDiffPreferences() { - return this.$.restAPI.getDiffPreferences(); + return this.$.restAPI.getDiffPreferences().then(prefs => { + this._prefs = prefs; + }); }, _getPreferences() { @@ -457,7 +459,7 @@ this.modifierPressed(e)) { return; } e.preventDefault(); - this.$.diffPreferences.open(); + this.$.diffPreferencesDialog.open(); }, _handleToggleDiffMode(e) { @@ -608,10 +610,7 @@ const promises = []; - this._localPrefs = this.$.storage.getPreferences(); - promises.push(this._getDiffPreferences().then(prefs => { - this._prefs = prefs; - })); + promises.push(this._getDiffPreferences()); promises.push(this._getPreferences().then(prefs => { this._userPrefs = prefs; @@ -837,22 +836,7 @@ _handlePrefsTap(e) { e.preventDefault(); - this.$.diffPreferences.open(); - }, - - _handlePrefsSave(e) { - e.stopPropagation(); - const el = Polymer.dom(e).rootTarget; - el.disabled = true; - this.$.storage.savePreferences(this._localPrefs); - this._saveDiffPreferences().then(response => { - el.disabled = false; - if (!response.ok) { return response; } - - this.$.prefsOverlay.close(); - }).catch(err => { - el.disabled = false; - }); + this.$.diffPreferencesDialog.open(); }, /** @@ -1036,5 +1020,9 @@ (file === this._path || !this._reviewedFiles.has(file))); this._navToFile(this._path, unreviewedFiles, 1); }, + + _handleReloadingDiffPreference() { + this._getDiffPreferences(); + }, }); })(); diff --git a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view_test.html b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view_test.html index 958acdb9a8..354bfef6c9 100644 --- a/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view_test.html +++ b/polygerrit-ui/app/elements/diff/gr-diff-view/gr-diff-view_test.html @@ -172,7 +172,7 @@ limitations under the License. assert.isTrue(element._loading); const showPrefsStub = - sandbox.stub(element.$.diffPreferences.$.prefsOverlay, 'open', + sandbox.stub(element.$.diffPreferencesDialog, 'open', () => Promise.resolve()); MockInteractions.pressAndReleaseKeyOn(element, 188, null, ','); @@ -365,7 +365,7 @@ limitations under the License. test('prefsButton opens gr-diff-preferences', () => { const handlePrefsTapSpy = sandbox.spy(element, '_handlePrefsTap'); - const overlayOpenStub = sandbox.stub(element.$.diffPreferences, + const overlayOpenStub = sandbox.stub(element.$.diffPreferencesDialog, 'open'); const prefsButton = Polymer.dom(element.root).querySelector('.prefsButton'); |