<!-- Localization completed -->
<div class='profile'>
    <form class='form-horizontal'>
        <div ng-show='errorMessage' class='error'><span>{{errorMessage}}</span></div>
        <div ng-show='completeMessage' class='success'><span>{{completeMessage}}</span></div>

        <div class='form-group change-title'>
            <label class='col-sm-3 control-label' localized>&nbsp;</label>
            <div class='col-sm-9'><h3 localized>menu.profile</h3></div>
        </div>

        <div class='form-group'>
            <label for='login' class='col-sm-3 control-label' style="font-weight: normal" localized>form.user.login</label>
            <div class='col-sm-9'>
                <input ng-model='user.login' type='text' class='form-control' id='login' disabled>
            </div>
        </div>

        <div class='form-group' ng-if="settings.accountType != 3 && !settings.singleCustomer">
            <div class="col-sm-3 align-right" localized>form.customer.type</div>
            <div class="col-sm-9 bold">{{accountType(settings.accountType)}}</div>
        </div>

        <div class='form-group' ng-if="settings.expiryTime > 0">
            <div class="col-sm-3 align-right" localized>form.customer.expiry.time</div>
            <div class="col-sm-9 bold"><span ng-class="{'warning-font': settings.expiryTime && settings.expiryTime < now + 86400000*3}">{{settings.expiryTime | date:'dd/MM/yyyy'}}</span></div>
        </div>

        <div class='form-group' ng-if="settings.deviceLimit > 0">
            <div class="col-sm-3 align-right" localized>form.customer.device.limit</div>
            <div class="col-sm-9 bold"><span ng-class="{'warning-font': settings.deviceCount > settings.deviceLimit}">{{settings.deviceCount}} / {{settings.deviceLimit}}</span></div>
        </div>

        <div class='form-group' ng-if="settings.sizeLimit > 0">
            <div class="col-sm-3 align-right" localized>form.customer.size.limit</div>
            <div class="col-sm-9 bold"><span>{{sizeLimit}} Mb</span></div>
        </div>

        <div class='form-group'>
            <label for='username' class='col-sm-3 control-label' style="font-weight: normal" localized>form.user.name</label>
            <div class='col-sm-9'>
                <input ng-model='user.name' type='text' class='form-control' id='username'
                       localized-placeholder='form.user.name.placeholder'>
            </div>
        </div>

        <div class='form-group'>
            <label for='email' class='col-sm-3 control-label' style="font-weight: normal" localized>form.user.email</label>
            <div class='col-sm-9'>
                <input ng-model='user.email' type='text' class='form-control' id='email'
                       localized-placeholder='form.user.email.placeholder'>
            </div>
        </div>

        <div class='form-group'>
            <div class='col-sm-offset-2 col-sm-10'>
                <button type='submit' class='btn btn-default' ng-disabled="!saveEnabled" ng-click='saveDetails()' localized>button.save</button>
            </div>
        </div>

        <div class='form-group change-title'>
            <label class='col-sm-3 control-label' localized>&nbsp;</label>
            <div class='col-sm-9'><h3 localized>form.profile.title</h3></div>
        </div>

        <div class='form-group'>
            <label for='oldPassword' class='col-sm-3 control-label' style="font-weight: normal" localized>form.profile.password.old</label>
            <div class='col-sm-9'>
                <input ng-model='user.oldPassword' type='password' class='form-control' id='oldPassword'
                       localized-placeholder='form.profile.password.old.placeholder'>
            </div>
        </div>

        <div class='form-group'>
            <label for='newPassword' class='col-sm-3 control-label' style="font-weight: normal" localized>form.profile.password.new</label>
            <div class='col-sm-9'>
                <input ng-model='user.newPassword' type='password' class='form-control' id='newPassword'
                       localized-placeholder='form.profile.password.new.placeholder'>
            </div>
        </div>

        <div class='form-group'>
            <label for='confirm' class='col-sm-3 control-label' style="font-weight: normal" localized>form.profile.password.confirm</label>
            <div class='col-sm-9'>
                <input ng-model='user.confirm' type='password' class='form-control' id='confirm'
                       localized-placeholder='form.profile.password.confirm.placeholder'>
                <div class="field-hint">{{qualityMessage}}</div>
            </div>
        </div>

        <div class='form-group'>
            <div class='col-sm-offset-2 col-sm-10'>
                <button type='submit' class='btn btn-default' ng-disabled="!saveEnabled" ng-click='saveProfile()' localized>button.save</button>
            </div>
        </div>
    </form>
</div>