<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" th:lang="${#ctx.getLocale().toLanguageTag()}" >
  <head>
    <meta charset="utf-8"/>
    <title>User form</title>
  </head>
<body>
<div id="userForm" th:fragment="userFormFragment" >
  <script type="text/javascript" th:inline="javascript">
    //<![CDATA[

        function userFormSubmit() {

            var errors = {};
            var valid = true;

            if(!$('#title').val()) {
                errors['title'] = /*[[#{renkan.error.title.empty}]]*/"renkan.error.title.empty";
                valid = false;
            }

            var password = $('#password').val();
            var passwordConf = $('#passwordConfirm').val();
            var objId = $('#id').val();
            
            if(objId && !password) {
                errors['password'] = /*[[#{renkan.error.password.missing}]]*/"renkan.error.passwsord.missing";
                valid = false;
            }
            if(password !== passwordConf) {
                errors['password'] = /*[[#{renkan.error.password.equals}]]*/"renkan.error.passwsord.equals";
                valid = false;
            }

            showformErrors(errors);

            return valid;
        }
        
        
        $(function(){
            var regionalValue = /*[[${#ctx.getLocale().getLanguage()}]]*/"";
            $.datepicker.setDefaults($.datepicker.regional[ "" ]);
            $('.datepicker').datepicker($.datepicker.regional[regionalValue]);
            $('#color').spectrum({
                showInput: true,
                showAlpha: true,
                showPalette: true,
                showInitial: true
            });
            $("#model-form").submit(function(e) {
                return userFormSubmit();
            });
            
        });
    //]]>
  </script>
  <form action="#" th:object="${user}" th:action="@{/admin/users/save}" method="post" id="model-form">
     <fieldset class="form-fields">
       <input type="hidden" th:field="*{id}" th:if="*{id}" />
       <div>
         <label for="title" th:text="#{renkanAdmin.form.name}">Name: </label> 
         <input type="text" th:field="*{title}" />
         <div th:if="${#fields.hasErrors('title')}" th:errors="*{title}" class="form-error"></div>
       </div> 
       <div>
         <label for="uri" th:text="#{renkanAdmin.form.uri}">Uri: </label> 
         <input type="text" th:field="*{uri}" /> 
       </div> 
       <div>
         <label for="description" th:text="#{renkanAdmin.form.description}">Description: </label> 
         <textarea th:field="*{description}"></textarea> 
       </div> 
       <div>
         <label for="color" th:text="#{renkanAdmin.form.color}">Color: </label> 
         <input type="text" th:field="*{color}" /> 
       </div>
       <div>
         <label for="avatar" th:text="#{renkanAdmin.form.avatar}">Avatar: </label> 
         <input type="text" th:field="*{avatar}" /> 
       </div>
       <div>
         <label for="password" th:text="#{renkanAdmin.form.password}">Password: </label> 
         <input type="password" th:field="*{password}" /> 
         <div th:if="${#fields.hasErrors('password')}" th:errors="*{password}" class="form-error"></div>
       </div>
       <div>
         <label for="passwordConfirm" th:text="#{renkanAdmin.form.passwordConfirm}">Confirm password: </label> 
         <input type="password" th:field="*{passwordConfirm}" /> 
         <div th:if="${#fields.hasErrors('passwordConfirm')}" th:errors="*{passwordConfirm}" class="form-error"></div>
       </div>       
       <div>
         <label for="credentialExpirationDate" th:text="#{renkanAdmin.form.credentialExpirationDate}">Credential expiration date: </label> 
         <input type="text" th:field="*{credentialExpirationDate}" class="datepicker"/> 
       </div>
       <div>
         <label for="expirationDate" th:text="#{renkanAdmin.form.expirationDate}">Expiration date: </label> 
         <input type="text" th:field="*{expirationDate}" class="datepicker"/> 
       </div>
       <div>
         <label for="email" th:text="#{renkanAdmin.form.email}">Email: </label> 
         <input type="email" th:field="*{email}" /> 
       </div>
       <div>
         <label for="enabled" th:text="#{renkanAdmin.form.enabled}">Enabled: </label> 
         <input type="checkbox" th:field="*{enabled}" /> 
       </div>
       <div>
         <label for="locked" th:text="#{renkanAdmin.form.locked}">Locked: </label> 
         <input type="checkbox" th:field="*{locked}" /> 
       </div>
       <div class="submit"> 
         <button type="submit" name="save" th:text="#{renkanAdmin.form.user.submit}">Save</button>
         <!--button type="button" name="cancel" th:text="#{renkanAdmin.form.user.cancel}" th:onclick="location">Cancel</button-->
       </div> 
      
     </fieldset>  
  </form>
</div>
</body>
</html>