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