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