how to login with facebook on iphone/phonegap with the ChildBrowser plugin

[sserrano]

Hi
By demand on stackoverflow, I write a blog post about how I
implement the login with facebook in one of my apps using the
ChildBrowser plugin.
The link to the post: http://www.pushittolive.com/post/1239874936/facebook-login-on-iphone-phonegap
I hope is useful for others.

Cheers, Sebastian Serrano

[Jesse MacFadyen]

Nice, this is exactly what my hope was when I added the locationChange event.

Super simple, and this same approach can easily be applied to other services, including twitter, ...

Would you consider adding this as a js only plugin in the plugins repo?

- ie. a plugin that is dependent on ChildBrowser, and simply wraps some of the functions.

Cheers, 

  Jesse

--
You received this message because you are subscribed to the Google
Groups "phonegap" group.
To post to this group, send email to phon...@googlegroups.com
To unsubscribe from this group, send email to
phonegap+u...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/phonegap?hl=en?hl=en

For more info on PhoneGap or to download the code go to www.phonegap.com

--
--
Jesse MacFadyen
{
  blog:'blogs.nitobi.com/jesse',
  email:'jesse.m...@nitobi.com',
  company:
  {
    name:'Nitobi Software',
    site:'www.nitobi.com',
    phone:
    {
      office:'+1 (604) 685-9287',
      tollFree:'1-866-632-2777'
     }
  }
}

[sebastian serrano]

Yes, sure.

Cheers, Sebastian

-

http://www.sserrano.com

2010/10/4 Jesse MacFadyen <jesse.m...@nitobi.com>

[Samuel Michelot]

This is great! I wanted to do that since a long time !
Thanks a lot Sebastian!

On Oct 4, 9:35 pm, sebastian serrano <sebast...@livemade.com> wrote:
> Yes, sure.
>
> Cheers, Sebastian
> -http://www.sserrano.com
>
> 2010/10/4 Jesse MacFadyen <jesse.macfad...@nitobi.com>

>
>
>
> > Nice, this is exactly what my hope was when I added the locationChange
> > event.
> > Super simple, and this same approach can easily be applied to other
> > services, including twitter, ...
>
> > Would you consider adding this as a js only plugin in the plugins repo?
> > - ie. a plugin that is dependent on ChildBrowser, and simply wraps some of
> > the functions.
>
> > Cheers,
> >   Jesse
>

> > On Mon, Oct 4, 2010 at 11:55 AM, sserrano <sebastian.serr...@gmail.com>wrote:
>
> >> Hi
> >>  By demand on stackoverflow, I write a blog post about how I
> >> implement the login with facebook in one of my apps using the
> >> ChildBrowser plugin.
> >>  The link to the post:

> >>http://www.pushittolive.com/post/1239874936/facebook-login-on-iphone-...

> >>  I hope is useful for others.
>
> >> Cheers, Sebastian Serrano
>
> >> --
> >> You received this message because you are subscribed to the Google
> >> Groups "phonegap" group.
> >> To post to this group, send email to phon...@googlegroups.com
> >> To unsubscribe from this group, send email to

> >> phonegap+u...@googlegroups.com<phonegap%2Bunsubscribe@googlegroups.c om>

