first version of charts in newhome (regatta rank)

java/com.sap.sailing.gwt.ui/Home.html

@@ -28,6 +28,13 @@
     <!--                                           -->
     <script type="text/javascript" src="com.sap.sailing.gwt.Home/com.sap.sailing.gwt.Home.nocache.js"></script>
     <script type="text/javascript" src="js/newhome/idangerous.swiper.js"></script>
+    
+    <script type="text/javascript" src="js/jquery-1.5.2.min.js"></script>
+    <script type="text/javascript" src="highcharts/js/highcharts.js"></script>
+
+    <!-- Optionally, add a highcharts theme file -->
+	<script type="text/javascript" src="highcharts/js/themes/grid.js"></script>
+    
   </head>
 
   <!--                                           -->

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/i18n/TextMessages.java

@@ -29,6 +29,7 @@ public interface TextMessages extends Messages {
     String errorMessageNoSuchLeaderboard();
     String raceNotScheduled();
     String regattaDetails();
+    String regatta();
     
     String countdownDays();
     String countdownHours();

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/i18n/TextMessages.properties

@@ -21,6 +21,7 @@ errorMessageLoadingData=An error occured while loading the data for this page.
 errorMessageNoSuchLeaderboard=Could not find a leaderboard with this name.
 raceNotScheduled=Not scheduled.
 regattaDetails=Regatta details
+regatta=Regatta
 
 countdownDays=Days
 countdownHours=Hrs

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/i18n/TextMessages_de.properties

@@ -20,7 +20,8 @@ reloadPage=Seite neu laden
 errorMessageLoadingData=Beim Laden der Daten für diese Seite ist ein Fehler aufgetreten.
 errorMessageNoSuchLeaderboard=Es wurde keine Ergebnisliste mit diesem Namen gefunden.
 raceNotScheduled=Keine Startzeit bekannt
-regattaDetails=Regatta anzeigen 
+regattaDetails=Regatta anzeigen
+regatta=Regatta
 
 countdownDays=Tage
 countdownHours=Std.

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/leaderboard/AbstractLeaderboardViewer.java

@@ -1,64 +1,109 @@
 package com.sap.sailing.gwt.home.client.shared.leaderboard;
 
-import com.google.gwt.dom.client.Style;
-import com.google.gwt.event.dom.client.ClickEvent;
-import com.google.gwt.event.dom.client.ClickHandler;
-import com.google.gwt.user.client.ui.Button;
-import com.google.gwt.user.client.ui.SimplePanel;
+import com.sap.sailing.domain.common.DetailType;
+import com.sap.sailing.domain.common.RaceIdentifier;
 import com.sap.sailing.gwt.ui.client.CompetitorSelectionModel;
 import com.sap.sailing.gwt.ui.client.DebugIdHelper;
+import com.sap.sailing.gwt.ui.client.ErrorReporter;
+import com.sap.sailing.gwt.ui.client.SailingServiceAsync;
 import com.sap.sailing.gwt.ui.client.StringMessages;
+import com.sap.sailing.gwt.ui.client.shared.charts.MultiCompetitorLeaderboardChart;
+import com.sap.sailing.gwt.ui.client.shared.charts.MultiCompetitorLeaderboardChartSettings;
 import com.sap.sailing.gwt.ui.client.shared.components.Component;
 import com.sap.sailing.gwt.ui.client.shared.components.SettingsDialog;
 import com.sap.sailing.gwt.ui.leaderboard.LeaderboardPanel;
+import com.sap.sailing.gwt.ui.leaderboard.LeaderboardSettings;
 import com.sap.sse.gwt.client.async.AsyncActionsExecutor;
 import com.sap.sse.gwt.client.player.Timer;
+import com.sap.sse.gwt.client.useragent.UserAgentDetails;
 
 /**
- * A base class for a leaderboard viewer.
+ * A base class for a viewer managing data on the regatta level (like leaderboard, regatta rank, etc.)
  * 
  * @author Frank Mittag (c163874)
  */
-public abstract class AbstractLeaderboardViewer extends SimplePanel {
-    private final LeaderboardPanel leaderboardPanel;
+public abstract class AbstractLeaderboardViewer {
+    private LeaderboardPanel leaderboardPanel;
+    private MultiCompetitorLeaderboardChart multiCompetitorChart;
+
     protected final CompetitorSelectionModel competitorSelectionProvider;
     protected final AsyncActionsExecutor asyncActionsExecutor;
-
+    protected final ErrorReporter errorReporter;
+    protected final UserAgentDetails userAgent;
+    protected final SailingServiceAsync sailingService;
+    
     protected final Timer timer;
 
-    public AbstractLeaderboardViewer(CompetitorSelectionModel competitorSelectionProvider, AsyncActionsExecutor asyncActionsExecutor,
-            Timer timer, LeaderboardPanel leaderboardPanel) {
-        this.competitorSelectionProvider = competitorSelectionProvider;
-        this.leaderboardPanel = leaderboardPanel;
+    public AbstractLeaderboardViewer(final SailingServiceAsync sailingService, AsyncActionsExecutor asyncActionsExecutor, Timer timer, ErrorReporter errorReporter, UserAgentDetails userAgent) {
+        this.competitorSelectionProvider = new CompetitorSelectionModel(/* hasMultiSelection */true);
+        this.sailingService = sailingService;
         this.asyncActionsExecutor = asyncActionsExecutor;
         this.timer = timer;
+        this.errorReporter = errorReporter;
+        this.userAgent = userAgent;
+        this.leaderboardPanel = null;
+        this.multiCompetitorChart = null;
+    }
+
+    public LeaderboardPanel createLeaderboardPanel(final LeaderboardSettings leaderboardSettings, final RaceIdentifier preselectedRace,
+            final String leaderboardGroupName, String leaderboardName, boolean showRaceDetails, 
+            boolean autoExpandLastRaceColumn) {
+        if(leaderboardPanel == null) {
+            leaderboardPanel = new LeaderboardPanel(sailingService, asyncActionsExecutor, leaderboardSettings, true, preselectedRace,
+                    competitorSelectionProvider, timer, leaderboardGroupName, leaderboardName, errorReporter,
+                    StringMessages.INSTANCE, userAgent, showRaceDetails, /* competitorSearchTextBox */ null, /* showSelectionCheckbox */ true, /* raceTimesInfoProvider */null, autoExpandLastRaceColumn, /* adjustTimerDelay */
+                    true, false, false);
+        }
+        return leaderboardPanel;
+    }
+
+    public MultiCompetitorLeaderboardChart createMultiCompetitorChart(String leaderboardName, DetailType chartDetailType) {
+        if(multiCompetitorChart == null) {
+            multiCompetitorChart = new MultiCompetitorLeaderboardChart(sailingService, asyncActionsExecutor, leaderboardName, chartDetailType,
+                    competitorSelectionProvider, timer, StringMessages.INSTANCE, errorReporter);
+            multiCompetitorChart.setVisible(false); 
+        }
+        return multiCompetitorChart;
     }
     
     public LeaderboardPanel getLeaderboardPanel() {
         return leaderboardPanel;
     }
 
-    protected <SettingsType> void addComponentToNavigationMenu(final Component<SettingsType> component, boolean isCheckboxEnabled, 
-            String componentDisplayName, final boolean hasSettingsWhenComponentIsInvisible) {
-        final String componentName = componentDisplayName != null ? componentDisplayName : component.getLocalizedShortName();
-        final String debugIdPrefix = DebugIdHelper.createDebugId(componentName);
-        final Button settingsButton = new Button("");
-        settingsButton.ensureDebugId(debugIdPrefix + "SettingsButton");
-        if (component.hasSettings()) {
-            settingsButton.addClickHandler(new ClickHandler() {
-                @Override
-                public void onClick(ClickEvent event) {
-                    SettingsDialog<SettingsType> dialog = new SettingsDialog<SettingsType>(component,
-                            StringMessages.INSTANCE);
-                    dialog.ensureDebugId(debugIdPrefix + "SettingsDialog");
-                    dialog.show();
-                }
-            });
-        }
-        settingsButton.setEnabled(component.hasSettings() && hasSettingsWhenComponentIsInvisible);
-//        settingsButton.addStyleName(STYLE_VIEWER_TOOLBAR_SETTINGS_BUTTON);
-        settingsButton.getElement().getStyle().setFloat(Style.Float.LEFT);
-        settingsButton.setTitle(StringMessages.INSTANCE.settingsForComponent(componentName));
+    public MultiCompetitorLeaderboardChart getMultiCompetitorChart() {
+        return multiCompetitorChart;
     }
+
+    public void showCompetitorChart(DetailType chartDetailType) {
+        MultiCompetitorLeaderboardChart multiCompetitorChart = getMultiCompetitorChart();
+        MultiCompetitorLeaderboardChartSettings settings = new MultiCompetitorLeaderboardChartSettings(chartDetailType);
+        multiCompetitorChart.updateSettings(settings);
+        multiCompetitorChart.setVisible(true);
+        timer.addTimeListener(multiCompetitorChart);
+        multiCompetitorChart.timeChanged(timer.getTime(), null);
+    }
+
+    public void hideCompetitorChart() {
+        MultiCompetitorLeaderboardChart multiCompetitorChart = getMultiCompetitorChart();
+        multiCompetitorChart.setVisible(false);
+        timer.removeTimeListener(multiCompetitorChart);
+    }
+
+    public void showLeaderboardSettingsDialog() {
+        showComponentSettingsDialog(leaderboardPanel, null);
+    }
+    
+    public void showChartSettingsDialog() {
+        showComponentSettingsDialog(multiCompetitorChart, null);
+    }
+    
+    protected <SettingsType> void showComponentSettingsDialog(final Component<SettingsType> component, String componentDisplayName) {
+        String componentName = componentDisplayName != null ? componentDisplayName : component.getLocalizedShortName();
+        String debugIdPrefix = DebugIdHelper.createDebugId(componentName);
+        SettingsDialog<SettingsType> dialog = new SettingsDialog<SettingsType>(component, StringMessages.INSTANCE);
+        dialog.ensureDebugId(debugIdPrefix + "SettingsDialog");
+        dialog.show();
+    }
+
 }
 

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/leaderboard/LeaderboardViewer.java

@@ -1,79 +1,48 @@
 package com.sap.sailing.gwt.home.client.shared.leaderboard;
 
-import java.util.List;
-
-import com.google.gwt.user.client.rpc.AsyncCallback;
-import com.google.gwt.user.client.ui.FlowPanel;
-import com.sap.sailing.domain.common.RaceIdentifier;
-import com.sap.sailing.gwt.ui.client.CompetitorSelectionModel;
 import com.sap.sailing.gwt.ui.client.ErrorReporter;
 import com.sap.sailing.gwt.ui.client.SailingServiceAsync;
-import com.sap.sailing.gwt.ui.client.StringMessages;
-import com.sap.sailing.gwt.ui.leaderboard.LeaderboardPanel;
-import com.sap.sailing.gwt.ui.leaderboard.LeaderboardSettings;
 import com.sap.sse.gwt.client.async.AsyncActionsExecutor;
-import com.sap.sse.gwt.client.async.MarkedAsyncCallback;
 import com.sap.sse.gwt.client.player.Timer;
 import com.sap.sse.gwt.client.useragent.UserAgentDetails;
 
 /**
- * A viewer for a single leaderboard and a leaderboard chart.
+ * A viewer for a single leaderboard, a ranks or total points chart.
  * @author Frank Mittag (c163874)
  *
  */
 public class LeaderboardViewer extends AbstractLeaderboardViewer {
-    private LeaderboardPanel overallLeaderboardPanel;
+//    private LeaderboardPanel overallLeaderboardPanel;
     
     public LeaderboardViewer(final SailingServiceAsync sailingService, final AsyncActionsExecutor asyncActionsExecutor,
-            final Timer timer, final LeaderboardSettings leaderboardSettings, final RaceIdentifier preselectedRace,
-            final String leaderboardGroupName, String leaderboardName, final ErrorReporter errorReporter,
-            final UserAgentDetails userAgent, boolean showRaceDetails, 
-            boolean autoExpandLastRaceColumn, boolean showOverallLeaderboard) {
-        this(new CompetitorSelectionModel(/* hasMultiSelection */true), sailingService, asyncActionsExecutor, timer,
-                leaderboardSettings, preselectedRace, leaderboardGroupName, leaderboardName, errorReporter,
-                userAgent, showRaceDetails, autoExpandLastRaceColumn, showOverallLeaderboard);
-    }
-
-    private LeaderboardViewer(CompetitorSelectionModel competitorSelectionModel,
-            final SailingServiceAsync sailingService, final AsyncActionsExecutor asyncActionsExecutor,
-            final Timer timer, final LeaderboardSettings leaderboardSettings, final RaceIdentifier preselectedRace,
-            final String leaderboardGroupName, String leaderboardName, final ErrorReporter errorReporter,
-            final UserAgentDetails userAgent, boolean showRaceDetails,
-            boolean autoExpandLastRaceColumn, boolean showOverallLeaderboard) {
-        super(competitorSelectionModel, asyncActionsExecutor, timer, new LeaderboardPanel(
-                sailingService, asyncActionsExecutor, leaderboardSettings, true, preselectedRace,
-                competitorSelectionModel, timer, leaderboardGroupName, leaderboardName, errorReporter,
-                StringMessages.INSTANCE, userAgent, showRaceDetails, /* competitorSearchTextBox */ null, /* showSelectionCheckbox */ true, /* raceTimesInfoProvider */null, autoExpandLastRaceColumn, /* adjustTimerDelay */
-                true, false, false));
-        final FlowPanel mainPanel = new FlowPanel();
-        setWidget(mainPanel);
-
-        mainPanel.add(getLeaderboardPanel());
-
-        overallLeaderboardPanel = null;
-        if(showOverallLeaderboard) {
-            sailingService.getOverallLeaderboardNamesContaining(leaderboardName, new MarkedAsyncCallback<List<String>>(
-                    new AsyncCallback<List<String>>() {
-                        @Override
-                        public void onSuccess(List<String> result) {
-                            if(result.size() == 1) {
-                                String overallLeaderboardName = result.get(0);
-                                overallLeaderboardPanel = new LeaderboardPanel(sailingService, asyncActionsExecutor,
-                                        leaderboardSettings, true, preselectedRace, competitorSelectionProvider, timer,
-                                        leaderboardGroupName, overallLeaderboardName, errorReporter, StringMessages.INSTANCE, userAgent,
-                                        false, /* competitorSearchTextBox */ null, /* showSelectionCheckbox */ true, /* raceTimesInfoProvider */null, false, 
-                                        /* adjustTimerDelay */ true, /*autoApplyTopNFilter*/false, false);
-                                mainPanel.add(overallLeaderboardPanel);
-                                addComponentToNavigationMenu(overallLeaderboardPanel, true, StringMessages.INSTANCE.seriesLeaderboard(),
-                                        /* hasSettingsWhenComponentIsInvisible*/ true);
-                            }
-                        }
-                        
-                        @Override
-                        public void onFailure(Throwable caught) {
-                            // DO NOTHING
-                        }
-            }));
-        }
+            final Timer timer, final ErrorReporter errorReporter, final UserAgentDetails userAgent) {
+        super(sailingService, asyncActionsExecutor, timer, errorReporter, userAgent);
+        
+//        overallLeaderboardPanel = null;
+//        if(showOverallLeaderboard) {
+//            sailingService.getOverallLeaderboardNamesContaining(leaderboardName, new MarkedAsyncCallback<List<String>>(
+//                    new AsyncCallback<List<String>>() {
+//                        @Override
+//                        public void onSuccess(List<String> result) {
+//                            if(result.size() == 1) {
+//                                String overallLeaderboardName = result.get(0);
+//                                overallLeaderboardPanel = new LeaderboardPanel(sailingService, asyncActionsExecutor,
+//                                        leaderboardSettings, true, preselectedRace, competitorSelectionProvider, timer,
+//                                        leaderboardGroupName, overallLeaderboardName, errorReporter, StringMessages.INSTANCE, userAgent,
+//                                        false, /* competitorSearchTextBox */ null, /* showSelectionCheckbox */ true, /* raceTimesInfoProvider */null, false, 
+//                                        /* adjustTimerDelay */ true, /*autoApplyTopNFilter*/false, false);
+//                                mainPanel.add(overallLeaderboardPanel);
+//                                addComponentToNavigationMenu(overallLeaderboardPanel, true, StringMessages.INSTANCE.seriesLeaderboard(),
+//                                        /* hasSettingsWhenComponentIsInvisible*/ true);
+//                            }
+//                        }
+//                        
+//                        @Override
+//                        public void onFailure(Throwable caught) {
+//                            // DO NOTHING
+//                        }
+//            }));
+//        }
     }
+    
 }

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/leaderboard/MetaLeaderboardViewer.java

@@ -1,13 +1,10 @@
 package com.sap.sailing.gwt.home.client.shared.leaderboard;
 
-import com.google.gwt.user.client.ui.FlowPanel;
 import com.google.gwt.user.client.ui.Label;
 import com.sap.sailing.domain.common.RaceIdentifier;
-import com.sap.sailing.gwt.ui.client.CompetitorSelectionModel;
 import com.sap.sailing.gwt.ui.client.ErrorReporter;
 import com.sap.sailing.gwt.ui.client.SailingServiceAsync;
 import com.sap.sailing.gwt.ui.client.StringMessages;
-import com.sap.sailing.gwt.ui.leaderboard.LeaderboardPanel;
 import com.sap.sailing.gwt.ui.leaderboard.LeaderboardSettings;
 import com.sap.sailing.gwt.ui.leaderboard.MultiLeaderboardPanel;
 import com.sap.sse.gwt.client.async.AsyncActionsExecutor;
@@ -22,38 +19,35 @@ import com.sap.sse.gwt.client.useragent.UserAgentDetails;
  * @author Axel Uhl (d043530)
  */
 public class MetaLeaderboardViewer extends AbstractLeaderboardViewer {    
-    private final MultiLeaderboardPanel multiLeaderboardPanel;
+    private MultiLeaderboardPanel multiLeaderboardPanel;
     
-    public MetaLeaderboardViewer(SailingServiceAsync sailingService, AsyncActionsExecutor asyncActionsExecutor, 
-            Timer timer, LeaderboardSettings leaderboardSettings, String preselectedLeaderboardName, RaceIdentifier preselectedRace,
-            String leaderboardGroupName, String metaLeaderboardName, ErrorReporter errorReporter,
-            UserAgentDetails userAgent, boolean showRaceDetails, 
-            boolean autoExpandLastRaceColumn, boolean showSeriesLeaderboards) {
-        this(new CompetitorSelectionModel(/* hasMultiSelection */true), sailingService, asyncActionsExecutor,  timer,
-                leaderboardSettings, preselectedLeaderboardName, preselectedRace, leaderboardGroupName, metaLeaderboardName,
-                errorReporter, userAgent, showRaceDetails, autoExpandLastRaceColumn, showSeriesLeaderboards);
-    }
-    
-    private MetaLeaderboardViewer(CompetitorSelectionModel competitorSelectionModel, SailingServiceAsync sailingService,
-            AsyncActionsExecutor asyncActionsExecutor, Timer timer, LeaderboardSettings leaderboardSettings,
-            String preselectedLeaderboardName, RaceIdentifier preselectedRace, String leaderboardGroupName,
-            String metaLeaderboardName, ErrorReporter errorReporter, 
-            UserAgentDetails userAgent, boolean showRaceDetails, boolean autoExpandLastRaceColumn, boolean showSeriesLeaderboards) {
-        super(competitorSelectionModel, asyncActionsExecutor,  timer, new LeaderboardPanel(sailingService, asyncActionsExecutor,
-                        leaderboardSettings, true, preselectedRace, competitorSelectionModel, timer,
-                        leaderboardGroupName, metaLeaderboardName, errorReporter, StringMessages.INSTANCE, userAgent,
-                        showRaceDetails, /* competitorSearchTextBox */ null, /* showSelectionCheckbox */ true, /* raceTimesInfoProvider */null, autoExpandLastRaceColumn, 
-                        /* adjustTimerDelay */ true, /*autoApplyTopNFilter*/false, false));
-        final FlowPanel mainPanel = new FlowPanel();
-        setWidget(mainPanel);
+    public MetaLeaderboardViewer(SailingServiceAsync sailingService,
+            AsyncActionsExecutor asyncActionsExecutor, Timer timer, ErrorReporter errorReporter, UserAgentDetails userAgent) {
+        super(sailingService, asyncActionsExecutor, timer, errorReporter, userAgent);
+        
+//        new LeaderboardPanel(sailingService, asyncActionsExecutor,
+//                leaderboardSettings, true, preselectedRace, competitorSelectionModel, timer,
+//                leaderboardGroupName, metaLeaderboardName, errorReporter, StringMessages.INSTANCE, userAgent,
+//                showRaceDetails, /* competitorSearchTextBox */ null, /* showSelectionCheckbox */ true, /* raceTimesInfoProvider */null, autoExpandLastRaceColumn, 
+//                /* adjustTimerDelay */ true, /*autoApplyTopNFilter*/false, false)
+        
         final Label overallStandingsLabel = new Label(StringMessages.INSTANCE.overallStandings());
         overallStandingsLabel.setStyleName("leaderboardHeading");
-        multiLeaderboardPanel = new MultiLeaderboardPanel(sailingService, metaLeaderboardName, asyncActionsExecutor, timer,
-                preselectedLeaderboardName, preselectedRace, errorReporter, StringMessages.INSTANCE,
-                userAgent, showRaceDetails, autoExpandLastRaceColumn);
-        multiLeaderboardPanel.setVisible(showSeriesLeaderboards);
-        mainPanel.add(getLeaderboardPanel());
-        mainPanel.add(multiLeaderboardPanel);
+    
+    }
+    
+    public MultiLeaderboardPanel createMetaLeaderboardPanel(LeaderboardSettings leaderboardSettings,
+            String preselectedLeaderboardName, RaceIdentifier preselectedRace, String leaderboardGroupName,
+            String metaLeaderboardName, boolean showRaceDetails, boolean autoExpandLastRaceColumn) {
+        if(multiLeaderboardPanel == null) {
+            multiLeaderboardPanel = new MultiLeaderboardPanel(sailingService, metaLeaderboardName, asyncActionsExecutor, timer,
+                    preselectedLeaderboardName, preselectedRace, errorReporter, StringMessages.INSTANCE,
+                    userAgent, showRaceDetails, autoExpandLastRaceColumn);
+        }
+        return multiLeaderboardPanel;
     }
 
+    public MultiLeaderboardPanel getMultiLeaderboardPanel() {
+        return multiLeaderboardPanel;
+    }
 }

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/leaderboard/OldLeaderboardPanel.java

@@ -16,6 +16,7 @@ import com.google.gwt.user.client.ui.Composite;
 import com.google.gwt.user.client.ui.HTMLPanel;
 import com.google.gwt.user.client.ui.ScrollPanel;
 import com.google.gwt.user.client.ui.Widget;
+import com.sap.sailing.domain.common.DetailType;
 import com.sap.sailing.domain.common.RaceIdentifier;
 import com.sap.sailing.domain.common.dto.FleetDTO;
 import com.sap.sailing.domain.common.dto.LeaderboardDTO;
@@ -98,14 +99,17 @@ public class OldLeaderboardPanel extends Composite implements LeaderboardUpdateL
             final UserAgentDetails userAgent, boolean showRaceDetails,  
             boolean autoExpandLastRaceColumn, boolean showOverallLeaderboard) {
         this.autoRefreshTimer = timer;
-        leaderboardViewer = new LeaderboardViewer(sailingService, new AsyncActionsExecutor(),
-                timer, leaderboardSettings, preselectedRace, leaderboardGroupName, leaderboardName, errorReporter, 
-                userAgent, showRaceDetails, autoExpandLastRaceColumn, showOverallLeaderboard);
+        leaderboardViewer = new LeaderboardViewer(sailingService, asyncActionsExecutor, timer, errorReporter, userAgent);
+        leaderboardViewer.createLeaderboardPanel(leaderboardSettings, preselectedRace, leaderboardGroupName, leaderboardName, showRaceDetails, autoExpandLastRaceColumn);
+        leaderboardViewer.createMultiCompetitorChart(leaderboardName, DetailType.REGATTA_RANK);
 
         ScrollPanel contentScrollPanel = new ScrollPanel();
-        contentScrollPanel.setWidget(leaderboardViewer);
+        contentScrollPanel.setWidget(leaderboardViewer.getLeaderboardPanel());
         oldLeaderboardPanel.add(contentScrollPanel);
         leaderboardViewer.getLeaderboardPanel().addLeaderboardUpdateListener(this);
+        
+        ranksChartsPanel.add(leaderboardViewer.getMultiCompetitorChart());
+        leaderboardViewer.hideCompetitorChart();
     }
 
     public void createMetaLeaderboardViewer(SailingServiceAsync sailingService, AsyncActionsExecutor asyncActionsExecutor, 
@@ -114,13 +118,14 @@ public class OldLeaderboardPanel extends Composite implements LeaderboardUpdateL
             UserAgentDetails userAgent, boolean showRaceDetails,  
             boolean autoExpandLastRaceColumn, boolean showSeriesLeaderboards) {
         this.autoRefreshTimer = timer;
-        leaderboardViewer = new MetaLeaderboardViewer(sailingService, new AsyncActionsExecutor(),
-                timer, leaderboardSettings, null, preselectedRace, leaderboardGroupName, metaLeaderboardName, errorReporter,
-                userAgent, showRaceDetails, autoExpandLastRaceColumn, showSeriesLeaderboards);
+        leaderboardViewer = new MetaLeaderboardViewer(sailingService, asyncActionsExecutor, timer, errorReporter, userAgent);
+        leaderboardViewer.createLeaderboardPanel(leaderboardSettings, preselectedRace, leaderboardGroupName, metaLeaderboardName, showRaceDetails, autoExpandLastRaceColumn);
        
         ScrollPanel contentScrollPanel = new ScrollPanel();
-        contentScrollPanel.setWidget(leaderboardViewer);
+        contentScrollPanel.setWidget(leaderboardViewer.getLeaderboardPanel());
         oldLeaderboardPanel.add(contentScrollPanel);
+
+        leaderboardViewer.hideCompetitorChart();
     }
     
     @UiHandler("autoRefreshAnchor")
@@ -197,17 +202,19 @@ public class OldLeaderboardPanel extends Composite implements LeaderboardUpdateL
     @UiHandler("leaderboardAnchor")
     void leaderboardTabClicked(ClickEvent event) {
         setActiveTabPanel(leaderboardTabPanel, leaderboardAnchor);
+        leaderboardViewer.hideCompetitorChart();
     }
     
     @UiHandler("ranksChartAnchor")
     void ranksChartTabClicked(ClickEvent event) {
         setActiveTabPanel(ranksChartTabPanel, ranksChartAnchor);
-        
+        leaderboardViewer.showCompetitorChart(DetailType.REGATTA_RANK);
     }
 
     @UiHandler("pointsChartAnchor")
     void pointsChartTabClicked(ClickEvent event) {
         setActiveTabPanel(pointsChartTabPanel, pointsChartAnchor);
+        leaderboardViewer.showCompetitorChart(DetailType.REGATTA_TOTAL_POINTS);
     }
     
     private void setActiveTabPanel(HTMLPanel newActivePanel, Anchor newActiveAnchor) {

java/com.sap.sailing.gwt.ui/src/main/java/com/sap/sailing/gwt/home/client/shared/leaderboard/OldLeaderboardPanel.ui.xml

@@ -9,7 +9,14 @@
     <ui:with field="local_res2" type="com.sap.sailing.gwt.home.client.shared.leaderboard.OldLeaderboardResources" />
 	<g:HTMLPanel>
 		<s:header.CompactEventHeader ui:field='eventHeader'/>
-		<div class="{local_res2.css.regattanavigation}">
+		<div class="{res.mainCss.grid}">
+    		<div class="{res.mainCss.navbar}">
+			    <h3 class="{local_res.css.eventregattaleaderboard_meta_title}">
+			        <span style="color:darkgrey;"><ui:text from='{i18n.regatta}'/></span>
+			        <span ui:field="title"></span>
+			    </h3>
+    		</div>
+		</div>
 		  <div class="{res.mainCss.grid}">
     		<div class="{res.mainCss.navbar}">
     		    <g:Anchor ui:field="leaderboardAnchor" href="javascript:;" styleName="{res.mainCss.navbar_button}">Leaderboard</g:Anchor>
@@ -17,16 +24,9 @@
     		    <g:Anchor ui:field="pointsChartAnchor" href="javascript:;" styleName="{res.mainCss.navbar_button}">Points Chart</g:Anchor>
     		</div>
           </div>
-		</div>
 		<g:HTMLPanel ui:field="leaderboardTabPanel">
 			<!-- The leaderboard of a regatta-->
 			<div class="{res.mainCss.grid} {local_res.css.eventregattaleaderboard_meta}">
-			   <div class="{res.mediaCss.large12} {res.mediaCss.columns}">
-			    <h3 class="{local_res.css.eventregattaleaderboard_meta_title}">
-			        <span style="color:darkgrey;"><ui:text from='{i18n.leaderboard}'/></span>
-			        <span ui:field="title"></span>
-			    </h3>
-			  </div>
 			  <div class="{res.mediaCss.small9} {res.mediaCss.columns}">
 			    <div ui:field="lastScoringCommentDiv" class="{local_res.css.eventregattaleaderboard_meta_update}"></div>
 			    <div ui:field="lastScoringUpdateTimeDiv" class="{local_res.css.eventregattaleaderboard_meta_update}"></div>
@@ -45,7 +45,7 @@
 		<g:HTMLPanel ui:field="ranksChartTabPanel">
 			<div class="{res.mainCss.grid}">
 			   <div class="{res.mediaCss.large12} {res.mediaCss.columns}">
-			    <h3>Ranks Chart</h3>
+			    <h3>Total Ranks Chart</h3>
               	<g:HTMLPanel ui:field="ranksChartsPanel">
         		</g:HTMLPanel>
 			  </div>
@@ -54,7 +54,7 @@
 		<g:HTMLPanel ui:field="pointsChartTabPanel">
 			<div class="{res.mainCss.grid}">
 			   <div class="{res.mediaCss.large12} {res.mediaCss.columns}">
-			    <h3>Total points Chart</h3>
+			    <h3>Total Points Chart</h3>
               	<g:HTMLPanel ui:field="pointsChartsPanel">
         		</g:HTMLPanel>
 			  </div>