[livejournal] r17124: LJSUP-6473: Facebook
Committer: esavintcev
LJSUP-6473: FacebookU trunk/htdocs/js/talkpost.js U trunk/templates/CommentForm/Author-Anonymous.tmpl U trunk/templates/CommentForm/Author-OpenID.tmpl U trunk/templates/CommentForm/Form.tmpl U trunk/templates/Identity/Login-openid.tmpl U trunk/templates/Identity/Login.tmpl
Modified: trunk/htdocs/js/talkpost.js
===================================================================
--- trunk/htdocs/js/talkpost.js 2010-08-16 07:06:11 UTC (rev 17123)
+++ trunk/htdocs/js/talkpost.js 2010-08-16 08:09:54 UTC (rev 17124)
@@ -7,6 +7,8 @@
var radio_remote = document.getElementById("talkpostfromremote");
var radio_user = document.getElementById("talkpostfromlj");
var radio_anon = document.getElementById("talkpostfromanon");
+ var radio_fblo = document.getElementById("talkpostfromfblo");
+ var radio_fbli = document.getElementById("talkpostfromfbli");
var radio_oidlo = document.getElementById("talkpostfromoidlo");
var radio_oidli = document.getElementById("talkpostfromoidli");
@@ -22,13 +24,16 @@
}
var password = form.password;
- var oidurl = document.getElementById("oidurl");
- var oid_more = document.getElementById("oid_more");
+ var oidurl = document.getElementById("openid:url");
var lj_more = document.getElementById("lj_more");
var ljuser_row = document.getElementById("ljuser_row");
var otherljuser_row = document.getElementById("otherljuser_row");
var oidlo_row = document.getElementById("oidlo");
var oidli_row = document.getElementById("oidli");
+ var oid_more = document.getElementById("oid_more");
+ var fblo_row = document.getElementById("fblo");
+ var fbli_row = document.getElementById("fbli");
+ var fb_more = document.getElementById("fb_more");
var remotef = document.getElementById("cookieuser");
var remote;
@@ -76,7 +81,7 @@
hideMe(ljuser_row);
}
if (lj_more) {
- showMe(lj_more);
+ showMe(lj_more);
}
username.focus();
@@ -89,31 +94,28 @@
hideMe(lj_more);
}
}
-
+
+ // Facebook
+ if (fb_more) {
+ if (sel == 3) {
+ var radio = radio_fblo || radio_fbli;
+
+ showMe(fb_more);
+
+ radio.checked = 1;
+ } else {
+ hideMe(fb_more);
+ }
+ }
// OpenID
if (oid_more) {
- if (sel == 3) {
+ if (sel == 4) {
+ var radio = radio_oidli || radio_oidlo;
+
showMe(oid_more);
oidurl.focus();
- if (oidli_row) {
- hideMe(oidli_row);
- }
- showMe(oidlo_row);
-
- if (radio_oidlo.checked != 1) {
- radio_oidlo.checked = 1;
- }
-
- } else if (sel == 4) {
- if (oidlo_row) {
- hideMe(oidlo_row);
- }
- showMe(oidli_row);
- hideMe(oid_more);
-
- if (radio_oidli.checked != 1) {
- radio_oidli.checked = 1;
- }
+
+ radio.checked = 1;
} else {
hideMe(oid_more);
}
@@ -123,8 +125,8 @@
}
function submitHandler() {
- if (remote && username.value == remote && ((! radio_anon || ! radio_anon.checked) && (! radio_oidlo || ! radio_oidlo.checked))) {
- // Quietly arrange for cookieuser auth instead, to avoid
+ if (remote && username.value == remote && ((! radio_anon || ! radio_anon.checked) && (! radio_oidlo || ! radio_oidlo.checked) && (! radio_fblo || ! radio_fblo.checked))) {
+ // Quietly arrange for cookieuser auth instead, to avoid
// sending cleartext password.
password.value = "";
username.value = "";
@@ -146,7 +148,9 @@
if (radio_anon && radio_anon.checked) handleRadios(0);
if (radio_remote && radio_remote.checked) handleRadios(1);
if (radio_user && radio_user.checked) handleRadios(2);
- if (radio_oidlo && radio_oidlo.checked) handleRadios(3);
+ if (radio_fblo && radio_fblo.checked) handleRadios(3);
+ if (radio_fbli && radio_fbli.checked) handleRadios(3);
+ if (radio_oidlo && radio_oidlo.checked) handleRadios(4);
if (radio_oidli && radio_oidli.checked) handleRadios(4);
if (radio_remote) {
@@ -163,9 +167,17 @@
radio_anon.onclick = function () {
handleRadios(0);
};
+ if (radio_fbli)
+ radio_fbli.onclick = function () {
+ handleRadios(3);
+ };
+ if (radio_fblo)
+ radio_fblo.onclick = function () {
+ handleRadios(3);
+ };
if (radio_oidlo)
radio_oidlo.onclick = function () {
- handleRadios(3);
+ handleRadios(4);
};
if (radio_oidli)
radio_oidli.onclick = function () {
@@ -189,7 +201,9 @@
if (radio_anon && radio_anon.checked) handleRadios(0);
if (radio_user && radio_user.checked) otherLJUser();
if (radio_remote && radio_remote.checked) handleRadios(1);
- if (radio_oidlo && radio_oidlo.checked) handleRadios(3);
+ if (radio_fblo && radio_fblo.checked) handleRadios(3);
+ if (radio_fbli && radio_fbli.checked) handleRadios(3);
+ if (radio_oidlo && radio_oidlo.checked) handleRadios(4);
if (radio_oidli && radio_oidli.checked) handleRadios(4);
}
@@ -253,15 +267,19 @@
}
function otherOIDUser() {
- handleRadios(3);
+ handleRadios(4);
radio_oidlo.checked = 1;
}
function hideMe(e) {
- e.className = 'display_none';
+ //e.className = 'display_none';
+
+ jQuery(e).addClass('display_none');
}
function showMe(e) {
- e.className = '';
+ //e.className = '';
+
+ jQuery(e).removeClass('display_none');
}
Modified: trunk/templates/CommentForm/Author-Anonymous.tmpl
===================================================================
--- trunk/templates/CommentForm/Author-Anonymous.tmpl 2010-08-16 07:06:11 UTC (rev 17123)
+++ trunk/templates/CommentForm/Author-Anonymous.tmpl 2010-08-16 08:09:54 UTC (rev 17124)
@@ -5,7 +5,7 @@
<td align='center'>( )</td>
<td align='left' colspan='2'>
<font color='#c0c0c0'><b><TMPL_VAR expr="ml('/talkpost.bml.opt.anonymous')"></b></font>
- <TMPL_VAR expr="ml('/talkpost.bml.opt.noanonpost.nonpublic')">
+ <p class="i-bubble b-bubble-yellow b-postform-openid"><i class="i-bubble-arrow-border"></i><i class="i-bubble-arrow"></i><TMPL_VAR expr="ml('/talkpost.bml.opt.noanonpost.nonpublic')"></p>
</td>
</tr>
<TMPL_ELSE>
@@ -24,7 +24,7 @@
<td align='center'>( )</td>
<td align='left' colspan='2'>
<font color='#c0c0c0'><b><TMPL_VAR expr="ml('/talkpost.bml.opt.anonymous')"></b></font>
- <TMPL_VAR expr="ml('/talkpost.bml.opt.noanonpost')">
+ <p class="i-bubble b-bubble-yellow b-postform-openid"><i class="i-bubble-arrow-border"></i><i class="i-bubble-arrow"></i><TMPL_VAR expr="ml('/talkpost.bml.opt.noanonpost')"></p>
</td>
</tr>
<TMPL_ELSIF friends_can_comment>
Modified: trunk/templates/CommentForm/Author-OpenID.tmpl
===================================================================
--- trunk/templates/CommentForm/Author-OpenID.tmpl 2010-08-16 07:06:11 UTC (rev 17123)
+++ trunk/templates/CommentForm/Author-OpenID.tmpl 2010-08-16 08:09:54 UTC (rev 17124)
@@ -14,23 +14,14 @@
<tr valign='middle' id='oidlo' name='oidlo'>
<td align='center'><img src='<TMPL_VAR lj_imgprefix>/openid-profile.gif' onclick='handleRadios(3);' /></td>
<td align='center'><input type='radio' name='usertype' value='openid' id='talkpostfromoidlo' <TMPL_IF whocheck_openid>checked='checked'</TMPL_IF> /></td>
- <td align='left'>
- <b><label for='talkpostfromoidlo' onclick='handleRadios(3);return false;'>OpenID</label></b>
- <TMPL_VAR helpicon_openid>
+ <td align='left' class="b-postform-td">
+ <b><label for='talkpostfromoidlo' onclick='handleRadios(4);return false;'>OpenID</label></b>
<TMPL_VAR ml_willscreen>
+ <p id="oid_more" class="i-bubble b-bubble-lite b-postform-openid"><i class="i-bubble-arrow-border"></i><i class="i-bubble-arrow"></i><label for="openid:url"><TMPL_VAR expr="ml('/talkpost.bml.openid.identity.url')"> </label><input class='textbox' name='openid:url' maxlength='60' size='42' id='openid:url' value='<TMPL_VAR openid_url_default>' /> <label for='oidlogincheck'><TMPL_VAR expr="ml('/talkpost.bml.loginq')"> </label><input type='checkbox' name='oiddo_login' id='oidlogincheck' <TMPL_VAR oiddo_login_checked> /> <TMPL_VAR helpicon_openid></p>
</td>
</tr>
</TMPL_IF>
- <tr valign='middle' align='left' id='oid_more'>
- <td colspan='2'></td>
- <td>
- Identity URL: <input class='textbox' name='openid:url' maxlength='60' size='53' id='openid:url' value='<TMPL_VAR openid_url_default>' />
- <br />
- <label for='oidlogincheck'><TMPL_VAR expr="ml('/talkpost.bml.loginq')"> </label>
- <input type='checkbox' name='oiddo_login' id='oidlogincheck' <TMPL_VAR oiddo_login_checked> />
- </td>
- </tr>
<TMPL_ELSIF registered_can_comment>
<TMPL_IF is_trusted_identity>
<tr valign='middle' id='oidli' name='oidli'>
@@ -86,23 +77,14 @@
<tr valign='middle' id='oidlo' name='oidlo'>
<td align='center'><img src='<TMPL_VAR lj_imgprefix>/openid-profile.gif' onclick='handleRadios(3);' /></td>
<td align='center'><input type='radio' name='usertype' value='openid' id='talkpostfromoidlo' <TMPL_IF whocheck_openid>checked='checked'</TMPL_IF> /></td>
- <td align='left'>
- <b><label for='talkpostfromoidlo' onclick='handleRadios(3);return false;'>OpenID</label></b>
- <TMPL_VAR helpicon_openid>
+ <td align='left' class="b-postform-td">
+ <b><label for='talkpostfromoidlo' onclick='handleRadios(4);return false;'>OpenID</label></b>
<TMPL_VAR ml_willscreen>
+ <p id="oid_more" class="i-bubble b-bubble-lite b-postform-openid"><i class="i-bubble-arrow-border"></i><i class="i-bubble-arrow"></i><label for="openid:url"><TMPL_VAR expr="ml('/talkpost.bml.openid.identity.url')"> </label><input class='textbox' name='openid:url' maxlength='60' size='42' id='openid:url' value='<TMPL_VAR openid_url_default>' /> <label for='oidlogincheck'><TMPL_VAR expr="ml('/talkpost.bml.loginq')"> </label><input type='checkbox' name='oiddo_login' id='oidlogincheck' <TMPL_VAR oiddo_login_checked> /> <TMPL_VAR helpicon_openid></p>
</td>
</tr>
</TMPL_IF>
-
- <tr valign='middle' align='left' id='oid_more'>
- <td colspan='2'></td>
- <td>
- Identity URL: <input class='textbox' name='openid:url' maxlength='60' size='53' id='openid:url' value='<TMPL_VAR openid_url_default>' />
- <br />
- <label for='oidlogincheck'><TMPL_VAR expr="ml('/talkpost.bml.loginq')"> </label>
- <input type='checkbox' name='oiddo_login' id='oidlogincheck' <TMPL_VAR oiddo_login_checked> />
- </td>
- </tr>
+s
</TMPL_IF>
</TMPL_IF>
Modified: trunk/templates/CommentForm/Form.tmpl
===================================================================
--- trunk/templates/CommentForm/Form.tmpl 2010-08-16 07:06:11 UTC (rev 17123)
+++ trunk/templates/CommentForm/Form.tmpl 2010-08-16 08:09:54 UTC (rev 17124)
@@ -211,8 +211,7 @@
</TMPL_IF>
<TMPL_IF show_logips>
- <br/><TMPL_VAR ml_logcommentips>
- <TMPL_VAR helpicon_iplogging>
+ <p class="b-bubble b-bubble-yellow b-bubble-noarrow b-bubble-intext"><i class="i-bubble-arrow-border"></i><i class="i-bubble-arrow"></i><TMPL_VAR ml_logcommentips> <TMPL_VAR helpicon_iplogging></p>
</TMPL_IF>
</td>
</tr>
Modified: trunk/templates/Identity/Login-openid.tmpl
===================================================================
--- trunk/templates/Identity/Login-openid.tmpl 2010-08-16 07:06:11 UTC (rev 17123)
+++ trunk/templates/Identity/Login-openid.tmpl 2010-08-16 08:09:54 UTC (rev 17124)
@@ -1,10 +1,3 @@
-<TMPL_VAR expr="ml('.openid.label.url')">
-<input type="text" name="openid:url">
-
-<TMPL_IF errors>
- <TMPL_LOOP errors>
- <?errorbar <TMPL_VAR error> errorbar?>
- </TMPL_LOOP>
-</TMPL_IF>
-
-<button type="submit"><TMPL_VAR expr="ml('.openid.btn.login')"></button>
+<p class="b-auth-desc"><TMPL_VAR expr="ml('.openid.desc')"></p>
+<p class="b-auth-openid-form"><label for=""><TMPL_VAR expr="ml('.openid.label.url')"></label> <input type="url" name="openid:url" id="" value="http://" class="b-auth-openid-input" /> <button type="submit"><TMPL_VAR expr="ml('.openid.btn.login')"></button></p>
+<TMPL_IF errors><TMPL_LOOP errors><p class="b-auth-error"><span class="i-message i-message-error"><?errorbar <TMPL_VAR error> errorbar?></span></p></TMPL_LOOP></TMPL_IF>
Modified: trunk/templates/Identity/Login.tmpl
===================================================================
--- trunk/templates/Identity/Login.tmpl 2010-08-16 07:06:11 UTC (rev 17123)
+++ trunk/templates/Identity/Login.tmpl 2010-08-16 08:09:54 UTC (rev 17124)
@@ -1,44 +1,41 @@
-<div id="tabs">
+<div class="b-identity">
+<ul class="m-auth">
<TMPL_LOOP types>
<TMPL_IF expr="type eq current_type">
- <a href="?type=<TMPL_VAR type>" class="active"><TMPL_VAR ml_tab_heading></a>
+ <li class="m-auth-item m-auth-<TMPL_VAR type> current"><a href="?type=<TMPL_VAR type>"><span><TMPL_VAR ml_tab_heading></span></a><i class="m-auth-bl"></i><i class="m-auth-br"></i></li>
<TMPL_ELSE>
- <a href="?type=<TMPL_VAR type>"><TMPL_VAR ml_tab_heading></a>
+ <li class="m-auth-item m-auth-<TMPL_VAR type>"><a href="?type=<TMPL_VAR type>"><span><TMPL_VAR ml_tab_heading></span></a><i class="m-auth-bl"></i><i class="m-auth-br"></i></li>
</TMPL_IF>
</TMPL_LOOP>
-</div>
-
-<div id="tabs-content">
+</ul>
+<ul class="b-auth">
<TMPL_LOOP types>
<TMPL_IF expr="type eq current_type">
- <div id="tab-<TMPL_VAR type>" class="tab">
+ <li id="tab-<TMPL_VAR type>" class="b-auth-item">
<TMPL_ELSE>
- <div id="tab-<TMPL_VAR type>" class="tab" style="display:none">
+ <li id="tab-<TMPL_VAR type>" class="b-auth-item" style="display:none">
</TMPL_IF>
-
<form action="" method="post">
<input type="hidden" name="type" value="<TMPL_VAR type>">
<TMPL_INCLUDE expr="sprintf('templates/Identity/Login-%s.tmpl', type)">
</form>
- </div>
+ </li>
</TMPL_LOOP>
+</ul>
</div>
<script type="text/javascript">
jQuery(function($) {
- $("#tabs a").click(function(e) {
+ $(".m-auth a").click(function(e) {
e.preventDefault();
var type = $(this).attr("href").replace(/.*type=/, "");
- $("#tabs a").removeClass("active");
- $("#tabs-content .tab").hide();
- $(this).addClass("active");
+ $(".m-auth-item").removeClass("current");
+ $(".b-auth-item").hide();
+ $(this).parent('li').addClass("current");
$("#tab-" + type).show();
});
});
</script>
-<style type="text/css">
-#tabs a.active { font-weight: bold; }
-</style>
