Skip to content

Commit fe8d925

Browse files
shaialonGerrit Code Review
shaialon
authored and
Gerrit Code Review
committed
Add Cordova Social Sharing and Actionsheet examples
- Add examples for Sharing Message, Subject, Image(s) and a Link - Add examples for Sharing Twitter, Facebook, Email, SMS, WhatsApp - Add examples for Actionsheet popups Change-Id: I2cf789cdc1b595b3c99de3f4d390b9449c5623b7
1 parent 340bcd3 commit fe8d925

File tree

3 files changed

+240
-1
lines changed

3 files changed

+240
-1
lines changed

‎examples/cordova/app.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
[
2+
"./modules/SharingPage",
23
"./modules/ToastPage",
34
"./modules/MotionPage",
45
"./modules/DialogPage",
56
"./modules/NetworkPage",
67
"./modules/CameraPage",
78
"./modules/BarcodeScannerPage",
8-
"./modules/MediaPage"
9+
"./modules/MediaPage",
10+
"./modules/ActionSheetPage"
911
].forEach(function(page) {
1012
require(page).create();
1113
});

‎examples/cordova/modules/ActionSheetPage.js

Lines changed: 74 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,74 @@
1+
var PluginPage = require("./PluginPage");
2+
var layoutNext = {left: 10, top: ["prev()", 10], right: 10};
3+
4+
/********************
5+
* More info at:
6+
* https://github.com/EddyVerbruggen/cordova-plugin-actionsheet
7+
*******************/
8+
9+
var page = new PluginPage("ActionSheet", "cordova-plugin-actionsheet", function(parent) {
10+
11+
var buttons = [
12+
{
13+
title: "Sharing menu",
14+
handler: shareSheet
15+
},
16+
{
17+
title: "Delete menu",
18+
handler: deleteSheet
19+
},
20+
{
21+
title: "Log out menu",
22+
handler: logoutSheet
23+
}
24+
];
25+
26+
buttons.forEach(function(option) {
27+
new tabris.Button({
28+
layoutData: layoutNext,
29+
text: option.title
30+
}).appendTo(parent).on("select", option.handler);
31+
});
32+
33+
});
34+
35+
module.exports = page;
36+
37+
var callback = function(buttonIndex) {
38+
setTimeout(function() {
39+
// like other Cordova plugins (prompt, confirm) the buttonIndex is 1-based (first button is index 1)
40+
console.log("button index clicked: " + buttonIndex);
41+
window.plugins.toast.showShortCenter("button index clicked: " + buttonIndex);
42+
});
43+
};
44+
45+
function shareSheet() {
46+
var options = {
47+
androidTheme: window.plugins.actionsheet.ANDROID_THEMES.THEME_HOLO_LIGHT,
48+
title: "What do you want with this image?",
49+
buttonLabels: ["Share via Facebook", "Share via Twitter"],
50+
androidEnableCancelButton: true,
51+
winphoneEnableCancelButton: true,
52+
addCancelButtonWithLabel: "Cancel",
53+
addDestructiveButtonWithLabel: "Delete it"
54+
};
55+
window.plugins.actionsheet.show(options, callback);
56+
}
57+
58+
function deleteSheet() {
59+
var options = {
60+
addCancelButtonWithLabel: "Cancel",
61+
addDestructiveButtonWithLabel: "Delete note"
62+
};
63+
window.plugins.actionsheet.show(options, callback);
64+
}
65+
66+
function logoutSheet() {
67+
var options = {
68+
buttonLabels: ["Log out"],
69+
androidEnableCancelButton: true,
70+
winphoneEnableCancelButton: true,
71+
addCancelButtonWithLabel: "Cancel"
72+
};
73+
window.plugins.actionsheet.show(options, callback);
74+
}

