opendev/gerrit
Code Issues Proposed changes

Merge changes Ib6ea751a,I3f9156e3

Browse Source 
* changes:
  Update the selected file in change view after nav in diff view
  Some responsive layout tweaks
This commit is contained in:
Dave Borowitz 2016-02-04 19:09:09 +00:00 committed by Gerrit Code Review
commit 5ba30edfe3
9 changed files with 83 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

29
polygerrit-ui/app/elements/gr-app.html
View File

@ -37,11 +37,6 @@ limitations under the License.
min-height: 100vh;
flex-direction: column;
}
:host([constrained]) main {
margin: 0 auto;
width: 100%;
max-width: var(--max-constrained-width);
}
header,
footer {
background-color: var(--primary-color);
@ -104,20 +99,27 @@ limitations under the License.
</header>
<main>
<template is="dom-if" if="{{_showChangeListView}}" restamp="true">
<gr-change-list-view params="[[params]]"
<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]]"
<gr-dashboard-view
params="[[params]]"
view-state="{{_viewState.dashboardView}}"></gr-dashboard-view>
</template>
<template is="dom-if" if="{{_showChangeView}}" restamp="true">
<gr-change-view server-config="[[config]]"
params="[[params]]" view-state="{{_viewState.changeView}}"></gr-change-view>
<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 prefs="{{_diffPreferences}}" params="[[params]]"></gr-diff-view>
<gr-diff-view
params="[[params]]"
prefs="{{_diffPreferences}}"
change-view-state="{{_viewState.changeView}}"></gr-diff-view>
</template>
</main>
<footer role="contentinfo">
@ -175,11 +177,6 @@ limitations under the License.
},
},
version: String,
constrained: {
type: Boolean,
value: false,
reflectToAttribute: true,
},
params: Object,
_diffPreferences: Object,
@ -206,6 +203,7 @@ limitations under the License.
changeNum: null,
patchNum: null,
selectedFileIndex: 0,
showReplyDropdown: false,
},
changeListView: {
query: null,
@ -255,7 +253,6 @@ limitations under the License.
this.set('_showDashboardView', view == 'gr-dashboard-view');
this.set('_showChangeView', view == 'gr-change-view');
this.set('_showDiffView', view == 'gr-diff-view');
this.constrained = view == 'gr-change-view';
},
_loginTapHandler: function(e) {

9
polygerrit-ui/app/elements/gr-change-view.html
View File

@ -32,7 +32,7 @@ limitations under the License.
<template>
<style>
.container {
margin: 1em 0;
margin: 1em var(--default-horizontal-margin);
}
.container:not(.loading) {
background-color: var(--view-background-color);
@ -47,9 +47,7 @@ limitations under the License.
align-items: center;
background-color: var(--view-background-color);
display: flex;
max-width: var(--max-constrained-width);
padding: 1em var(--default-horizontal-margin);
width: 100%;
z-index: 1000;
}
.header.pinned {
@ -57,6 +55,7 @@ limitations under the License.
position: fixed;
top: 0;
transition: box-shadow 250ms linear;
width: calc(100% - (2 * var(--default-horizontal-margin)));
}
.header-title {
flex: 1;
@ -419,9 +418,9 @@ limitations under the License.
app.accountReady.then(function() {
if (!this._loggedIn) { return; }
if (window.sessionStorage.getItem('changeView.showReplyDropdown')) {
if (this.viewState.showReplyDropdown) {
this.$.replyDropdown.open();
window.sessionStorage.removeItem('changeView.showReplyDropdown');
this.set('viewState.showReplyDropdown', false);
}
}.bind(this));
}.bind(this));

32
polygerrit-ui/app/elements/gr-diff-view.html
View File

@ -82,12 +82,6 @@ limitations under the License.
font: inherit;
padding: .3em 0;
}
.mainContainer {
border-bottom: 1px solid #eee;
border-collapse: collapse;
border-top: 1px solid #eee;
width: 100%;
}
</style>
<gr-ajax id="changeDetailXHR"
auto
@ -161,6 +155,11 @@ limitations under the License.
type: Object,
value: function() { return document.body; },
},
changeViewState: {
type: Object,
notify: true,
value: function() { return {}; },
},
_patchRange: Object,
_change: Object,
@ -170,7 +169,10 @@ limitations under the License.
type: Array,
value: function() { return []; },
},
_path: String,
_path: {
type: String,
observer: '_pathChanged',
},
_loggedIn: {
type: Boolean,
value: false,
@ -192,6 +194,11 @@ limitations under the License.
if (this._path) {
this.fire('title-change', {title: this._path});
}
window.addEventListener('resize', this._boundWindowResizeHandler);
},
detached: function() {
window.removeEventListener('resize', this._boundWindowResizeHandler);
},
_handleKey: function(e) {
@ -209,9 +216,7 @@ limitations under the License.
case 65: // 'a'
if (!this._loggedIn) { return; }
// Values can only be strings.
window.sessionStorage.setItem(
'changeView.showReplyDropdown', 'true');
this.set('changeViewState.showReplyDropdown', true);
// No break here. Allow to fall through.
case 85: // 'u'
if (this._changeNum) {
@ -267,6 +272,13 @@ limitations under the License.
this.$.diff.reload();
},
_pathChanged: function(path) {
if (this._fileList.length == 0) { return; }
this.set('changeViewState.selectedFileIndex',
this._fileList.indexOf(path));
},
_computeDiffURL: function(changeNum, patchRange, path) {
var patchStr = patchRange.patchNum;
if (patchRange.basePatchNum != null &&

2
polygerrit-ui/app/elements/gr-diff.html
View File

@ -42,7 +42,7 @@ limitations under the License.
border-bottom: 1px solid #eee;
border-top: 1px solid #eee;
display: flex;
font-family: var(--monospace-font-family);
font: 12px var(--monospace-font-family);
overflow-x: auto;
white-space: pre;
}

19
polygerrit-ui/app/elements/gr-file-list.html
View File

@ -191,15 +191,30 @@ limitations under the License.
e.preventDefault();
this.selectedIndex = Math.max(0, this.selectedIndex - 1);
break;
case 219: // '['
e.preventDefault();
this._openSelectedFile(this.files.length - 1);
break;
case 221: // ']'
e.preventDefault();
this._openSelectedFile(0);
break;
case 13: // <enter>
case 79: // 'o'
e.preventDefault();
page(this._computeDiffURL(this.changeNum, this.patchNum,
this.files[this.selectedIndex].__path));
this._openSelectedFile();
break;
}
},
_openSelectedFile: function(opt_index) {
if (opt_index != null) {
this.selectedIndex = opt_index;
}
page(this._computeDiffURL(this.changeNum, this.patchNum,
this.files[this.selectedIndex].__path));
},
_computeFileSelected: function(index, selectedIndex) {
return index == selectedIndex;
},

