<%= tmpl( 'tpl_settings_tab', { data : { activeTab : 'account' } } ) %>

<div class="row">
    <div class="col-md-12">
        <h3>Account</h3>
    </div>
</div>
<div class="row">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-body">
                <p>
                <dl class="dl-horizontal">
                    <dt>Erstelldatum</dt>
                    <dd><%= TB.Utils.convertSQLDateToDatepickerDate( data.account.created_dt.date ) %></dd>
                    <dt>Email Adresse</dt>
                    <dd><%= data.account.email %></dd>
                    <dt>Validiert</dt>
                    <dd><%= ( 1 == data.account.is_validated ) ? '<span class="label label-success"><i class="glyphicon glyphicon-ok"></i></span>' : '<span class="label label-danger"><i class="glyphicon glyphicon-remove"></i></span>' %></dd>
                </dl>
                </p>
            </div>
        </div>
    </div>
</div>

<hr />

<h4>Passwort ändern</h4>

<div class="row">
    <div class="col-md-12">
        <form role="form" method="post" id="form_change_password">
            <div class="form-group">
                <label for="input-old-password">Bisheriges Passwort</label>
                <input type="password"
                       id="input-old-password"
                       name="input-old-password"
                       class="form-control"
                       data-validate="required"
                       data-validate-errormsg="Bitte bisheriges Passwort eingeben" />
            </div>
            <div class="form-group">
                <label for="input-new-password-1">Neues Passwort</label>
                <input type="password"
                       id="input-new-password-1"
                       name="input-new-password-1"
                       class="form-control"
                       data-validate="required"
                       data-validate-minchars="4"
                       data-validate-errormsg="Bitte neues Passwort mit mindestens 4 Zeichen eingeben" />
            </div>
            <div class="form-group">
                <label for="input-new-password-2">Neues Passwort erneut eingeben</label>
                <input type="password"
                       id="input-new-password-2"
                       name="input-new-password-2"
                       class="form-control"
                       data-validate="identical"
                       data-identical-field-id="input-new-password-1"
                       data-validate-errormsg="Passwörter nicht identisch." />
            </div>
        </form>
    </div>
</div>

<div class="row">
    <div class="col-md-6 col-sm-12">
        <button type="submit"
                id="btn-change-password-cancel"
                class="btn btn-primary btn-block">
            Abbrechen
        </button>
    </div>
    <div class="col-md-6 col-sm-12">
        <button type="button"
                id="btn-change-password-submit"
                class="btn btn-primary btn-block">
            Passwort ändern
        </button>
    </div>
</div>

<hr />

<h4>Email-Adresse ändern</h4>

<% if ( data.ec == null ) { %>

<div class="row">
    <div class="col-md-12">
        <form role="form" method="post" id="form_change_email">
            <div class="form-group">
                <label for="input-new-email">Neue Email-Adresse</label>
                <input type="text"
                       id="input-new-email"
                       name="input-new-email"
                       class="form-control"
                       data-validate="email"
                       placeholder="mein@neue-email.de"
                       data-validate-errormsg="Bitte neue Email Adresse eingeben" />
            </div>
            <div class="form-group">
                <label for="verify-password">Gebe dein Passwort zum Verifizieren ein</label>
                <input type="password"
                       id="verify-password"
                       name="verify-password"
                       class="form-control"
                       data-validate="required"
                       data-validate-minchars="4"
                       data-validate-errormsg="Bitte gebe dein aktuelles Passwort ein." />
            </div>
        </form>
    </div>
</div>
<div class="row">
    <div class="col-md-6 col-sm-12">
        <button type="submit"
                id="btn-change-email-cancel"
                class="btn btn-primary btn-block">
            Abbrechen
        </button>
    </div>
    <div class="col-md-6 col-sm-12">
        <button type="button"
                id="btn-change-email-submit"
                class="btn btn-primary btn-block">
            Email-Änderung beantragen
        </button>
    </div>
</div>

<% } else { %>

<div class="row">
    <div class="col-md-12">
        <div class="panel">
            <div class="panel-body panel-info">
                <p>
                    Du hast eine Email Änderung auf die Adresse <strong><%= data.ec.new_email %></strong> beantragt.
                </p>
                <p>
                    Eine Email mit Validierungslink wurde an diese Adresse geschickt. Der Validierungslink ist gültig bis zum <strong><%= TB.Utils.getDatetimeStringFromTimeString( data.ec.valid_until_dt.date ) %></strong>.
                </p>
            </div>
        </div>
    </div>
</div>


<% }    %>

<hr />

<h4>Accountdaten löschen</h4>

<div class="row">
    <div class="col-md-12">
        <div class="panel">
            <div class="panel-body">
                <p>
                    Deine Accountdaten werden automatisch gelöscht, sobald du dein letztes <a href="<%= TB.Controller.getUrl( 'Profiles' ) %>">Profil</a> von TBuddy gelöscht hast.
                </p>
            </div>
        </div>
    </div>
</div>