‎examples/cordova/modules/SharingPage.js

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
var PluginPage = require("./PluginPage");
2+
var layoutNext = {left: 10, top: ["prev()", 10], right: 10};
3+
4+
var page = new PluginPage("Sharing", "cordova-plugin-x-socialsharing", function(parent) {
5+
6+
var shareSheetOptions = [
7+
{
8+
name: "Message only",
9+
handler: function(message) {
10+
window.plugins.socialsharing.share(message); }
11+
}, {
12+
name: "Message and subject",
13+
handler: function(message) {
14+
window.plugins.socialsharing.share(message, "An awesome title"); }
15+
}, {
16+
name: "Message and link",
17+
handler: function(message) {
18+
window.plugins.socialsharing.share(message,
19+
null, null, "https://tabrisjs.com",
20+
shareSuccessful, shareError);
21+
}
22+
}, {
23+
name: "Image only",
24+
handler: function() {
25+
window.plugins.socialsharing.share(null,
26+
null, "http://eclipsesource.com/blogs/wp-content/uploads/2015/10/tabris-icon-logo-small.png", null,
27+
shareSuccessful, shareError);
28+
}
29+
}, {
30+
name: "Message, subject, image and link",
31+
handler: function(message) {
32+
window.plugins.socialsharing.share(message, "An awesome subject",
33+
"http://eclipsesource.com/blogs/wp-content/uploads/2015/10/tabris-icon-logo-small.png",
34+
"https://tabrisjs.com", shareSuccessful, shareError);
35+
}
36+
}
37+
];
38+
39+
var shareViaOptions = [
40+
// When using shareVia, make sure the share option is available with window.plugins.socialsharing.canShareVia(..)
41+
{
42+
name: "Share via Twitter",
43+
handler: function(message) {
44+
window.plugins.socialsharing.shareViaTwitter(
45+
message + " @tabrisjs",
46+
"http://eclipsesource.com/blogs/wp-content/uploads/2015/10/tabris-icon-logo-small.png",
47+
"https://tabrisjs.com", shareSuccessful, shareError
48+
);
49+
}
50+
}, {
51+
name: "Share via Facebook",
52+
handler: function() {
53+
window.plugins.socialsharing.shareViaFacebook(
54+
null, null,
55+
"https://tabrisjs.com",
56+
shareSuccessful, shareError
57+
);
58+
}
59+
}, {
60+
name: "Share via Whatsapp",
61+
handler: function(message) {
62+
window.plugins.socialsharing.shareViaWhatsApp(message,
63+
null, "https://tabrisjs.com", shareSuccessful, shareError
64+
);
65+
}
66+
}, {
67+
name: "Share via SMS",
68+
handler: function(message) {
69+
window.plugins.socialsharing.shareViaSMS({message: message},
70+
"0612345678,0687654321", shareSuccessful, shareError
71+
);
72+
}
73+
}, {
74+
name: "Share via Email",
75+
handler: function(message) {
76+
window.plugins.socialsharing.shareViaEmail(
77+
message,
78+
"I just discovered Tabris.js!",
79+
["[email protected]", "[email protected]"],
80+
["[email protected]"],
81+
null,
82+
["http://eclipsesource.com/blogs/wp-content/uploads/2015/10/tabris-icon-logo-small.png"],
83+
shareSuccessful, shareError
84+
);
85+
}
86+
}
87+
];
88+
89+
var tabs = [
90+
{
91+
title: "ShareSheet",
92+
description: ["Use the platform native sharing capabilities. There are various",
93+
" options for sharing a Message, Subject, Image(s) and a Link"].join(""),
94+
options: shareSheetOptions
95+
},
96+
{
97+
title: "ShareVia",
98+
description: ["You can also specify the target app for sharing.",
99+
" Before you offer users to share via twitter, whatsapp, facebook, sms, email,",
100+
" you may want to check that the option is available with",
101+
" socialsharing.canShareVia('whatsapp' ... )"].join(""),
102+
options: shareViaOptions
103+
}
104+
];
105+
106+
new tabris.TextView({
107+
text: "Text to share:",
108+
font: "20px", layoutData: layoutNext
109+
}).appendTo(parent);
110+
111+
var input = new tabris.TextInput({
112+
text: "Tabris.js - Native mobile apps in JavaScript", layoutData: layoutNext
113+
}).appendTo(parent);
114+
115+
var scrollContainer = new tabris.ScrollView({
116+
layoutData: {left: 0, top: ["prev()",16] , right: 0, bottom: 0}
117+
}).appendTo(parent);
118+
119+
tabs.forEach(function(tabConfig) {
120+
createSharingSection(tabConfig, scrollContainer);
121+
});
122+
123+
function createSharingSection(tabConfig, target) {
124+
new tabris.TextView({
125+
text: tabConfig.title + " options", font: "20px",
126+
layoutData: {left: 10, top: ["prev()",6], right: 10}
127+
}).appendTo(target);
128+
129+
new tabris.TextView({
130+
text: tabConfig.description, font: "14px",
131+
layoutData: {left: 10, top: ["prev()", 2], right: 10}
132+
}).appendTo(target);
133+
134+
tabConfig.options.forEach(function(sharingOption) {
135+
new tabris.Button({
136+
layoutData: layoutNext,
137+
text: sharingOption.name
138+
}).appendTo(target).on("select", function() {
139+
var message = input.get("text");
140+
sharingOption.handler(message);
141+
});
142+
});
143+
144+
new tabris.Composite({layoutData: {left: 0, top: ["prev()",30] , right: 0}}).appendTo(target);
145+
}
146+
});
147+
148+
module.exports = page;
149+
150+
function shareSuccessful(success) {
151+
if (success) {
152+
window.plugins.toast.showShortCenter("Thank you for sharing :)");
153+
console.log("Success sharing: " + success);
154+
} else {
155+
window.plugins.toast.showShortCenter("Did you cancel? Not awesome enough for you?");
156+
console.log("Cancelled sharing. Response: " + success);
157+
}
158+
}
159+
160+
function shareError(errormsg) {
161+
window.plugins.toast.showShortCenter("Error sharing: " + errormsg + ". Do you have this feature available?");
162+
console.log("Error sharing: " + errormsg);
163+
}

0 commit comments

Comments
 (0)