3 http://code.google.com/p/openid-selector/
5 This code is licenced under the New BSD License.
8 var providers_large = {
11 icon: 'ikiwiki/openid/verisign.png',
12 label: 'Enter your Verisign username:',
13 url: 'http://{username}.pip.verisignlabs.com/'
17 icon: 'ikiwiki/openid/goa-account-yahoo.png',
18 url: 'http://me.yahoo.com/'
22 icon: 'wikiicons/openidlogin-bg.gif',
23 label: 'Enter your OpenID:',
27 var providers_small = {
30 icon: 'ikiwiki/openid/livejournal.png',
31 label: 'Enter your Livejournal username:',
32 url: 'http://{username}.livejournal.com/'
36 icon: 'ikiwiki/openid/goa-account-flickr.png',
37 label: 'Enter your Flickr username:',
38 url: 'http://flickr.com/photos/{username}/'
42 icon: 'ikiwiki/openid/wordpress.png',
43 label: 'Enter your Wordpress.com username:',
44 url: 'http://{username}.wordpress.com/'
48 icon: 'ikiwiki/openid/aol.png',
49 label: 'Enter your AOL username:',
50 url: 'http://openid.aol.com/{username}'
53 var providers = $.extend({}, providers_large, providers_small);
59 cookie_expires: 6*30, // 6 months.
60 cookie_name: 'openid_provider',
70 init: function(input_id, localsignin_id, localsignin_label) {
72 var openid_btns = $('#openid_btns');
74 this.input_id = input_id;
76 $('#openid_choice').show();
77 $('#openid_input_area').empty();
79 // add box for each provider
80 for (id in providers_large) {
81 openid_btns.append(this.getBoxHTML(providers_large[id], 'large'));
84 if (providers_small) {
85 openid_btns.append('<br/>');
87 for (id in providers_small) {
89 openid_btns.append(this.getBoxHTML(providers_small[id], 'small'));
92 if (localsignin_label != "") {
93 this.localsignin_label=localsignin_label;
96 this.localsignin_label="other";
98 if (localsignin_id != "") {
99 this.localsignin_id=localsignin_id;
101 '<a href="javascript: openid.signin(\'localsignin\');"' +
102 ' style="background: #FFF" ' +
103 'class="localsignin openid_small_btn">' +
104 '<img alt="" width="16" height="16" src="favicon.ico" />' +
105 ' ' + this.localsignin_label +
108 $('#'+this.localsignin_id).hide();
111 $('#openid_form').submit(this.submit);
113 var box_id = this.readCookie();
115 this.signin(box_id, true);
118 getBoxHTML: function(provider, box_size) {
121 if (box_size == 'large') {
122 label=' ' + provider["name"];
125 title=' title="'+provider["name"]+'"';
127 var box_id = provider["name"].toLowerCase();
128 return '<a' + title +' href="javascript: openid.signin(\''+ box_id +'\');"' +
129 ' style="background: #FFF" ' +
130 'class="' + box_id + ' openid_' + box_size + '_btn">' +
131 '<img alt="" width="16" height="16" src="' + provider["icon"] + '" />' +
136 /* Provider image click */
137 signin: function(box_id, onload) {
139 if (box_id == 'localsignin') {
140 this.highlight(box_id);
141 $('#openid_input_area').empty();
142 $('#'+this.localsignin_id).show();
143 this.setCookie(box_id);
147 if (this.localsignin_id) {
148 $('#'+this.localsignin_id).hide();
152 var provider = providers[box_id];
157 this.highlight(box_id);
159 this.provider_id = box_id;
160 this.provider_url = provider['url'];
162 // prompt user for input?
163 if (provider['label']) {
164 this.setCookie(box_id);
165 this.useInputBox(provider);
168 $('#openid_input_area').empty();
170 $('#openid_form').submit();
174 /* Sign-in button click */
177 var url = openid.provider_url;
179 url = url.replace('{username}', $('#openid_username').val());
180 openid.setOpenIdUrl(url);
182 if(openid.ajaxHandler) {
183 openid.ajaxHandler(openid.provider_id, document.getElementById(openid.input_id).value);
187 alert("In client demo mode. Normally would have submitted OpenID:\r\n" + document.getElementById(openid.input_id).value);
192 setOpenIdUrl: function (url) {
194 var hidden = $('#'+this.input_id);
195 if (hidden.length > 0) {
198 $('#openid_form').append('<input style="display:none" id="' + this.input_id + '" name="' + this.input_id + '" value="'+url+'"/>');
201 highlight: function (box_id) {
203 // remove previous highlight.
204 var highlight = $('#openid_highlight');
206 highlight.replaceWith($('#openid_highlight a')[0]);
208 // add new highlight.
209 $('.'+box_id).wrap('<div id="openid_highlight"></div>');
211 setCookie: function (value) {
213 var date = new Date();
214 date.setTime(date.getTime()+(this.cookie_expires*24*60*60*1000));
215 var expires = "; expires="+date.toGMTString();
217 document.cookie = this.cookie_name+"="+value+expires+"; path=" + this.cookie_path;
219 readCookie: function () {
220 var nameEQ = this.cookie_name + "=";
221 var ca = document.cookie.split(';');
222 for(var i=0;i < ca.length;i++) {
224 while (c.charAt(0)==' ') c = c.substring(1,c.length);
225 if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
229 useInputBox: function (provider) {
231 var input_area = $('#openid_input_area');
234 var id = 'openid_username';
236 var label = provider['label'];
239 if (provider['name'] == 'OpenID') {
242 style = 'background:#FFF url(wikiicons/openidlogin-bg.gif) no-repeat scroll 0 50%; padding-left:18px;';
245 html = '<label for="'+ id +'" class="block">' + label + '</label>';
247 html += '<input id="'+id+'" type="text" style="'+style+'" name="'+id+'" value="'+value+'" />' +
248 '<input id="openid_submit" type="submit" value="Login"/>';
251 input_area.append(html);
255 setDemoMode: function (demoMode) {
256 this.demo = demoMode;
258 setAjaxHandler: function (ajaxFunction) {
259 this.ajaxHandler = ajaxFunction;