<#import "template.ftl" as layout>
<@layout.registrationLayout displayInfo=social.displayInfo; section>
    <#if section = "title">
        ${msg("loginTitle",(realm.displayName!''))}
    <#elseif section = "header">
        ${msg("loginTitleHtml",(realm.displayNameHtml!''))?no_esc}
        <#if realm.internationalizationEnabled><small>(<#list locale.supported as l><#if l.label!=locale.current><a href="${l.url}">${l.label}</a></#if></#list>)</small></#if> 
    <#elseif section = "form">
    <div class="medium-12 large-6 large-push-1 columns">
        <#if realm.password>
            <form id="kc-form-login" class="sso-form" onsubmit="login.disabled = true; return true;"
                  action="${url.loginAction}" method="post">
                <div>
                    <label for="username"><#if !realm.loginWithEmailAllowed>${msg("username")}<#elseif !realm.registrationEmailAsUsername>${msg("usernameOrEmail")}<#else>${msg("email")}</#if></label>
                    <#if usernameEditDisabled??>
                        <input tabindex="1" id="username" name="username" value="${(login.username!'')}" type="text" disabled/>
                    <#else>
                        <input tabindex="1" id="username" name="username" value="${(login.username!'')}" type="text" autofocus autocomplete="off"/>
                    </#if>
                </div>

                <div>
                    <label for="password">${msg("password")}</label>
                    <input tabindex="2" id="password" name="password" type="password" autocomplete="off"/>
                </div>

                <div>
                    <#if realm.rememberMe && !usernameEditDisabled??>
                        <div class="checkbox">
                            <label>
                                <#if login.rememberMe??>
                                    <input tabindex="3" id="rememberMe" name="rememberMe" type="checkbox" checked> ${msg("rememberMe")}
                                <#else>
                                    <input tabindex="3" id="rememberMe" name="rememberMe" type="checkbox"> ${msg("rememberMe")}
                                </#if>
                            </label>
                        </div>
                    </#if>
                </div>

                <div class="sso-form-buttons">
                    <input class="sso-form-button sso-form-button-primary" name="login" type="submit" value="${msg("doLogIn")}">
                    <a class="sso-form-button" href="${url.loginResetCredentialsUrl}">${msg("doForgotPassword")?no_esc}</a>
                    <#if realm.password && realm.registrationAllowed && !usernameEditDisabled??>
                        <a class="sso-form-button" href="${url.registrationUrl}">${msg("doRegister")}</a>
                    </#if>
                </div>
            </form>

        </#if>
    </div>
    <div class="medium-12 large-4 large-pull-1 columns sso-form">
        <a id="info"></a>
        <h2>Přihlášení existujícím účtem</h2>
        <div>Pro příhlášení můžete využít rovněž:
        <#if realm.password && social.providers??>
            <div id="kc-social-providers" class="sso-social-buttons">
                <#list social.providers as p>
                    <div class="sso-social-button sso-social-button-${p.providerId}"><a href="${p.loginUrl}">
                        <div class="sso-social-button-icon">
                        <#switch p.providerId>
                            <#case "facebook">
                                <i class="fab fa-fw fa-facebook-f"></i>
                                <#break>
                            <#case "google">
                                <i class="fab fa-fw fa-google"></i>
                                <#break>
                            <#case "twitter">
                                <i class="fab fa-fw fa-twitter"></i>
                                <#break>
                            <#case "microsoft">
                                <i class="fab fa-fw fa-microsoft"></i>
                                <#break>
                            <#case "oidc">
                                <i class="fab fa-fw fa-openid"></i>
                                <#break>
                            <#default>
                                <i class="fa fa-fw fa-question-square"></i>
                                <#break>
                        </#switch>
                        </div>
                        <div class="sso-social-button-text">${p.displayName}</div>
                    </a></div>
                </#list>
            </div>
        </#if>
        </div>
        <br/>

        <h2>Více informací</h2>
            <p>Proč se registrovat a další související informace najdete v aplikaci <a href="https://nalodeni.pirati.cz">Nalodění</a>.
        </p>

    </div>
    </#if>
</@layout.registrationLayout>
