Countdown initial styling

This commit is contained in:
Papick Garcia Taboada committed 2015-07-21 16:59:55 +02:00
1 parent e464526fe6
commit 9ed2f88428
8 files changed
+28 -83

No files matched your search

@@ -6,6 +6,7 @@
}
.countdown_content_panewrapper {
font-size: 0;
margin: auto;
}
.countdown_content_pane {
border: 0.2em solid #fff;
@@ -3,7 +3,7 @@
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.ui.client.StringMessages" />
<ui:with field="res" type="com.sap.sailing.gwt.common.client.SharedResources" />
<ui:with field="res" type="com.sap.sailing.gwt.home.mobile.resources.SharedResources" />
<ui:with field="local_res" type="com.sap.sailing.gwt.home.mobile.partials.countdown.CountdownResources" />
<g:HTMLPanel addStyleNames="{local_res.css.countdown}">
<div ui:field="image" class="{local_res.css.countdown_image}"></div>
@@ -27,6 +27,7 @@ public class CountdownTicker extends Composite {
private final Countdown countdown;
public CountdownTicker(Date startTime) {
CountdownResources.INSTANCE.css().ensureInjected();
initWidget(uiBinder.createAndBindUi(this));
this.countdown = new Countdown(new MillisecondsTimePoint(startTime), new CountdownTickerListener());
}
@@ -1,7 +1,5 @@
package com.sap.sailing.gwt.home.mobile.partials.stage;
import com.google.gwt.dom.client.Style.Display;
import com.google.gwt.dom.client.Style.Visibility;
import com.sap.sailing.gwt.home.mobile.app.MobilePlacesNavigator;
import com.sap.sailing.gwt.ui.shared.start.EventStageDTO;
@@ -15,8 +13,6 @@ public class LiveEventStageTeaser extends StageTeaser {
title.setInnerText(event.getDisplayName());
subtitle.setInnerText(event.getLocationAndVenue());
countdown.getStyle().setDisplay(Display.NONE);
countdown.getStyle().setVisibility(Visibility.HIDDEN);
bandCount.setAttribute("data-bandcount", "1");
@@ -1,6 +1,5 @@
package com.sap.sailing.gwt.home.mobile.partials.stage;
import com.google.gwt.dom.client.Style.Display;
import com.sap.sailing.gwt.home.mobile.app.MobilePlacesNavigator;
import com.sap.sailing.gwt.ui.shared.start.EventStageDTO;
@@ -13,9 +12,6 @@ public class PopularEventStageTeaser extends StageTeaser {
title.setInnerText(event.getDisplayName());
subtitle.setInnerText(event.getLocationAndVenue());
countdown.getStyle().setDisplay(Display.NONE);
bandCount.setAttribute("data-bandcount", "1");
teaserBand = new PopularEventStageTeaserBand(event, placeNavigator);
stageTeaserBandsPanel.getElement().appendChild(teaserBand.getElement());
@@ -5,8 +5,6 @@ import com.google.gwt.dom.client.DivElement;
import com.google.gwt.dom.client.Element;
import com.google.gwt.dom.client.EventTarget;
import com.google.gwt.dom.client.SpanElement;
import com.google.gwt.dom.client.Style.Display;
import com.google.gwt.dom.client.Style.Visibility;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.uibinder.client.UiBinder;
@@ -14,9 +12,7 @@ import com.google.gwt.uibinder.client.UiField;
import com.google.gwt.user.client.ui.Composite;
import com.google.gwt.user.client.ui.HTMLPanel;
import com.google.gwt.user.client.ui.Widget;
import com.sap.sailing.gwt.home.client.shared.Countdown;
import com.sap.sailing.gwt.home.client.shared.Countdown.CountdownListener;
import com.sap.sailing.gwt.home.client.shared.Countdown.RemainingTime;
import com.sap.sailing.gwt.home.mobile.partials.countdown.CountdownTicker;
import com.sap.sailing.gwt.ui.shared.start.EventStageDTO;
import com.sap.sse.common.TimePoint;
import com.sap.sse.common.impl.MillisecondsTimePoint;
@@ -29,20 +25,8 @@ public abstract class StageTeaser extends Composite implements LazyLoadable {
SpanElement subtitle;
@UiField
SpanElement title;
@UiField
DivElement countdown;
@UiField
DivElement countdownMajor;
@UiField
DivElement countdownMajorValue;
@UiField
DivElement countdownMajorUnit;
@UiField
DivElement countdownMinor;
@UiField
DivElement countdownMinorValue;
@UiField
DivElement countdownMinorUnit;
@UiField(provided = true)
CountdownTicker countdownTickerUi;
@UiField
HTMLPanel stageTeaserBandsPanel;
@UiField
@@ -70,18 +54,10 @@ public abstract class StageTeaser extends Composite implements LazyLoadable {
public StageTeaser(EventStageDTO event) {
this.event = event;
StageResources.INSTANCE.css().ensureInjected();
initWidget(uiBinder.createAndBindUi(this));
TimePoint eventStart = new MillisecondsTimePoint(event.getStartDate());
CountdownListener countdownListener = new CountdownListener() {
@Override
public void changed(RemainingTime major, RemainingTime minor) {
updateCountdown(major, minor);
}
};
new Countdown(eventStart, countdownListener);
countdownTickerUi = new CountdownTicker(eventStart.asDate());
initWidget(uiBinder.createAndBindUi(this));
addDomHandler(new ClickHandler() {
@@ -101,33 +77,5 @@ public abstract class StageTeaser extends Composite implements LazyLoadable {
}, ClickEvent.getType());
}
private void updateCountdown(RemainingTime major, RemainingTime minor) {
if (major == null && minor == null) {
countdownMajorValue.setInnerHTML(null);
countdownMajorUnit.setInnerHTML(null);
countdownMinorValue.setInnerHTML(null);
countdownMinorUnit.setInnerHTML(null);
countdown.getStyle().setDisplay(Display.NONE);
countdown.getStyle().setVisibility(Visibility.HIDDEN);
} else {
if (major != null) {
countdownMajorValue.setInnerHTML(String.valueOf(major.value));
countdownMajorUnit.setInnerHTML(String.valueOf(major.unitI18n()));
} else {
countdownMajorValue.setInnerHTML(null);
countdownMajorUnit.setInnerHTML(null);
countdownMajor.getStyle().setDisplay(Display.NONE);
countdownMajor.getStyle().setVisibility(Visibility.HIDDEN);
}
if (minor != null) {
countdownMinorValue.setInnerHTML(String.valueOf(minor.value));
countdownMinorUnit.setInnerHTML(String.valueOf(minor.unitI18n()));
} else {
countdownMinorValue.setInnerHTML(null);
countdownMinorUnit.setInnerHTML(null);
countdownMinor.getStyle().setDisplay(Display.NONE);
countdownMinor.getStyle().setVisibility(Visibility.HIDDEN);
}
}
}
}
@@ -1,34 +1,36 @@
<!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">
xmlns:g="urn:import:com.google.gwt.user.client.ui"
xmlns:s="urn:import:com.sap.sailing.gwt.home.client.shared"
xmlns:mp="urn:import:com.sap.sailing.gwt.home.mobile.partials"
>
<ui:with field="i18n" type="com.sap.sailing.gwt.common.client.i18n.TextMessages" />
<ui:with field="res" type="com.sap.sailing.gwt.home.mobile.resources.SharedResources" />
<ui:with field="local_res" type="com.sap.sailing.gwt.home.mobile.partials.stage.StageResources" />
<ui:style>
.countdownPosition {
position: absolute;
top: 1em;
width: 100%;
}
</ui:style>
<g:HTMLPanel styleName="{local_res.css.stageteaser} {local_res.css.swiperslide}">
<div class="{local_res.css.stageteaser_background}">
<div ui:field="teaserImage" class="{local_res.css.stageteaser_background_image}" />
</div>
<div class="{local_res.css.stageteaser_content}" style="display:none;">
<header class="{local_res.css.stageteaser_content_header}">
<p class="{local_res.css.stageteaser_content_header_subtitle}">
<div class="{local_res.css.stageteaser_content}" >
<header class="{local_res.css.stageteaser_content_header}" style="display:none;">
<p class="{local_res.css.stageteaser_content_header_subtitle}" >
<span ui:field="subtitle"/>
</p>
<h2 class="{local_res.css.stageteaser_content_header_title}">
<span ui:field="title" />
</h2>
<div ui:field="countdown" class="{local_res.css.stageteaser_content_header_countdown} {local_res.css.countdown}">
<div ui:field="countdownMajor" class="{local_res.css.countdown_pane}">
<div ui:field="countdownMajorValue" class="{local_res.css.countdown_pane_count}"></div>
<div ui:field="countdownMajorUnit" class="{local_res.css.countdown_pane_unit}"></div>
</div>
<div ui:field="countdownMinor" class="{local_res.css.countdown_pane}">
<div ui:field="countdownMinorValue" class="{local_res.css.countdown_pane_count}"></div>
<div ui:field="countdownMinorUnit" class="{local_res.css.countdown_pane_unit}"></div>
</div>
</div>
</header>
</div>
<div class="{style.countdownPosition}">
<mp:countdown.CountdownTicker ui:field="countdownTickerUi" />
</div>
<div ui:field="bandCount" data-bandcount="" class="{local_res.css.stageteaser_content_band}">
<div class="{res.mediaCss.grid}">
<g:HTMLPanel ui:field="stageTeaserBandsPanel" />
@@ -1,6 +1,7 @@
<!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" xmlns:mp="urn:import:com.sap.sailing.gwt.home.mobile.partials">
xmlns:s="urn:import:com.sap.sailing.gwt.home.client.shared"
xmlns:mp="urn:import:com.sap.sailing.gwt.home.mobile.partials">
<ui:with field="i18n" type="com.sap.sailing.gwt.ui.client.StringMessages" />
<ui:with field="res" type="com.sap.sailing.gwt.home.mobile.resources.SharedResources" />
<ui:with field="local_res" type="com.sap.sailing.gwt.home.mobile.partials.statisticsBox.StatisticsBoxResources" />