source: OpenWorkouts-current/ow/templates/edit_profile.pt @ 31adfa5

currentfeature/docs
Last change on this file since 31adfa5 was 31adfa5, checked in by borja <borja@…>, 5 years ago

(#14) Timezones support:

  • Added pytz as a new dependency, please install it in your existing envs:

pip install pytz

  • Added a timezone attribute to users, to store in which timezone they are, defaults to 'UTC'. Ensure any users you could have in your database have such attribute. You can add it in pshell:

for user in root.users:

user.timezone = 'UTC'

request.tm.commit()

  • Modified schemas/templates/views to let users choose their timezone based on a list of "common" timezones provided by pytz
  • Added two methods to the Workout model so we can get the start and end dates formatted in the appropiate timezone (all datetime objects are stored in UTC)
  • Modified the templates where we show workout dates and times so the new timezone-formatting methods are used.
  • Property mode set to 100644
File size: 5.1 KB
Line 
1<html xmlns="http://www.w3.org/1999/xhtml"
2      xml:lang="en"
3      xmlns:tal="http://xml.zope.org/namespaces/tal"
4      xmlns:metal="http://xml.zope.org/namespaces/metal"
5      xmlns:i18n="http://xml.zope.org/namespaces/i18n"
6      i18n:domain="OpenWorkouts"
7      metal:use-macro="load: base.pt"
8      tal:attributes="lang request.locale_name">
9
10  <metal:head-title metal:fill-slot="head-title">
11    <tal:t i18n:translate="">Edit profile</tal:t>
12  </metal:head-title>
13
14  <metal:title metal:fill-slot="title">
15      <tal:t i18n:translate="">Edit profile</tal:t>
16  </metal:title>
17
18  <metal:css metal:fill-slot="css">
19      <link rel="stylesheet" href="${request.static_url('ow:static/components/pickadate/themes/default.css')}" />
20      <link rel="stylesheet" href="${request.static_url('ow:static/components/pickadate/themes/default.date.css')}" />
21  </metal:css>
22
23  <metal:content metal:fill-slot="content">
24      <h2 i18n:translate="">Edit profile</h2>
25    <div class="edit-profile ow-forms">
26      ${form.begin(multipart=True)}
27      ${form.csrf_token()}
28
29        <fieldset>
30            <p>
31                <label for="email" i18n:translate="">Email address:</label>
32                ${form.errorlist('email')}
33                ${form.text('email')}
34            </p>
35            <p>
36                <label for="nickname" i18n:translate="">Nickname:</label>
37                ${form.errorlist('nickname')}
38                ${form.text('nickname')}
39            </p>
40        </fieldset>
41
42        <fieldset>
43            <p>
44                <tal:c tal:condition="getattr(context, 'picture', None)">
45
46                    <label for="current_picture" i18n:translate="">
47                        Current picture:</label>
48                    <img id="current_picture" tal:attributes="src request.resource_path(context, 'picture')" width="150">
49                </tal:c>
50                <label for="picture" i18n:translate="">
51                    Picture (jpg, jpeg, png or gif):</label>
52                ${form.errorlist('picture')}
53                ${form.file('picture')}
54            </p>
55        </fieldset>
56
57        <fieldset>
58            <p>
59                <label for="firstname" i18n:translate="">First name:</label>
60                ${form.errorlist('firstname')}
61                ${form.text('firstname')}
62            </p>
63            <p>
64                <label for="lastname" i18n:translate="">Last name:</label>
65                ${form.errorlist('lastname')}
66                ${form.text('lastname')}
67            </p>
68        </fieldset>
69
70        <fieldset>
71            <p>
72                <label for="gender" i18n:translate="">Gender:</label>
73                ${form.errorlist('gender')}
74                ${form.select('gender', ['male', 'female'])}
75            </p>
76            <p>
77                <label for="birth_date" i18n:translate="">Birth date:</label>
78                ${form.errorlist('birth_date')}
79                ${form.date('birth_date', date_format='%d/%m/%Y')}
80            </p>
81            <p>
82                <label for="height" i18n:translate="">Height (meters):</label>
83                ${form.errorlist('height')}
84                ${form.text('height')}
85            </p>
86            <p>
87                <label for="weight" i18n:translate="">Weight (kg):</label>
88                ${form.errorlist('weight')}
89                ${form.text('weight')}
90            </p>
91        </fieldset>
92
93        <fieldset>
94            <p>
95                <label for="bio" i18n:translate="">Bio/About you:</label>
96                ${form.errorlist('bio')}
97                ${form.textarea('bio', rows=10, cols=50)}
98            </p>
99        </fieldset>
100
101        <fieldset>
102            <p>
103                <label for="timezone" i18n:translate="">Timezone:</label>
104                <small i18n:translate="">
105                    All dates and times will be formatted for this timezone
106                </small>
107                ${form.errorlist('timezone')}
108                ${form.select('timezone', timezones)}
109            </p>
110        </fieldset>
111
112        <p>
113            ${form.submit("submit", "Save",  **{'class':"button button-normal"})}
114            <a href="" class="button button-important"
115               tal:attributes="href request.resource_url(context, 'profile')"
116               i18n:translate="">Cancel</a>
117        </p>
118        ${form.end()}
119    </div>
120
121  </metal:content>
122
123  <metal:body-js metal:fill-slot="body-js">
124      <script src="${request.static_url('ow:static/components/pickadate/picker.js')}"></script>
125      <script src="${request.static_url('ow:static/components/pickadate/picker.date.js')}"></script>
126      <script type="text/javascript">
127       $(document).ready(function() {
128           var today = new Date();
129           var first_year = new Date();
130           // start 100 years ago, should be enough for birth date
131           first_year.setMonth(first_year.getMonth() - 1200);
132           $('#birth_date').pickadate({
133               format: 'dd/mm/yyyy',
134               formatSubmit: 'dd/mm/yyyy',
135               selectMonths: true,
136               selectYears: 100,
137               min: first_year,
138               max: today
139           });
140       });
141      </script>
142  </metal:body-js>
143
144</html>
Note: See TracBrowser for help on using the repository browser.