mirror of
https://github.com/eclipse-sailing-analytics/sailing-analytics.git
synced 2026-10-25 05:23:51 +00:00
seperate messages for different legends, bubble popup implemented
This commit is contained in:
1 parent
9a212e612a
commit
56cee73670
7 files changed
+75
-29
No files matched your search
+2
-3
@@ -38,9 +38,8 @@
|
||||
}
|
||||
</ui:style>
|
||||
<g:HTMLPanel addStyleNames="{local_res.css.raceslistlive}">
|
||||
<h3 ui:field="titleUi" class="{res.mediaCss.column} {res.mediaCss.medium12} {res.mediaCss.large5}"/>
|
||||
<div ui:field="legend" class="{res.mediaCss.column} {res.mediaCss.medium12} {res.mediaCss.large7} {style.legend}">
|
||||
<div class="{style.iconGPS}"><ui:text from='{i18n.eventRegattaRacesLegendGps}'/></div>
|
||||
<h3 ui:field="titleUi" class="{res.mediaCss.column} {res.mediaCss.medium12} {res.mediaCss.large4}"/>
|
||||
<div ui:field="legend" class="{res.mediaCss.column} {res.mediaCss.medium12} {res.mediaCss.large8} {style.legend}">
|
||||
<div class="{style.iconWind}"><ui:text from='{i18n.eventRegattaRacesLegendWind}'/></div>
|
||||
<div class="{style.iconVideo}"><ui:text from='{i18n.eventRegattaRacesLegendVideo}'/></div>
|
||||
<div class="{style.iconAudio}"><ui:text from='{i18n.eventRegattaRacesLegendAudio}'/></div>
|
||||
|
||||
+16
-11
@@ -1,16 +1,16 @@
|
||||
package com.sap.sailing.gwt.home.desktop.partials.regattaheader;
|
||||
|
||||
import com.google.gwt.core.client.GWT;
|
||||
import com.google.gwt.core.client.Scheduler;
|
||||
import com.google.gwt.core.client.Scheduler.ScheduledCommand;
|
||||
import com.google.gwt.dom.client.AnchorElement;
|
||||
import com.google.gwt.dom.client.DivElement;
|
||||
import com.google.gwt.dom.client.Style.Unit;
|
||||
import com.google.gwt.uibinder.client.UiBinder;
|
||||
import com.google.gwt.uibinder.client.UiField;
|
||||
import com.google.gwt.user.client.DOM;
|
||||
import com.google.gwt.user.client.Event;
|
||||
import com.google.gwt.user.client.EventListener;
|
||||
import com.google.gwt.user.client.ui.Composite;
|
||||
import com.google.gwt.user.client.ui.PopupPanel.PositionCallback;
|
||||
import com.google.gwt.user.client.ui.UIObject;
|
||||
import com.google.gwt.user.client.ui.Widget;
|
||||
import com.sap.sailing.gwt.home.communication.eventview.RegattaMetadataDTO;
|
||||
@@ -56,16 +56,21 @@ public class RegattaHeader extends Composite {
|
||||
Event.setEventListener(dataIndicatorsUi, new EventListener() {
|
||||
@Override
|
||||
public void onBrowserEvent(Event event) {
|
||||
final RegattaHeaderLegendPopup pop = new RegattaHeaderLegendPopup(dataIndicatorsUi);
|
||||
// place it right aligned in the header next to it, setPostion is left based so it cannot be used
|
||||
// instead
|
||||
pop.setPopupPositionAndShow(new PositionCallback() {
|
||||
|
||||
final RegattaHeaderLegendPopup pop = new RegattaHeaderLegendPopup();
|
||||
pop.setVisible(false);
|
||||
pop.show();
|
||||
// Pausing until the event loop is clear appears to give the browser
|
||||
// sufficient time to apply CSS styling. We use the popup's offset
|
||||
// width and height to calculate the display position, but those
|
||||
// dimensions are not accurate until styling has been applied.
|
||||
Scheduler.get().scheduleDeferred(new ScheduledCommand() {
|
||||
@Override
|
||||
public void setPosition(int offsetWidth, int offsetHeight) {
|
||||
pop.getElement().getStyle().setTop(dataIndicatorsUi.getAbsoluteTop(), Unit.PX);
|
||||
pop.getElement().getStyle().setRight(
|
||||
dataIndicatorsUi.getAbsoluteLeft(), Unit.PX);
|
||||
public void execute() {
|
||||
// the arrow is ~16 pixels long
|
||||
pop.setPopupPosition(dataIndicatorsUi.getAbsoluteLeft() - pop.getOffsetWidth() - 16,
|
||||
RegattaHeader.this.getAbsoluteTop() + RegattaHeader.this.getOffsetHeight() / 2
|
||||
- pop.getOffsetHeight() / 2);
|
||||
pop.setVisible(true);
|
||||
}
|
||||
});
|
||||
event.preventDefault();
|
||||
|
||||
+2
-2
@@ -1,7 +1,6 @@
|
||||
package com.sap.sailing.gwt.home.desktop.partials.regattaheader;
|
||||
|
||||
import com.google.gwt.core.client.GWT;
|
||||
import com.google.gwt.dom.client.AnchorElement;
|
||||
import com.google.gwt.uibinder.client.UiBinder;
|
||||
import com.google.gwt.user.client.ui.PopupPanel;
|
||||
import com.google.gwt.user.client.ui.Widget;
|
||||
@@ -12,7 +11,8 @@ public class RegattaHeaderLegendPopup extends PopupPanel {
|
||||
|
||||
interface RegattaHeaderLegendPopupUiBinder extends UiBinder<Widget, RegattaHeaderLegendPopup> {
|
||||
}
|
||||
public RegattaHeaderLegendPopup(final AnchorElement parent) {
|
||||
|
||||
public RegattaHeaderLegendPopup() {
|
||||
super(true);
|
||||
setWidget(uiBinder.createAndBindUi(this));
|
||||
}
|
||||
|
||||
+43
-10
@@ -6,41 +6,74 @@
|
||||
|
||||
<ui:style>
|
||||
.iconGPS, .iconWind, .iconVideo, .iconAudio{
|
||||
line-height: 1.5em;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin-left: 0.666666666666667em;
|
||||
padding-left: 2.333333333333333em;
|
||||
background-size: 1.666666666666667rem 1.666666666666667rem;
|
||||
background-position: left;
|
||||
background-position: left bottom;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
.iconGPS {
|
||||
background-image:url('images/home/raw_gps_fixes.png');
|
||||
}
|
||||
.iconWind {
|
||||
margin-left: 0.666666666666667em;
|
||||
background-image:url('images/home/icon-wind.png');
|
||||
border-left: 1px solid #ccc;
|
||||
}
|
||||
.iconVideo {
|
||||
background-image:url('images/home/icon-video.png');
|
||||
border-left: 1px solid #ccc;
|
||||
padding-top: 0.277777777777778em;
|
||||
}
|
||||
.iconAudio {
|
||||
margin-left: 0.666666666666667em;
|
||||
background-image:url('images/home/icon-audio.png');
|
||||
border-left: 1px solid #ccc;
|
||||
padding-top: 0.277777777777778em;
|
||||
}
|
||||
.legend{
|
||||
padding: 0.5em;
|
||||
border-radius: .277777777777778em;
|
||||
width:100%;
|
||||
height:2.375em;
|
||||
background-color:white;
|
||||
border: 2px solid #ccc;
|
||||
}
|
||||
.legend:after, .legend:before {
|
||||
left: 100%;
|
||||
top: 50%;
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
width: 0;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.legend:after {
|
||||
border-color: rgba(255, 255, 255, 0);
|
||||
border-left-color: #ffffff;
|
||||
border-width: 0.5em;
|
||||
margin-top: -0.5em;
|
||||
margin-left: -2px;
|
||||
}
|
||||
.legend:before {
|
||||
border-color: rgba(204, 204, 204, 0);
|
||||
border-left-color: #ccc;
|
||||
border-width: 0.55em;
|
||||
margin-top: -0.55em;
|
||||
}
|
||||
|
||||
</ui:style>
|
||||
<g:HTMLPanel styleName="{style.legend}">
|
||||
<div class="{style.iconGPS}"><ui:text from='{i18n.eventRegattaRacesLegendGps}'/></div>
|
||||
<div class="{style.iconWind}"><ui:text from='{i18n.eventRegattaRacesLegendWind}'/></div>
|
||||
<div></div>
|
||||
<div class="{style.iconVideo}"><ui:text from='{i18n.eventRegattaRacesLegendVideo}'/></div>
|
||||
<div class="{style.iconAudio}"><ui:text from='{i18n.eventRegattaRacesLegendAudio}'/></div>
|
||||
<table>
|
||||
<tr>
|
||||
<td><div class="{style.iconGPS}"><ui:text from='{i18n.eventRegattaHeaderLegendGps}'/></div></td>
|
||||
<td><div class="{style.iconWind}"><ui:text from='{i18n.eventRegattaHeaderLegendWind}'/></div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td><div class="{style.iconVideo}"><ui:text from='{i18n.eventRegattaHeaderLegendVideo}'/></div></td>
|
||||
<td><div class="{style.iconAudio}"><ui:text from='{i18n.eventRegattaHeaderLegendAudio}'/></div></td>
|
||||
</tr>
|
||||
</table>
|
||||
</g:HTMLPanel>
|
||||
</ui:UiBinder>
|
||||
+4
-1
@@ -1747,8 +1747,11 @@ public interface StringMessages extends com.sap.sse.gwt.client.StringMessages,
|
||||
String externalLinks();
|
||||
String buoyZoneRadiusInHullLengths();
|
||||
String incorrectValueForRegattaBuoyZoneRadiusInHullLengths();
|
||||
String eventRegattaRacesLegendGps();
|
||||
String eventRegattaRacesLegendWind();
|
||||
String eventRegattaRacesLegendVideo();
|
||||
String eventRegattaRacesLegendAudio();
|
||||
String eventRegattaHeaderLegendGps();
|
||||
String eventRegattaHeaderLegendWind();
|
||||
String eventRegattaHeaderLegendVideo();
|
||||
String eventRegattaHeaderLegendAudio();
|
||||
}
|
||||
+4
-1
@@ -1719,7 +1719,10 @@ filterDeviceMappings=Filter device mappings
|
||||
raceStartAnalysis=Race Start Analysis
|
||||
buoyZoneRadiusInHullLengths=Buoy zone radius in hull lengths (e.g., 2 or 3)
|
||||
incorrectValueForRegattaBuoyZoneRadiusInHullLengths=Incorrect value for the buoy zone radius in hull lengths
|
||||
eventRegattaRacesLegendGps=Tracking
|
||||
eventRegattaRacesLegendWind=# Windsensors
|
||||
eventRegattaRacesLegendVideo=# Video Streams
|
||||
eventRegattaRacesLegendAudio=# Audio Streams
|
||||
eventRegattaHeaderLegendGps=Has Trackingdata
|
||||
eventRegattaHeaderLegendWind=Has Winddata
|
||||
eventRegattaHeaderLegendVideo=Has Videostreams
|
||||
eventRegattaHeaderLegendAudio=Has Audiostreams
|
||||
+4
-1
@@ -1704,7 +1704,10 @@ filterDeviceMappings=Gerätezuordnungen filtern
|
||||
raceStartAnalysis=Startanalyse
|
||||
buoyZoneRadiusInHullLengths=Anzahl Bootslängen für Bahnmarkenkreis (z.B. 2 oder 3)
|
||||
incorrectValueForRegattaBuoyZoneRadiusInHullLengths=Ungültiger WErt für den Bootslängen-Bahnmarkenkreis
|
||||
eventRegattaRacesLegendGps=Tracking
|
||||
eventRegattaRacesLegendWind=Nr. Windsensoren
|
||||
eventRegattaRacesLegendVideo=Nr. Video Streams
|
||||
eventRegattaRacesLegendAudio=Nr. Audio Streams
|
||||
eventRegattaHeaderLegendGps=Hat Trackinginformationen
|
||||
eventRegattaHeaderLegendWind=Hat Winddaten
|
||||
eventRegattaHeaderLegendVideo=Hat Videostreams
|
||||
eventRegattaHeaderLegendAudio=Hat Audiostreams
|
||||
Reference in new issue
Block a user