> >> For more options, visit this group at
> >>http://groups.google.com/group/phonegap?hl=en?hl=en
>
> >> For more info on PhoneGap or to download the code go towww.phonegap.com
>
> > --
> > --
> > Jesse MacFadyen
> > {
> >   blog:'blogs.nitobi.com/jesse',

> >   email:'jesse.macfad...@nitobi.com<email%3A%27jesse.macfad...@nitobi.com>

[tdawg]

Any chance on a idiot proof guide?

I got my whole phonegap/jqtouch app built except the iPhone/Twitter
parts.

I tried your code, I didn't quite get how to use the python script.
Then I get it to execure the JS code with a "onClick" event, but,
nothing happens after that.

T-

On Oct 4, 9:55 pm, sserrano <sebastian.serr...@gmail.com> wrote:
> Hi
>   By demand on stackoverflow, I write a blog post about how I

> implement the login withfacebookin one of my apps using the
> ChildBrowser plugin.
>   The link to the post:http://www.pushittolive.com/post/1239874936/facebook-login-on-iphone-...

[Jesse MacFadyen]

I have checked in a plugin-extension to use ChildBrowser to connect to FaceBook

http://github.com/purplecabbage/phonegap-plugins/tree/master/iPhone/ChildBrowser/FBConnectExample/

Cheers,

  Jesse

--
You received this message because you are subscribed to the Google
Groups "phonegap" group.
To post to this group, send email to phon...@googlegroups.com
To unsubscribe from this group, send email to
phonegap+u...@googlegroups.com

For more options, visit this group at
http://groups.google.com/group/phonegap?hl=en?hl=en

For more info on PhoneGap or to download the code go to www.phonegap.com

--
--
Jesse MacFadyen
{
  blog:'blogs.nitobi.com/jesse',

  email:'jesse.m...@nitobi.com',

[Jesse MacFadyen]

You need to use ChildBrowser as well, what do you mean 'closes your app' ?

Does it launch something in Mobile Safari? Does it crash? What is displayed in the debugger console?

On Tue, Oct 19, 2010 at 11:51 AM, Tim S <tpha...@gmail.com> wrote:

It seems OK, but, it automatically closes my app

[Giacomo Balli]

pretty sweet Jesse, you're on the ball lately!

On Oct 19, 8:32 pm, Jesse MacFadyen <jesse.macfad...@nitobi.com>
wrote:

> I have checked in a plugin-extension to use ChildBrowser to connect to
> FaceBook
>

> http://github.com/purplecabbage/phonegap-plugins/tree/master/iPhone/C...

>
> Cheers,
>   Jesse
>
>
>
>
>
> On Tue, Oct 19, 2010 at 10:58 AM, tdawg <tphar...@gmail.com> wrote:
> > Any chance on a idiot proof guide?
>
> > I got my whole phonegap/jqtouch app built except the iPhone/Twitter
> > parts.
>
> > I tried your code, I didn't quite get how to use the python script.
> > Then I get it to execure the JS code with a "onClick" event, but,
> > nothing happens after that.
>
> > T-
>
> > On Oct 4, 9:55 pm, sserrano <sebastian.serr...@gmail.com> wrote:
> > > Hi
> > >   By demand on stackoverflow, I write a blog post about how I
> > > implement the login withfacebookin one of my apps using the
> > > ChildBrowser plugin.
> > >   The link to the post:
> >http://www.pushittolive.com/post/1239874936/facebook-login-on-iphone-...
> > >   I hope is useful for others.
>
> > > Cheers, Sebastian Serrano
>
> > --
> > You received this message because you are subscribed to the Google
> > Groups "phonegap" group.
> > To post to this group, send email to phon...@googlegroups.com
> > To unsubscribe from this group, send email to

> > phonegap+u...@googlegroups.com<phonegap%2Bunsubscribe@googlegroups.c om>

> > For more options, visit this group at
> >http://groups.google.com/group/phonegap?hl=en?hl=en
>
> > For more info on PhoneGap or to download the code go towww.phonegap.com
>
> --
> --
> Jesse MacFadyen
> {
>   blog:'blogs.nitobi.com/jesse',

>   email:'jesse.macfad...@nitobi.com <email%3A%27jesse.macfad...@nitobi.com>

[Tim S]

It seems OK, but, it automatically closes my app

On Tue, Oct 19, 2010 at 9:32 PM, Jesse MacFadyen <jesse.m...@nitobi.com> wrote:

[Tim S]

My bad, it simply needed clean build.

[Tim S]

I am not sure if this is useful, but I made additions to your file others might like... I also know there are a ton more coders, who can do this millions of times better, but, I just thought I'd share back:

In the FB Connect, I added this row:

authorize_url += "&scope=offline_access,publish_stream";

In index page added this function:

function onFBPost(FBID){

var req = window.plugins.fbConnect.wallPost(FBID);

}

and in FBConnect.js added the following:

FBConnect.prototype.wallPost = function(FBID)

{

var url = "https://graph.facebook.com/"+FBID+"/feed";

var params = "access_token="+this.accessToken+"&message=my test message";

//alert(url+params);

var req = new XMLHttpRequest();

req.open("POST", url, true);

//Send the proper header information along with the request

req.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

req.setRequestHeader("Content-length", params.length);

req.setRequestHeader("Connection", "close");

req.onreadystatechange = function() {//Call a function when the state changes.

if(req.readyState == 4 && req.status == 200) {

//alert(req.responseText);

}

}

req.send(params);

return req;

[Jesse MacFadyen]

Cool!

Why don't you fork the repo and check this in?

[Tim S]

Does anyone have an idea how to do a similar thing with twitter?  I'd like to get a list of followers.

[tdawg]

anyone have an idea how to do the same thing for twitter? I'd ike to
grab a list of followers

On Oct 20, 1:57 am, Jesse MacFadyen <jesse.macfad...@nitobi.com>
wrote:

> >>> On Tue, Oct 19, 2010 at 11:51 AM, Tim S <tphar...@gmail.com> wrote:
>
> >>>> It seems OK, but, it automatically closes my app
>
> >>>> On Tue, Oct 19, 2010 at 9:32 PM, Jesse MacFadyen <
> >>>> jesse.macfad...@nitobi.com> wrote:
>
> >>>>> I have checked in a plugin-extension to use ChildBrowser to connect to
> >>>>> FaceBook
>

> >>>>>http://github.com/purplecabbage/phonegap-plugins/tree/master/iPhone/C...
>
> >>>>> Cheers,
> >>>>>   Jesse

>
> >>>>> On Tue, Oct 19, 2010 at 10:58 AM, tdawg <tphar...@gmail.com> wrote:
>
> >>>>>> Any chance on a idiot proof guide?
>
> >>>>>> I got my whole phonegap/jqtouch app built except the iPhone/Twitter
> >>>>>> parts.
>
> >>>>>> I tried your code, I didn't quite get how to use the python script.
> >>>>>> Then I get it to execure the JS code with a "onClick" event, but,
> >>>>>> nothing happens after that.
>
> >>>>>> T-
>
> >>>>>> On Oct 4, 9:55 pm, sserrano <sebastian.serr...@gmail.com> wrote:
> >>>>>> > Hi
> >>>>>> >   By demand on stackoverflow, I write a blog post about how I
> >>>>>> > implement the login withfacebookin one of my apps using the
> >>>>>> > ChildBrowser plugin.
> >>>>>> >   The link to the post:
> >>>>>>http://www.pushittolive.com/post/1239874936/facebook-login-on-iphone-.
> >>>>>> ..
> >>>>>> >   I hope is useful for others.
>
> >>>>>> > Cheers, Sebastian Serrano
>
> >>>>>> --
> >>>>>> You received this message because you are subscribed to the Google
> >>>>>> Groups "phonegap" group.
> >>>>>> To post to this group, send email to phon...@googlegroups.com
> >>>>>> To unsubscribe from this group, send email to

> >>>>>> phonegap+u...@googlegroups.com<phonegap%2Bunsubscribe@googlegroups.c om>

> >>>>>> For more options, visit this group at
> >>>>>>http://groups.google.com/group/phonegap?hl=en?hl=en
>
> >>>>>> For more info on PhoneGap or to download the code go to
> >>>>>>www.phonegap.com
>
> >>>>> --
> >>>>> --
> >>>>> Jesse MacFadyen
> >>>>> {
> >>>>>   blog:'blogs.nitobi.com/jesse',

> >>>>>   email:'jesse.macfad...@nitobi.com<email%3A%27jesse.macfad...@nitobi.com>

> >>>>> ',
> >>>>>   company:
> >>>>>   {
> >>>>>     name:'Nitobi Software',
> >>>>>     site:'www.nitobi.com',
> >>>>>     phone:
> >>>>>     {
> >>>>>       office:'+1 (604) 685-9287',
> >>>>>       tollFree:'1-866-632-2777'
> >>>>>      }
> >>>>>   }
> >>>>> }
>
> >>> --
> >>> --
> >>> Jesse MacFadyen
> >>> {
> >>>   blog:'blogs.nitobi.com/jesse',

> >>>   email:'jesse.macfad...@nitobi.com<email%3A%27jesse.macfad...@nitobi.com>

> >>> ',
> >>>   company:
> >>>   {
> >>>     name:'Nitobi Software',
> >>>     site:'www.nitobi.com',
> >>>     phone:
> >>>     {
> >>>       office:'+1 (604) 685-9287',
> >>>       tollFree:'1-866-632-2777'
> >>>      }
> >>>   }
> >>> }
>
> --
> --
> Jesse MacFadyen
> {
>   blog:'blogs.nitobi.com/jesse',

>   email:'jesse.macfad...@nitobi.com <email%3A%27jesse.macfad...@nitobi.com>

[tdawg]

I found this link:
http://www.moretechtips.net/2009/10/twitter-friends-followers-widget-jquery.html

But I haven't succeeded yet at putting into phonegap, will send back
here when I do.

> > >>>>>> phonegap+u...@googlegroups.com<phonegap%2Bunsubscr...@googlegroups.c om>

[Tim S]

include twitter.js below your jquery include
include the required css in the <head> tag (this is copied from their page)

<style>

/* container */

div.twitter-friends{ }

/*---- Users ----*/

div.tf-users{

/* fixed height so container will not flicker within transitions */

height:48px;

border:silver 1px solid;

overflow:hidden;

background-color:#eaeaea;

}

/* user img link*/

div.tf-users a{

display:block;

float:left;

}

/* user img */

div.tf-users img{ }

/* ---- Info Link ----- */

div.tf-info{

text-align:right;

}

div.tf-info a{

text-decoration:none;

font-size:9px;

font-weight:bolder;

color:gray;

font-family:tahoma;

}

</style>

<!-- end twitter css-->

In the html of your document include:

<ul class=rounded id=twitter-friends options="{

debug:0

,friends:0

,username:'tdawgpharaoh'

}"></ul>

** the original was a div, I changed to UL because I use jqtouch.

Styling changes after that happen in twitter.js