Changeset b3374f6 in OpenWorkouts-current for ow/templates

Timestamp:

Feb 12, 2019, 5:55:33 PM (5 years ago)

Author:

Borja Lopez <borja@…>

Branches:

current, feature/docs, master

Children:

c999b73e

Parents:

f713dbc

Message:

(#52) - Make map screenshot generation async and non-blocker of the dashboard
and user profile pages:

• workout.map_screenshot is a property again, returns a string with the static path (suitable for use with request.static_url()) for the map screenshot file if exists, none otherwise

• added a couple of helpers to build the proper screenshot name and full path on the filesystem

• added a view to generate the map if needed, returning the full static url to the screenshot file in a json-encoded stream

• added a new js ow tool that looks for workouts that still don't have a map screenshot, calling the view to generate that screenshot and updating the map screenshot when the file is ready

• modified the dashboard and user profile templates, so a dummy/placeholder image is shown when no map screenshot is yet ready, plus setup and calls for the js tool that generates the maps.

Location:

ow/templates

Files:

• dashboard.pt (modified) (2 diffs)
• profile.pt (modified) (2 diffs)

ow/templates/dashboard.pt

@@ -79 +79 @@
 
             <div class="workout-map" tal:condition="workout.has_gpx">
-                <a href="" tal:attributes="href request.resource_url(workout)">
-                    <img src="" tal:attributes="src workout.map_screenshot(request);
-                              alt workout.title; title workout.title">
-                </a>
+              <a href="" tal:attributes="href request.resource_url(workout)">
+                <tal:has-screenshot tal:condition="workout.map_screenshot is not None">
+                  <img src="" tal:attributes="src request.static_url(workout.map_screenshot);
+                            alt workout.title; title workout.title">
+                </tal:has-screenshot>
+                <tal:has-not-screenshot tal:condition="workout.map_screenshot is None">
+                  <img src="" tal:attributes="src request.static_url('ow:static/media/img/no_map.png');
+                            alt workout.title; title workout.title; class 'js-needs-map'">
+                </tal:has-not-screenshot>
+              </a>
             </div>
 
@@ -193 +199 @@
 
     <script type="text/javascript">
+
+     var map_shots = owjs.map_shots({
+         img_selector: 'img.js-needs-map',
+     })
+     map_shots.run();
+
      var week_chart = owjs.week_chart({
          chart_selector: 'div.js-week-stats svg',

ow/templates/profile.pt

@@ -144 +144 @@
               <div class="workout-map" tal:condition="workout.has_gpx">
                 <a href="" tal:attributes="href request.resource_url(workout)">
-                  <img src="" tal:attributes="src workout.map_screenshot(request);
-                            alt workout.title; title workout.title">
+                  <tal:has-screenshot tal:condition="workout.map_screenshot is not None">
+                    <img src="" tal:attributes="src request.static_url(workout.map_screenshot);
+                              alt workout.title; title workout.title">
+                  </tal:has-screenshot>
+                  <tal:has-not-screenshot tal:condition="workout.map_screenshot is None">
+                    <img src="" tal:attributes="src request.static_url('ow:static/media/img/no_map.png');
+                              alt workout.title; title workout.title; class 'js-needs-map'">
+                  </tal:has-not-screenshot>
                 </a>
               </div>
@@ -187 +193 @@
 
     <script type="text/javascript">
+     var map_shots = owjs.map_shots({
+         img_selector: 'img.js-needs-map',
+     })
+     map_shots.run();
+
      var y_axis_labels = {
          "distance": "Kilometers",