<!-- start: Register Trainer form -->
<div id="register_trainer" class="row<% if ( data.activeTab != 'register_trainer' ) { %> hide<% } %>" data-type="formholder">
    <div class="center-block" style="max-width: 90%">
        <div class="panel panel-success">
            <div class="panel panel-heading">
                <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/tbloginlogo.png" class="center-block"/>
            </div>
            <div class="center-block" style="max-width: 90%;padding-bottom: 20px;">
                <form role="form" id="form_register_trainer">
                    <div class="form-group">
                        <label for="register.name">Teamname</label>
                        <input type="text"
                               id="register.team_name"
                               name="register.team_name"
                               placeholder="Teamname"
                               class="form-control"
                               value=""
                               data-validate="required"
                               data-validate-errormsg="Bitte geben den Namen deiner Team ein."
                            />
                    </div>

                    <div class="form-group">
                        <label for="register.category">Sport/Art (optional)</label>
                        <input type="text"
                               id="registerteamcategory"
                               name="register.team_category"
                               placeholder="bspw. Fussball, Handball, Freiwillige Feuerwehr"
                               class="form-control"
                               maxlength="32"
                            />
                    </div>

                    <div class="form-group">
                        <label class="for-custom-radio" for="gender">Anrede</label>
                        <label class="radiochecklabel radio-inline">
                            <div>
                                <input class="radiocheck"
                                       type="radio"
                                       name="register.gender"
                                       value="male"
                                />
                                Herr
                                <div class="check">
                                    <div class="inside"></div>
                                </div>
                            </div>
                        </label>
                        <label class="radiochecklabel radio-inline">
                            <div>
                                <input class="radiocheck"
                                       type="radio"
                                       name="register.gender"
                                       value="female"
                                />
                                Frau
                                <div class="check">
                                    <div class="inside"></div>
                                </div>
                            </div>
                        </label>
                    </div>
                    <div class="form-group">
                        <label for="register.first_name">Dein Vorname</label>
                        <input type="text"
                               id="register.first_name"
                               name="register.first_name"
                               placeholder="Vorname"
                               class="form-control"
                               value=""
                               data-validate="required"
                               data-validate-errormsg="Bitte gebe Deinen Vorname ein."
                            />
                    </div>
                    <div class="form-group">
                        <label for="register.last_name">Dein Nachname</label>
                        <input type="text"
                               id="register.last_name"
                               name="register.last_name"
                               placeholder="Nachname"
                               class="form-control"
                               value=""
                               data-validate="required"
                               data-validate-errormsg="Bitte gebe Deinen Nachnamen ein."
                            />
                    </div>
                    <div class="form-group">
                        <label for="register.email">Deine Email Adresse</label>
                        <input type="email"
                               id="register.email"
                               name="register.email"
                               placeholder="Email Adresse"
                               class="form-control"
                               value="<%= ( data.email ) ? data.email : '' %>"
                               data-validate="email"
                               data-validate-errormsg="Email Adresse ist nicht gültig."
                            />
                    </div>
                    <div class="form-group">
                        <label for="register.pass">Dein Passwort</label>
                        <input type="password"
                               id="register.pass"
                               name="register.pass"
                               placeholder="<?= _lc( 'Passwort' ); ?>"
                               value=""
                               class="form-control"
                               data-validate="required"
                               data-validate-minchars="4"
                               data-validate-errormsg="Das Passwort muss aus mindestens 4 Zeichen bestehen."
                            />
                    </div>
                    <div class="form-group">
                        <label>
                            <input type="checkbox"
                                   name="register.subscribe_news"
                                />&nbsp;<small>Ja, ich möchte viermal im Jahr über alle Neuerungen, Updates und Ideen von TBuddy informiert werden.</small>
                        </label>
                    </div>
                    <div class="form-group">
                        <label>
                            <input type="checkbox"
                                   name="register.accept_terms"
                                   data-validate="required"
                                   data-validate-errormsg="Du musst die AGB und Datenschutzerklärung akzeptieren, um den Service nutzen zu können."
                                />&nbsp;<small>Ich akzeptiere die <a href="http://tbuddy.de/agb/" target="_blank">AGB</a> und <a href="http://tbuddy.de/datenschutz/" target="_blank">Datenschutzerklärung</a>.</small>
                        </label>
                    </div>
                    <% if( data.token ) { %>
                        <input type="hidden" name="register.token" value="<%= data.token %>" />
                    <% } %>
                    <button type="submit"
                            id="btn_register_trainer"
                            data-style="zoom-in"
                            data-size="l"
                            class="btn btn-success btn-block ladda-button">Registrieren</button>
                </form>
                <hr />
                <h6>Du hast Dich bereits registriert?</h6>
                <button type="button" class="btn btn-default btn-block" data-refdivid="login">Zum Login</button>
            </div>
        </div>
    </div>
