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