<%@ page import="zall.bean.*" %>
<%
User user = (User)request.getAttribute("profile_user");
%>

<div id="main">
	<script type="text/javascript"> 
    jQuery().ready(function() {
		// Validate register form
		jQuery("#profileForm").validate({
			rules: {
				email: {
					required: true,
					email: true
				},
				password: {
					required: true
				},
				rePassword: {
					required: true,
					equalTo: "#password"
				},
				name: {
					required: true,
					firstLastName: true
				}
			},
			messages: {
				email: "<lable to='email'><img src='img/error.png' title='Please enter a valid email address' /></lable>",
				password: {
					required: "<lable to='password'><img src='img/error.png' title='Please enter a password' /></lable>"
				},
				rePassword: {
					required: "<lable to='re_password'><img src='img/error.png' title='Please enter a password' /><lable>",
					equalTo: "<lable to='re_password'><img src='img/error.png' title='Please enter the same password as above' /></lable>"
				},
				name: "<lable to='name'><img src='img/error.png' title='Please enter your first and last name, eg. Ziver Koc' /></lable>"
			}
		});
	});
	</script> 
   
        <div id="container">
            <div id="content">
                <DIV id="comments">
                	<% if( request.getParameter("page")==null || request.getParameter("page").equalsIgnoreCase("general") ){ %> 
                    <DIV id="respond" style="float: left; width: 400px;"> 
                        <H3>General settings </H3>
                        
                        <DIV class="formcontainer">
                            <FORM id="profileForm" method="post">     
                            	<INPUT type="hidden" name="action" value="moduser">                            	
                            	<p>&nbsp;</p>
                                
                                 <DIV class="form-section"> 
                                    <DIV class="form-label"><LABEL for="email">Email</LABEL> <SPAN class="required">*</SPAN></DIV> 
                                    <DIV class="form-input"><INPUT id="email" name="email" type="text" value="<%=user.getEmail() %>" size="30" tabindex="1"></DIV> 
                                </DIV>
                                
                                <DIV class="form-section"> 
                                    <DIV class="form-label"><LABEL for="name">Full Name</LABEL> <SPAN class="required">*</SPAN></DIV> 
                                    <DIV class="form-input"><INPUT id=name name="name" type="text" value="<%=user.getName() %>" size="30" tabindex="4"></DIV> 
                                </DIV>
                                
                                <INPUT id="submit" name="save" type="submit" value="Save" tabindex="7">
                            </FORM><!-- #commentform --> 
                        </DIV><!-- .formcontainer --> 
                    </DIV><!-- .formcontainer -->                       
                	<%} else if( request.getParameter("page").equalsIgnoreCase("password") ){ %> 
                    <DIV id="respond" style="float: left; width: 400px;"> 
                        <H3>General settings </H3>
                        
                        <DIV class="formcontainer">
                            <FORM id="profileForm" method="post">     
                            	<INPUT type="hidden" name="action" value="moduser">                            	
                            	<p>&nbsp;</p>
                                
                                <DIV class="form-section"> 
                                    <DIV class="form-label"><LABEL for="old_password">Old Password</LABEL> <SPAN class="required">*</SPAN></DIV> 
                                    <% if( user.getPassword()==null ){ %>
                                    <DIV class="form-input"><INPUT id="old_password" name="oldPassword" type="text" value="N/A" size="30" tabindex="1" disabled></DIV> 
                                	<%} else{ %>
                                	<DIV class="form-input"><INPUT id="old_password" name="oldPassword" type="password" value="" size="30" tabindex="1" ></DIV> 
                                	<%} %>
                                </DIV>
                                <p>&nbsp;</p>
                                <DIV class="form-section"> 
                                    <DIV class="form-label"><LABEL for="password">Password</LABEL> <SPAN class="required">*</SPAN></DIV> 
                                    <DIV class="form-input"><INPUT id="password" name="password" type="password" value="" size="30" tabindex="2"></DIV> 
                                </DIV>
                                <DIV class="form-section"> 
                                    <DIV class="form-label"><LABEL for="rePassword">Re-enter Password</LABEL> <SPAN class="required">*</SPAN></DIV> 
                                    <DIV class="form-input"><INPUT id="rePassword" name="rePassword" type="password" value="" size="30" tabindex="3"></DIV> 
                                </DIV>
                                
                                <INPUT id="submit" name="save" type="submit" value="Save" tabindex="7">
                            </FORM><!-- #commentform --> 
                        </DIV><!-- .formcontainer --> 
                    </DIV><!-- .formcontainer -->                       
                    <%} %>
                </div><!-- .post -->            
            </div><!-- #content -->
        </div><!-- #container -->


	<div class="aside main-aside">
		<ul class="xoxo">
			<li class="widgetcontainer widget_pages">
				<h3 class="widgettitle">Settings</h3>
				<ul>
					<li class="page_item"><a href="?id=<%=user.getId() %>&page=general" title="Change General Settings">General</a></li>
					<li class="page_item"><a href="?id=<%=user.getId() %>&page=password" title="Change Password">Password</a></li>
					<li class="page_item">Faces <!-- <a href="?id=<%=user.getId() %>&page=faces" title="Edit Detected faces">Faces</a> --></li> 
					<li class="page_item">&nbsp;</li>
				</ul>
			</li>
		</ul>
	</div><!-- #primary .aside -->

</div><!-- #main -->
