source: OpenWorkouts-current/ow/templates/workout.pt @ 5f05e83

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

Replaced Leaflet.Elevation with a newer, improved version (fork of the original)

Done some clean-up of the map javascript code, removed old tests and WIP code
that is not needed anymore.

IMPORTANT: After pulling this patch, run js_deps to install the new version of
leaflet elevation:

./bin/js_deps
  • Property mode set to 100644
File size: 6.2 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="">Workout details</tal:t>:
12    <tal:c tal:content="context.title"></tal:c>
13  </metal:head-title>
14
15  <metal:css metal:fill-slot="css">
16    <link rel="stylesheet" tal:condition="context.has_gpx"
17          href="${request.static_url('ow:static/components/Leaflet/leaflet.css')}" />
18    <link rel="stylesheet" tal:condition="context.has_gpx"
19          href="${request.static_url('ow:static/components/leaflet-elevation/leaflet-elevation.css')}" />
20    <link rel="stylesheet"
21          href="${request.static_url('ow:static/css/leaflet-elevation.css')}" />
22  </metal:css>
23
24  <metal:title metal:fill-slot="title">
25    <tal:t i18n:translate="">Workout details</tal:t>
26  </metal:title>
27
28  <metal:content metal:fill-slot="content">
29
30
31    <div class="workout-detail" id="workout">
32      <div class="workout-detail-resume">
33        <h3 tal:content="context.title"></h3>
34        <div id="" tal:content="context.notes"
35             tal:attributes="id 'workout-' + context.workout_id + '-notes'">
36        </div>
37        <ul class="workout-options">
38          <li>
39            <a href="" i18n:translate=""
40               tal:attributes="href request.resource_url(context, 'edit')">
41              edit workout
42            </a>
43          </li>
44          <li>
45            <a href="" i18n:translate=""
46               tal:attributes="href request.resource_url(context, 'update-from-file')">
47              update with tracking file
48            </a>
49          </li>
50          <li class="owo-del"><a href="" i18n:translate=""
51                                 tal:attributes="href request.resource_url(context, 'delete')">
52            delete
53          </a>
54          </li>
55        </ul>
56      </div>
57      <div class="workout-detail-info">
58        <ul id="" tal:attributes="id 'workout-' + context.workout_id + '-details'"
59            tal:define="hr context.hr; cad context.cad; atemp context.atemp; timezone context.owner.timezone">
60          <li class="important" tal:condition="context.distance">
61            <span><tal:t i18n:translate="">Distance</tal:t></span>
62            <tal:c tal:content="context.rounded_distance"></tal:c> km
63          </li>
64          <li class="important">
65            <span><tal:t i18n:translate="">Duration</tal:t></span>
66            <!--! use the properly formatted duration instead of the timedelta object -->
67            <tal:c tal:content="context._duration"></tal:c>
68          </li>
69          <li class="important">
70            <span><tal:t i18n:translate="">Start</tal:t></span>
71            <tal:c tal:content="context.start_in_timezone(timezone)"></tal:c>
72          </li>
73          <li tal:condition="context.speed">
74            <span><tal:t i18n:translate="">Speed</tal:t></span>
75            <span class="avg"><tal:t i18n:translate="">Avg.</tal:t>
76              <tal:c tal:content="round(context.speed['avg'], 1)"></tal:c>km/h</span>
77            <span class="max"><tal:t i18n:translate="">Max.</tal:t>
78              <tal:c tal:content="round(context.speed['max'], 1)"></tal:c>km/h</span>
79          </li>
80          <li tal:condition="hr">
81            <span><tal:t i18n:translate="">Heart Rate</tal:t></span>
82            <span class="avg"><tal:t i18n:translate="">Avg.</tal:t>
83              <tal:c tal:content="hr['avg']"></tal:c>bpm</span>
84            <span class="max"><tal:t i18n:translate="">Max.</tal:t>
85              <tal:c tal:content="hr['max']"></tal:c> bpm</span>
86          </li>
87          <li tal:condition="cad">
88            <span><tal:t i18n:translate="">Cadence</tal:t></span>
89            <span class="avg"><tal:t i18n:translate="">Avg.</tal:t>
90              <tal:c tal:content="cad['avg']"></tal:c></span>
91            <span class="max"><tal:t i18n:translate="">Max.</tal:t>
92              <tal:c tal:content="cad['max']"></tal:c></span>
93          </li>
94          <li tal:condition="atemp">
95            <span><tal:t i18n:translate="">Temperature</tal:t></span>
96            <span class="min"><tal:t i18n:translate="">Min.</tal:t>
97              <tal:c tal:content="atemp['min']"></tal:c>℃</span>
98            <span class="avg"><tal:t i18n:translate="">Avg.</tal:t>
99              <tal:c tal:content="atemp['avg']"></tal:c>℃</span>
100            <span class="max"><tal:t i18n:translate="">Max.</tal:t>
101              <tal:c tal:content="atemp['max']"></tal:c>℃</span>
102          </li>
103        </ul>
104        <div id="elevation"></div>
105      </div>
106    </div>
107
108    <!--! Track map -->
109    <div id="map" tal:condition="context.has_gpx"></div>
110  </metal:content>
111
112  <metal:body-js metal:fill-slot="body-js">
113
114    <script src="${request.static_url('ow:static/components/d3/d3.min.js')}"
115            tal:condition="context.has_gpx"></script>
116
117    <script src="${request.static_url('ow:static/components/Leaflet/leaflet.js')}"
118            tal:condition="context.has_gpx"></script>
119
120    <script src="${request.static_url('ow:static/components/leaflet-gpx/gpx.js')}"
121            tal:condition="context.has_gpx"></script>
122
123    <script src="${request.static_url('ow:static/components/leaflet-elevation/leaflet-elevation.js')}"
124            tal:condition="context.has_gpx"></script>
125
126    <script src="${request.static_url('ow:static/js/ow.js')}"
127            tal:condition="context.has_gpx"></script>
128
129    <script type="text/javascript" tal:condition="context.has_gpx">
130     var workout_map = owjs.map({
131         map_id: 'map',
132         latitude: ${start_point['latitude']},
133         longitude: ${start_point['longitude']},
134         zoom: 11,
135         gpx_url: '${request.resource_url(context, 'gpx')}',
136         start_icon: '${request.static_url('ow:static/components/leaflet-gpx/pin-icon-start.png')}',
137         end_icon: '${request.static_url('ow:static/components/leaflet-gpx/pin-icon-end.png')}',
138         shadow: '${request.static_url('ow:static/components/leaflet-gpx/pin-shadow.png')}',
139         elevation: true,
140         zoom_control: true
141     });
142     workout_map.render();
143    </script>
144  </metal:body-js>
145
146</html>
Note: See TracBrowser for help on using the repository browser.