|
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 url: 'https://www.google.com/accounts/o8/id' |
|
12 }, |
|
13 yahoo: { |
|
14 name: 'Yahoo', |
|
15 url: 'https://me.yahoo.com/' |
|
16 }, |
|
17 aol: { |
|
18 name: 'AOL', |
|
19 label: 'Enter your AOL screenname.', |
|
20 url: 'http://openid.aol.com/{username}/' |
|
21 }, |
|
22 openid: { |
|
23 name: 'OpenID', |
|
24 label: 'Enter your OpenID.', |
|
25 url: null |
|
26 } |
|
27 }; |
|
28 var providers_small = { |
|
29 myopenid: { |
|
30 name: 'MyOpenID', |
|
31 label: 'Enter your MyOpenID username.', |
|
32 url: 'http://{username}.myopenid.com/' |
|
33 }, |
|
34 livejournal: { |
|
35 name: 'LiveJournal', |
|
36 label: 'Enter your Livejournal username.', |
|
37 url: 'http://{username}.livejournal.com/' |
|
38 }, |
|
39 flickr: { |
|
40 name: 'Flickr', |
|
41 label: 'Enter your Flickr username.', |
|
42 url: 'http://flickr.com/photos/{username}/' |
|
43 }, |
|
44 technorati: { |
|
45 name: 'Technorati', |
|
46 label: 'Enter your Technorati username.', |
|
47 url: 'http://technorati.com/people/technorati/{username}/' |
|
48 }, |
|
49 wordpress: { |
|
50 name: 'Wordpress', |
|
51 label: 'Enter your Wordpress.com username.', |
|
52 url: 'http://{username}.wordpress.com/' |
|
53 }, |
|
54 blogger: { |
|
55 name: 'Blogger', |
|
56 label: 'Your Blogger account', |
|
57 url: 'http://{username}.blogspot.com/' |
|
58 }, |
|
59 verisign: { |
|
60 name: 'Verisign', |
|
61 label: 'Your Verisign username', |
|
62 url: 'http://{username}.pip.verisignlabs.com/' |
|
63 }, |
|
64 vidoop: { |
|
65 name: 'Vidoop', |
|
66 label: 'Your Vidoop username', |
|
67 url: 'http://{username}.myvidoop.com/' |
|
68 }, |
|
69 verisign: { |
|
70 name: 'Verisign', |
|
71 label: 'Your Verisign username', |
|
72 url: 'http://{username}.pip.verisignlabs.com/' |
|
73 }, |
|
74 claimid: { |
|
75 name: 'ClaimID', |
|
76 label: 'Your ClaimID username', |
|
77 url: 'http://claimid.com/{username}' |
|
78 } |
|
79 }; |
|
80 var providers = $.extend({}, providers_large, providers_small); |
|
81 |
|
82 var openid = { |
|
83 |
|
84 cookie_expires: 6*30, // 6 months. |
|
85 cookie_name: 'openid_provider', |
|
86 cookie_path: '/', |
|
87 |
|
88 img_path: '/platform/static/images/', |
|
89 |
|
90 input_id: null, |
|
91 provider_url: null, |
|
92 |
|
93 init: function(input_id) { |
|
94 |
|
95 var openid_btns = $('#openid_btns'); |
|
96 |
|
97 this.input_id = input_id; |
|
98 |
|
99 $('#openid_choice').show(); |
|
100 $('#openid_input_area').empty(); |
|
101 // add box for each provider |
|
102 for (id in providers_large) { |
|
103 |
|
104 openid_btns.append(this.getBoxHTML(providers_large[id], 'large', '.gif')); |
|
105 } |
|
106 if (providers_small) { |
|
107 openid_btns.append('<br/>'); |
|
108 |
|
109 for (id in providers_small) { |
|
110 |
|
111 openid_btns.append(this.getBoxHTML(providers_small[id], 'small', '.ico')); |
|
112 } |
|
113 } |
|
114 |
|
115 $('#openid_form').submit(this.submit); |
|
116 |
|
117 var box_id = this.readCookie(); |
|
118 if (box_id) { |
|
119 this.signin(box_id, true); |
|
120 } |
|
121 }, |
|
122 getBoxHTML: function(provider, box_size, image_ext) { |
|
123 |
|
124 var box_id = provider["name"].toLowerCase(); |
|
125 return '<a title="'+provider["name"]+'" href="javascript: openid.signin(\''+ box_id +'\');"' + |
|
126 ' style="background: #FFF url(' + this.img_path + box_id + image_ext+') no-repeat center center" ' + |
|
127 'class="' + box_id + ' openid_' + box_size + '_btn"></a>'; |
|
128 |
|
129 }, |
|
130 /* Provider image click */ |
|
131 signin: function(box_id, onload) { |
|
132 |
|
133 var provider = providers[box_id]; |
|
134 if (! provider) { |
|
135 return; |
|
136 } |
|
137 |
|
138 this.highlight(box_id); |
|
139 this.setCookie(box_id); |
|
140 |
|
141 // prompt user for input? |
|
142 if (provider['label']) { |
|
143 |
|
144 this.useInputBox(provider); |
|
145 this.provider_url = provider['url']; |
|
146 |
|
147 } else { |
|
148 |
|
149 this.setOpenIdUrl(provider['url']); |
|
150 if (! onload) { |
|
151 $('#openid_form').submit(); |
|
152 } |
|
153 } |
|
154 }, |
|
155 /* Sign-in button click */ |
|
156 submit: function() { |
|
157 |
|
158 var url = openid.provider_url; |
|
159 if (url) { |
|
160 url = url.replace('{username}', $('#openid_username').val()); |
|
161 openid.setOpenIdUrl(url); |
|
162 } |
|
163 return true; |
|
164 }, |
|
165 setOpenIdUrl: function (url) { |
|
166 |
|
167 var hidden = $('#'+this.input_id); |
|
168 if (hidden.length > 0) { |
|
169 hidden.value = url; |
|
170 } else { |
|
171 $('#openid_form').append('<input type="hidden" id="' + this.input_id + '" name="' + this.input_id + '" value="'+url+'"/>'); |
|
172 } |
|
173 }, |
|
174 highlight: function (box_id) { |
|
175 |
|
176 // remove previous highlight. |
|
177 var highlight = $('#openid_highlight'); |
|
178 if (highlight) { |
|
179 highlight.replaceWith($('#openid_highlight a')[0]); |
|
180 } |
|
181 // add new highlight. |
|
182 $('.'+box_id).wrap('<div id="openid_highlight"></div>'); |
|
183 }, |
|
184 setCookie: function (value) { |
|
185 |
|
186 var date = new Date(); |
|
187 date.setTime(date.getTime()+(this.cookie_expires*24*60*60*1000)); |
|
188 var expires = "; expires="+date.toGMTString(); |
|
189 |
|
190 document.cookie = this.cookie_name+"="+value+expires+"; path=" + this.cookie_path; |
|
191 }, |
|
192 readCookie: function () { |
|
193 var nameEQ = this.cookie_name + "="; |
|
194 var ca = document.cookie.split(';'); |
|
195 for(var i=0;i < ca.length;i++) { |
|
196 var c = ca[i]; |
|
197 while (c.charAt(0)==' ') c = c.substring(1,c.length); |
|
198 if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); |
|
199 } |
|
200 return null; |
|
201 }, |
|
202 useInputBox: function (provider) { |
|
203 |
|
204 var input_area = $('#openid_input_area'); |
|
205 |
|
206 var html = ''; |
|
207 var id = 'openid_username'; |
|
208 var value = ''; |
|
209 var label = provider['label']; |
|
210 var style = ''; |
|
211 |
|
212 if (label) { |
|
213 html = '<p>' + label + '</p>'; |
|
214 } |
|
215 if (provider['name'] == 'OpenID') { |
|
216 id = this.input_id; |
|
217 value = 'http://'; |
|
218 style = 'background:#FFF url('+this.img_path+'openid-inputicon.gif) no-repeat scroll 0 50%; padding-left:18px;'; |
|
219 } |
|
220 html += '<input id="'+id+'" type="text" style="'+style+'" name="'+id+'" value="'+value+'" />' + |
|
221 '<input id="openid_submit" type="submit" value="Sign-In"/>'; |
|
222 |
|
223 input_area.empty(); |
|
224 input_area.append(html); |
|
225 |
|
226 $('#'+id).focus(); |
|
227 } |
|
228 }; |