<br>
<input type="submit" value="Change">
</fieldset></form>
+<form action="[% c.uri_for('changeBirthday') %]" method="post"><fieldset> <legend>Birthday</legend>
+ YYYY-MM-DD:
+ <input type="text" name="birthday" value="[% birthday %]" id="birthday">
+ <br><input type="submit" value="Change">
+</fieldset></form>
<form action="[% c.uri_for('changePassword') %]" method="post"> <fieldset> <legend>Change password</legend>
<p>Old password:
<input type="password" name="oldpass" value="">
</p>
</fieldset>
</form>
+<fieldset> <legend>Timezone</legend>
+ <select name="category" id="tzcategory">
+[% FOR cat IN tzcategories %]
+ <option value="[% cat %]" [% IF cat == timezone.0 %]selected[% END %]>[% cat %]</option>
+[% END %]
+ </select>
+ <select name="country" id="tzcountry">
+[% FOR country IN tzcountries %]
+ <option value="[% country %]" [% IF country == timezone.1 %]selected[% END %]>[% country %]</option>
+[% END %]
+ </select>
+<form action="[% c.uri_for('changeTimezone') %]" method="post">
+ <p><input type="text" name="timezone" value="[% timezone.join("/") %]" id="timezone">
+ <input type="submit" value="Change"></p>
+ <p>Remember that GMT stays the same all year, so if you're in the UK you should pick Europe/London.</p>
+</form></fieldset>
+[%- site.stylesheets = ['ui/ui.datepicker.css'] %]
+<script type="text/javascript" src="/static/ui/ui.core.min.js"></script>
+<script type="text/javascript" src="/static/ui/ui.datepicker.min.js"></script>
+
+<script type="text/javascript">
+$(document).ready(function(){
+ $("#birthday").datepicker({
+ yearRange: "-80:+0",
+ dateFormat: $.datepicker.ATOM,
+ firstDay: 1,
+ showOn: "both"
+ });
+ $("#tzcategory").change(function(){
+ if ($(this).val() == 'GMT'){
+ $("#timezone").val($(this).val());
+ $("#tzcountry").empty();
+ }else{
+ $.get("/jsrpc/tzcountries/" + $(this).val(),function(xml){
+ $("#tzcountry").empty();
+ $("country",xml).each(function(i){
+ var opt = $('<option>');
+ $("#tzcountry").append(opt);
+ opt.attr('value',$(this).text()).text($(this).text());
+ });
+ $("#tzcountry").change();
+ });
+ }
+ });
+ $("#tzcountry").change(function(){
+ $("#timezone").val($("#tzcategory").val() + '/' + $(this).val());
+ });
+});
+</script>