1
polygerrit-ui/app/styles/app-theme.html
View File

@ -22,7 +22,6 @@ limitations under the License.
--default-text-color: #000;
--view-background-color: #fff;
--default-horizontal-margin: 1.25rem;
--max-constrained-width: 980px;
--monospace-font-family: 'Source Code Pro', Menlo, 'Lucida Console', Monaco, monospace;
}
</style>

18
polygerrit-ui/app/styles/gr-change-list-styles.html
View File

@ -62,6 +62,24 @@ limitations under the License.
width: 2.6em;
text-align: center;
}
:host {
font-size: 11px;
}
@media only screen and (min-width: 1240px) {
:host {
font-size: 12px;
}
}
@media only screen and (min-width: 1340px) {
:host {
font-size: 13px;
}
}
@media only screen and (min-width: 1450px) {
:host {
font-size: 14px;
}
}
</style>
</template>
</dom-module>

18
polygerrit-ui/app/styles/main.css
View File

@ -30,21 +30,5 @@ body {
transition: none; /* Override the default Polymer fade-in. */
}
body {
font: 11px 'Open Sans', sans-serif;
}
@media only screen and (min-width: 1240px) {
body {
font-size: 12px;
}
}
@media only screen and (min-width: 1340px) {
body {
font-size: 13px;
}
}
@media only screen and (min-width: 1450px) {
body {
font-size: 14px;
}
font: 14px 'Open Sans', sans-serif;
}

10
polygerrit-ui/app/test/gr-diff-view-test.html
View File

@ -52,6 +52,7 @@ limitations under the License.
};
element._fileList = ['chell.go', 'glados.txt', 'wheatley.md'];
element._path = 'glados.txt';
element.changeViewState.selectedFileIndex = 1;
var showStub = sinon.stub(page, 'show');
MockInteractions.pressAndReleaseKeyOn(element, 85); // 'u'
@ -62,20 +63,24 @@ limitations under the License.
assert(showStub.lastCall.calledWithExactly('/c/42/10/wheatley.md'),
'Should navigate to /c/42/10/wheatley.md');
element._path = 'wheatley.md';
assert.equal(element.changeViewState.selectedFileIndex, 2);
MockInteractions.pressAndReleaseKeyOn(element, 219); // '['
assert(showStub.lastCall.calledWithExactly('/c/42/10/glados.txt'),
'Should navigate to /c/42/10/glados.txt');
element._path = 'glados.txt';
assert.equal(element.changeViewState.selectedFileIndex, 1);
MockInteractions.pressAndReleaseKeyOn(element, 219); // '['
assert(showStub.lastCall.calledWithExactly('/c/42/10/chell.go'),
'Should navigate to /c/42/10/chell.go');
element._path = 'chell.go';
assert.equal(element.changeViewState.selectedFileIndex, 0);
MockInteractions.pressAndReleaseKeyOn(element, 219); // '['
assert(showStub.lastCall.calledWithExactly('/c/42'),
'Should navigate to /c/42');
assert.equal(element.changeViewState.selectedFileIndex, 0);
var showPrefsStub = sinon.stub(element.$.diff, 'showDiffPreferences');
MockInteractions.pressAndReleaseKeyOn(element, 188); // ','
@ -104,9 +109,8 @@ limitations under the License.
element._loggedIn = true;
MockInteractions.pressAndReleaseKeyOn(element, 65); // 'a'
assert.equal(window.sessionStorage.getItem(
'changeView.showReplyDropdown'), 'true');
window.sessionStorage.removeItem('changeView.showReplyDropdown');
assert.isTrue(element.changeViewState.showReplyDropdown);
assert(showStub.lastCall.calledWithExactly('/c/42'),
'Should navigate to /c/42');