48f1dfccc6db6baea831d3b17072c1a18d52cba1
[ikiwiki.git] / underlays / openid-selector / ikiwiki / openid / openid-jquery.js
1 /*
2 Simple OpenID Plugin
3 http://code.google.com/p/openid-selector/
4
5 This code is licenced under the New BSD License.
6 */
7
8 var providers_large = {
9     google: {
10         name: 'Google',
11         icon: 'ikiwiki/openid/goa-account-google.png',
12         url: 'https://www.google.com/accounts/o8/id'
13     },
14     yahoo: {
15         name: 'Yahoo',      
16         icon: 'ikiwiki/openid/goa-account-yahoo.png',
17         url: 'http://me.yahoo.com/'
18     },    
19     openid: {
20         name: 'OpenID',     
21         icon: 'wikiicons/openidlogin-bg.gif',
22         label: 'Enter your OpenID:',
23         url: null
24     }
25 };
26 var providers_small = {
27     livejournal: {
28         name: 'LiveJournal',
29         icon: 'http://livejournal.com/favicon.ico',
30         label: 'Enter your Livejournal username:',
31         url: 'http://{username}.livejournal.com/'
32     },
33     flickr: {
34         name: 'Flickr',        
35         icon: 'ikiwiki/openid/goa-account-flickr.png',
36         label: 'Enter your Flickr username:',
37         url: 'http://flickr.com/photos/{username}/'
38     },
39     wordpress: {
40         name: 'Wordpress',
41         icon: 'ikiwiki/openid/wordpress.png',
42         label: 'Enter your Wordpress.com username:',
43         url: 'http://{username}.wordpress.com/'
44     },
45     aol: {
46         name: 'AOL',     
47         icon: 'http://aol.com/favicon.ico',
48         label: 'Enter your AOL username:',
49         url: 'http://openid.aol.com/{username}'
50     },
51     verisign: {
52         name: 'Verisign',
53         icon: 'http://verisign.com/favicon.ico',
54         label: 'Enter your Verisign username:',
55         url: 'http://{username}.pip.verisignlabs.com/'
56     }
57 };
58 var providers = $.extend({}, providers_large, providers_small);
59
60 var openid = {
61
62         demo: false,
63         ajaxHandler: null,
64         cookie_expires: 6*30,   // 6 months.
65         cookie_name: 'openid_provider',
66         cookie_path: '/',
67         
68         img_path: 'images/',
69         
70         input_id: null,
71         provider_url: null,
72         provider_id: null,
73         localsignin_id: null,
74         
75     init: function(input_id, localsignin_id) {
76         
77         var openid_btns = $('#openid_btns');
78         
79         this.input_id = input_id;
80         
81         $('#openid_choice').show();
82         $('#openid_input_area').empty();
83         
84         // add box for each provider
85         for (id in providers_large) {
86                 openid_btns.append(this.getBoxHTML(providers_large[id], 'large'));
87         }
88
89         if (providers_small) {
90                 openid_btns.append('<br/>');
91                 
92                 for (id in providers_small) {
93                 
94                         openid_btns.append(this.getBoxHTML(providers_small[id], 'small'));
95                 }
96         }
97         if (localsignin_id != "") {
98                 this.localsignin_id=localsignin_id;
99                 openid_btns.append(
100                         '<a href="javascript: openid.signin(\'localsignin\');"' +
101                         ' style="background: #FFF" ' +
102                         'class="localsignin openid_small_btn">' +
103                         '<img alt="" width="16" height="16" src="favicon.ico" />' +
104                         ' other' +
105                         '</a>'
106                 );
107                 $('#'+this.localsignin_id).hide();
108         }
109         
110         $('#openid_form').submit(this.submit);
111         
112         var box_id = this.readCookie();
113         if (box_id) {
114                 this.signin(box_id, true);
115         }
116     },
117     getBoxHTML: function(provider, box_size) {
118         var label="";
119         var title=""
120         if (box_size == 'large') {
121                 label=' ' + provider["name"];
122         }
123         else {
124                 title=' title="'+provider["name"]+'"';
125         }
126         var box_id = provider["name"].toLowerCase();
127         return '<a' + title +' href="javascript: openid.signin(\''+ box_id +'\');"' +
128                         ' style="background: #FFF" ' + 
129                         'class="' + box_id + ' openid_' + box_size + '_btn">' +
130                         '<img alt="" width="16" height="16" src="' + provider["icon"] + '" />' +
131                         label +
132                         '</a>';
133     
134     },
135     /* Provider image click */
136     signin: function(box_id, onload) {
137
138         if (box_id == 'localsignin') {
139                 this.highlight(box_id);
140                 $('#openid_input_area').empty();
141                 $('#'+this.localsignin_id).show();
142                 this.setCookie(box_id);
143                 return;
144         }
145         else {
146                 if (this.localsignin_id) {
147                         $('#'+this.localsignin_id).hide();
148                 }
149         }
150
151         var provider = providers[box_id];
152                 if (! provider) {
153                         return;
154                 }
155                 
156                 this.highlight(box_id);
157                 
158                 this.provider_id = box_id;
159                 this.provider_url = provider['url'];
160                 
161                 // prompt user for input?
162                 if (provider['label']) {
163                         this.setCookie(box_id);
164                         this.useInputBox(provider);
165                 } else {
166                         this.setCookie('');
167                         $('#openid_input_area').empty();
168                         if (! onload) {
169                                 $('#openid_form').submit();
170                         }
171                 }
172     },
173     /* Sign-in button click */
174     submit: function() {
175         
176         var url = openid.provider_url; 
177         if (url) {
178                 url = url.replace('{username}', $('#openid_username').val());
179                 openid.setOpenIdUrl(url);
180         }
181         if(openid.ajaxHandler) {
182                 openid.ajaxHandler(openid.provider_id, document.getElementById(openid.input_id).value);
183                 return false;
184         }
185         if(openid.demo) {
186                 alert("In client demo mode. Normally would have submitted OpenID:\r\n" + document.getElementById(openid.input_id).value);
187                 return false;
188         }
189         return true;
190     },
191     setOpenIdUrl: function (url) {
192     
193         var hidden = $('#'+this.input_id);
194         if (hidden.length > 0) {
195                 hidden.value = url;
196         } else {
197                 $('#openid_form').append('<input style="display:none" id="' + this.input_id + '" name="' + this.input_id + '" value="'+url+'"/>');
198         }
199     },
200     highlight: function (box_id) {
201         
202         // remove previous highlight.
203         var highlight = $('#openid_highlight');
204         if (highlight) {
205                 highlight.replaceWith($('#openid_highlight a')[0]);
206         }
207         // add new highlight.
208         $('.'+box_id).wrap('<div id="openid_highlight"></div>');
209     },
210     setCookie: function (value) {
211     
212                 var date = new Date();
213                 date.setTime(date.getTime()+(this.cookie_expires*24*60*60*1000));
214                 var expires = "; expires="+date.toGMTString();
215                 
216                 document.cookie = this.cookie_name+"="+value+expires+"; path=" + this.cookie_path;
217     },
218     readCookie: function () {
219                 var nameEQ = this.cookie_name + "=";
220                 var ca = document.cookie.split(';');
221                 for(var i=0;i < ca.length;i++) {
222                         var c = ca[i];
223                         while (c.charAt(0)==' ') c = c.substring(1,c.length);
224                         if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
225                 }
226                 return null;
227     },
228     useInputBox: function (provider) {
229         
230                 var input_area = $('#openid_input_area');
231                 
232                 var html = '';
233                 var id = 'openid_username';
234                 var value = '';
235                 var label = provider['label'];
236                 var style = '';
237                 
238                 if (provider['name'] == 'OpenID') {
239                         id = this.input_id;
240                         value = '';
241                         style = 'background:#FFF url(wikiicons/openidlogin-bg.gif) no-repeat scroll 0 50%; padding-left:18px;';
242                 }
243                 if (label) {
244                         html = '<label for="'+ id +'" class="block">' + label + '</label>';
245                 }
246                 html += '<input id="'+id+'" type="text" style="'+style+'" name="'+id+'" value="'+value+'" />' + 
247                                         '<input id="openid_submit" type="submit" value="Login"/>';
248                 
249                 input_area.empty();
250                 input_area.append(html);
251
252                 $('#'+id).focus();
253     },
254     setDemoMode: function (demoMode) {
255         this.demo = demoMode;
256     },
257     setAjaxHandler: function (ajaxFunction) {
258         this.ajaxHandler = ajaxFunction;
259     }
260 };