</div>
<!-- end: Register Trainer form -->


<!-- end: trainer registration email reminder info -->
<div id="register_trainer_done" class="row<% if ( data.activeTab != 'register_trainer_done' ) { %> hide<% } %>">
    <div class="center-block" style="max-width: 90%">
        <div class="panel panel-success">
            <div class="panel panel-heading">
                <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/tbloginlogo.png" class="center-block"/>
            </div>
            <div class="center-block" style="max-width:90%;">
                <h3>Du hast Post!!!</h3>
                <p>Bitte schau in deinem Email-Postfach nach. In den nächsten Minuten bekommst Du eine Mail mit einem Validierungslink.</p>
                <p>Folge einfach den Anweisungen und schon kann es losgehen.</p>
                <p>Viel Spass!</p>
                <hr />
                <button type="button" class="btn btn-default btn-block" data-refdivid="login">Zurück zur Startseite</button>
                <p>&nbsp;</p>
            </div>
        </div>
    </div>
</div>
</div>
<!-- end: trainer registration email reminder info -->


<!-- start: Register Player form -->
<div id="register_player" class="row<% if ( data.activeTab != 'register_player' ) { %> hide<% } %>" data-type="formholder">
    <div class="center-block" style="max-width: 90%">
        <div class="panel panel-success">
            <div class="panel-heading">
                <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/tbloginlogo.png" class="center-block"/>
            </div>
            <div class="panel-body">
                <div class="center-block" style="max-width: 90%;">
                    <% if ( data.token ) { %>
                        <p class="lead">Hallo, <%= data.invitation.first_name + " " + data.invitation.last_name %>!</p>
                        <p>Du wurdest vom Trainer <span class="label label-default"><%= data.inviter.first_name %>&nbsp;<%= data.inviter.last_name %></span> des Teams <span class="label label-success"><%= data.team.display_name %></span> eingeladen, an tbuddy.de teilzunehmen.</p>
                        <p>Bitte mache noch folgende Angaben, damit es losgehen kann.</p>

                        <form role="form" id="form_register_player">
                            <% if ( !data.account || data.account.email != data.invitation.email ) {    %>
                            <div class="form-group">
                                <label for="register.pass">Dein Passwort</label>
                                <input type="password"
                                       id="register.pass"
                                       name="register.pass"
                                       placeholder="<?= _lc( 'Passwort' ); ?>"
                                       value=""
                                       class="form-control"
                                       data-validate="required"
                                       data-validate-minchars="4"
                                       data-validate-errormsg="Das Passwort muss aus mindestens 4 Zeichen bestehen."
                                    />
                            </div>
                            <%  }   %>
                            <div class="form-group">
                                <label>
                                    <input type="checkbox"
                                           name="register.subscribe_news"
                                        />&nbsp;<small>Ja, ich möchte viermal im Jahr über alle Neuerungen, Updates und Ideen von TBuddy informiert werden.</small>
                                </label>
                            </div>
                            <div class="form-group">
                                <label>
                                    <input type="checkbox"
                                           name="register.accept_terms"
                                           data-validate="required"
                                           data-validate-errormsg="Du musst die AGB und Datenschutzerklärung akzeptieren, um den Service nutzen zu können."
                                        />&nbsp;<small>Ich akzeptiere die <a href="http://tbuddy.de/agb/" target="_blank">AGB</a> und <a href="http://tbuddy.de/datenschutz/" target="_blank">Datenschutzerklärung</a>.</small>
                                </label>
                            </div>
                            <input type="hidden" name="register.token" value="<%= data.token %>" />
                            <button type="submit"
                                    id="btn_register_player"
                                    data-style="zoom-in"
                                    data-size="l"
                                    class="btn btn-success btn-block ladda-button">Registrieren</button>
                        </form>

                    <% } else {   %>

                        <h4>Ungültiges Einladungstoken</h4>
                        <p>
                            Leider können wir keine Einladung für Dich finden. Bitte Deinen Coach Dir eine neue Einladung zu schicken.
                        </p>
                        <hr />
                        <p>Du hast bereits einen Account bei uns?</p>
                        <button type="button" class="btn btn-default btn-block" data-refdivid="login">Zum Login</button>

                    <% }    %>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- end: Register Player form -->



