[geeklog-cvs] geeklog: Restyled the OAuth and OpenID login buttons, so that th...
geeklog-cvs at lists.geeklog.net
geeklog-cvs at lists.geeklog.net
Wed Mar 14 19:57:14 EDT 2012
changeset 8537:7b82440eaeae
url: http://project.geeklog.net/cgi-bin/hgwebdir.cgi/geeklog/rev/7b82440eaeae
user: Rouslan Placella <rouslan at placella.com>
date: Wed Mar 14 23:55:52 2012 +0000
description:
Restyled the OAuth and OpenID login buttons, so that they are localised
diffstat:
language/english.php | 7 ++-
language/english_utf-8.php | 7 ++-
public_html/images/facebook-login-icon.png | Bin
public_html/images/linkedin-login-icon.png | Bin
public_html/images/login-with-facebook.png | Bin
public_html/images/login-with-linkedin.png | Bin
public_html/images/login-with-twitter.png | Bin
public_html/images/openid_login_icon.png | Bin
public_html/images/twitter-login-icon.png | Bin
public_html/javascript/login.js | 21 ++++++++++
public_html/layout/professional/functions.php | 3 +
public_html/layout/professional/loginform.thtml | 2 +-
public_html/layout/professional/loginform_oauth.thtml | 5 +-
public_html/layout/professional/loginform_openid.thtml | 17 ++++++--
public_html/layout/professional/style.css | 33 ++++++++++++++++-
public_html/layout/professional/users/loginform.thtml | 8 +++-
public_html/lib-common.php | 14 ++++--
system/lib-security.php | 8 ++-
18 files changed, 103 insertions(+), 22 deletions(-)
diffs (300 lines):
diff -r 3a440bb03b7e -r 7b82440eaeae language/english.php
--- a/language/english.php Mon Mar 12 23:37:57 2012 +0000
+++ b/language/english.php Wed Mar 14 23:55:52 2012 +0000
@@ -169,7 +169,7 @@
125 => 'Are you sure you want to Delete all checked items?',
126 => 'Select or de-select all items',
127 => 'Permalink',
- 128 => 'Login with OpenID:',
+ 128 => 'Login with OpenID',
129 => 'Configuration',
130 => 'Webservices',
131 => 'No HTML is allowed',
@@ -180,7 +180,10 @@
136 => 'Warning: Javascript recommended for enhanced functionality',
137 => 'Warning: Javascript required to enable functionality',
138 => "Click <a href=\"{$_CONF['site_url']}/usersettings.php\" rel=\"nofollow\">here</a> to disable the advanced editor and use the default editor which does not require JavaScript",
- 139 => "Click <a href=\"{$_CONF['site_url']}/\" rel=\"nofollow\">here</a> to return to the homepage"
+ 139 => "Click <a href=\"{$_CONF['site_url']}/\" rel=\"nofollow\">here</a> to return to the homepage",
+ 'facebook' => 'Login with Facebook',
+ 'twitter' => 'Login with Twitter',
+ 'linkedin' => 'Login with LinkedIn'
);
###############################################################################
diff -r 3a440bb03b7e -r 7b82440eaeae language/english_utf-8.php
--- a/language/english_utf-8.php Mon Mar 12 23:37:57 2012 +0000
+++ b/language/english_utf-8.php Wed Mar 14 23:55:52 2012 +0000
@@ -169,7 +169,7 @@
125 => 'Are you sure you want to Delete all checked items?',
126 => 'Select or de-select all items',
127 => 'Permalink',
- 128 => 'Login with OpenID:',
+ 128 => 'Login with OpenID',
129 => 'Configuration',
130 => 'Webservices',
131 => 'No HTML is allowed',
@@ -180,7 +180,10 @@
136 => 'Warning: Javascript recommended for enhanced functionality',
137 => 'Warning: Javascript required to enable functionality',
138 => "Click <a href=\"{$_CONF['site_url']}/usersettings.php\" rel=\"nofollow\">here</a> to disable the advanced editor and use the default editor which does not require JavaScript",
- 139 => "Click <a href=\"{$_CONF['site_url']}/\" rel=\"nofollow\">here</a> to return to the homepage"
+ 139 => "Click <a href=\"{$_CONF['site_url']}/\" rel=\"nofollow\">here</a> to return to the homepage",
+ 'facebook' => 'Login with Facebook',
+ 'twitter' => 'Login with Twitter',
+ 'linkedin' => 'Login with LinkedIn'
);
###############################################################################
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/images/facebook-login-icon.png
Binary file public_html/images/facebook-login-icon.png has changed
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/images/linkedin-login-icon.png
Binary file public_html/images/linkedin-login-icon.png has changed
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/images/login-with-facebook.png
Binary file public_html/images/login-with-facebook.png has changed
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/images/login-with-linkedin.png
Binary file public_html/images/login-with-linkedin.png has changed
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/images/login-with-twitter.png
Binary file public_html/images/login-with-twitter.png has changed
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/images/openid_login_icon.png
Binary file public_html/images/openid_login_icon.png has changed
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/images/twitter-login-icon.png
Binary file public_html/images/twitter-login-icon.png has changed
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/javascript/login.js
--- /dev/null Thu Jan 01 00:00:00 1970 +0000
+++ b/public_html/javascript/login.js Wed Mar 14 23:55:52 2012 +0000
@@ -0,0 +1,21 @@
+$(document).ready(function() {
+ // Show the openid button for JS-enabled browsers
+ $('form.third-party-login div').show();
+ $('form.third-party-login img').click(function() {
+ // Ensure that clicking on an icon will trigger the login action
+ $(this).prev().click();
+ });
+ $('form.third-party-login').submit(function(e) {
+ if ($(this).find('noscript').length) { // OpenId form submitted
+ e.preventDefault();
+ // Add a textbox for the identity provider url
+ // and change the text in the submit button
+ $(this)
+ .unbind('submit')
+ .find('> div')
+ .prepend(
+ $('<input/>', {'type':'text','name':'identity_url','value':'http://'})
+ );
+ }
+ });
+});
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/layout/professional/functions.php
--- a/public_html/layout/professional/functions.php Mon Mar 12 23:37:57 2012 +0000
+++ b/public_html/layout/professional/functions.php Wed Mar 14 23:55:52 2012 +0000
@@ -10,6 +10,9 @@
// Add Theme CSS File to scripts class
$_SCRIPTS->setCSSFile('theme', '/layout/' . $_CONF['theme'] . '/style.css');
+// Load jQuery
+$_SCRIPTS->setJavaScriptLibrary('jquery');
+
/*
* For left/right block support there is no longer any need for the theme to
* put code into functions.php to set specific templates for the left/right
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/layout/professional/loginform.thtml
--- a/public_html/layout/professional/loginform.thtml Mon Mar 12 23:37:57 2012 +0000
+++ b/public_html/layout/professional/loginform.thtml Wed Mar 14 23:55:52 2012 +0000
@@ -10,5 +10,5 @@
</form>
<p>{lang_signup}<br{xhtml}>
{lang_forgetpassword}</p>
+{oauth_login}
{openid_login}
-{oauth_login}
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/layout/professional/loginform_oauth.thtml
--- a/public_html/layout/professional/loginform_oauth.thtml Mon Mar 12 23:37:57 2012 +0000
+++ b/public_html/layout/professional/loginform_oauth.thtml Wed Mar 14 23:55:52 2012 +0000
@@ -1,5 +1,6 @@
-<form action="{site_url}/users.php?oauth_login={oauth_service}" method="post">
+<form class="third-party-login" action="{site_url}/users.php?oauth_login={oauth_service}" method="post">
<div>
- <input src="{oauth_sign_in_image}"{oauth_sign_in_image_style} type="image"{xhtml}>
+ <img alt="" src="{oauth_sign_in_image}"{xhtml}>
+ <input value="{lang_oauth_service}" type="submit" class="submit"{xhtml}>
</div>
</form>
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/layout/professional/loginform_openid.thtml
--- a/public_html/layout/professional/loginform_openid.thtml Mon Mar 12 23:37:57 2012 +0000
+++ b/public_html/layout/professional/loginform_openid.thtml Wed Mar 14 23:55:52 2012 +0000
@@ -1,7 +1,16 @@
-<form action="{site_url}/users.php?openid_login=1" method="post">
+<form class="third-party-login" action="{site_url}/users.php?openid_login=1" method="post">
<div>
- <b><label for="identity_url">{lang_openid_login}</label></b><br{xhtml}>
- <input name="identity_url" id="identity_url" style='background: url("{site_url}/images/openid_login_icon.png") no-repeat;background-color:#fff;background-position:0 50%;color:#000;padding-left:18px;font-family:monospace;font-size:10px' value="http://" size="{input_field_size}"{xhtml}>
- <input src="{site_url}/images/right_arrow.png" style="padding:1px;margin-bottom:-5px;height:16px;width:16px;border:1px" type="image"{xhtml}>
+ <div style="display: none;">
+ <!-- this is revealed by login.js -->
+ <img alt="" src="{site_url}/images/openid_login_icon.png"{xhtml}>
+ <input value="{lang_openid_login}" type="submit" class="submit"{xhtml}>
+ </div>
+ <noscript>
+ <div>
+ <b><label for="identity_url">{lang_openid_login}</label></b><br{xhtml}>
+ <input name="identity_url" id="identity_url" style='background: url("{site_url}/images/openid_login_icon.png") no-repeat;background-color:#fff;background-position:0 50%;color:#000;padding-left:18px;font-family:monospace;font-size:10px' value="http://" size="{input_field_size}"{xhtml}>
+ <input src="{site_url}/images/right_arrow.png" style="padding:1px;margin-bottom:-5px;height:16px;width:16px;border:1px" type="image"{xhtml}>
+ </div>
+ </noscript>
</div>
</form>
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/layout/professional/style.css
--- a/public_html/layout/professional/style.css Mon Mar 12 23:37:57 2012 +0000
+++ b/public_html/layout/professional/style.css Wed Mar 14 23:55:52 2012 +0000
@@ -1117,6 +1117,37 @@
display: inline;
color: black;
}
-
/* End of Common Plugin CSS */
+/* Third party login */
+form.third-party-login {
+ margin: 0.1em 0;
+}
+
+form.third-party-login div {
+ position: relative;
+}
+
+form.third-party-login div img {
+ position: absolute;
+ left: 6px;
+ top: 6px;
+}
+
+form.third-party-login div input {
+ width: 100%;
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+form.third-party-login div input.submit {
+ text-indent: 24px;
+ font-size: 12px;
+ height: 28px;
+}
+
+div.third-party-login {
+ width: 164px;
+}
+
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/layout/professional/users/loginform.thtml
--- a/public_html/layout/professional/users/loginform.thtml Mon Mar 12 23:37:57 2012 +0000
+++ b/public_html/layout/professional/users/loginform.thtml Wed Mar 14 23:55:52 2012 +0000
@@ -30,12 +30,16 @@
</tr>
<tr>
<td>
- {openid_login}
+ <div class="third-party-login">
+ {oauth_login}
+ </div>
</td>
</tr>
<tr>
<td>
- {oauth_login}
+ <div class="third-party-login">
+ {openid_login}
+ </div>
</td>
</tr>
</table>
diff -r 3a440bb03b7e -r 7b82440eaeae public_html/lib-common.php
--- a/public_html/lib-common.php Mon Mar 12 23:37:57 2012 +0000
+++ b/public_html/lib-common.php Wed Mar 14 23:55:52 2012 +0000
@@ -2365,7 +2365,7 @@
*/
function COM_userMenu( $help='', $title='', $position='' )
{
- global $_TABLES, $_CONF, $LANG01, $LANG04, $_BLOCK_TEMPLATE;
+ global $_TABLES, $_CONF, $LANG01, $LANG04, $_BLOCK_TEMPLATE, $_SCRIPTS;
$retval = '';
@@ -2502,19 +2502,23 @@
// OpenID remote authentification.
if ($_CONF['user_login_method']['openid'] && ($_CONF['usersubmission'] == 0) && !$_CONF['disable_new_user_registration']) {
+ $_SCRIPTS->setJavascriptFile('login', '/javascript/login.js');
$login->set_file('openid_login', 'loginform_openid.thtml');
$login->set_var('lang_openid_login', $LANG01[128]);
$login->set_var('input_field_size', 18);
$login->set_var('app_url', $_CONF['site_url'] . '/users.php');
$login->parse('output', 'openid_login');
- $login->set_var('openid_login',
- $login->finish($login->get_var('output')));
+ $login->set_var(
+ 'openid_login',
+ $login->finish($login->get_var('output'))
+ );
} else {
$login->set_var('openid_login', '');
}
// OAuth remote authentification.
if ($_CONF['user_login_method']['oauth'] && ($_CONF['usersubmission'] == 0) && !$_CONF['disable_new_user_registration']) {
+ $_SCRIPTS->setJavascriptFile('login', '/javascript/login.js');
$modules = SEC_collectRemoteOAuthModules();
if (count($modules) == 0) {
$login->set_var('oauth_login', '');
@@ -2523,9 +2527,9 @@
foreach ($modules as $service) {
$login->set_file('oauth_login', 'loginform_oauth.thtml');
$login->set_var('oauth_service', $service);
+ $login->set_var('lang_oauth_service', $LANG01[$service]);
// for sign in image
- $login->set_var('oauth_sign_in_image', $_CONF['site_url'] . '/images/login-with-' . $service . '.png');
- $login->set_var('oauth_sign_in_image_style', '');
+ $login->set_var('oauth_sign_in_image', $_CONF['site_url'] . '/images/' . $service . '-login-icon.png');
$login->parse('output', 'oauth_login');
$html_oauth .= $login->finish($login->get_var('output'));
}
diff -r 3a440bb03b7e -r 7b82440eaeae system/lib-security.php
--- a/system/lib-security.php Mon Mar 12 23:37:57 2012 +0000
+++ b/system/lib-security.php Wed Mar 14 23:55:52 2012 +0000
@@ -1801,7 +1801,7 @@
*/
function SEC_loginForm($use_config = array())
{
- global $_CONF, $LANG01, $LANG04;
+ global $_CONF, $LANG01, $LANG04, $_SCRIPTS;
$retval = '';
@@ -1896,6 +1896,7 @@
if (!$config['no_openid_login'] && $_CONF['user_login_method']['openid'] &&
($_CONF['usersubmission'] == 0) &&
!$_CONF['disable_new_user_registration']) {
+ $_SCRIPTS->setJavascriptFile('login', '/javascript/login.js');
$loginform->set_file('openid_login', '../loginform_openid.thtml');
$loginform->set_var('lang_openid_login', $LANG01[128]);
$loginform->set_var('input_field_size', 40);
@@ -1917,6 +1918,7 @@
if (!$config['no_oauth_login'] && $_CONF['user_login_method']['oauth'] &&
($_CONF['usersubmission'] == 0) &&
!$_CONF['disable_new_user_registration']) {
+ $_SCRIPTS->setJavascriptFile('login', '/javascript/login.js');
$modules = SEC_collectRemoteOAuthModules();
if (count($modules) == 0) {
$loginform->set_var('oauth_login', '');
@@ -1925,9 +1927,9 @@
foreach ($modules as $service) {
$loginform->set_file('oauth_login', '../loginform_oauth.thtml');
$loginform->set_var('oauth_service', $service);
+ $loginform->set_var('lang_oauth_service', $LANG01[$service]);
// for sign in image
- $loginform->set_var('oauth_sign_in_image', $_CONF['site_url'] . '/images/login-with-' . $service . '.png');
- $loginform->set_var('oauth_sign_in_image_style', '');
+ $loginform->set_var('oauth_sign_in_image', $_CONF['site_url'] . '/images/' . $service . '-login-icon.png');
$loginform->parse('output', 'oauth_login');
$html_oauth .= $loginform->finish($loginform->get_var('output'));
}
More information about the geeklog-cvs
mailing list