<md-dialog>
    <md-content>
        <md-toolbar class="md-hue-1">
            <div class="md-toolbar-tools">
                <h3>
                    <span>Change Password</span>
                </h3>
            </div>
        </md-toolbar>
        <form style="width:400px;" name="passwordForm" novalidate ng-hide="showSuccess" layout-padding>
            <div layout="row">
                <md-input-container flex="100">
                    <label>Current Password</label>
                    <input name="currentPassword"
                           ng-model="newPassword.oldPassword"
                           type="password"
                           ng-pattern="/(^.*(?=.*\d)(?=.*[a-z]).*$)/"
                           ng-minlength="8"
                           ng-required="true">
                </md-input-container>
            </div>
            <div layout="row">
                <md-input-container flex="100">
                    <label>New Password</label>
                    <input name="password"
                           ng-model="newPassword.newPassword"
                           type="password"
                           ng-pattern="/(^.*(?=.*\d)(?=.*[a-z]).*$)/"
                           ng-minlength="8"
                           ng-required="true">
                </md-input-container>
            </div>
            <div layout="row">
                <md-input-container flex="100">
                    <label>Confirm Password (required)</label>
                    <input name="verifyPassword"
                           ng-model="verify.verifyPassword"
                           type="password"
                           compare-to="newPassword.newPassword"
                           ng-required="true">
                    <div ng-if="passwordForm.verifyPassword.$dirty" ng-messages="passwordForm.verifyPassword.$error">
                        <div ng-message="required">You must verify your password!</div>
                        <div ng-message="compareTo">Passwords must match!</div>
                    </div>
                </md-input-container>
            </div>
            <div class="md-actions md-padding" layout="row" layout-align="start center">
                <md-button class="md-raised md-primary md-hue-1" ng-click="resetPassword($event)"> Save </md-button>
                <md-button class="md-raised md-hue-1" ng-click="cancel()"> Cancel </md-button>
            </div>
        </form>
        <div ng-if="showSuccess">
            <h3>
                Your password was sucessfully changed.
            </h3>
            <div class="md-actions md-padding" layout="row" layout-align="start center">
                <md-button class="md-raised md-primary md-hue-1" ng-click="cancel()"> Close </md-button>
            </div>
        </div>
    </md-content>
</md-dialog>