<html> <head> <link href="client.css" type="text/css" rel="stylesheet"> <script src="client.js" type="text/javascript"></script> <script src="serverstub.js" type="text/javascript"></script> <script type="text/view" id="welcomeview"> <div class="welcome"> <img src="wimage.png" alt="logo and slogan"> <div class="form-elements" id="login"> <form id="loginform"> <h2>Login</h2> <div class="form-input"> <label for="email">Email</label> <input type="text" id="email" name="email" size="18"> </div> <div class="form-input"> <label for="password">Password</label> <input type="password" id="password" name="password" size="18"> </div> <input type="submit" value="Login"> <div id="message"></div> </form> <form id="signupform"> <h2>Sign up here</h2> <div class="form-input"> <label for="fname">First name</label> <input type="text" id="fname" name="fname" size="18"> </div> <div class="form-input"> <label for="lname">Family name</label> <input type="text" id="lname" name="lname" size="18"> </div> <div class="form-input"> <label for="gender">Gender</label> <select id="gender" name="gender" style="width:169;"> <option value="male">Male</option> <option value="female">Female</option> <option value="other">Other</option> </select> </div> <div class="form-input"> <label for="city">City</label> <input type="text" id="city" name="city" size="18"> </div> <div class="form-input"> <label for="country">Country</label> <input type="text" id="country" name="country" size="18"> </div> <div class="form-input"> <label for="email">Email</label> <input type="text" id="email" name="email" size="18"> </div> <div class="form-input"> <label for="password">Password</label> <input type="password" id="password" name="password" size="18"> </div> <div class="form-input"> <label for="password2">Repeat PSW</label> <input type="password" id="password2" name="password2" size="18"> </div> <div class="form-input"> <input type="submit" value="Sign Up"> </div> <div id="message"></div> </form> </div> </div> </script> <script type="text/view" id="profileview"> <!-- Tab links --> <div class="tab"> <button class="tablinks" onclick="openTab(event, 'Home')" id="defaultOpen">Home</button> <button class="tablinks" onclick="openTab(event, 'Browse')">Browse</button> <button class="tablinks" onclick="openTab(event, 'Account')">Account</button> </div> <!-- Tab content --> <div id="Home" class="tabcontent"> <h3 id=home-username>Home</h3> <div class="user-data-elements"> <div class="data-field"> <label for="home-gender"></label> <p id=home-gender></p> </div> <div class="data-field"> <label for="home-location"></label> <p id=home-location></p> </div> <div class="data-field"> <label for="home-email"></label> <p id=home-email></p> </div> </div> </div> <div id="Browse" class="tabcontent"> <h3>Browse</h3> <p>Here you can browse very cool stuff.</p> </div> <div id="Account" class="tabcontent"> <button id="logoutbutton">Log out</button> <div id="message1"></div> <h3>Account</h3> <p>Here you can change your account information</p> <form id="changepassform"> <h2>Change password</h2> <div class="form-input"> <label for="oldpassword">Old password</label> <input type="password" id="oldpassword" name="oldpassword" size="18"> </div> <div class="form-input"> <label for="password">New password</label> <input type="password" id="password" name="password" size="18"> </div> <div class="form-input"> <label for="password2">Confirm password</label> <input type="password" id="password2" name="password2" size="18"> </div> <input type="submit" value="Confirm change"> <div id="message2"></div> </form> </div> </script> </head> <body style="background-color: antiquewhite;"> <div id="pagecontent"> </div> </body> </html>