mirror of
https://github.com/eclipse-sailing-analytics/sailing-analytics.git
synced 2026-11-04 01:59:35 +00:00
Layout improvements
This commit is contained in:
Jens Rommel committed
1 parent
01b356d6f2
commit
8d94d9462a
13 files changed
+327
-286
No files matched your search
@@ -14,156 +14,156 @@
|
||||
iframe {display: block; width: 100%; height: 100%; border: none; overflow-y: auto; overflow-x: hidden;}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
font-size: 1px;
|
||||
height: 0px;
|
||||
line-height: 0px;
|
||||
margin: -1px 0 0;
|
||||
width: 100%;
|
||||
clear: both;
|
||||
font-size: 1px;
|
||||
height: 0px;
|
||||
line-height: 0px;
|
||||
margin: -1px 0 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.cover {
|
||||
left: -1000px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: -1000px;
|
||||
left: -1000px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: -1000px;
|
||||
}
|
||||
|
||||
body {
|
||||
background: white;
|
||||
font-family: 'OpenSansRegular', Arial, Verdana, sans-serif;
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
padding: 80px 0 160px 0;
|
||||
margin: 0;
|
||||
background: white;
|
||||
font-family: 'OpenSansRegular', Arial, Verdana, sans-serif;
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
padding: 80px 0 160px 0;
|
||||
margin: 0;
|
||||
color: #3b3b3b;
|
||||
}
|
||||
|
||||
table td,select,button {
|
||||
font-family: 'OpenSansLight', Arial, Verdana, sans-serif;
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
font-family: 'OpenSansLight', Arial, Verdana, sans-serif;
|
||||
line-height: 1;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.contentOuterPanel {
|
||||
background: #dddcdc;
|
||||
margin: 0 12px 0 12px;
|
||||
padding: 12px;
|
||||
background: #dddcdc;
|
||||
margin: 0 12px 0 12px;
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
/** Example rules used by the template application (remove for your app) */
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
font-family: 'OpenSansSemiBold', Arial, Verdana, sans-serif;
|
||||
color: #777777;
|
||||
margin: 40px 0px 70px;
|
||||
text-align: center;
|
||||
font-size: 2em;
|
||||
font-family: 'OpenSansSemiBold', Arial, Verdana, sans-serif;
|
||||
color: #777777;
|
||||
margin: 40px 0px 70px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: separate;
|
||||
border-collapse: separate;
|
||||
}
|
||||
|
||||
.CombinedWindPanel {
|
||||
-moz-border-radius: 4px;
|
||||
-webkit-border-radius: 4px;
|
||||
-o-border-radius: 4px;
|
||||
-ms-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
background-color: rgba(255, 255, 255, 0.75);
|
||||
border: 1px solid #C9CACA;
|
||||
-moz-border-radius: 4px;
|
||||
-webkit-border-radius: 4px;
|
||||
-o-border-radius: 4px;
|
||||
-ms-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
background-color: rgba(255, 255, 255, 0.75);
|
||||
border: 1px solid #C9CACA;
|
||||
}
|
||||
|
||||
.RaceMap-HeaderPanel {
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
background-color: #333;
|
||||
opacity: .5;
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
background-color: #333;
|
||||
opacity: .5;
|
||||
}
|
||||
|
||||
.leaderboardLabel {
|
||||
border-bottom: 2px solid #007dc0;
|
||||
padding: 0 0 6px 0;
|
||||
font-family: 'OpenSansSemiBold', Arial, Verdana, sans-serif;
|
||||
border-bottom: 2px solid #007dc0;
|
||||
padding: 0 0 6px 0;
|
||||
font-family: 'OpenSansSemiBold', Arial, Verdana, sans-serif;
|
||||
}
|
||||
|
||||
.refreshAndSettings {
|
||||
background: #f2f2f2;
|
||||
border-bottom: 2px solid #fff;
|
||||
border-top: 2px solid #fff;
|
||||
height: 30px;
|
||||
background: #f2f2f2;
|
||||
border-bottom: 2px solid #fff;
|
||||
border-top: 2px solid #fff;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.refreshAndSettings table td {
|
||||
padding: 0 10px 0 0;
|
||||
padding: 0 10px 0 0;
|
||||
}
|
||||
|
||||
.refreshAndSettings table table td {
|
||||
padding: 0 0 0 0;
|
||||
padding: 0 0 0 0;
|
||||
}
|
||||
|
||||
.race-name {
|
||||
line-height: 1.0;
|
||||
line-height: 1.0;
|
||||
}
|
||||
|
||||
.openColumn {
|
||||
position: relative;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
img.openColumn {
|
||||
display: block;
|
||||
margin: 3px auto 3px auto !important;
|
||||
display: block;
|
||||
margin: 3px auto 3px auto !important;
|
||||
}
|
||||
|
||||
.breadcrumbPanel {
|
||||
height: 30px;
|
||||
margin: 0 12px 13px 12px;
|
||||
height: 30px;
|
||||
margin: 0 12px 13px 12px;
|
||||
}
|
||||
|
||||
.mainPanel {
|
||||
width: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.raceBoardNavigation {
|
||||
float: left;
|
||||
margin: 9px 0 0 12px;
|
||||
font-family: 'OpenSansLight', Arial, Verdana, sans-serif;
|
||||
float: left;
|
||||
margin: 9px 0 0 12px;
|
||||
font-family: 'OpenSansLight', Arial, Verdana, sans-serif;
|
||||
}
|
||||
|
||||
.raceBoardControls {
|
||||
float: right;
|
||||
margin: 9px 0 0 12px;
|
||||
font-family: 'OpenSansLight', Arial, Verdana, sans-serif;
|
||||
float: right;
|
||||
margin: 9px 0 0 12px;
|
||||
font-family: 'OpenSansLight', Arial, Verdana, sans-serif;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-navigationitem {
|
||||
color: #dddcdc;
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
margin: 0 12px 0 0;
|
||||
padding: 0 0 5px 0;
|
||||
color: #dddcdc;
|
||||
text-transform: uppercase;
|
||||
font-weight: 500;
|
||||
margin: 0 12px 0 0;
|
||||
padding: 0 0 5px 0;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-navigationitem:hover {
|
||||
border-bottom: 4px solid #f0ab00;
|
||||
color: #dddcdc;
|
||||
text-decoration: none;
|
||||
border-bottom: 4px solid #f0ab00;
|
||||
color: #dddcdc;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-navigationitem:active {
|
||||
border-bottom: 4px solid #f0ab00;
|
||||
color: #dddcdc;
|
||||
text-decoration: none;
|
||||
border-bottom: 4px solid #f0ab00;
|
||||
color: #dddcdc;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.competitorInfo-Canvas {
|
||||
pointer-events: none;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.gwt-DialogBox {
|
||||
z-index: 20;
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
.abstractChartPanel-importantMessageOfChart {
|
||||
@@ -174,55 +174,55 @@ img.openColumn {
|
||||
padding: 49px 0 0 80px;
|
||||
width: 300px;
|
||||
color: #7c7c7c;
|
||||
background: url(images/important-message.png) left center no-repeat;
|
||||
background: url(images/important-message.png) left center no-repeat;
|
||||
}
|
||||
|
||||
.breadcrumbPanel-NextArrow {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.errorLabel {
|
||||
color: #FF0000;
|
||||
color: #FF0000;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-settingsButtonPanel {
|
||||
float: right;
|
||||
margin: 9px 12px 0 0;
|
||||
float: right;
|
||||
margin: 9px 12px 0 0;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-settingsButton {
|
||||
background: url(images/settings_white.png), url(images/btn-cta-orangeleft.png);
|
||||
background-position: center, center 0;
|
||||
background-repeat: no-repeat, repeat-x;
|
||||
width: 27px;
|
||||
height: 23px;
|
||||
background: url(images/settings_white.png), url(images/btn-cta-orangeleft.png);
|
||||
background-position: center, center 0;
|
||||
background-repeat: no-repeat, repeat-x;
|
||||
width: 27px;
|
||||
height: 23px;
|
||||
margin: 0 12px 0 1px;
|
||||
-webkit-border-radius: 0px 3px 3px 0px;
|
||||
-moz-border-radius: 0px 3px 3px 0px;
|
||||
-o-border-radius: 0px 3px 3px 0px;
|
||||
-ms-border-radius: 0px 3px 3px 0px;
|
||||
border-radius: 0px 3px 3px 0px;
|
||||
-webkit-border-radius: 0px 3px 3px 0px;
|
||||
-moz-border-radius: 0px 3px 3px 0px;
|
||||
-o-border-radius: 0px 3px 3px 0px;
|
||||
-ms-border-radius: 0px 3px 3px 0px;
|
||||
border-radius: 0px 3px 3px 0px;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-settingsButton:hover {
|
||||
background-image: url(images/settings_white.png), url(images/btn-cta-orangeleft.png);
|
||||
background-position: center, center -30px;
|
||||
background-repeat: no-repeat, repeat-x;
|
||||
background-image: url(images/settings_white.png), url(images/btn-cta-orangeleft.png);
|
||||
background-position: center, center -30px;
|
||||
background-repeat: no-repeat, repeat-x;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-filterButton:hover {
|
||||
background-image: url(images/filter_white.png), url(images/btn-cta-orangeleft.png);
|
||||
background-position: center, center -30px;
|
||||
background-repeat: no-repeat, repeat-x;
|
||||
background-image: url(images/filter_white.png), url(images/btn-cta-orangeleft.png);
|
||||
background-position: center, center -30px;
|
||||
background-repeat: no-repeat, repeat-x;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-innerElement {
|
||||
background: url("images/btn-cta-orangeleft.png") repeat-x scroll center 0 transparent;
|
||||
border-bottom-left-radius: 3px;
|
||||
border-top-left-radius: 3px;
|
||||
color: #FFFFFF;
|
||||
border-bottom-left-radius: 3px;
|
||||
border-top-left-radius: 3px;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
font-family: OpenSansSemiBold,Verdana,Arial,sans-serif;
|
||||
font-size: 14px;
|
||||
@@ -246,8 +246,8 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.raceBoardNavigation-innerElement:active {
|
||||
top: 1px;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-innerElement:hover {
|
||||
@@ -256,12 +256,12 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.raceBoardNavigation-innerElement label {
|
||||
cursor: pointer;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-standaloneElement {
|
||||
background: url("images/btn-cta-orangeleft.png") repeat-x scroll center 0 transparent;
|
||||
color: #FFFFFF;
|
||||
color: #FFFFFF;
|
||||
cursor: pointer;
|
||||
font-family: OpenSansSemiBold,Verdana,Arial,sans-serif;
|
||||
font-size: 14px;
|
||||
@@ -277,7 +277,7 @@ img.openColumn {
|
||||
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
|
||||
text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.25);
|
||||
border-bottom: 1px solid rgba(0, 0, 0, 0.25);
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
border-radius: 5px 5px 5px 5px;
|
||||
-moz-border-radius: 5px 0 0 5px;
|
||||
-webkit-border-radius: 5px 5px 5px 5px;
|
||||
-o-border-radius: 5px 5px 5px 5px;
|
||||
@@ -285,8 +285,8 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.raceBoardNavigation-standaloneElement:active {
|
||||
top: 1px;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.raceBoardNavigation-standaloneElement:hover {
|
||||
@@ -295,28 +295,28 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.raceBoardNavigation-standaloneElement label {
|
||||
cursor: pointer;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.timePanelButton {
|
||||
float: left;
|
||||
margin: 0 0 0 5px;
|
||||
float: left;
|
||||
margin: 0 0 0 5px;
|
||||
}
|
||||
|
||||
.timePanelButton-SlowDown {
|
||||
background-color: red !important;
|
||||
background-color: red !important;
|
||||
}
|
||||
|
||||
.timePanelButton-SpeedUp {
|
||||
background-color: green !important;
|
||||
background-color: green !important;
|
||||
}
|
||||
|
||||
.playPauseButton {
|
||||
padding: 0;
|
||||
float: left;
|
||||
width: 32px;
|
||||
height: 28px;
|
||||
background: url(images/viewicons/@1x/img/SAP_RV_Play_INACTIVE.png) center no-repeat;
|
||||
padding: 0;
|
||||
float: left;
|
||||
width: 32px;
|
||||
height: 28px;
|
||||
background: url(images/viewicons/@1x/img/SAP_RV_Play_INACTIVE.png) center no-repeat;
|
||||
cursor: pointer;
|
||||
border: 1px solid #cecece;
|
||||
border-radius: 4px;
|
||||
@@ -329,9 +329,9 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.playPauseButtonPause {
|
||||
background: url(images/viewicons/@2x/img/SAP_RV_Pause_INACTIVE.png) 2px 0 no-repeat;
|
||||
outline: 0;
|
||||
background-size: contain;
|
||||
background: url(images/viewicons/@2x/img/SAP_RV_Pause_INACTIVE.png) 2px 0 no-repeat;
|
||||
outline: 0;
|
||||
background-size: contain;
|
||||
}
|
||||
|
||||
.playPauseButtonPause:hover {
|
||||
@@ -344,8 +344,8 @@ img.openColumn {
|
||||
top: 8px;
|
||||
width: 42px;
|
||||
height: 38px;
|
||||
font-size: 8px;
|
||||
white-space: normal;
|
||||
font-size: 8px;
|
||||
white-space: normal;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
@@ -356,31 +356,31 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.backToLivePlayButton-Inactive {
|
||||
color: #6dc021;
|
||||
background-color: white;
|
||||
font-weight: bold;
|
||||
color: #6dc021;
|
||||
background-color: white;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.backToLivePlayButton-Active {
|
||||
background-color: #6dc021;
|
||||
color: white;
|
||||
font-weight: normal;
|
||||
background-color: #6dc021;
|
||||
color: white;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
.backToLivePlayButton:hover {
|
||||
border: 2px solid gray;
|
||||
border: 2px solid gray;
|
||||
}
|
||||
|
||||
.backToLivePlayButton:focus {
|
||||
outline: 0 !important;
|
||||
outline: 0 !important;
|
||||
}
|
||||
|
||||
.dockLayoutPanel div[style="position: absolute; overflow: hidden; left: 0px; right: 0px; bottom: 0px; height: 90px;"] {
|
||||
z-index: 10;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.browserOptimizedMessage {
|
||||
padding: 15px 0px;
|
||||
padding: 15px 0px;
|
||||
}
|
||||
|
||||
|
||||
@@ -423,156 +423,156 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.busyIndicator-Simple {
|
||||
position: absolute;
|
||||
top: 0.7em;
|
||||
right: 7.4em;
|
||||
position: absolute;
|
||||
top: 0.7em;
|
||||
right: 7.4em;
|
||||
}
|
||||
|
||||
.busyIndicator-Circle {
|
||||
}
|
||||
|
||||
.raceBoard-TitlePanel {
|
||||
position: relative;
|
||||
top: 10px;
|
||||
z-index: 10;
|
||||
color: #fff;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
position: relative;
|
||||
top: 10px;
|
||||
z-index: 10;
|
||||
color: #fff;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.raceBoard-TitlePanel-RaceNameLabel {
|
||||
font-size: 32px;
|
||||
font-weight: bold;
|
||||
padding: 7px;
|
||||
font-size: 32px;
|
||||
font-weight: bold;
|
||||
padding: 7px;
|
||||
}
|
||||
|
||||
.raceBoard-Logo {
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: 10px;
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
top: 6px;
|
||||
left: 10px;
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.SideBySideComponentViewer-MainPanel {
|
||||
top: 12px;
|
||||
top: 12px;
|
||||
}
|
||||
|
||||
.TimePanel-ShowExtended-Button {
|
||||
width: 29px;
|
||||
height: 28px;
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
border: 1px solid #ececec;
|
||||
width: 29px;
|
||||
height: 28px;
|
||||
float: left;
|
||||
cursor: pointer;
|
||||
border-top-left-radius: 5px;
|
||||
border-top-right-radius: 5px;
|
||||
border-bottom-left-radius: 5px;
|
||||
border-bottom-right-radius: 5px;
|
||||
border: 1px solid #ececec;
|
||||
}
|
||||
|
||||
.TimePanel-ShowExtended-Button-Open {
|
||||
background: white url(images/arrows_top_black.png) center no-repeat;
|
||||
background: white url(images/arrows_top_black.png) center no-repeat;
|
||||
}
|
||||
|
||||
.TimePanel-ShowExtended-Button-Closed {
|
||||
background: white url(images/arrows_bottom_black.png) center no-repeat;
|
||||
background: white url(images/arrows_bottom_black.png) center no-repeat;
|
||||
}
|
||||
|
||||
.TimePanel-ShowExtended-Button:hover {
|
||||
background-color: #cecece;
|
||||
background-color: #cecece;
|
||||
}
|
||||
|
||||
.TimePanel-ShowExtended-Button:focus {
|
||||
outline: 0 !important;
|
||||
outline: 0 !important;
|
||||
}
|
||||
|
||||
.RaceBoard-globalNavigation-Link {
|
||||
display: inline;
|
||||
margin-right: 3px;
|
||||
display: inline;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
.RaceBoard-globalNavigation-Link a {
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.RaceBoard-globalNavigation-Link+.RaceBoard-globalNavigation-Link:before {
|
||||
content: ' \00bb\00a0';
|
||||
content: ' \00bb\00a0';
|
||||
}
|
||||
|
||||
.TimePanel-settingsButtonStyle {
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
z-index: 1;
|
||||
border: none;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
z-index: 1;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.TimePanel-settingsButtonStyle:focus {
|
||||
outline: 0 !important;
|
||||
outline: 0 !important;
|
||||
}
|
||||
|
||||
.TimePanel-settingsButtonStyle:hover {
|
||||
border: 1px solid gray;
|
||||
border: 1px solid gray;
|
||||
}
|
||||
|
||||
.gwt-SplitLayoutPanel-NorthSouthToggleButton-Closed-multiCompetitorRaceChart {
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_CompetitorCharts_INACTIVE.png), url(images/arrows_top_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 5% 50%, 95% 50%
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_CompetitorCharts_INACTIVE.png), url(images/arrows_top_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 5% 50%, 95% 50%
|
||||
}
|
||||
|
||||
.gwt-SplitLayoutPanel-NorthSouthToggleButton-Open-multiCompetitorRaceChart {
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_CompetitorCharts_GHOSTED.png), url(images/arrows_bottom_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 5% 50%, 95% 50%
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_CompetitorCharts_GHOSTED.png), url(images/arrows_bottom_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 5% 50%, 95% 50%
|
||||
}
|
||||
|
||||
.gwt-SplitLayoutPanel-NorthSouthToggleButton-Closed-windChart {
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_CompetitorCharts_INACTIVE.png), url(images/arrows_top_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 5% 50%, 95% 50%
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_CompetitorCharts_INACTIVE.png), url(images/arrows_top_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 5% 50%, 95% 50%
|
||||
}
|
||||
|
||||
.gwt-SplitLayoutPanel-NorthSouthToggleButton-Open-windChart {
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_CompetitorCharts_GHOSTED.png), url(images/arrows_bottom_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 5% 50%, 95% 50%
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_CompetitorCharts_GHOSTED.png), url(images/arrows_bottom_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 5% 50%, 95% 50%
|
||||
}
|
||||
|
||||
.gwt-SplitLayoutPanel-EastToggleButton-Open-leaderboard {
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_Leaderboard_GHOSTED.png), url(images/arrows_top_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 4% 50%, 96% 50%
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_Leaderboard_GHOSTED.png), url(images/arrows_top_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 4% 50%, 96% 50%
|
||||
}
|
||||
|
||||
.gwt-SplitLayoutPanel-EastToggleButton-Closed-leaderboard {
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_Leaderboard_INACTIVE.png), url(images/arrows_bottom_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 4% 50%, 96% 50%
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_Leaderboard_INACTIVE.png), url(images/arrows_bottom_black_small.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 4% 50%, 96% 50%
|
||||
}
|
||||
|
||||
.gwt-SplitLayoutPanel-NorthSouthToggleButton-Closed-media {
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_AudioVideo_INACTIVE.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 4% 50%, 96% 50%
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_AudioVideo_INACTIVE.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 4% 50%, 96% 50%
|
||||
}
|
||||
|
||||
|
||||
.gwt-SplitLayoutPanel-NorthSouthToggleButton-Open-media {
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_AudioVideo_INACTIVE.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 4% 50%, 96% 50%
|
||||
background-color: white;
|
||||
background-image: url(images/viewicons/@1x/img/SAP_RV_AudioVideo_INACTIVE.png);
|
||||
background-repeat: no-repeat, no-repeat;
|
||||
background-position: 4% 50%, 96% 50%
|
||||
}
|
||||
|
||||
.gwt-SplitLayoutPanel-NorthSouthToggleButton-Small-media {
|
||||
background-position: 50% 50%, 100% 50% !important;
|
||||
background-position: 50% 50%, 100% 50% !important;
|
||||
margin-left: 0px !important;
|
||||
padding: 2px 20px !important;
|
||||
}
|
||||
@@ -588,26 +588,26 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.RegattaRaceInformation-Header {
|
||||
position: relative;
|
||||
position: relative;
|
||||
left: 140px;
|
||||
top: 11px;
|
||||
}
|
||||
|
||||
.RegattaRaceInformation-Header .RaceName-Label {
|
||||
display: inline;
|
||||
display: inline;
|
||||
color: white;
|
||||
margin-right: 10px;
|
||||
font-size: 36px;
|
||||
}
|
||||
|
||||
.RegattaRaceInformation-Header .RaceSeriesAndFleet-Label {
|
||||
display: inline;
|
||||
display: inline;
|
||||
color: white;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.RegattaAndRaceTime-Header {
|
||||
position: absolute;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 13px;
|
||||
text-align: right;
|
||||
@@ -615,10 +615,10 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.RegattaAndRaceTime-Header .RegattaName-Anchor {
|
||||
font-size: 15px;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
padding-left: 25px;
|
||||
font-size: 15px;
|
||||
color: white;
|
||||
text-decoration: none;
|
||||
padding-left: 25px;
|
||||
background-image: url(images/home.png);
|
||||
background-repeat: no-repeat;
|
||||
background-size: 17px;
|
||||
@@ -626,31 +626,31 @@ img.openColumn {
|
||||
}
|
||||
|
||||
.RegattaAndRaceTime-Header .RegattaName-Anchor:hover {
|
||||
text-decoration: underline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
|
||||
.RegattaAndRaceTime-Header .RaceTime-Label {
|
||||
font-size: 15px;
|
||||
margin-top: 5px;
|
||||
font-size: 15px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.VideoPopup-Close-Button {
|
||||
border: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.gwt-Button, .gwt-Button:visited, .test, .test:visited {
|
||||
background-color: #fcbb22;
|
||||
background-image: none !important;
|
||||
background-color: #fcbb22;
|
||||
background-image: none !important;
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-o-box-shadow: none;
|
||||
-ms-box-shadow: none;
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
-o-box-shadow: none;
|
||||
-ms-box-shadow: none;
|
||||
box-shadow: none;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.gwt-Button:hover {
|
||||
background-color: #fcbb22 !important;
|
||||
background-color: #fcbb22 !important;
|
||||
}
|
||||
|
||||
.Media-Select-Button {
|
||||
@@ -660,7 +660,7 @@ img.openColumn {
|
||||
font-weight: 400;
|
||||
color: #111;
|
||||
border: none;
|
||||
padding: 0.666666666666667em 1.133333333333333em;
|
||||
padding: 0.5em 0.3em 0.5em 0.8em;
|
||||
background-color: #fff;
|
||||
-webkit-transition: background-color 0.2s;
|
||||
-moz-transition: background-color 0.2s;
|
||||
@@ -668,7 +668,11 @@ img.openColumn {
|
||||
-ms-transition: background-color 0.2s;
|
||||
transition: background-color 0.2s;
|
||||
width: 100%;
|
||||
max-width: 25em;
|
||||
text-align: left;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.Media-Select-Button:hover,
|
||||
.Media-Select-Button:focus {
|
||||
@@ -691,5 +695,4 @@ img.openColumn {
|
||||
|
||||
.Media-Select-Popup .Caption {
|
||||
padding: 4px 10px;
|
||||
}
|
||||
|
||||
}
|
||||
+8
-8
@@ -1082,14 +1082,14 @@ public interface StringMessages extends Messages {
|
||||
String raceIsInLiveTimePanelMode();
|
||||
String backToLiveTimePanelMode();
|
||||
String windChart();
|
||||
String showVideoCaption();
|
||||
String showVideoTooltip();
|
||||
String hideVideoCaption();
|
||||
String hideVideoTooltip();
|
||||
String selectVideoCaption(int mediaCount);
|
||||
String selectVideoTooltip();
|
||||
String manageMediaCaption();
|
||||
String manageMediaTooltip();
|
||||
String mediaShowVideoCaption();
|
||||
String mediaShowVideoTooltip(String title);
|
||||
String mediaHideVideoCaption();
|
||||
String mediaHideVideoTooltip();
|
||||
String mediaSelectVideoCaption(int mediaCount);
|
||||
String mediaSelectVideoTooltip();
|
||||
String mediaManageMediaCaption();
|
||||
String mediaManageMediaTooltip();
|
||||
String showAll();
|
||||
String raceVisibilityColumn();
|
||||
String enterCarryValueFor(String competitorName);
|
||||
|
||||
+8
-8
@@ -1063,14 +1063,14 @@ leaderboardGroupNotContainedInEvent=The leaderboard group {0} is not contained i
|
||||
raceIsInLiveTimePanelMode=Race is Live
|
||||
backToLiveTimePanelMode=Back to Live
|
||||
windChart=Wind Chart
|
||||
showVideoCaption=Show Video
|
||||
showVideoTooltip=Click to show video
|
||||
hideVideoCaption=Hide Video
|
||||
hideVideoTooltip=Click to hide video
|
||||
selectVideoCaption={0} Videos
|
||||
selectVideoTooltip=Click to select video
|
||||
manageMediaCaption=Manage Media
|
||||
manageMediaTooltip=Configure audio and video clips, synchronize times
|
||||
mediaShowVideoCaption=Show Video
|
||||
mediaShowVideoTooltip=Click to show video: {0}
|
||||
mediaHideVideoCaption=Hide Video
|
||||
mediaHideVideoTooltip=Click to hide video
|
||||
mediaSelectVideoCaption={0} Videos
|
||||
mediaSelectVideoTooltip=Click to select video
|
||||
mediaManageMediaCaption=Manage Media
|
||||
mediaManageMediaTooltip=Configure audio and video clips, synchronize times
|
||||
showAll=Show all
|
||||
raceVisibilityColumn=Visibility
|
||||
enterCarryValueFor=Enter carried points for competitor {0}
|
||||
+8
-8
@@ -1058,14 +1058,14 @@ leaderboardGroupNotContainedInEvent=Die Wettfahrtgruppe {0} gehört nicht zur Ve
|
||||
raceIsInLiveTimePanelMode=Rennen ist live
|
||||
backToLiveTimePanelMode=Zurück zu live
|
||||
windChart=Wind Chart
|
||||
showVideoCaption=Video ein
|
||||
showVideoTooltip=Video abspielen
|
||||
hideVideoCaption=Video aus
|
||||
hideVideoTooltip=Video ausblenden
|
||||
selectVideoCaption={0} Videos
|
||||
selectVideoTooltip=Video auswählen
|
||||
manageMediaCaption=Medien verwalten
|
||||
manageMediaTooltip=Audio- und Video-Clips verwalten, Zeiten synchronisieren
|
||||
mediaShowVideoCaption=Video ein
|
||||
mediaShowVideoTooltip=Video abspielen: {0}
|
||||
mediaHideVideoCaption=Video aus
|
||||
mediaHideVideoTooltip=Video ausblenden
|
||||
mediaSelectVideoCaption={0} Videos
|
||||
mediaSelectVideoTooltip=Video auswählen
|
||||
mediaManageMediaCaption=Medien verwalten
|
||||
mediaManageMediaTooltip=Audio- und Video-Clips verwalten, Zeiten synchronisieren
|
||||
showAll=Alle zeigen
|
||||
raceVisibilityColumn=Sichtbarkeit
|
||||
enterCarryValueFor=Punkteübertrag für Teilnehmer {0} erfassen
|
||||
+8
-8
@@ -1011,14 +1011,14 @@ leaderboardGroupNotContainedInEvent=The leaderboard group {0} is not contained i
|
||||
raceIsInLiveTimePanelMode=Race is Live
|
||||
backToLiveTimePanelMode=Back to Live
|
||||
windChart=Wind Chart
|
||||
showVideoCaption=Show Video
|
||||
showVideoTooltip=Click to show video
|
||||
hideVideoCaption=Hide Video
|
||||
hideVideoTooltip=Click to hide video
|
||||
selectVideoCaption={0} Videos
|
||||
selectVideoTooltip=Click to select video
|
||||
manageMediaCaption=Manage Media
|
||||
manageMediaTooltip=Configure audio and video clips, synchronize times
|
||||
mediaShowVideoCaption=Show Video
|
||||
mediaShowVideoTooltip=Click to show video: {0}
|
||||
mediaHideVideoCaption=Hide Video
|
||||
mediaHideVideoTooltip=Click to hide video
|
||||
mediaSelectVideoCaption={0} Videos
|
||||
mediaSelectVideoTooltip=Click to select video
|
||||
mediaManageMediaCaption=Manage Media
|
||||
mediaManageMediaTooltip=Configure audio and video clips, synchronize times
|
||||
showAll=Show all
|
||||
raceVisibilityColumn=Visibility
|
||||
enterCarryValueFor=Enter carried points for competitor {0}
|
||||
+4
-1
@@ -1,14 +1,17 @@
|
||||
package com.sap.sailing.gwt.ui.client.media;
|
||||
|
||||
import com.sap.sailing.domain.common.media.MediaTrack;
|
||||
import com.sap.sailing.gwt.ui.client.StringMessages;
|
||||
|
||||
public abstract class AbstractMediaSelectionControl implements MediaPlayerManager.PlayerChangeListener {
|
||||
|
||||
protected final MediaPlayerManager mediaPlayerManager;
|
||||
protected final StringMessages stringMessages;
|
||||
|
||||
public AbstractMediaSelectionControl(MediaPlayerManager mediaPlayerManager) {
|
||||
public AbstractMediaSelectionControl(MediaPlayerManager mediaPlayerManager, StringMessages stringMessages) {
|
||||
this.mediaPlayerManager = mediaPlayerManager;
|
||||
this.mediaPlayerManager.setPlayerChangeListener(this);
|
||||
this.stringMessages = stringMessages;
|
||||
}
|
||||
|
||||
protected boolean isPotentiallyPlayable(MediaTrack mediaTrack) {
|
||||
|
||||
+3
-2
@@ -28,6 +28,7 @@ import com.google.gwt.user.client.ui.UIObject;
|
||||
import com.google.gwt.user.client.ui.VerticalPanel;
|
||||
import com.google.gwt.user.client.ui.Widget;
|
||||
import com.sap.sailing.domain.common.media.MediaTrack;
|
||||
import com.sap.sailing.gwt.ui.client.StringMessages;
|
||||
import com.sap.sse.gwt.client.useragent.UserAgentDetails.AgentTypes;
|
||||
|
||||
public class MediaManagementControl extends AbstractMediaSelectionControl implements CloseHandler<PopupPanel> {
|
||||
@@ -36,8 +37,8 @@ public class MediaManagementControl extends AbstractMediaSelectionControl implem
|
||||
private final Map<MediaTrack, CheckBox> videoCheckBoxes = new HashMap<MediaTrack, CheckBox>();
|
||||
private final UIObject popupLocation;
|
||||
|
||||
public MediaManagementControl(MediaPlayerManager mediaPlayerManager, UIObject popupLocation) {
|
||||
super(mediaPlayerManager);
|
||||
public MediaManagementControl(MediaPlayerManager mediaPlayerManager, UIObject popupLocation, StringMessages stringMessages) {
|
||||
super(mediaPlayerManager, stringMessages);
|
||||
this.popupLocation = popupLocation;
|
||||
|
||||
this.dialogControl = new DialogBox(true, false);
|
||||
|
||||
+20
-5
@@ -14,14 +14,15 @@ import com.google.gwt.user.client.ui.PopupPanel;
|
||||
import com.google.gwt.user.client.ui.UIObject;
|
||||
import com.google.gwt.user.client.ui.VerticalPanel;
|
||||
import com.sap.sailing.domain.common.media.MediaTrack;
|
||||
import com.sap.sailing.gwt.ui.client.StringMessages;
|
||||
|
||||
public class MediaSingleSelectionControl extends AbstractMediaSelectionControl implements CloseHandler<PopupPanel> {
|
||||
|
||||
private final DialogBox dialogControl;
|
||||
private final UIObject popupLocation;
|
||||
|
||||
public MediaSingleSelectionControl(MediaPlayerManager mediaPlayerManager, UIObject popupLocation) {
|
||||
super(mediaPlayerManager);
|
||||
public MediaSingleSelectionControl(MediaPlayerManager mediaPlayerManager, UIObject popupLocation, StringMessages stringMessages) {
|
||||
super(mediaPlayerManager, stringMessages);
|
||||
this.popupLocation = popupLocation;
|
||||
|
||||
this.dialogControl = new DialogBox(true, false);
|
||||
@@ -58,14 +59,28 @@ public class MediaSingleSelectionControl extends AbstractMediaSelectionControl i
|
||||
Button mediaSelectButton = new Button(mediaTrack.title);
|
||||
mediaSelectButton.setStyleName("Media-Select-Button");
|
||||
if (mediaPlayerManager.getPlayingVideoTracks().contains(mediaTrack)) {
|
||||
mediaSelectButton.setTitle(stringMessages.mediaHideVideoTooltip());
|
||||
mediaSelectButton.addStyleName("Media-Select-Button-playing");
|
||||
mediaSelectButton.setEnabled(false);
|
||||
} else {
|
||||
mediaSelectButton.addClickHandler(new ClickHandler() {
|
||||
|
||||
@Override
|
||||
public void onClick(ClickEvent event) {
|
||||
if (mediaPlayerManager.getPlayingAudioTrack() != mediaTrack) {
|
||||
if (mediaPlayerManager.getPlayingAudioTrack() == mediaTrack) {
|
||||
mediaPlayerManager.muteAudio();
|
||||
}
|
||||
mediaPlayerManager.closeFloatingVideo(mediaTrack);
|
||||
hide();
|
||||
};
|
||||
});
|
||||
} else {
|
||||
mediaSelectButton.setTitle(stringMessages.mediaShowVideoTooltip(mediaTrack.title));
|
||||
mediaSelectButton.addClickHandler(new ClickHandler() {
|
||||
|
||||
@Override
|
||||
public void onClick(ClickEvent event) {
|
||||
if (event.isControlKeyDown() && mediaTrack.mimeType.mediaType == MediaTrack.MediaType.video) {
|
||||
mediaPlayerManager.playFloatingVideo(mediaTrack);
|
||||
} else if (mediaPlayerManager.getPlayingAudioTrack() != mediaTrack) {
|
||||
mediaPlayerManager.stopAll();
|
||||
if (mediaTrack.mimeType.mediaType == MediaTrack.MediaType.video) {
|
||||
mediaPlayerManager.playFloatingVideo(mediaTrack);
|
||||
|
||||
-1
@@ -58,7 +58,6 @@ public class VideoFloatingContainer extends AbstractVideoContainer implements Vi
|
||||
void show() {
|
||||
dialogBox.setPopupPosition(5, Document.get().getClientHeight()-dialogBox.getOffsetHeight()-500);
|
||||
dialogBox.show();
|
||||
dialogBox.setPixelSize(416, 234);
|
||||
}
|
||||
|
||||
@Override
|
||||
|
||||
+1
@@ -50,6 +50,7 @@ public class VideoYoutubePlayer extends AbstractMediaPlayer implements VideoSync
|
||||
this.raceStartTime = raceStartTime;
|
||||
|
||||
this.videoContainer = new SimplePanel();
|
||||
this.videoContainer.setStyleName("Youtube-Video-Panel");
|
||||
final String videoContainerId = "videoContainer-" + videoTrack.url + ++videoCounter;
|
||||
this.videoContainer.getElement().setId(videoContainerId);
|
||||
this.videoContainer
|
||||
|
||||
+2
-2
@@ -64,8 +64,8 @@ public class YoutubeVideoControl {
|
||||
|
||||
var player = new $wnd.YT.Player(videoContainerId, {
|
||||
videoId : videoUrl,
|
||||
height: '480', //see https://developers.google.com/youtube/iframe_api_reference?hl=en#Playback_quality
|
||||
width: '853',
|
||||
//height: '480', //see https://developers.google.com/youtube/iframe_api_reference?hl=en#Playback_quality
|
||||
//width: '853',
|
||||
events: { //https://developers.google.com/youtube/iframe_api_reference?hl=en#Events
|
||||
'onReady': function(event) {
|
||||
that.@com.sap.sailing.gwt.ui.client.media.YoutubeVideoControl::initPlayState(Lcom/google/gwt/core/client/JavaScriptObject;)(player);
|
||||
|
||||
+10
-10
@@ -87,18 +87,18 @@ public class SideBySideComponentViewer implements ComponentViewer {
|
||||
case 1:
|
||||
mediaSelectionButton.setVisible(true);
|
||||
if(mediaPlayerManagerComponent.isPlaying()){
|
||||
mediaSelectionButton.setText(stringMessages.hideVideoCaption());
|
||||
mediaSelectionButton.setTitle(stringMessages.hideVideoTooltip());
|
||||
mediaSelectionButton.setText(stringMessages.mediaHideVideoCaption());
|
||||
mediaSelectionButton.setTitle(stringMessages.mediaHideVideoTooltip());
|
||||
}
|
||||
else{
|
||||
mediaSelectionButton.setText(stringMessages.showVideoCaption());
|
||||
mediaSelectionButton.setTitle(stringMessages.showVideoTooltip());
|
||||
mediaSelectionButton.setText(stringMessages.mediaShowVideoCaption());
|
||||
mediaSelectionButton.setTitle(stringMessages.mediaShowVideoTooltip(mediaPlayerManagerComponent.getAssignedMediaTracks().iterator().next().title));
|
||||
}
|
||||
break;
|
||||
default:
|
||||
mediaSelectionButton.setVisible(true);
|
||||
mediaSelectionButton.setText(stringMessages.selectVideoCaption(mediaPlayerManagerComponent.getAssignedMediaTracks().size()));
|
||||
mediaSelectionButton.setTitle(stringMessages.selectVideoTooltip());
|
||||
mediaSelectionButton.setText(stringMessages.mediaSelectVideoCaption(mediaPlayerManagerComponent.getAssignedMediaTracks().size()));
|
||||
mediaSelectionButton.setTitle(stringMessages.mediaSelectVideoTooltip());
|
||||
break;
|
||||
}
|
||||
mediaManagementButton.setVisible(mediaPlayerManagerComponent.allowsEditing());
|
||||
@@ -150,7 +150,7 @@ public class SideBySideComponentViewer implements ComponentViewer {
|
||||
private Button createMediaSelectionButton(final MediaPlayerManager mediaPlayerManager) {
|
||||
final Button result = new Button();
|
||||
final MediaSingleSelectionControl multiSelectionControl = new MediaSingleSelectionControl(mediaPlayerManager,
|
||||
result);
|
||||
result, stringMessages);
|
||||
result.addClickHandler(new ClickHandler() {
|
||||
|
||||
@Override
|
||||
@@ -180,11 +180,11 @@ public class SideBySideComponentViewer implements ComponentViewer {
|
||||
* @param userAgent
|
||||
*/
|
||||
private Button createMediaManagementButton(final MediaPlayerManager mediaPlayerManager) {
|
||||
final Button result = new Button(stringMessages.manageMediaCaption());
|
||||
result.setTitle(stringMessages.manageMediaTooltip());
|
||||
final Button result = new Button(stringMessages.mediaManageMediaCaption());
|
||||
result.setTitle(stringMessages.mediaManageMediaTooltip());
|
||||
// onClick
|
||||
final MediaManagementControl multiSelectionControl = new MediaManagementControl(mediaPlayerManager,
|
||||
result);
|
||||
result, stringMessages);
|
||||
result.addClickHandler(new ClickHandler() {
|
||||
|
||||
@Override
|
||||
|
||||
Reference in new issue
Block a user