Redesigned ACP login
authorAlexander Ebert <ebert@woltlab.com>
Tue, 12 Jan 2016 12:38:23 +0000 (13:38 +0100)
committerAlexander Ebert <ebert@woltlab.com>
Tue, 12 Jan 2016 12:38:23 +0000 (13:38 +0100)
wcfsetup/install/files/acp/templates/login.tpl
wcfsetup/install/files/acp/templates/pageFooter.tpl

index be65192cfbe6bd7cc879f3a104ef8ec601aa30d0..c98705fa0fffa280f0287592838e91f06dc98684 100644 (file)
@@ -1,72 +1,66 @@
 {include file='header' pageTitle='wcf.user.login'}
 
-<script data-relocate="true">
-       //<![CDATA[
-       $(function() {
-               if (!$('#username').val() || '{$errorField}' == 'username') {
-                       $('#username').focus();
-               }
-               else {
-                       $('#password').focus();
-               }
-       });
-       //]]>
-</script>
-
-<header class="boxHeadline">
-       <h1>{@$pageTitle|language}</h1>
-</header>
-
-{include file='formError'}
-
-<form method="post" action="{link controller='Login'}{/link}">
-       <div class="container containerPadding marginTop">
-               <fieldset>
-                       <legend>{lang}wcf.user.login.data{/lang}</legend>
-                       
-                       <dl{if $errorField == 'username'} class="formError"{/if}>
-                               <dt><label for="username">{lang}wcf.user.username{/lang}</label></dt>
-                               <dd><input type="text" id="username" name="username" value="{$username}" class="medium" />
-                                       {if $errorField == 'username'}
-                                               <small class="innerError">
-                                                       {if $errorType == 'empty'}
-                                                               {lang}wcf.global.form.error.empty{/lang}
-                                                       {else}
-                                                               {lang}wcf.user.username.error.{@$errorType}{/lang}
-                                                       {/if}
-                                               </small>
-                                       {/if}
-                               </dd>
-                       </dl>
-                       
-                       <dl{if $errorField == 'password'} class="formError"{/if}>
-                               <dt><label for="password">{lang}wcf.user.password{/lang}</label></dt>
-                               <dd><input type="password" id="password" name="password" value="" class="medium" />
-                                       {if $errorField == 'password'}
-                                               <small class="innerError">
-                                                       {if $errorType == 'empty'}
-                                                               {lang}wcf.global.form.error.empty{/lang}
-                                                       {else}
-                                                               {lang}wcf.user.password.error.{@$errorType}{/lang}
-                                                       {/if}
-                                               </small>
-                                       {/if}
-                               </dd>
-                       </dl>
-                       
-                       {event name='dataFields'}
-               </fieldset>
+<div id="login" style="display: none">
+       <form method="post" action="{link controller='Login'}{/link}">
+               {include file='formError'}
                
-               {event name='fieldsets'}
+               <dl{if $errorField == 'username'} class="formError"{/if}>
+                       <dt><label for="username">{lang}wcf.user.username{/lang}</label></dt>
+                       <dd><input type="text" id="username" name="username" value="{$username}" class="long" />
+                               {if $errorField == 'username'}
+                                       <small class="innerError">
+                                               {if $errorType == 'empty'}
+                                                       {lang}wcf.global.form.error.empty{/lang}
+                                               {else}
+                                                       {lang}wcf.user.username.error.{@$errorType}{/lang}
+                                               {/if}
+                                       </small>
+                               {/if}
+                       </dd>
+               </dl>
                
+               <dl{if $errorField == 'password'} class="formError"{/if}>
+                       <dt><label for="password">{lang}wcf.user.password{/lang}</label></dt>
+                       <dd><input type="password" id="password" name="password" value="" class="long" />
+                               {if $errorField == 'password'}
+                                       <small class="innerError">
+                                               {if $errorType == 'empty'}
+                                                       {lang}wcf.global.form.error.empty{/lang}
+                                               {else}
+                                                       {lang}wcf.user.password.error.{@$errorType}{/lang}
+                                               {/if}
+                                       </small>
+                               {/if}
+                       </dd>
+               </dl>
+                       
                {include file='captcha'}
-       </div>
-       
-       <div class="formSubmit">
-               <input type="submit" value="{lang}wcf.global.button.submit{/lang}" accesskey="s" />
-               <input type="hidden" name="url" value="{$url}" />
-               {@SECURITY_TOKEN_INPUT_TAG}
-       </div>
-</form>
+               
+               <div class="formSubmit">
+                       <input type="submit" value="{lang}wcf.global.button.submit{/lang}" accesskey="s" />
+                       <input type="hidden" name="url" value="{$url}" />
+                       {@SECURITY_TOKEN_INPUT_TAG}
+               </div>
+       </form>
+</div>
+
+<script data-relocate="true">
+       document.addEventListener('DOMContentLoaded', function() {
+               require(['Ui/Dialog'], function (UiDialog) {
+                       UiDialog.openStatic('login', null, {
+                               closable: false,
+                               title: '{@$pageTitle|language}',
+                               onShow: function() {
+                                       if (elById('username').value === '' || '{$errorField}' === 'username') {
+                                               elById('username').focus();
+                                       }
+                                       else {
+                                               elById('password').focus();
+                                       }
+                               }
+                       });
+               });
+       });
+</script>
 
 {include file='footer'}
index eb2e851a86e158eb9b96e21037535b348c59c52e..1ab6362e1990eaecd698c334372aad063d292f42 100644 (file)
@@ -5,7 +5,7 @@
                        
                        {if ENABLE_BENCHMARK}{include file='benchmark'}{/if}
                        
-                       <address class="copyright"><a href="http://www.woltlab.com">Copyright &copy; 2001-2015 WoltLab&reg; GmbH</a>{event name='copyright'}</address>
+                       <address class="copyright"><a href="http://www.woltlab.com">Copyright &copy; 2001-2016 WoltLab&reg; GmbH</a>{event name='copyright'}</address>
                </div>
        </div>
 </footer>