Implemented the leg progress bar in the racelist view

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/regattaraces/EventRegattaRaces.gss

@@ -178,7 +178,7 @@
 .eventregattarace_legs_leg {
   display: inline-block;
   height: 10px;
-  width: 20px;
+  width: 10px;
   background-color: #ccc;
 }
 .eventregattarace_legs_leg[data-status*="finished"] {

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/regattaraces/EventRegattaRacesRace.java

@@ -48,6 +48,7 @@ public class EventRegattaRacesRace extends Composite {
 
     @UiField DivElement raceFeaturesDiv;
     @UiField DivElement legProgressDiv;
+    @UiField DivElement legProgressPanel;
     @UiField DivElement raceFlagDiv;
     @UiField DivElement windStatusDiv;
     
@@ -117,6 +118,12 @@ public class EventRegattaRacesRace extends Composite {
                     showElement(legProgressDiv);
                     currentLegNo.setInnerText(String.valueOf(race.trackedRaceStatistics.currentLegNo));
                     totalLegsCount.setInnerText(String.valueOf(race.trackedRaceStatistics.totalLegsCount));
+                    
+                    for(int i = 0; i < race.trackedRaceStatistics.totalLegsCount; i++) {
+                        boolean isLive = i <= race.trackedRaceStatistics.currentLegNo; 
+                        EventRegattaRacesRaceProgressItem item = new EventRegattaRacesRaceProgressItem(isLive);
+                        legProgressPanel.appendChild(item.getElement());
+                    }
                 }
                 if(race.trackedRaceStatistics.hasLeaderOrWinnerData && race.trackedRaceStatistics.leaderOrWinner != null) {
                     showElement(raceLeaderDiv);

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/regattaraces/EventRegattaRacesRace.ui.xml

@@ -28,8 +28,8 @@
       <ui:text from="{i18n.eventRegattaRaceLeader}"/><br></br><span ui:field="raceLeader" class="{local_res.css.eventregattarace_leader_name}"></span>
   </div>
   <div ui:field="legProgressDiv" class="{local_res.css.eventregattarace_details} {local_res.css.eventregattarace_legs}"><ui:text from='{i18n.leg}'/>&nbsp;<span ui:field="currentLegNo" />/<span ui:field="totalLegsCount" />
-    <div class="{local_res.css.eventregattarace_legs_list}">
-      <div data-status="r" class="{local_res.css.eventregattarace_legs_leg}"></div>
+    <div ui:field="legProgressPanel" class="{local_res.css.eventregattarace_legs_list}">
+      <!-- <div data-status="r" class="{local_res.css.eventregattarace_legs_leg}"></div>-->
     </div>
   </div>
   <div ui:field="raceFeaturesDiv" class="{local_res.css.eventregattarace_details} {local_res.css.eventregattarace_features}">

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/regattaraces/EventRegattaRacesRaceProgressItem.java

@@ -0,0 +1,39 @@
+package com.sap.sailing.gwt.home.client.place.event.regattaraces;
+
+import com.google.gwt.core.client.GWT;
+import com.google.gwt.dom.client.DivElement;
+import com.google.gwt.uibinder.client.UiBinder;
+import com.google.gwt.uibinder.client.UiField;
+import com.google.gwt.user.client.ui.UIObject;
+import com.sap.sailing.gwt.home.client.place.event.regatta.RegattaResources;
+
+public class EventRegattaRacesRaceProgressItem extends UIObject {
+    private static EventRegattaRacesRaceProgressItemUiBinder uiBinder = GWT.create(EventRegattaRacesRaceProgressItemUiBinder.class);
+
+    interface EventRegattaRacesRaceProgressItemUiBinder extends UiBinder<DivElement, EventRegattaRacesRaceProgressItem> {
+    }
+
+    private enum DataStatusEnum { 
+        FINISHED ("finished"), LIVE("running");
+        
+        private final String attributeValue; 
+        private static final String ATTRIBUTE_NAME = "data-status";
+        
+        DataStatusEnum(String attributeValue) {
+            this.attributeValue = attributeValue;
+        }
+    }
+    
+    @UiField DivElement legProgressItem;
+    
+    public EventRegattaRacesRaceProgressItem(boolean isLive) {
+        RegattaResources.INSTANCE.css().ensureInjected();
+
+        setElement(uiBinder.createAndBindUi(this));
+        
+        if(isLive) {
+            DataStatusEnum dataStatus = DataStatusEnum.LIVE;
+            legProgressItem.setAttribute(DataStatusEnum.ATTRIBUTE_NAME, dataStatus.attributeValue);
+        }
+    }
+}

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/place/event/regattaraces/EventRegattaRacesRaceProgressItem.ui.xml

@@ -0,0 +1,9 @@
+<!DOCTYPE ui:UiBinder SYSTEM "http://dl.google.com/gwt/DTD/xhtml.ent">
+<ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder"
+  xmlns:g="urn:import:com.google.gwt.user.client.ui"
+    xmlns:s="urn:import:com.sap.sailing.gwt.home.client.shared">
+    <ui:with field="i18n" type="com.sap.sailing.gwt.common.client.i18n.TextMessages"/>
+	<ui:with field="res" type="com.sap.sailing.gwt.common.client.SharedResources" />
+    <ui:with field="local_res" type="com.sap.sailing.gwt.home.client.place.event.regattaraces.EventRegattaRacesResources" />
+	<div ui:field="legProgressItem" class="{local_res.css.eventregattarace_legs_leg}"></div>
+</ui:UiBinder>