<!-- start: login form -->
<div id="login" class="row<% if ( data.activeTab != 'login' ) { %> hide<% } %>">
    <div class="center-block" style="max-width: 90%">
        <div class="panel panel-success">
            <div class="panel panel-heading">
                <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/tbloginlogo.png" class="center-block"/>
            </div>
            <div class="center-block" style="max-width:90%;">
                <form role="form" id="form_login">
                    <div class="form-group">
                        <label for="login.email">Email</label>
                        <input type="email"
                               id="login.email"
                               name="login.email"
                               placeholder="Deine Email Adresse"
                               class="form-control"
                               value=""
                               />
                    </div>
                    <div class="form-group">
                        <label for="login.pass">Passwort</label>
                        <input type="password"
                               id="login.pass"
                               name="login.pass"
                               placeholder="<?= _lc( 'Dein Passwort' ); ?>"
                               value=""
                               class="form-control"
                               />
                        <p class="align-right">
                            <small>Hast Du Dein <a href="#/c=Auth&a=forgot_password" data-refdivid="forgot_password">Passwort vergessen</a>?</small>
                        </p>
                    </div>
                    <!--
                    <div class="form-group">
                        <label>
                            <input type="checkbox"
                                   name="login.remember"> <small>Eingeloggt bleiben</small>
                        </label>
                    </div>
                    -->
                    <button type="submit"
                            id="btn_login"
                            data-style="zoom-in"
                            data-size="l"
                            class="btn btn-success btn-block ladda-button">
                        <i class="fa fa-sign-in"></i>&nbsp;Login
                    </button>
                    <p>
                        <small>Mit dem Login bestätigst Du unsere <a href="http://tbuddy.de/agb/" target="_blank">AGB</a> und <a href="http://tbuddy.de/datenschutz/" target="_blank">Datenschutzerklärung</a>.</small>
                    </p>
                </form>
                <hr />
                <h6>Noch keinen Account?</h6>
                <p>Du bist Trainer und hast Lust Dein Team bei tbuddy.de anzumelden?</p>
                <button type="button" class="btn btn-default btn-block" data-refdivid="registerTrainer">Team anmelden</button>
                <hr />
                <div class="browsersupport"">
                    <h6>Optimiert &amp; getestet für die folgenden Browser:</h6>
                    <div class="row">
                        <div class="col-xs-3 text-center">
                            <small>min.40</small>
                            <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/chrome_32x32.png" class="center-block" style="opacity: 0.5" /><br />
                        </div>
                        <div class="col-xs-3 text-center">
                            <small>min.30</small>
                            <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/firefox_32x32.png" class="center-block" style="opacity: 0.5"/><br />
                        </div>
                        <div class="col-xs-3 text-center">
                            <small>min.8</small>
                            <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/safari_32x32.png" class="center-block" style="opacity: 0.5" /><br />
                        </div>
                        <div class="col-xs-3 text-center">
                            <small>min.10</small>
                            <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/internet-explorer_32x32.png" class="center-block" style="opacity: 0.7" /><br />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- end: login form -->

<!-- start: forgot_password form -->
<div id="forgot_password" class="row<% if ( data.activeTab != 'forgot_password' ) { %> hide<% } %>" data-type="formholder">

    <div class="center-block" style="max-width: 320px">
        <div class="panel panel-success">
            <div class="panel panel-heading">
                <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/tbloginlogo.png" class="center-block"/>
            </div>
            <div class="center-block" style="max-width: 260px;padding-bottom: 20px;">
                <p>
                    Gebe Deine Email Adresse ein. Wir schicken Dir dann eine Email, in der Du Informationen findest, wie Du ein neues Passwort erstellen kannst.
                </p>
                <form role="form" method="post" id="form_forgot_password">
                    <div class="form-group">
                        <label for="forgot_password.email">Email</label>
                        <input type="email"
                               id="forgot_password.email"
                               name="forgot_password.email"
                               placeholder="Deine Email Adresse"
                               class="form-control"
                               value=""
                               data-validate="email"
                               data-validate-errormsg="Email Adresse ist nicht gültig."
                            />
                    </div>
                    <button type="submit"
                            id="btn_forgot_password"
                            data-style="zoom-in"
                            data-size="l"
                            class="btn btn-success btn-block ladda-button">Passwort zurücksetzen</button>
                </form>
                <h6>Zurück zum Login?</h6>
                <button type="button" class="btn btn-default btn-block" data-refdivid="login">
                    Login
                </button>
            </div>
        </div>
    </div>
</div>
<!-- end: forgot_password form -->

