You are here: Home > Latest news from Darcs > Aligns the login button with the text fields

Revision 20080429223138-9043f-bbe897...

Aligns the login button with the text fields

Lets accept that we are already using tables and at least enjoy some of the advantages.

app/views/account/_authorization.rhtml
app/views/javascript/motiro.rjs

Changes to _authorization.rhtml

9
    <table>
    <table>
9
10
      <tbody>
      <tbody>
10
11
        <tr>
        <tr>
11
12
          <td>
          <td><%= content_tag :label, 'User'.t, :for=> 'user_login' -%></td>
12
13
            <%= content_tag :label, 'User'.t, :for=> 'user_login'%><br />
          <td><%= content_tag :label, 'Password'.t, :for=> 'user_password' -%></td>
13
14
            <%= text_field 'user', 'login', :size => 12,
          <td id="confirm_label" style="display: none;">
14
15
                                            :value => flash[:desired_login] %>
            <%= content_tag :label, 'Confirmation'.t, :for=> 'user_password_confirmation'%>
15
16
          </td>
 
17
          <td>
 
18
            <%= content_tag :label, 'Password'.t, :for=> 'user_password'%><br />
 
19
            <%= password_field 'user', 'password', :size => 12 %>
 
20
          </td>
 
21
          <td id="password_confirm" style="display: none;">
 
22
            <%= content_tag :label, 'Confirmation'.t, :for=> 'user_password_confirmation'%><br />
 
23
            <%= password_field 'user', 'password_confirmation',
 
24
                               :size => 12,
 
25
                               :disabled => true %>
 
26
          </td>
          </td>
16
27
          <td>
          <td>
17
28
            <input type="checkbox" id="chk_new_user"
            <input type="checkbox" id="chk_new_user"
18
1 more lines
30
                   onClick="tooglePasswordConfirmation(document.forms[0].chk_new_user.checked)" />
                   onClick="tooglePasswordConfirmation(document.forms[0].chk_new_user.checked)" />
20
31
            <%= 'New user?'.t %><br />
            <%= 'New user?'.t %><br />
21
32
            <input type='hidden' name='return_to' value="<%= request.env['REQUEST_URI'] -%>"/>
            <input type='hidden' name='return_to' value="<%= request.env['REQUEST_URI'] -%>"/>
22
33
            <input class='button' type="submit" name="login" value="Login &#187;" />
 
34
          </td>
          </td>
23
35
        </tr>
        </tr>
24
 
        <tr>
25
 
          <td>
26
 
            <%= text_field 'user', 'login', :size => 12,
27
 
                                            :value => flash[:desired_login] %>
28
 
          </td>
29
 
          <td><%= password_field 'user', 'password', :size => 12 %></td>
30
 
          <td id="confirm_field" style="display: none;">
31
 
            <%= password_field 'user', 'password_confirmation',
32
 
                               :size => 12,
33
 
                               :disabled => true %>
34
 
          </td>
35
 
          <td><input class='button' type="submit" name="login" value="Login &#187;" /></td>
36
 
        </tr>
37
36
      </tbody>
      </tbody>
38
37
    </table>
    </table>
39
38
    <% if flash[:login_failure] %>
    <% if flash[:login_failure] %>
40

    
      
Changes to motiro.rjs
51
}
}
51
52
52
53
function tooglePasswordConfirmation(show) {
function tooglePasswordConfirmation(show) {
53
54
	var display = show ? '' : 'none';
	document.getElementById("authentication_errors").style.display =
54
55
	document.getElementById("authentication_errors").style.display = display;
    document.getElementById("confirm_field").style.display =
55
56
	document.getElementById('password_confirm').style.display = display;
      document.getElementById("confirm_label").style.display = show ? '':'none';
56
57
57
58
	document.getElementById("user_password_confirmation").disabled = !show;
	document.getElementById("user_password_confirmation").disabled = !show;
58
59
59