Bug 1178304 - Facebook share button in conversation when waiting alone. r=dmose

This commit is contained in:
Fernando Campo 2016-01-06 10:20:15 +00:00
parent 7f3b6c4e6f
commit adfd149f97
13 changed files with 150 additions and 33 deletions

View File

@ -52,7 +52,8 @@ const SHARING_ROOM_URL = {
COPY_FROM_PANEL: 0,
COPY_FROM_CONVERSATION: 1,
EMAIL_FROM_CALLFAILED: 2,
EMAIL_FROM_CONVERSATION: 3
EMAIL_FROM_CONVERSATION: 3,
FACEBOOK_FROM_CONVERSATION: 4
};
/**

View File

@ -85,6 +85,7 @@ loop.store = loop.store || {};
"deleteRoom",
"deleteRoomError",
"emailRoomUrl",
"facebookShareRoomUrl",
"getAllRooms",
"getAllRoomsError",
"openRoom",
@ -351,6 +352,29 @@ loop.store = loop.store || {};
["TelemetryAddValue", "LOOP_SHARING_ROOM_URL", bucket]);
},
/**
* Share a room url with Facebook
*
* @param {sharedActions.FacebookShareRoomUrl} actionData The action data.
*/
facebookShareRoomUrl: function(actionData) {
var encodedRoom = encodeURIComponent(actionData.roomUrl);
loop.request("GetLoopPref", "facebook.shareUrl")
.then(shareUrl => {
loop.request("OpenURL", shareUrl.replace("%ROOM_URL%", encodedRoom));
}).then(() => {
loop.request("NotifyUITour", "Loop:RoomURLShared");
});
var from = actionData.from;
var bucket = this._constants.SHARING_ROOM_URL["FACEBOOK_FROM_" + from.toUpperCase()];
if (typeof bucket === "undefined") {
console.error("No URL sharing type bucket found for '" + from + "'");
return;
}
loop.request("TelemetryAddValue", "LOOP_SHARING_ROOM_URL", bucket);
},
/**
* Share a room url.
*

View File

@ -280,6 +280,15 @@ loop.roomViews = (function(mozL10n) {
}));
},
handleFacebookButtonClick: function(event) {
event.preventDefault();
this.props.dispatcher.dispatch(new sharedActions.FacebookShareRoomUrl({
from: "conversation",
roomUrl: this.props.roomData.roomUrl
}));
},
handleCopyButtonClick: function(event) {
event.preventDefault();
@ -301,20 +310,6 @@ loop.roomViews = (function(mozL10n) {
}
},
handleShareButtonClick: function(event) {
event.preventDefault();
var providers = this.props.socialShareProviders;
// If there are no providers available currently, save a click by dispatching
// the 'AddSocialShareProvider' right away.
if (!providers || !providers.length) {
this.props.dispatcher.dispatch(new sharedActions.AddSocialShareProvider());
return;
}
this.toggleDropdownMenu();
},
handleEditContextClose: function() {
if (this.props.onEditContextClose) {
this.props.onEditContextClose();
@ -354,6 +349,12 @@ loop.roomViews = (function(mozL10n) {
onMouseOver: this.resetTriggeredButtons},
React.createElement("img", {src: "shared/img/glyph-email-16x16.svg"}),
React.createElement("p", null, mozL10n.get("invite_email_link_button"))
),
React.createElement("div", {className: "btn-facebook invite-button",
onClick: this.handleFacebookButtonClick,
onMouseOver: this.resetTriggeredButtons},
React.createElement("img", {src: "shared/img/glyph-facebook-16x16.svg"}),
React.createElement("p", null, mozL10n.get("invite_facebook_button3"))
)
),
React.createElement(SocialShareDropdown, {

View File

@ -280,6 +280,15 @@ loop.roomViews = (function(mozL10n) {
}));
},
handleFacebookButtonClick: function(event) {
event.preventDefault();
this.props.dispatcher.dispatch(new sharedActions.FacebookShareRoomUrl({
from: "conversation",
roomUrl: this.props.roomData.roomUrl
}));
},
handleCopyButtonClick: function(event) {
event.preventDefault();
@ -301,20 +310,6 @@ loop.roomViews = (function(mozL10n) {
}
},
handleShareButtonClick: function(event) {
event.preventDefault();
var providers = this.props.socialShareProviders;
// If there are no providers available currently, save a click by dispatching
// the 'AddSocialShareProvider' right away.
if (!providers || !providers.length) {
this.props.dispatcher.dispatch(new sharedActions.AddSocialShareProvider());
return;
}
this.toggleDropdownMenu();
},
handleEditContextClose: function() {
if (this.props.onEditContextClose) {
this.props.onEditContextClose();
@ -355,6 +350,12 @@ loop.roomViews = (function(mozL10n) {
<img src="shared/img/glyph-email-16x16.svg" />
<p>{mozL10n.get("invite_email_link_button")}</p>
</div>
<div className="btn-facebook invite-button"
onClick={this.handleFacebookButtonClick}
onMouseOver={this.resetTriggeredButtons}>
<img src="shared/img/glyph-facebook-16x16.svg" />
<p>{mozL10n.get("invite_facebook_button3")}</p>
</div>
</div>
<SocialShareDropdown
dispatcher={this.props.dispatcher}

View File

@ -3,6 +3,7 @@ pref("loop.textChat.enabled", true);
pref("loop.server", "https://loop.services.mozilla.com/v0");
pref("loop.linkClicker.url", "https://hello.firefox.com/");
pref("loop.gettingStarted.latestFTUVersion", 0);
pref("loop.facebook.shareUrl", "https://www.facebook.com/sharer/sharer.php?u=%ROOM_URL%");
pref("loop.gettingStarted.url", "https://www.mozilla.org/%LOCALE%/firefox/%VERSION%/hello/start/");
pref("loop.gettingStarted.resumeOnFirstJoin", false);
pref("loop.learnMoreUrl", "https://www.firefox.com/hello/");

View File

@ -219,6 +219,7 @@ html[dir="rtl"] .conversation-toolbar-btn-box.btn-edit-entry {
margin: .5rem 0 0;
position: absolute;
right: -10rem;
font-size: 0.8rem;
}
.call-action-group > .invite-button.triggered > p,
@ -554,7 +555,7 @@ body[platform="win"] .share-service-dropdown.overflow > .dropdown-menu-item {
.room-invitation-content,
.room-context-header {
color: #333;
font-size: 1.2rem;
font-size: 1rem;
font-weight: bold;
margin: 1rem auto;
}

View File

@ -344,6 +344,9 @@ loop.shared.actions = (function() {
/**
* Copy a room url into the user's clipboard.
* XXX: should move to some roomActions module - refs bug 1079284
* @from: where the invitation is shared from.
* Possible values ['panel', 'conversation']
* @roomUrl: the URL that is shared
*/
CopyRoomUrl: Action.define("copyRoomUrl", {
from: String,
@ -353,6 +356,9 @@ loop.shared.actions = (function() {
/**
* Email a room url.
* XXX: should move to some roomActions module - refs bug 1079284
* @from: where the invitation is shared from.
* Possible values ['panel', 'conversation']
* @roomUrl: the URL that is shared
*/
EmailRoomUrl: Action.define("emailRoomUrl", {
from: String,
@ -360,9 +366,23 @@ loop.shared.actions = (function() {
// roomDescription: String, Optional.
}),
/**
* Share a room url with Facebook.
* XXX: should move to some roomActions module - refs bug 1079284
* @from: where the invitation is shared from.
* Possible values ['panel', 'conversation']
* @roomUrl: the URL that is shared
*/
FacebookShareRoomUrl: Action.define("facebookShareRoomUrl", {
from: String,
roomUrl: String
}),
/**
* Share a room url via the Social API.
* XXX: should move to some roomActions module - refs bug 1079284
* @provider: one of the share-capable Social Providers included
* @roomUrl: the URL that is shared
*/
ShareRoomUrl: Action.define("shareRoomUrl", {
provider: Object,

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

View File

@ -9,6 +9,14 @@
<meta name="default_locale" content="en-US" />
<meta name="referrer" content="origin" />
<meta property="og:image" content="https://hello.firefox.com/img/invitation.png" />
<meta property="og:image:height" content="630" />
<meta property="og:image:width" content="1200" />
<meta property="og:site_name" content="Firefox Hello" />
<meta property="og:title" content="A friend has invited you to browse the Web together on Firefox Hello" />
<meta property="og:description" content="Click to connect" />
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" type="text/css" href="shared/css/reset.css">

View File

@ -33,7 +33,8 @@ describe("loop.store.RoomStore", function() {
COPY_FROM_PANEL: 0,
COPY_FROM_CONVERSATION: 1,
EMAIL_FROM_PANEL: 2,
EMAIL_FROM_CONVERSATION: 3
EMAIL_FROM_CONVERSATION: 3,
FACEBOOK_FROM_CONVERSATION: 4
},
ROOM_CREATE: {
CREATE_SUCCESS: 0,
@ -56,6 +57,7 @@ describe("loop.store.RoomStore", function() {
}
},
NotifyUITour: function() {},
OpenURL: sinon.stub(),
"Rooms:Create": sinon.stub().returns({ roomToken: "fakeToken" }),
"Rooms:Delete": sinon.stub(),
"Rooms:GetAll": sinon.stub(),
@ -513,6 +515,43 @@ describe("loop.store.RoomStore", function() {
});
});
describe("#facebookShareRoomUrl", function() {
var getLoopPrefStub;
beforeEach(function() {
getLoopPrefStub = function() {
return "https://shared.site/?u=%ROOM_URL%";
};
LoopMochaUtils.stubLoopRequest({
GetLoopPref: getLoopPrefStub
});
});
it("should open the facebook url with room URL", function() {
store.facebookShareRoomUrl(new sharedActions.FacebookShareRoomUrl({
from: "conversation",
roomUrl: "http://invalid"
}));
sinon.assert.calledOnce(requestStubs.OpenURL);
sinon.assert.calledWithExactly(requestStubs.OpenURL, "https://shared.site/?u=http%3A%2F%2Finvalid");
});
it("should send a telemetry event for facebook share from conversation", function() {
store.facebookShareRoomUrl(new sharedActions.FacebookShareRoomUrl({
from: "conversation",
roomUrl: "http://invalid"
}));
sinon.assert.calledOnce(requestStubs.TelemetryAddValue);
sinon.assert.calledWithExactly(requestStubs.TelemetryAddValue,
"LOOP_SHARING_ROOM_URL", 4);
});
});
describe("#shareRoomUrl", function() {
var socialShareRoomStub;

View File

@ -246,6 +246,27 @@ describe("loop.roomViews", function() {
}));
});
it("should dispatch a FacebookShareRoomUrl action when the facebook button is clicked",
function() {
var url = "http://invalid";
view = mountTestComponent({
roomData: {
roomUrl: url
}
});
var facebookBtn = view.getDOMNode().querySelector(".btn-facebook");
React.addons.TestUtils.Simulate.click(facebookBtn);
sinon.assert.calledOnce(dispatcher.dispatch);
sinon.assert.calledWith(dispatcher.dispatch,
new sharedActions.FacebookShareRoomUrl({
from: "conversation",
roomUrl: url
}));
});
describe("Copy Button", function() {
beforeEach(function() {
view = mountTestComponent();

View File

@ -52,7 +52,7 @@ invite_header_text3=It takes two to use Firefox Hello, so send a friend a link t
invite_copy_link_button=Copy Link
invite_copied_link_button=Copied!
invite_email_link_button=Email Link
invite_facebook_button2=Share on Facebook
invite_facebook_button3=Facebook
invite_your_link=Your link:
# Status text

View File

@ -8299,7 +8299,7 @@
"kind": "enumerated",
"n_values": 8,
"releaseChannelCollection": "opt-out",
"description": "Number of times a room URL is shared (0=COPY_FROM_PANEL, 1=COPY_FROM_CONVERSATION, 2=EMAIL_FROM_CALLFAILED, 3=EMAIL_FROM_CONVERSATION)"
"description": "Number of times a room URL is shared (0=COPY_FROM_PANEL, 1=COPY_FROM_CONVERSATION, 2=EMAIL_FROM_CALLFAILED, 3=EMAIL_FROM_CONVERSATION, 4=FACEBOOK_FROM_CONVERSATION)"
},
"LOOP_ROOM_CREATE": {
"alert_emails": ["firefox-dev@mozilla.org", "mdeboer@mozilla.com"],