Tutorial Downloads

File Size
dialogFacebook.capx179KB

Translations

Know another language? Translate this tutorial!

Facebook and Twitter Dialog for cocoonjs

Favourite 22 favourites
Tutorial written by juannn91Originally published on 18th, March 2014 - 7 revisions

This is a solution that use facebook and twitter dialog with the browser plugin for publish your game score on ios windows phone and android using cocoonjs, it is a simple but useful solution I hope it works for you

if you only need to work with android yo can put the dialog url(facebook or tweeter) on a browser "OpenURL in a new window" action like this:


if you need this to work on iOS, you need to use something to encode the url, maybe you knows other solution this is what i found:

1. you can encode the url on an external tool search "encode url" on google and you will have a lot of tools for this.

or

2.you can use the encodeURI inside a plugin

a.Create a new plugin to use the encodeURI function of javascript or create a copy of browser plugion (if you create the copy yo need to change the id and name of the plugin

    	return {"name":			"Browser","id":			"Browser","version":		"1.0","description":	"Access the browser that is running the HTML5 application.","author":		"Scirra","help url":		"http://www.scirra.com/manual/110/browser","category":		"Web","type":			"object",			// not in layout"rotatable":	false,"flags":		pf_singleglobal};

)
b.add the encodeURL function to the brwoser plugin Open url function like this:


Be sure not to have any encode url on the facebook or twitter url

Complementary material

* You cand find the plugin code in C:\Program Files\Construct 2\exporters\html5\plugins\browser\runtime.js

* You can use tumblr to store your image

* Use this links to undestand more the properties of each dialog box
facebook reference
twitter reference

Dialog for facebook

https://www.facebook.com/dialog/feed?app_id=XXXXXXXXXX&display=popup&caption= Your score message here &link=https://developers.facebook.com/docs/dialogs/&redirect_uri=https://facebook.com&name=Your game name &picture=your picture url&description= your description

Dialog for twitter

https://twitter.com/intent/tweet?text= Your score message here &lang= your lenguage &url=your url

.capx
I have attached a . capx to that show what i have done, remember to use the encodeURI function for iOS

Unlock your full gamedev potential

Upgrade to the Personal Edition of Construct 2, it has way more features and won't holding back from making money and using your full creativity like the free edition does. It's a one off payment and all Construct 2 editor updates are free for life!

View deals

Plus, it's got a lot of additional features that will help you save time and make more impressive games!

Congratulations on finishing this tutorial!

Did you learn a lot from it? Share it now with your friends!

Share and Copy this Tutorial

You are free to copy, distribute, transmit and adapt this work with correct attribution. Click for more info.

Comments

0
Lordshiva1948 44.3k rep

Nice work thanks for sharing

Wednesday, March 19, 2014 at 8:38:19 AM
0
zorrovn 373 rep

Thanks for your tutorial , I hope this tutorial will solve my problems with social integration function in my game :D

Friday, March 21, 2014 at 10:48:23 PM
0
juannn91 1,239 rep

Hi, i am sure it works for simple sharing integration, if you have any problems tell me.

Tuesday, March 25, 2014 at 2:49:20 PM
0
hollowthreat 1,578 rep

can i use encode url for android? i tried make a copy of browser plugin and add both plugins in my project, when i preview the game, it shows error. i can only have one browser plugin in the project, so if i can use encode url one for both ios and android would be great!

Tuesday, March 25, 2014 at 11:50:30 PM
0
Bitapps 504 rep

can i use this to get a friends score?

Wednesday, March 26, 2014 at 8:28:16 PM
0
juannn91 1,239 rep

@hollowthreat
if you are going to make a copy the browser plugin you need to change some few things in code, or make a knew one with only the open url functions.

In my case I modify the browser plugin adding the encodeURI to each open URL function, like i show in the second image.

tri it.
it works.

@Bitapps
No this is only for sharing :/

Friday, March 28, 2014 at 6:19:13 AM
0
hollowthreat 1,578 rep

@juannn91
yes it does work, thank you for the tutorial, its very useful!

my only concern is I have to modify the browser plugin in every C2 update. would be easier to clone it? i can't get clone to work without error :/

Friday, March 28, 2014 at 8:52:17 AM
0
AbelaNET 14.9k rep

Thanks for sharing.

Saturday, March 29, 2014 at 8:05:28 PM
0
irina 6,924 rep

same here... if i clone browser plugin and even if i rename it to browserIOS i cant make it work... :(

Monday, March 31, 2014 at 10:25:51 AM
0
AndreasR 30.6k rep

CocoonJS offers an in-built Facebook service. Is this possible with construct 2? Or do just that way works?

Tuesday, April 01, 2014 at 9:33:28 PM
0
iceangel 33.5k rep

Thanks you.

Wednesday, April 02, 2014 at 10:24:39 AM
0
AndreasR 30.6k rep

Works fine on HTML5 projects, but it doesn't work on android (cocoonJS). Does it work on your android app?

Wednesday, April 02, 2014 at 7:12:28 PM
1
hollowthreat 1,578 rep

ok a proper way to tackle encodeURL, use URLencode(str), so you don't have to mess with the official plugin :)

Sunday, April 06, 2014 at 4:06:47 AM
0
Colludium 58.4k rep

@juann91 - this is an awesome step. Thank you for your help. I have a problem implementing it but I'm going to ask in the how do I forum as it involves trying to use the URLencode(str).

Thanks again!!

Monday, April 07, 2014 at 3:49:12 AM
1
juannn91 1,239 rep

Hi, yes it works on all devices.
heare is a solution that @Colludium have found and you don't need to use the url encode

www.scirra.com/forum/viewtopic.php?f=147&t=101201&p=768163#p768163

insted encode the url with an external tool example : meyerweb.com/eric/tools/dencoder/

thanks @Colludium

Wednesday, April 16, 2014 at 12:40:28 AM

Leave a comment

Everyone is welcome to leave their thoughts! Register a new account or login.