track progress

resources/layouts/layouts.xml

@@ -5,7 +5,7 @@
         <drawable class="HeartRate" id="HeartRate">
             <param name="y">64</param>
         </drawable>
-        <drawable class="Stamina" />
+        <!-- drawable class="Stamina" /-->
         <drawable class="Track" />
 
         <!-- hr labels -->

source/RepaFieldStamina.mc

@@ -2,6 +2,8 @@ import Toybox.Application;
 import Toybox.Graphics;
 import Toybox.WatchUi;
 
+// TODO: stamina not supported yet in the API
+
 class Stamina extends WatchUi.Drawable {
 
     function initialize() {

source/RepaFieldTrack.mc

@@ -1,18 +1,76 @@
 import Toybox.Application;
 import Toybox.Graphics;
 import Toybox.WatchUi;
+import Toybox.Lang;
 
 class Track extends WatchUi.Drawable {
 
+    hidden var _toDestination as Float;
+    hidden var _distance as Float;
+    hidden var _offCourse as Float;
+
     function initialize() {
         var dictionary = {
             :identifier => "Track"
         };
 
         Drawable.initialize(dictionary);
+
+        _toDestination = 0.0f;
+        _distance = 0.0f;
+        _offCourse = 0.0f;
+    }
+
+    function setToDestination(tdst as Float) as Void {
+        _toDestination = tdst;
+    }
+
+    function setDistance(dst as Float) as Void {
+        _distance = dst;
+    }
+
+    function setOffCourse(off as Float) as Void {
+        _offCourse = off;
     }
 
     function draw(dc as Dc) as Void {
-        dc.setColor(0xFF8800, Graphics.COLOR_TRANSPARENT);
+        if (_toDestination == 0.0f) {
+            return;
+        }
+
+        var trackPercentage = _distance / (_distance + _toDestination);
+        if (trackPercentage > 1.0f) {
+            trackPercentage = 1.0f;
+        }
+
+        // draw
+        var w = dc.getWidth();
+        var h = dc.getHeight();
+        var astart = 150;
+        var aend = 390;
+        dc.setPenWidth(4);
+        dc.setColor(0x555555, Graphics.COLOR_TRANSPARENT);
+        dc.drawArc(w / 2, h / 2, w / 2 - 2, Graphics.ARC_COUNTER_CLOCKWISE, astart, aend);
+
+        if (trackPercentage <= 0.0f) {
+            return;
+        }
+
+        // color
+        if (_offCourse > 50.0f) {
+            dc.setColor(0xFF0000, Graphics.COLOR_TRANSPARENT);
+        } else if (trackPercentage < 0.2) {
+            dc.setColor(0xFFFF00, Graphics.COLOR_TRANSPARENT);
+        } else if (trackPercentage < 0.4) {
+            dc.setColor(0xAAFF00, Graphics.COLOR_TRANSPARENT);
+        } else if (trackPercentage < 0.6) {
+            dc.setColor(0x88FF00, Graphics.COLOR_TRANSPARENT);
+        } else if (trackPercentage < 0.8) {
+            dc.setColor(0x44FF00, Graphics.COLOR_TRANSPARENT);
+        } else {
+            dc.setColor(0x00FF00, Graphics.COLOR_TRANSPARENT);
+        }
+
+        dc.drawArc(w / 2, h / 2, w / 2 - 2, Graphics.ARC_COUNTER_CLOCKWISE, astart, astart + (aend-astart) * trackPercentage);
     }
 }

source/RepaFieldView.mc

@@ -3,6 +3,8 @@ import Toybox.Graphics;
 import Toybox.Lang;
 import Toybox.UserProfile;
 import Toybox.WatchUi;
+// TODO remove
+import Toybox.System;
 
 class RepaFieldView extends WatchUi.DataField {
 
@@ -10,6 +12,9 @@ class RepaFieldView extends WatchUi.DataField {
     hidden var ahrValue as Numeric;
     hidden var mhrValue as Numeric;
     hidden var hrZones as Array<Numeric>;
+    hidden var toDestination as Float;
+    hidden var distance as Float;
+    hidden var offCourse as Float;
 
     function initialize() {
         DataField.initialize();
@@ -17,6 +22,9 @@ class RepaFieldView extends WatchUi.DataField {
         ahrValue = 0;
         mhrValue = 0;
         hrZones = UserProfile.getHeartRateZones(UserProfile.getCurrentSport());
+        toDestination = 0.0f;
+        distance = 0.0f;
+        offCourse = 0.0f;
     }
 
     function calculateHRColor(hr as Numeric) as Numeric {
@@ -39,6 +47,16 @@ class RepaFieldView extends WatchUi.DataField {
         return hrColor;
     }
 
+    function darken(color as Numeric) as Numeric {
+        var r = (color >> 16) & 0xFF;
+        var g = (color >> 8) & 0xFF;
+        var b = color & 0xFF;
+        r = r * 0.5f;
+        g = g * 0.5f;
+        b = b * 0.5f;
+        return (r.toLong() << 16) | (g.toLong() << 8) | b.toLong();
+    }
+
     // Set your layout here. Anytime the size of obscurity of
     // the draw context is changed this will be called.
     function onLayout(dc as Dc) as Void {
@@ -91,6 +109,27 @@ class RepaFieldView extends WatchUi.DataField {
                 mhrValue = 0;
             }
         }
+        if (info has :elapsedDistance) {
+            if (info.elapsedDistance != null) {
+                distance = info.elapsedDistance as Float;
+            } else {
+                distance = 0.0f;
+            }
+        }
+        if (info has :distanceToDestination) {
+            if (info.distanceToDestination != null) {
+                toDestination = info.distanceToDestination as Float;
+            } else {
+                toDestination = 0.0f;
+            }
+        }
+        if (info has :offCourseDistance) {
+            if (info.offCourseDistance != null) {
+                offCourse = info.offCourseDistance as Float;
+            } else {
+                offCourse = 0.0f;
+            }
+        }
     }
 
     // Display the value you computed here. This will be called
@@ -102,16 +141,28 @@ class RepaFieldView extends WatchUi.DataField {
         // HR value
         var hrColor = calculateHRColor(hrValue);
         var hr = View.findDrawableById("hr") as Text;
-        hr.setColor(hrColor);
+        hr.setColor(calculateHRColor(hrValue));
         hr.setText(hrValue.format("%d"));
         var ahr = View.findDrawableById("ahr") as Text;
+        ahr.setColor(darken(calculateHRColor(ahrValue)));
         ahr.setText(ahrValue.format("%d"));
         var mhr = View.findDrawableById("mhr") as Text;
+        mhr.setColor(darken(calculateHRColor(mhrValue)));
         mhr.setText(mhrValue.format("%d"));
         var hrGraph = View.findDrawableById("HeartRate") as HeartRate;
+        if (hrGraph != null) {
             hrGraph.setHRColor(hrColor);
             hrGraph.setHRZones(hrZones);
             hrGraph.setHRValue(hrValue);
+        }
+
+        // track
+        var track = View.findDrawableById("Track") as Track;
+        if (track != null) {
+            track.setToDestination(toDestination);
+            track.setDistance(distance);
+            track.setOffCourse(offCourse);
+        }
 
         // Set the foreground color and value
         var value = View.findDrawableById("value") as Text;