Merge 6b8dccb into f5745fe

CenterForOpenScience · Dec 19, 2017 · d9910c1 · d9910c1
2 parents f5745fe + 6b8dccb
commit d9910c1
Show file tree

Hide file tree

Showing 12 changed files with 227 additions and 33 deletions.
diff --git a/app/components/preprint-status-banner/component.js b/app/components/preprint-status-banner/component.js
@@ -121,6 +121,8 @@ export default Component.extend({
 
     commentExceedsLimit: computed.gt('reviewerComment.length', COMMENT_LIMIT),
 
+    userActivity: computed.or('commentEdited', 'decisionChanged'),
+
     commentLengthErrorMessage: computed('reviewerComment', function () {
         const i18n = this.get('i18n');
         return i18n.t('components.preprintStatusBanner.decision.commentLengthError', {
@@ -224,14 +226,12 @@ export default Component.extend({
     }),
 
     decisionChanged: computed('submission.reviewsState', 'decision', function() {
-        return this.get('submission.reviewsState') !== this.get('decision');
+        return ((this.get('submission.reviewsState') !== this.get('decision') && this.get('submission.reviewsState') !== PENDING) ||
+        (this.get('submission.reviewsState') === PENDING && this.get('decision') !== ACCEPTED));
     }),
 
     btnDisabled: computed('decisionChanged', 'commentEdited', 'saving', 'commentExceedsLimit', function() {
-        if (this.get('saving') || (!this.get('decisionChanged') && !this.get('commentEdited')) || this.get('commentExceedsLimit')) {
-            return true;
-        }
-        return false;
+        return this.get('saving') || (!this.get('decisionChanged') && !this.get('commentEdited')) || this.get('commentExceedsLimit');
     }),
 
     didInsertElement() {
@@ -257,6 +257,9 @@ export default Component.extend({
             this.set('decision', this.get('submission.reviewsState'));
             this.set('reviewerComment', this.get('initialReviewerComment'));
         },
+        closeReviewerFeedback() {
+            this.set('userHasEnteredReview', this.get('userActivity'));
+        },
     },
 
     _handleActions(action) {

diff --git a/app/components/preprint-status-banner/template.hbs b/app/components/preprint-status-banner/template.hbs
@@ -21,7 +21,7 @@
             {{/if}}
         </div>
         <div class="dropdown reviewer-feedback">
-            {{#bs-dropdown closeOnMenuClick=false as |dd|}}
+            {{#bs-dropdown onHide=(action 'closeReviewerFeedback') closeOnMenuClick=false as |dd|}}
                 {{#dd.button type="success" disabled=submission.actions.isPending}}
                     {{#if submission.actions.isPending}}
                         <i class='button-loading-indicator fa fa-circle-o-notch fa-spin'></i>

diff --git a/app/controllers/preprints/provider/preprint-detail.js b/app/controllers/preprints/provider/preprint-detail.js
@@ -34,6 +34,10 @@ export default Controller.extend({
     _activeFile: null,
     chosenFile: null,
 
+    userHasEnteredReview: false,
+    showWarning: false,
+    previousTransition: null,
+
     hasTags: bool('node.tags.length'),
     expandedAbstract: navigator.userAgent.includes('Prerender'),
 
@@ -103,6 +107,17 @@ export default Controller.extend({
                 activeFile: fileItem,
             });
         },
+        leavePage() {
+            const previousTransition = this.get('previousTransition');
+            if (previousTransition) {
+                this.set('userHasEnteredReview', false);
+                this.set('showWarning', false);
+                previousTransition.retry();
+            }
+        },
+        hideWarning() {
+            this.set('showWarning', false);
+        },
         submitDecision(trigger, comment, filter) {
             this.toggleProperty('savingAction');
 

diff --git a/app/locales/en/translations.js b/app/locales/en/translations.js
@@ -166,6 +166,14 @@ export default {
             paragraph: 'The project for this paper is available on the OSF.',
             button: 'Visit project',
         },
+        warning: {
+            header: 'Discard your feedback',
+            body: 'Are you sure you want to leave without submitting your feedback? Your feedback will be discarded.',
+            footer: {
+                leave: 'Leave this page',
+                stay: 'Stay on this page',
+            },
+        },
     },
     components: {
         actionFeed: {

diff --git a/app/routes/preprints/provider/preprint-detail.js b/app/routes/preprints/provider/preprint-detail.js
@@ -3,8 +3,9 @@ import $ from 'jquery';
 import { scheduleOnce } from '@ember/runloop';
 import { inject as service } from '@ember/service';
 import Route from '@ember/routing/route';
+import ConfirmationMixin from 'ember-onbeforeunload/mixins/confirmation';
 
-export default Route.extend({
+export default Route.extend(ConfirmationMixin, {
     theme: service(),
     currentUser: service(),
 
@@ -45,6 +46,19 @@ export default Route.extend({
                 return this.intermediateTransitionTo('page-not-found');
             }
         },
+        willTransition(transition) {
+            if (this.controller.get('userHasEnteredReview')) {
+                this.controller.set('showWarning', true);
+                this.controller.set('previousTransition', transition);
+                transition.abort();
+            }
+        },
+    },
+
+    isPageDirty() {
+        // If true, shows a confirmation message when leaving the page
+        // True if the reviewer has any unsaved changes including comment edit or state change.
+        return this.controller.get('userHasEnteredReview');
     },
 
     _checkNodePublic(node) {

diff --git a/app/styles/modules/provider/_preprint-detail.scss b/app/styles/modules/provider/_preprint-detail.scss
@@ -12,3 +12,15 @@ section.preprint-license {
     width: 100%;
   }
 }
+
+.warning-header {
+  font-size: 20px;
+  padding: 5px 15px 8px 15px;
+
+  a {
+    color: $color-text-gray-dark;
+  }
+}
+.setting-reminder {
+  font-size: 14px;
+}
diff --git a/app/templates/preprints/provider/preprint-detail.hbs b/app/templates/preprints/provider/preprint-detail.hbs
@@ -14,7 +14,7 @@
         </div>
     </div>
 
-    {{preprint-status-banner submission=model saving=savingAction submitDecision=(action 'submitDecision')}}
+    {{preprint-status-banner submission=model saving=savingAction userHasEnteredReview=userHasEnteredReview submitDecision=(action 'submitDecision')}}
 
     <div id="view-page" class="container">
         <div class="row p-md">
@@ -136,4 +136,15 @@
 
         </div>
     </div>
+
+    {{#bs-modal open=showWarning onHide=(action 'hideWarning') as |modal|}}
+        {{#modal.header}}
+            <div class="warning-header"><i class="fa fa-exclamation-triangle"></i> {{t 'content.warning.header'}}</div>
+        {{/modal.header}}
+        {{#modal.body}}<div class="warning-body">{{t 'content.warning.body'}}</div>{{/modal.body}}
+        {{#modal.footer}}
+            {{#bs-button onClick=(action 'hideWarning') type="info"}}{{t 'content.warning.footer.stay'}}{{/bs-button}}
+            {{#bs-button onClick=(action 'leavePage')}}{{t 'content.warning.footer.leave'}}{{/bs-button}}
+        {{/modal.footer}}
+    {{/bs-modal}}
 </div>
diff --git a/package.json b/package.json
@@ -49,6 +49,7 @@
     "ember-i18n": "5.0.2",
     "ember-load-initializers": "^1.0.0",
     "ember-moment": "^7.4.1",
+    "ember-onbeforeunload": "^1.1.2",
     "ember-parachute": "^0.3.5",
     "ember-radio-button": "^1.1.1",
     "ember-resolver": "^4.0.0",

diff --git a/tests/unit/components/preprint-file-browser-test.js b/tests/unit/components/preprint-file-browser-test.js
@@ -0,0 +1,91 @@
+import { moduleForComponent } from 'ember-qunit';
+import test from 'ember-sinon-qunit/test-support/test';
+
+
+moduleForComponent('preprint-file-browser', 'Unit | Component | preprint file browser', {
+    unit: true,
+    needs: [
+        'model:node',
+        'model:preprint',
+        'model:preprint-provider',
+        'model:file-provider',
+        'model:file',
+    ],
+});
+
+test('hasPrev computed property', function(assert) {
+    const component = this.subject();
+    assert.ok(component);
+
+    component.set('pageNumber', 0);
+    assert.ok(!component.get('hasPrev'));
+
+    component.set('pageNumber', 4);
+    assert.ok(component.get('hasPrev'));
+});
+
+test('hasNext computed property', function(assert) {
+    const component = this.subject();
+    assert.ok(component);
+    component.set('pageNumber', 1);
+
+    component.set('files', ['f1', 'f2', 'f3']);
+    assert.ok(!component.get('hasNext'));
+
+    component.set('files', ['f1', 'f2', 'f3', 'f4', 'f5', 'f6', 'f7']);
+    assert.ok(!component.get('hasNext'));
+});
+
+test('fileIsPrimary computed property', function(assert) {
+    const component = this.subject();
+    assert.ok(component);
+    component.set('selectedFile', 'f1');
+
+    component.set('primaryFile', 'f1');
+    assert.ok(component.get('fileIsPrimary'));
+});
+
+test('page computed property', function(assert) {
+    const component = this.subject();
+    assert.ok(component);
+    component.set('pageNumber', 1);
+
+    component.set('files', ['f1', 'f2', 'f3', 'f4', 'f5', 'f6', 'f7']);
+    assert.deepEqual(component.get('page'), ['f7']);
+
+    component.set('pageNumber', 2);
+    assert.deepEqual(component.get('page'), []);
+});
+
+test('didReceiveAttrs function', function(assert) {
+    const component = this.subject();
+    assert.ok(component);
+    component.set('pageNumber', 1);
+
+    component.set('selectedFile', 'f1');
+
+    component.set('primaryFile', 'f2');
+    assert.ok(component.get('selectedFile') !== component.get('primaryFile'));
+
+    component.didReceiveAttrs();
+    assert.strictEqual(component.get('selectedFile'), component.get('primaryFile'));
+});
+
+test('page action', function(assert) {
+    const component = this.subject();
+    assert.ok(component);
+    component.set('pageNumber', 1);
+
+    component.send('page', 5);
+    assert.strictEqual(component.get('pageNumber'), 6);
+});
+
+test('selectFile action', function(assert) {
+    const component = this.subject();
+    assert.ok(component);
+
+    component.set('selectedFile', 'f1');
+    component.send('selectFile', 'f2');
+
+    assert.strictEqual(component.get('selectedFile'), 'f2');
+});
diff --git a/tests/unit/components/preprint-status-banner-test.js b/tests/unit/components/preprint-status-banner-test.js
@@ -298,3 +298,29 @@ test('commentLengthErrorMessage computed property', function(assert) {
     component.set('reviewerComment', 'test comment for error message'.repeat(2000));
     assert.strictEqual(component.get('commentLengthErrorMessage'), 'Comment is 5535 character(s) too long (maximum is 65535).');
 });
+
+test('userActivity computed property', function(assert) {
+    const component = this.subject();
+
+    component.set('commentEdited', true);
+    component.set('decisionChanged', true);
+    assert.ok(component.get('userActivity'));
+    component.set('decisionChanged', false);
+    assert.ok(component.get('userActivity'));
+    component.set('commentEdited', false);
+    assert.ok(!component.get('userActivity'));
+});
+
+test('closeReviewerFeedback computed property', function(assert) {
+    const component = this.subject();
+
+    component.set('commentEdited', true);
+    component.set('decisionChanged', true);
+    component.send('closeReviewerFeedback');
+    assert.ok(component.get('userHasEnteredReview'));
+
+    component.set('commentEdited', false);
+    component.set('decisionChanged', false);
+    component.send('closeReviewerFeedback');
+    assert.ok(!component.get('userHasEnteredReview'));
+});
diff --git a/tests/unit/controllers/preprints/provider/preprint-detail-test.js b/tests/unit/controllers/preprints/provider/preprint-detail-test.js
@@ -287,12 +287,6 @@ test('fileDownloadURL computed property', function (assert) {
     const ctrl = this.subject();
 
     run(() => {
-        const origin = 'http://localhost:4200';
-
-        const window = { location: { origin } };
-
-        ctrl.set('window', window);
-
         const node = this.store.createRecord('node', {
             description: 'test description',
         });
@@ -302,6 +296,32 @@ test('fileDownloadURL computed property', function (assert) {
         ctrl.setProperties({ model });
         ctrl.set('model.id', '6gtu');
 
-        assert.strictEqual(ctrl.get('fileDownloadURL'), 'http://localhost:4201/6gtu/download');
+        const url = ctrl.get('fileDownloadURL').split(ctrl.get('model.id'));
+        assert.strictEqual(url[1], '/download');
     });
 });
+
+test('hideWarning action', function (assert) {
+    const ctrl = this.subject();
+    ctrl.set('showWarning', true);
+    ctrl.send('hideWarning');
+    assert.ok(!ctrl.get('showWarning'));
+});
+
+test('leavePage action', function (assert) {
+    const ctrl = this.subject();
+
+    ctrl.send('leavePage');
+    assert.ok(!ctrl.get('showWarning'));
+    assert.ok(!ctrl.get('userHasEnteredReview'));
+
+    const stubTransition = { retry() {} };
+    const stub = this.stub(stubTransition, 'retry');
+    ctrl.set('previousTransition', stubTransition);
+    ctrl.set('userHasEnteredReview', true);
+    ctrl.set('showWarning', true);
+    ctrl.send('leavePage');
+    assert.ok(!ctrl.get('showWarning'));
+    assert.ok(!ctrl.get('userHasEnteredReview'));
+    assert.ok(stub.calledOnce);
+});