<!-- start: reset_password form -->
<div id="reset_password" class="row<% if ( data.activeTab != 'reset_password' ) { %> hide<% } %>" data-type="formholder">

    <div class="center-block" style="max-width: 320px">
        <div class="panel panel-success">
            <div class="panel panel-heading">
                <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/tbloginlogo.png" class="center-block"/>
            </div>
            <div class="center-block" style="max-width: 260px;padding-bottom: 20px;">
                <h5>Fast geschafft!</h5>
                <p>
                    Bitte gebe im Formular zweimal Dein neues Passwort ein.
                </p>
                <form role="form" method="post" id="form_reset_password">
                    <input type="hidden" name="reset_password.token" value="<%= data.pwrtoken %>" />
                    <div class="form-group">
                        <label for="reset_password.password1">Neues Passwort</label>
                        <input type="password"
                               id="reset_password.password1"
                               name="reset_password.password1"
                               class="form-control"
                               data-validate-minchars="4"
                               value=""
                               data-validate="required"
                               data-validate-errormsg="Das Passwort muss mindestens aus 4 Buchstaben bestehen."
                            />
                    </div>
                    <div class="form-group">
                        <label for="reset_password.password2">Neues Passwort wiederholen</label>
                        <input type="password"
                               id="reset_password.password2"
                               name="reset_password.password2"
                               class="form-control"
                               value=""
                               data-validate="identical"
                               data-identical-field-id="reset_password\\.password1"
                               data-validate-errormsg="Diese Eingabe muss mit dem oberen Passwort übereinstimmen."
                            />
                    </div>
                    <button type="submit"
                            id="btn_reset_password"
                            data-style="zoom-in"
                            data-size="l"
                            class="btn btn-success btn-block ladda-button">Neues Passwort speichern</button>
                </form>
                <h6>Zurück zum Login?</h6>
                <button type="button" class="btn btn-default btn-block" data-refdivid="login">
                    Login
                </button>
            </div>
        </div>
    </div>
</div>
<!-- end: reset_password form -->


<!-- start: end: confirm_email_change -->
<div id="confirm_email_change" class="row<% if ( data.activeTab != 'confirm_email_change' ) { %> hide<% } %>" data-type="formholder">

    <div class="center-block" style="max-width: 320px">
        <div class="panel panel-success">
            <div class="panel panel-heading">
                <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/tbloginlogo.png" class="center-block"/>
            </div>
            <div class="center-block" style="max-width: 260px;padding-bottom: 20px;">

                <% if ( "ok" == data.actionResult ) {   %>
                    <h5>Email erfolgreich geändert.</h5>
                    <p>
                        Deine Emailänderung war erfolgreich.
                    </p>
                    <p>
                        Verwende von nun ab bitte immer deine neue Email Adresse.
                    </p>
                <% } else if ( "timeup" == data.actionResult )  {   %>

                    <h5>Token zu alt.</h5>
                    <p>
                        Deine Email konnte nicht geändert werden.
                    </p>
                    <p>
                        Der Grund hierfür ist, dass dein Token mittlerweile veraltet ist. Versuche es erneut.
                    </p>

                <% } else { %>

                    <h5>Fehler bei EMail Änderung</h5>
                    <p>
                        Deine Email konnte nicht geändert werden.
                    </p>
                    <p>
                        Bitte melde dich beim Support, um deine Email zu ändern.
                    </p>

                <% }    %>

                <button type="button" class="btn btn-default btn-block" id="btn-continue-after-confirm-email">
                    Weiter...
                </button>
            </div>
        </div>
    </div>
</div>
<!-- end: confirm_email_change -->

<!-- start: email_validation form -->
<div id="email_validation" class="row<% if ( data.activeTab != 'email_validation' ) { %> hide<% } %>" data-type="formholder">

    <div class="center-block" style="max-width: 320px">
        <div class="panel panel-success">
            <div class="panel panel-heading">
                <img src="<?= Francis_Utils_Config::get( 'url.client' ) ?>/img/tbloginlogo.png" class="center-block"/>
            </div>
            <div class="center-block" style="max-width: 260px;padding-bottom: 20px;">
                <h5>Vielen Dank!</h5>
                <p>
                    Deine Email ist nun erfolgreich validiert.<br />
                    Und nun weiterhin viel Spass auf tbuddy.de!
                </p>
                <h6>Weiter zum Login</h6>
                <a href="/#/c=Auth&a=login" class="btn btn-link">Login</a>
            </div>
        </div>
    </div>
</div>
<!-- end: email_validation form -->