From 73b54b9cdbb2a367ec2f178950c736c32ae4b325 Mon Sep 17 00:00:00 2001 From: Mark Banner Date: Wed, 26 Nov 2014 21:09:09 +0000 Subject: [PATCH] Follow-up to bug 1079225 - Fix formatting of the waiting for media message in Loop rooms, and ensure feedback can be given for multiple conversations in a row. r=abr --- .../loop/content/shared/js/actions.js | 5 +++-- .../loop/content/shared/js/activeRoomStore.js | 8 +++++--- .../loop/content/shared/js/feedbackStore.js | 11 +++++++++- .../loop/content/shared/js/store.js | 11 ++++++++++ .../content/js/standaloneRoomViews.js | 8 +++++--- .../content/js/standaloneRoomViews.jsx | 10 ++++++---- .../loop/standalone/content/js/webapp.js | 7 ++++--- .../loop/standalone/content/js/webapp.jsx | 7 ++++--- .../loop/test/shared/activeRoomStore_test.js | 4 ++-- .../loop/test/shared/feedbackStore_test.js | 12 +++++++++++ .../standalone/standaloneRoomViews_test.js | 20 +++++++++++-------- 11 files changed, 74 insertions(+), 29 deletions(-) diff --git a/browser/components/loop/content/shared/js/actions.js b/browser/components/loop/content/shared/js/actions.js index cd4491073de..5355d4fb11b 100644 --- a/browser/components/loop/content/shared/js/actions.js +++ b/browser/components/loop/content/shared/js/actions.js @@ -331,9 +331,10 @@ loop.shared.actions = (function() { }), /** - * Resets current room. + * Used to indicate that the feedback cycle is completed and the countdown + * finished. */ - ResetRoom: Action.define("resetRoom", { + FeedbackComplete: Action.define("feedbackComplete", { }), /** diff --git a/browser/components/loop/content/shared/js/activeRoomStore.js b/browser/components/loop/content/shared/js/activeRoomStore.js index 8ff38125b28..da9ea7a65d0 100644 --- a/browser/components/loop/content/shared/js/activeRoomStore.js +++ b/browser/components/loop/content/shared/js/activeRoomStore.js @@ -140,7 +140,7 @@ loop.store.ActiveRoomStore = (function() { "remotePeerConnected", "windowUnload", "leaveRoom", - "resetRoom" + "feedbackComplete" ]); }, @@ -453,9 +453,11 @@ loop.store.ActiveRoomStore = (function() { }, /** - * Resets current room. + * When feedback is complete, we reset the room to the initial state. */ - resetRoom: function() { + feedbackComplete: function() { + // Note, that we want some values, such as the windowId, so we don't + // do a full reset here. this.setStoreState(this.getInitialStoreState()); } }); diff --git a/browser/components/loop/content/shared/js/feedbackStore.js b/browser/components/loop/content/shared/js/feedbackStore.js index a5b78e390de..546c967c5ed 100644 --- a/browser/components/loop/content/shared/js/feedbackStore.js +++ b/browser/components/loop/content/shared/js/feedbackStore.js @@ -37,7 +37,8 @@ loop.store.FeedbackStore = (function() { actions: [ "requireFeedbackDetails", "sendFeedback", - "sendFeedbackError" + "sendFeedbackError", + "feedbackComplete" ], initialize: function(options) { @@ -91,6 +92,14 @@ loop.store.FeedbackStore = (function() { feedbackState: FEEDBACK_STATES.FAILED, error: actionData.error }); + }, + + /** + * Resets the store to its initial state as feedback has been completed, + * i.e. ready for the next round of feedback. + */ + feedbackComplete: function() { + this.resetStoreState(); } }); diff --git a/browser/components/loop/content/shared/js/store.js b/browser/components/loop/content/shared/js/store.js index 1b6ed2be9de..41f5ad8a623 100644 --- a/browser/components/loop/content/shared/js/store.js +++ b/browser/components/loop/content/shared/js/store.js @@ -54,6 +54,17 @@ loop.store.createStore = (function() { this.trigger("change:" + key); } this.trigger("change"); + }, + + /** + * Resets the store state to the initially defined state. + */ + resetStoreState: function() { + if (typeof this.getInitialStoreState === "function") { + this._storeState = this.getInitialStoreState(); + } else { + this._storeState = {}; + } } }; diff --git a/browser/components/loop/standalone/content/js/standaloneRoomViews.js b/browser/components/loop/standalone/content/js/standaloneRoomViews.js index 72116f0107c..59a595a4111 100644 --- a/browser/components/loop/standalone/content/js/standaloneRoomViews.js +++ b/browser/components/loop/standalone/content/js/standaloneRoomViews.js @@ -29,7 +29,7 @@ loop.standaloneRoomViews = (function(mozL10n) { onFeedbackSent: function() { // We pass a tick to prevent React warnings regarding nested updates. setTimeout(function() { - this.props.activeRoomStore.dispatchAction(new sharedActions.ResetRoom()); + this.props.activeRoomStore.dispatchAction(new sharedActions.FeedbackComplete()); }.bind(this)); }, @@ -85,8 +85,10 @@ loop.standaloneRoomViews = (function(mozL10n) { {clientShortname: mozL10n.get("clientShortname2")}); // XXX Bug 1047040 will add images to help prompt the user. return ( - React.DOM.p({className: "prompt-media-message"}, - msg + React.DOM.div({className: "room-inner-info-area"}, + React.DOM.p({className: "prompt-media-message"}, + msg + ) ) ); } diff --git a/browser/components/loop/standalone/content/js/standaloneRoomViews.jsx b/browser/components/loop/standalone/content/js/standaloneRoomViews.jsx index adaa0e5ca22..44582835fa6 100644 --- a/browser/components/loop/standalone/content/js/standaloneRoomViews.jsx +++ b/browser/components/loop/standalone/content/js/standaloneRoomViews.jsx @@ -29,7 +29,7 @@ loop.standaloneRoomViews = (function(mozL10n) { onFeedbackSent: function() { // We pass a tick to prevent React warnings regarding nested updates. setTimeout(function() { - this.props.activeRoomStore.dispatchAction(new sharedActions.ResetRoom()); + this.props.activeRoomStore.dispatchAction(new sharedActions.FeedbackComplete()); }.bind(this)); }, @@ -85,9 +85,11 @@ loop.standaloneRoomViews = (function(mozL10n) { {clientShortname: mozL10n.get("clientShortname2")}); // XXX Bug 1047040 will add images to help prompt the user. return ( -

- {msg} -

+
+

+ {msg} +

+
); } case ROOM_STATES.JOINED: diff --git a/browser/components/loop/standalone/content/js/webapp.js b/browser/components/loop/standalone/content/js/webapp.js index 98177bc0eaf..37f66a37dc1 100644 --- a/browser/components/loop/standalone/content/js/webapp.js +++ b/browser/components/loop/standalone/content/js/webapp.js @@ -690,9 +690,10 @@ loop.webapp = (function($, _, OT, mozL10n) { return nextState.callStatus !== this.state.callStatus; }, - callStatusSwitcher: function(status) { + resetCallStatus: function() { + this.props.feedbackStore.dispatchAction(new sharedActions.FeedbackComplete()); return function() { - this.setState({callStatus: status}); + this.setState({callStatus: "start"}); }.bind(this); }, @@ -744,7 +745,7 @@ loop.webapp = (function($, _, OT, mozL10n) { sdk: this.props.sdk, conversation: this.props.conversation, feedbackStore: this.props.feedbackStore, - onAfterFeedbackReceived: this.callStatusSwitcher("start")} + onAfterFeedbackReceived: this.resetCallStatus()} ) ); } diff --git a/browser/components/loop/standalone/content/js/webapp.jsx b/browser/components/loop/standalone/content/js/webapp.jsx index 3e786340d43..9cd697566a8 100644 --- a/browser/components/loop/standalone/content/js/webapp.jsx +++ b/browser/components/loop/standalone/content/js/webapp.jsx @@ -690,9 +690,10 @@ loop.webapp = (function($, _, OT, mozL10n) { return nextState.callStatus !== this.state.callStatus; }, - callStatusSwitcher: function(status) { + resetCallStatus: function() { + this.props.feedbackStore.dispatchAction(new sharedActions.FeedbackComplete()); return function() { - this.setState({callStatus: status}); + this.setState({callStatus: "start"}); }.bind(this); }, @@ -744,7 +745,7 @@ loop.webapp = (function($, _, OT, mozL10n) { sdk={this.props.sdk} conversation={this.props.conversation} feedbackStore={this.props.feedbackStore} - onAfterFeedbackReceived={this.callStatusSwitcher("start")} + onAfterFeedbackReceived={this.resetCallStatus()} /> ); } diff --git a/browser/components/loop/test/shared/activeRoomStore_test.js b/browser/components/loop/test/shared/activeRoomStore_test.js index cb872cc3be4..a75836ef225 100644 --- a/browser/components/loop/test/shared/activeRoomStore_test.js +++ b/browser/components/loop/test/shared/activeRoomStore_test.js @@ -264,7 +264,7 @@ describe("loop.store.ActiveRoomStore", function () { }); }); - describe("#resetRoom", function() { + describe("#feedbackComplete", function() { it("should reset the room store state", function() { var initialState = store.getInitialStoreState(); store.setStoreState({ @@ -274,7 +274,7 @@ describe("loop.store.ActiveRoomStore", function () { failureReason: "foo" }); - store.resetRoom(new sharedActions.ResetRoom()); + store.feedbackComplete(new sharedActions.FeedbackComplete()); expect(store.getStoreState()).eql(initialState); }); diff --git a/browser/components/loop/test/shared/feedbackStore_test.js b/browser/components/loop/test/shared/feedbackStore_test.js index 8213189842a..9cfcd670268 100644 --- a/browser/components/loop/test/shared/feedbackStore_test.js +++ b/browser/components/loop/test/shared/feedbackStore_test.js @@ -105,4 +105,16 @@ describe("loop.store.FeedbackStore", function () { store.sendFeedback(new sharedActions.SendFeedback(sadFeedbackData)); }); }); + + describe("feedbackComplete", function() { + it("should reset the store state", function() { + store.setStoreState({feedbackState: FEEDBACK_STATES.SENT}); + + store.feedbackComplete(); + + expect(store.getStoreState()).eql({ + feedbackState: FEEDBACK_STATES.INIT + }); + }); + }); }); diff --git a/browser/components/loop/test/standalone/standaloneRoomViews_test.js b/browser/components/loop/test/standalone/standaloneRoomViews_test.js index b72bb3a88ec..7dac026c13c 100644 --- a/browser/components/loop/test/standalone/standaloneRoomViews_test.js +++ b/browser/components/loop/test/standalone/standaloneRoomViews_test.js @@ -291,21 +291,25 @@ describe("loop.standaloneRoomViews", function() { }); describe("Feedback", function() { + beforeEach(function() { + activeRoomStore.setStoreState({roomState: ROOM_STATES.ENDED}); + }); + it("should display a feedback form when the user leaves the room", function() { - activeRoomStore.setStoreState({roomState: ROOM_STATES.ENDED}); - expect(view.getDOMNode().querySelector(".faces")).not.eql(null); }); - it("should reinit the view after feedback is sent", function() { - feedbackStore.setStoreState({feedbackState: FEEDBACK_STATES.SENT}); + it("should dispatch a `FeedbackComplete` action after feedback is sent", + function() { + feedbackStore.setStoreState({feedbackState: FEEDBACK_STATES.SENT}); - sandbox.clock.tick( - loop.shared.views.WINDOW_AUTOCLOSE_TIMEOUT_IN_SECONDS * 1000); + sandbox.clock.tick( + loop.shared.views.WINDOW_AUTOCLOSE_TIMEOUT_IN_SECONDS * 1000 + 1000); - expect(view.getDOMNode().querySelector(".btn-join")).not.eql(null); - }); + sinon.assert.calledOnce(dispatch); + sinon.assert.calledWithExactly(dispatch, new sharedActions.FeedbackComplete()); + }); }); }); });