mirror of
https://github.com/eclipse-sailing-analytics/sailing-analytics.git
synced 2026-09-23 06:06:11 +00:00
bug5510: rework on subscription overview
- added modal dialog with info to business model - added info text to subscription card for showing e.g. 'Everything from plan x plus' - added a list of all features - added documentation to wiki
This commit is contained in:
Udo Wessels
@@ -91,6 +91,8 @@ SAP is at the center of today’s technology revolution, developing innovations
|
||||
* [[Prionet related information|wiki/info/misc/prionet-related-information]]
|
||||
* [[TracTrac Workshop 2013|wiki/info/misc/tractracworkshop2013]]
|
||||
|
||||
* [[Subscriptions|wiki/info/misc/subscriptions]]
|
||||
|
||||
## HowTo
|
||||
|
||||
* [[Onboarding|wiki/howto/onboarding]]
|
||||
|
||||
+188
-96
@@ -1,154 +1,246 @@
|
||||
.content {
|
||||
padding: 0 6px;
|
||||
}
|
||||
|
||||
.feature:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
background-image: resourceUrl("greenCheck");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-position: top left;
|
||||
margin-left: -25px;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
content: "";
|
||||
position: absolute;
|
||||
background-image: resourceUrl("greenCheck");
|
||||
background-repeat: no-repeat;
|
||||
background-size: contain;
|
||||
background-position: top left;
|
||||
margin-left: -25px;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
}
|
||||
|
||||
.feature {
|
||||
padding-left: 25px;
|
||||
margin-bottom: 1em;
|
||||
padding-left: 25px;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.features {
|
||||
margin: 30px;
|
||||
text-align: left;
|
||||
margin: 30px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
|
||||
}
|
||||
|
||||
.owned {
|
||||
|
||||
}
|
||||
|
||||
.free {
|
||||
|
||||
}
|
||||
|
||||
.subscription {
|
||||
order: 20;
|
||||
text-align: center;
|
||||
width: 390px;
|
||||
margin-bottom: 30px;
|
||||
order: 20;
|
||||
text-align: center;
|
||||
width: 390px;
|
||||
margin-bottom: 30px;
|
||||
}
|
||||
/* Small screens */
|
||||
@media (max-width: 400px) {
|
||||
.subscription {
|
||||
width: 100%;
|
||||
margin-right: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
@media ( max-width: 400px) {
|
||||
.subscription {
|
||||
width: 100%;
|
||||
margin-right: 5px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.subscription.individual {
|
||||
order: 999;
|
||||
order: 999;
|
||||
}
|
||||
|
||||
.subscription.highlight {
|
||||
order: 1;
|
||||
order: 1;
|
||||
}
|
||||
|
||||
.subscription.owned {
|
||||
order: 100;
|
||||
order: 100;
|
||||
}
|
||||
|
||||
.subscriptionBody {
|
||||
border: solid;
|
||||
border-width: 1px;
|
||||
border-color: #ddd;
|
||||
border-radius: .333333333333333em;
|
||||
margin-bottom: -50px;
|
||||
height: 100%;
|
||||
border: solid;
|
||||
border-width: 1px;
|
||||
border-color: #ddd;
|
||||
border-radius: .333333333333333em;
|
||||
margin-bottom: -50px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.highlight .subscriptionBody {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: .333333333333333em;
|
||||
border-bottom-right-radius: .333333333333333em;
|
||||
border-color: #8ab54e;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: .333333333333333em;
|
||||
border-bottom-right-radius: .333333333333333em;
|
||||
border-color: #8ab54e;
|
||||
}
|
||||
|
||||
.owned .subscriptionBody {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: .333333333333333em;
|
||||
border-bottom-right-radius: .333333333333333em;
|
||||
border-color: #ddd;
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
border-bottom-left-radius: .333333333333333em;
|
||||
border-bottom-right-radius: .333333333333333em;
|
||||
border-color: #ddd;
|
||||
}
|
||||
|
||||
.subscriptionFooter {
|
||||
|
||||
}
|
||||
|
||||
.highlightHeader {
|
||||
visibility: hidden;
|
||||
border: solid;
|
||||
border-width: 1px;
|
||||
border-top-left-radius: .333333333333333em;
|
||||
border-top-right-radius: .333333333333333em;
|
||||
height: 30px;
|
||||
padding: 5px;
|
||||
color: #fff;
|
||||
font-size: 1em;
|
||||
font-weight: bold;
|
||||
visibility: hidden;
|
||||
border: solid;
|
||||
border-width: 1px;
|
||||
border-top-left-radius: .333333333333333em;
|
||||
border-top-right-radius: .333333333333333em;
|
||||
height: 30px;
|
||||
padding: 5px;
|
||||
color: #fff;
|
||||
font-size: 1em;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.highlight .highlightHeader {
|
||||
visibility: visible;
|
||||
border-color: #8ab54e;
|
||||
background-color: #8ab54e;
|
||||
visibility: visible;
|
||||
border-color: #8ab54e;
|
||||
background-color: #8ab54e;
|
||||
}
|
||||
|
||||
.owned .highlightHeader {
|
||||
visibility: visible;
|
||||
border-color: #ddd;
|
||||
background-color: #ddd;
|
||||
visibility: visible;
|
||||
border-color: #ddd;
|
||||
background-color: #ddd;
|
||||
}
|
||||
|
||||
.title {
|
||||
background-color: #f2f2f2;
|
||||
margin: 0;
|
||||
border-bottom-color: #ddd;
|
||||
min-height: 3em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #f2f2f2;
|
||||
margin: 0;
|
||||
border-bottom-color: #ddd;
|
||||
min-height: 3em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.description {
|
||||
margin: 20px;
|
||||
margin: 20px;
|
||||
}
|
||||
|
||||
.info {
|
||||
|
||||
}
|
||||
|
||||
.price {
|
||||
width: 100%;
|
||||
border: solid;
|
||||
border-width: 1px;
|
||||
border-radius: .333333333333333em;
|
||||
border-color: #ddd;
|
||||
padding: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
width: 100%;
|
||||
border: solid;
|
||||
border-width: 1px;
|
||||
border-radius: .333333333333333em;
|
||||
border-color: #ddd;
|
||||
padding: 0.5em;
|
||||
margin-bottom: 0.5em;
|
||||
font-size: 24px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.price:hover {
|
||||
border-color: #d79900;
|
||||
background-color: #8ab54e;
|
||||
color: #fff;
|
||||
border-color: #d79900;
|
||||
background-color: #8ab54e;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.free .price, .individual .price {
|
||||
border-color: #f0ab00;
|
||||
background-color: #f0ab00;
|
||||
color: #fff;
|
||||
border-color: #f0ab00;
|
||||
background-color: #f0ab00;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.price.selected {
|
||||
background-color: #f0ab00;
|
||||
color: #fff;
|
||||
background-color: #f0ab00;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.free .price:hover, .individual .price:hover {
|
||||
border-color: #d79900;
|
||||
border-color: #d79900;
|
||||
}
|
||||
|
||||
.price.selected:hover {
|
||||
border-color: #d79900;
|
||||
border-color: #d79900;
|
||||
}
|
||||
|
||||
.prices {
|
||||
padding: 1em;
|
||||
width: 100%;
|
||||
padding: 1em;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.subscribe {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 30px;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
margin-bottom: 30px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
gap: 1em;
|
||||
margin-bottom: 1em;
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
gap: 1em;
|
||||
margin-bottom: 1em;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.popupContent {
|
||||
background: rgba(255, 255, 255, 0.95);
|
||||
border-radius: 4px;
|
||||
border: 1px solid #c9caca;
|
||||
margin-top: 5px;
|
||||
max-width: 800px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.popupGlass {
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.subscriptionHeader {
|
||||
width: 100%;
|
||||
display: block;
|
||||
position: relative;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
.hint {
|
||||
position: absolute;
|
||||
color: #333;
|
||||
font-size: 12px;
|
||||
width: 100%;
|
||||
top: 3px;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.hint button {
|
||||
background: none;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 4px;
|
||||
color: #333
|
||||
}
|
||||
|
||||
.hint button:hover {
|
||||
background: #0081b8;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.featureList dt {
|
||||
font-size: 1.2em;
|
||||
font-weight: bold;
|
||||
margin-top: 1em;
|
||||
margin-bottom: 0.5em;
|
||||
}
|
||||
|
||||
.featureList dd {
|
||||
font-size: 1em;
|
||||
font-weight: 600;
|
||||
}
|
||||
+3
@@ -56,6 +56,8 @@ public class SubscriptionCard extends Composite {
|
||||
@UiField
|
||||
HeadingElement description;
|
||||
@UiField
|
||||
HeadingElement info;
|
||||
@UiField
|
||||
FlowPanel prices;
|
||||
@UiField
|
||||
FlowPanel features;
|
||||
@@ -165,6 +167,7 @@ public class SubscriptionCard extends Composite {
|
||||
final SailingSubscriptionStringConstants subscriptionStringConstants = SailingSubscriptionStringConstants.INSTANCE;
|
||||
title.setInnerText(subscriptionStringConstants.getString(subscriptionPlanDTO.getNameMessageKey()));
|
||||
description.setInnerText(subscriptionStringConstants.getString(subscriptionPlanDTO.getDescMessageKey()));
|
||||
info.setInnerText(subscriptionStringConstants.getString(subscriptionPlanDTO.getInfoMessageKey()));
|
||||
final String[] featureStrings = subscriptionStringConstants.getStringArray(subscriptionPlanDTO.getFeatureMessageKey());
|
||||
for (String featureString : featureStrings) {
|
||||
if(featureString != "") {
|
||||
|
||||
+1
@@ -13,6 +13,7 @@
|
||||
<h1 ui:field="title" class="{local.css.title}"></h1>
|
||||
<g:FlowPanel ui:field="prices" styleName="{local.css.prices}"></g:FlowPanel>
|
||||
<h4 ui:field="description" class="{local.css.description}"></h4>
|
||||
<h5 ui:field="info" class="{local.css.info}"></h5>
|
||||
<g:FlowPanel ui:field="features" styleName="{local.css.features}"></g:FlowPanel>
|
||||
</div>
|
||||
<div class="{local.css.subscriptionFooter}">
|
||||
|
||||
+81
-1
@@ -1,28 +1,108 @@
|
||||
package com.sap.sailing.gwt.home.desktop.partials.subscription;
|
||||
|
||||
import com.google.gwt.core.client.GWT;
|
||||
import com.google.gwt.dom.client.DListElement;
|
||||
import com.google.gwt.dom.client.Element;
|
||||
import com.google.gwt.event.dom.client.ClickEvent;
|
||||
import com.google.gwt.safehtml.shared.SafeHtmlBuilder;
|
||||
import com.google.gwt.uibinder.client.UiBinder;
|
||||
import com.google.gwt.uibinder.client.UiField;
|
||||
import com.google.gwt.uibinder.client.UiHandler;
|
||||
import com.google.gwt.user.client.DOM;
|
||||
import com.google.gwt.user.client.ui.Button;
|
||||
import com.google.gwt.user.client.ui.Composite;
|
||||
import com.google.gwt.user.client.ui.FlowPanel;
|
||||
import com.google.gwt.user.client.ui.HTML;
|
||||
import com.google.gwt.user.client.ui.HTMLPanel;
|
||||
import com.google.gwt.user.client.ui.HorizontalPanel;
|
||||
import com.google.gwt.user.client.ui.Label;
|
||||
import com.google.gwt.user.client.ui.PopupPanel;
|
||||
import com.google.gwt.user.client.ui.PopupPanel.AnimationType;
|
||||
import com.google.gwt.user.client.ui.VerticalPanel;
|
||||
import com.google.gwt.user.client.ui.Widget;
|
||||
import com.sap.sse.security.ui.client.i18n.subscription.SubscriptionStringConstants;
|
||||
|
||||
public class SubscriptionCardContainer extends Composite {
|
||||
|
||||
private static SubscriptionContainerUiBinder uiBinder = GWT.create(SubscriptionContainerUiBinder.class);
|
||||
|
||||
@UiField
|
||||
Button businessModelInfoButton;
|
||||
|
||||
interface SubscriptionContainerUiBinder extends UiBinder<Widget, SubscriptionCardContainer> {
|
||||
}
|
||||
|
||||
public SubscriptionCardContainer() {
|
||||
initWidget(uiBinder.createAndBindUi(this));
|
||||
|
||||
addFeature("features_live_analytics");
|
||||
addFeatureWithLink("features_organize_events");
|
||||
addFeature("features_events_with_more_regatta");
|
||||
addFeatureWithLink("features_connect_to_tractrac");
|
||||
addFeature("features_imports");
|
||||
addFeature("features_media_management");
|
||||
addFeature("features_analytic_charts");
|
||||
addFeature("features_map_analytics");
|
||||
addFeature("features_maneuver_analytics");
|
||||
addFeature("features_media_tags");
|
||||
addFeature("features_scoring");
|
||||
}
|
||||
|
||||
private void addFeature(String featureKey) {
|
||||
final Element dt = DOM.createElement("dt");
|
||||
dt.setInnerHTML(SubscriptionStringConstants.INSTANCE.getString(featureKey + "_title"));
|
||||
final Element dd = DOM.createElement("dd");
|
||||
dd.setInnerHTML(SubscriptionStringConstants.INSTANCE.getString(featureKey + "_description"));
|
||||
features.appendChild(dt);
|
||||
features.appendChild(dd);
|
||||
}
|
||||
|
||||
private void addFeatureWithLink(String featureKey) {
|
||||
final Element dt = DOM.createElement("dt");
|
||||
dt.setInnerHTML(SubscriptionStringConstants.INSTANCE.getString(featureKey + "_title"));
|
||||
final Element dd = DOM.createElement("dd");
|
||||
HorizontalPanel description = new HorizontalPanel();
|
||||
description.add(new Label(SubscriptionStringConstants.INSTANCE.getString(featureKey + "_description")));
|
||||
String link = SubscriptionStringConstants.INSTANCE.getString(featureKey + "_link");
|
||||
HTML exampleLink = new HTML("<a href=\""
|
||||
+ new SafeHtmlBuilder().appendEscaped(link).toSafeHtml().asString()
|
||||
+ "\" target=\"_blank\"> "
|
||||
+ new SafeHtmlBuilder().appendEscaped("[...]").toSafeHtml().asString()
|
||||
+ "</a>");
|
||||
description.add(exampleLink);
|
||||
dd.appendChild(description.getElement());
|
||||
features.appendChild(dt);
|
||||
features.appendChild(dd);
|
||||
}
|
||||
|
||||
@UiField
|
||||
FlowPanel container;
|
||||
|
||||
|
||||
@UiField
|
||||
DListElement features;
|
||||
|
||||
public void addSubscription(SubscriptionCard subscription) {
|
||||
container.add(subscription);
|
||||
}
|
||||
|
||||
@UiHandler("businessModelInfoButton")
|
||||
void onClick(ClickEvent e) {
|
||||
VerticalPanel content = new VerticalPanel();
|
||||
HTMLPanel title = new HTMLPanel("h1", SubscriptionStringConstants.INSTANCE.businessModelTitle());
|
||||
content.add(title);
|
||||
Label body = new Label(SubscriptionStringConstants.INSTANCE.businessModelDescription());
|
||||
content.add(body);
|
||||
PopupPanel popup = new PopupPanel();
|
||||
popup.setWidget(content);
|
||||
popup.addStyleName(SubscriptionCardResources.INSTANCE.css().popupContent());
|
||||
popup.setGlassStyleName(SubscriptionCardResources.INSTANCE.css().popupGlass());
|
||||
popup.setAnimationEnabled(true);
|
||||
popup.setAnimationType(AnimationType.CENTER);
|
||||
popup.setGlassEnabled(true);
|
||||
popup.setModal(true);
|
||||
popup.setAutoHideEnabled(true);
|
||||
popup.addAutoHidePartner(businessModelInfoButton.getElement());
|
||||
popup.center();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
+37
-6
@@ -1,13 +1,44 @@
|
||||
<!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">
|
||||
<ui:with field="i18n" type="com.sap.sailing.gwt.ui.client.StringMessages" />
|
||||
<ui:with field="main" type="com.sap.sailing.gwt.common.client.SharedResources" />
|
||||
<ui:with field="local" type="com.sap.sailing.gwt.home.desktop.partials.subscription.SubscriptionCardResources"></ui:with>
|
||||
<ui:with field="i18n"
|
||||
type="com.sap.sailing.gwt.ui.client.StringMessages" />
|
||||
<ui:with field="main"
|
||||
type="com.sap.sailing.gwt.common.client.SharedResources" />
|
||||
<ui:with field="local"
|
||||
type="com.sap.sailing.gwt.home.desktop.partials.subscription.SubscriptionCardResources"></ui:with>
|
||||
<ui:style>
|
||||
</ui:style>
|
||||
<g:HTMLPanel styleName="{main.mediaCss.stackenblochen}">
|
||||
<h1><ui:text from="{i18n.subscriptionPlanOverview}" /></h1>
|
||||
<g:FlowPanel ui:field="container" styleName="{local.css.container}"></g:FlowPanel>
|
||||
<g:HTMLPanel styleName="{main.mediaCss.stackenblochen} {local.css.content}">
|
||||
<div class="{local.css.subscriptionHeader}">
|
||||
<span class="{local.css.hint}">
|
||||
<g:Button ui:field="businessModelInfoButton">
|
||||
<b>ⓘ </b>
|
||||
<ui:text
|
||||
from="{i18n.subscriptionBusinessModelInfoButton}" />
|
||||
</g:Button>
|
||||
</span>
|
||||
</div>
|
||||
<h1>
|
||||
<ui:text from="{i18n.subscriptionPlanOverview}" />
|
||||
</h1>
|
||||
<g:FlowPanel ui:field="container"
|
||||
styleName="{local.css.container}"></g:FlowPanel>
|
||||
<div class="{local.css.subscriptionHeader}">
|
||||
<span class="{local.css.hint}">
|
||||
<g:Button ui:field="emailContact">
|
||||
<ui:text from="{i18n.contactServicesAndInformation}" />
|
||||
<b> ✉</b>
|
||||
</g:Button>
|
||||
</span>
|
||||
<span> </span>
|
||||
</div>
|
||||
<h1>
|
||||
<ui:text from="{i18n.premiumFeatureList}" />
|
||||
</h1>
|
||||
<h2>
|
||||
<ui:text from="{i18n.premiumFeatureListDescription}" />
|
||||
</h2>
|
||||
<dl ui:field="features" class="{local.css.featureList}"></dl>
|
||||
</g:HTMLPanel>
|
||||
</ui:UiBinder>
|
||||
+7
@@ -12,6 +12,7 @@ public interface SubscriptionCardResources extends SharedHomeResources {
|
||||
LocalCss css();
|
||||
|
||||
public interface LocalCss extends CssResource {
|
||||
String content();
|
||||
String free();
|
||||
String feature();
|
||||
String highlight();
|
||||
@@ -20,6 +21,7 @@ public interface SubscriptionCardResources extends SharedHomeResources {
|
||||
String subscription();
|
||||
String title();
|
||||
String description();
|
||||
String info();
|
||||
String price();
|
||||
String selected();
|
||||
String prices();
|
||||
@@ -29,5 +31,10 @@ public interface SubscriptionCardResources extends SharedHomeResources {
|
||||
String highlightHeader();
|
||||
String subscriptionBody();
|
||||
String subscriptionFooter();
|
||||
String popupGlass();
|
||||
String popupContent();
|
||||
String subscriptionHeader();
|
||||
String hint();
|
||||
String featureList();
|
||||
}
|
||||
}
|
||||
|
||||
-9
@@ -43,7 +43,6 @@ public class SubscriptionActivity extends AbstractActivity {
|
||||
view.addSubscriptionPlan(plan, Type.DEFAULT, eventBus);
|
||||
}
|
||||
});
|
||||
addIndividual(eventBus, view);
|
||||
}
|
||||
|
||||
@Override
|
||||
@@ -51,14 +50,6 @@ public class SubscriptionActivity extends AbstractActivity {
|
||||
clientFactory.createErrorView("TODO Failed to load subscription plans", caught);
|
||||
}
|
||||
|
||||
private void addIndividual(final EventBus eventBus, final SubscriptionView view) {
|
||||
final SubscriptionPlanDTO individualPlan = new SubscriptionPlanDTO("individual_subscription_plan" /* id */,
|
||||
/* isUserSubscribedToPlan */ false,
|
||||
Collections.emptySet() /* prices */,
|
||||
null /* error */);
|
||||
view.addSubscriptionPlan(individualPlan, Type.INDIVIDUAL, eventBus);
|
||||
}
|
||||
|
||||
private void addFreePlan(final SubscriptionView view) {
|
||||
final SubscriptionPlanDTO freePlan = new SubscriptionPlanDTO("free_subscription_plan" /* id */,
|
||||
/* isUserSubscribedToPlan */ false,
|
||||
|
||||
@@ -8,6 +8,7 @@ encoding//src/main/java/com/sap/sse/security/ui/client/i18n/StringMessages_ja.pr
|
||||
encoding//src/main/java/com/sap/sse/security/ui/client/i18n/StringMessages_pt.properties=UTF-8
|
||||
encoding//src/main/java/com/sap/sse/security/ui/client/i18n/StringMessages_ru.properties=UTF-8
|
||||
encoding//src/main/java/com/sap/sse/security/ui/client/i18n/StringMessages_zh.properties=UTF-8
|
||||
encoding//src/main/java/com/sap/sse/security/ui/client/i18n/subscription/SubscriptionStringConstants_de.properties=UTF-8
|
||||
encoding//src/main/java/com/sap/sse/security/ui/login/LoginView.java=utf-8
|
||||
encoding//src/main/java/com/sap/sse/security/ui/oauth/client/util/ClientUtils.java=utf-8
|
||||
encoding//src/main/java/com/sap/sse/security/ui/servlet/RedirectServlet.java=utf-8
|
||||
|
||||
+4
@@ -199,6 +199,10 @@ public interface StringMessages extends com.sap.sse.gwt.client.StringMessages {
|
||||
String selectOption();
|
||||
String currentlyUnableToSubscribe();
|
||||
String subscriptionPlanOverview();
|
||||
String subscriptionBusinessModelInfoButton();
|
||||
String contactServicesAndInformation();
|
||||
String premiumFeatureList();
|
||||
String premiumFeatureListDescription();
|
||||
String selectSubscriptionPlan();
|
||||
String features();
|
||||
String price();
|
||||
|
||||
+4
@@ -206,6 +206,10 @@ selectOption=Please select an option.
|
||||
currentlyUnableToSubscribe=Currently unable to create new Subscriptions. Please try again later.
|
||||
subscribe=Subscribe
|
||||
subscriptionPlanOverview=Subscription Plan Overview
|
||||
subscriptionBusinessModelInfoButton=More info about our business model
|
||||
contactServicesAndInformation=Contact us for additional services and information requests
|
||||
premiumFeatureList=Complete Feature List
|
||||
premiumFeatureListDescription=Premium Features That Are Available for Subscriber
|
||||
selectSubscriptionPlan=Please select a subscription plan to subscribe to.
|
||||
features=Features
|
||||
price=Price
|
||||
|
||||
+4
@@ -204,6 +204,10 @@ selectOption=Bitte eine Option auswählen.
|
||||
currentlyUnableToSubscribe=Abschließen eines Abbonements derzeit nicht möglich. Bitte versuchen sie es später erneut.
|
||||
subscribe=Abonnieren
|
||||
subscriptionPlanOverview=Abonnementübersicht
|
||||
subscriptionBusinessModelInfoButton=Weitere Informationen zu unserem Geschäftsmodell
|
||||
contactServicesAndInformation=Kontaktieren Sie uns für zusätzliche Dienstleistungen und Informationsanfragen
|
||||
premiumFeatureList=Vollständige Feature-Liste
|
||||
premiumFeatureListDescription=Premium-Funktionen, die für Abonnenten verfügbar sind
|
||||
selectSubscriptionPlan=Bitte wählen sie einen Abonnementplan aus.
|
||||
features=Enthalten
|
||||
price=Preis
|
||||
|
||||
+34
-6
@@ -8,20 +8,48 @@ import com.google.gwt.i18n.client.LocalizableResource.DefaultLocale;
|
||||
public interface SubscriptionStringConstants extends ConstantsWithLookup {
|
||||
public static final SubscriptionStringConstants INSTANCE = GWT.create(SubscriptionStringConstants.class);
|
||||
|
||||
String free_subscription_plan_name();
|
||||
String free_subscription_plan_description();
|
||||
String[] free_subscription_plan_features();
|
||||
String payment_interval_YEAR();
|
||||
String payment_interval_MONTH();
|
||||
String payment_interval_WEEK();
|
||||
String payment_interval_DAY();
|
||||
String individual_subscription_plan_name();
|
||||
String individual_subscription_plan_description();
|
||||
String[] individual_subscription_plan_features();
|
||||
String businessModelTitle();
|
||||
String businessModelDescription();
|
||||
String free_subscription_plan_name();
|
||||
String free_subscription_plan_description();
|
||||
String free_subscription_plan_info();
|
||||
String[] free_subscription_plan_features();
|
||||
String yearly_premium_name();
|
||||
String yearly_premium_description();
|
||||
String yearly_premium_info();
|
||||
String[] yearly_premium_features();
|
||||
String weekly_premium_name();
|
||||
String weekly_premium_description();
|
||||
String weekly_premium_info();
|
||||
String[] weekly_premium_features();
|
||||
|
||||
String features_live_analytics_title();
|
||||
String features_live_analytics_description();
|
||||
String features_live_analytics_link();
|
||||
String features_organize_events_title();
|
||||
String features_organize_events_description();
|
||||
String features_organize_events_link();
|
||||
String features_events_with_more_regatta_title();
|
||||
String features_events_with_more_regatta_description();
|
||||
String features_connect_to_tractrac_title();
|
||||
String features_connect_to_tractrac_description();
|
||||
String features_connect_to_tractrac_link();
|
||||
String features_imports_title();
|
||||
String features_imports_description();
|
||||
String features_media_management_title();
|
||||
String features_media_management_description();
|
||||
String features_analytic_charts_title();
|
||||
String features_analytic_charts_description();
|
||||
String features_map_analytics_title();
|
||||
String features_map_analytics_description();
|
||||
String features_maneuver_analytics_title();
|
||||
String features_maneuver_analytics_description();
|
||||
String features_media_tags_title();
|
||||
String features_media_tags_description();
|
||||
String features_scoring_title();
|
||||
String features_scoring_description();
|
||||
}
|
||||
|
||||
+53
-10
@@ -1,16 +1,59 @@
|
||||
free_subscription_plan_name=Free
|
||||
free_subscription_plan_description=Try it out
|
||||
free_subscription_plan_features=Start your first steps in SAP sailing, Use basic features of SAP Sailing Analytics, Have a look on SAP Sailing Race Manager, Try more features and functions that will improve your life in sailing
|
||||
payment_interval_YEAR=year
|
||||
payment_interval_MONTH=month
|
||||
payment_interval_WEEK=week
|
||||
payment_interval_DAY=day
|
||||
individual_subscription_plan_name=Enterprise
|
||||
individual_subscription_plan_description=For individual offer contact us!
|
||||
individual_subscription_plan_features=
|
||||
businessModelTitle=Business Model
|
||||
businessModelDescription=We decided to extend our free solution by a Subscription Business Model. \
|
||||
But why did we do it? \
|
||||
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt \
|
||||
ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo \
|
||||
dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit \
|
||||
amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor \
|
||||
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et \
|
||||
justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum \
|
||||
dolor sit amet.
|
||||
|
||||
free_subscription_plan_name=Free
|
||||
free_subscription_plan_description=Try it out
|
||||
free_subscription_plan_info=
|
||||
free_subscription_plan_features=Basic live wind based leaderboard,\
|
||||
Create your own account and carry out the sailing analytics for your regatta or training with our \
|
||||
free tracking app or a professional tracking service,\
|
||||
Sync live YouTube videos with your races
|
||||
yearly_premium_name=Yearly Premium
|
||||
yearly_premium_description=Premium for a year. Reocuring
|
||||
yearly_premium_features=Everything in weekly, Additional Features
|
||||
yearly_premium_description=Full Access to all Features for one Year (auto renewing)
|
||||
yearly_premium_info=Everything from Weekly Premium plus:
|
||||
yearly_premium_features=\
|
||||
Place and read comments (notes and images on timeline)
|
||||
weekly_premium_name=Weekly Premium
|
||||
weekly_premium_description=One week premium. Non-Reocuring
|
||||
weekly_premium_features=Show streamlets, Additional Leaderboard info, Analysis-Charts
|
||||
weekly_premium_description=Full Access to all Features for one Week (one time payment)
|
||||
weekly_premium_info=Everything from free plan plus:
|
||||
weekly_premium_features=\
|
||||
Full Live Analytics with hundreds of features including wind streamlets, comparison charts, \
|
||||
advanced in-map visualizations and much more. See full premium feature-list below\u00A0\u21E9, \
|
||||
Tag Personal Timeline with Videos and Notes
|
||||
features_live_analytics_title=Live Analytics
|
||||
features_live_analytics_description=Full Live Analytics with hundreds of features including wind streamlets, comparison charts, advanced map visualizations and much more.
|
||||
features_live_analytics_link=https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_480_1_5MG.mp4
|
||||
features_organize_events_title=Organize Events
|
||||
features_organize_events_description=Run the Sailing Analytics at your Regatta with our free tracking app or a professional tracking service*. (below: *Like Trac Trac ) Maneuever detection and Analytics
|
||||
features_organize_events_link=https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_480_1_5MG.mp4
|
||||
features_events_with_more_regatta_title=Events with more than one regatta
|
||||
features_events_with_more_regatta_description=-
|
||||
features_connect_to_tractrac_title=Connect to Trac Trac
|
||||
features_connect_to_tractrac_description=Connect to professional tracking service
|
||||
features_connect_to_tractrac_link=https://tractrac.com/
|
||||
features_imports_title=Import external data
|
||||
features_imports_description=Import GPX and KML file formats
|
||||
features_media_management_title=Media Management
|
||||
features_media_management_description=Integrate/upload and replay video and Pictures
|
||||
features_analytic_charts_title=Analytic Charts
|
||||
features_analytic_charts_description=Charts like...
|
||||
features_map_analytics_title=Map Analytics
|
||||
features_map_analytics_description=Wind streamlets and boatspeed vizualization
|
||||
features_maneuver_analytics_title=Maneuver Analytics
|
||||
features_maneuver_analytics_description=-
|
||||
features_media_tags_title=Link and upload media (tags)
|
||||
features_media_tags_description=-
|
||||
features_scoring_title=Scoring
|
||||
features_scoring_description=ORC PCS scoring
|
||||
|
||||
+50
-8
@@ -1,15 +1,57 @@
|
||||
free_subscription_plan_name=Free
|
||||
free_subscription_plan_description=Probier es aus
|
||||
free_subscription_plan_features=Starten Sie Ihre ersten Schritte in SAP sailing, Grundfunktionen von SAP Sailing Analytics nutzen, Werfen Sie einen Blick auf den SAP Sailing Race Manager, free_subscription_plan_features=Probieren Sie weitere Features und Funktionen aus, die Ihr Leben beim Segeln verbessern werden
|
||||
payment_interval_YEAR=Jahr
|
||||
payment_interval_MONTH=Monat
|
||||
payment_interval_WEEK=Woche
|
||||
payment_interval_DAY=Tag
|
||||
individual_subscription_plan_name=Enterprise
|
||||
individual_subscription_plan_description=Für ein individuelles Angebot kontaktieren Sie uns!
|
||||
individual_subscription_plan_features=
|
||||
businessModelTitle=Business Model
|
||||
businessModelDescription=Wir haben uns entschieden, unsere kostenlose Lösung um ein Abonnement-Gesch�ftsmodell zu erweitern. \
|
||||
Aber warum haben wir es getan? \
|
||||
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt \
|
||||
ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo \
|
||||
dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit \
|
||||
amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor \
|
||||
invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et \
|
||||
justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum \
|
||||
dolor sit amet.
|
||||
free_subscription_plan_name=Free
|
||||
free_subscription_plan_description=Probier es aus
|
||||
free_subscription_plan_info=
|
||||
free_subscription_plan_features=Standart Live-Wind-basierte Bestenliste,\
|
||||
Erstellen Sie Ihr eigenes Konto und führen Sie die Segelanalyse für Ihre Regatta oder Ihr Training mit unserer kostenlosen Tracking-App oder einem professionellen Tracking-Service durch,\
|
||||
Synchronisiere YouTube-Videos mit deinen Rennen
|
||||
yearly_premium_name=Jahresabo
|
||||
yearly_premium_description=Ein Jahr Premium. Wiederkehrend.
|
||||
yearly_premium_features=Alles in weekly, Zusätzliche Features
|
||||
yearly_premium_info=Alles aus dem Jahresabo plus:
|
||||
yearly_premium_features=Alles in weekly, Zusätzliche Features
|
||||
weekly_premium_name=Wochenabo
|
||||
weekly_premium_description=Eine Woche Premium. Nicht wiederkehrend, Streamlets anzeigen, Zusätzliche Leaderboard Info, Analyse-Charts
|
||||
weekly_premium_description=Voller Zugriff auf alle Funktionen für eine Woche (einmalige Zahlung)
|
||||
weekly_premium_info=Alles vom kostenlosen Plan plus:
|
||||
weekly_premium_features=\
|
||||
Vollständige Live-Analyse mit Hunderten von Funktionen, einschließlich Windströmungen, Vergleichstabellen, \
|
||||
erweiterte In-Map-Visualisierungen und vieles mehr. Siehe die vollständige Liste der Premiumfunktionen unten\u00A0\u21E9, \
|
||||
Kennzeichnen Sie die persönliche Timeline mit Videos und Notizen
|
||||
features_live_analytics_title=Live Analytics
|
||||
features_live_analytics_description=Vollständige Live-Analyse mit Hunderten von Funktionen, darunter Windströmungen, Vergleichsdiagramme, erweiterte Kartenvisualisierungen und vieles mehr.
|
||||
features_live_analytics_link=https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_480_1_5MG.mp4
|
||||
features_organize_events_title=Veranstaltungen organisieren
|
||||
features_organize_events_description=Führen Sie die Sailing Analytics bei Ihrer Regatta mit unserer kostenlosen Tracking-App oder einem professionellen Tracking-Service* durch. (unten: *Wie Trac Trac) Manövererkennung und Analyse
|
||||
features_organize_events_link=https://file-examples-com.github.io/uploads/2017/04/file_example_MP4_480_1_5MG.mp4
|
||||
features_events_with_more_regatta_title=Veranstaltungen mit mehr als einer Regatta
|
||||
features_events_with_more_regatta_description=-
|
||||
features_connect_to_tractrac_title=Mit Trac Trac verbinden
|
||||
features_connect_to_tractrac_description=Verbinden Sie sich mit einem professionellen Tracking-Service
|
||||
features_connect_to_tractrac_link=https://tractrac.com/
|
||||
features_imports_title=Externe Daten importieren
|
||||
features_imports_description=GPX- und KML-Dateiformate importieren
|
||||
features_media_management_title=Media Management
|
||||
features_media_management_description=Integrieren/hochladen und wiedergeben von Videos und Bildern
|
||||
features_analytic_charts_title=Analysediagramme
|
||||
features_analytic_charts_description=...
|
||||
features_map_analytics_title=Map Analytics
|
||||
features_map_analytics_description=Visualisierung von Windströmungen und Bootsgeschwindigkeit
|
||||
features_maneuver_analytics_title=Manöveranalyse
|
||||
features_maneuver_analytics_description=-
|
||||
features_media_tags_title=LMedien verlinken und hochladen (Tags)
|
||||
features_media_tags_description=-
|
||||
features_scoring_title=Scoring
|
||||
features_scoring_description=ORC PCS Wertungen
|
||||
|
||||
|
||||
+5
@@ -14,6 +14,7 @@ public class SubscriptionPlanDTO implements IsSerializable {
|
||||
private static final String FEATURES_MESSAGE_KEY_SUFFX = "_features";
|
||||
private static final String NAME_MESSAGE_KEY_SUFFX = "_name";
|
||||
private static final String DESC_MESSAGE_KEY_SUFFX = "_description";
|
||||
private static final String INFO_MESSAGE_KEY_SUFFIX = "_info";
|
||||
private static final long serialVersionUID = -1990028347487353679L;
|
||||
private String id;
|
||||
private HashSet<SubscriptionPrice> prices = new HashSet<SubscriptionPrice>();
|
||||
@@ -58,6 +59,10 @@ public class SubscriptionPlanDTO implements IsSerializable {
|
||||
return this.id + DESC_MESSAGE_KEY_SUFFX;
|
||||
}
|
||||
|
||||
public String getInfoMessageKey() {
|
||||
return this.id + INFO_MESSAGE_KEY_SUFFIX;
|
||||
}
|
||||
|
||||
public String getFeatureMessageKey() {
|
||||
return this.id + FEATURES_MESSAGE_KEY_SUFFX;
|
||||
}
|
||||
|
||||
@@ -0,0 +1,71 @@
|
||||
# Subscriptions
|
||||
|
||||
## Subscription Overview Page
|
||||
|
||||
The subscription overview page includes a set of subscription cards, like the free plan but also the plans subscribable by Chargebee.
|
||||
|
||||
Additionally there is a detailed list of all features which are included in a paid subscription.
|
||||
|
||||
### Add a subscription plan
|
||||
|
||||
1. Create a plan in Chargebee. We need afterwards the plan ID and price ID
|
||||
2. Add a plan definition in class
|
||||
|
||||
com.sap.sailing.domain.common.subscription.SailingSubscriptionPlan
|
||||
|
||||
A plan definition includes the plan and price IDs and a list of connected roles.
|
||||
|
||||
3. Add following texts to class (and related property files)
|
||||
|
||||
com.sap.sse.security.ui.client.i18n.subscription.SubscriptionStringConstants
|
||||
|
||||
- `<PLAN-ID>_name`
|
||||
- Name or title of the plan (`<H1>`)
|
||||
- `<PLAN-ID>_description`
|
||||
- A short description of the plan content (`<H4>`)
|
||||
- `<PLAN-ID>_info`
|
||||
- Can be uses for additional info (`<H5>`)
|
||||
- `<PLAN-ID>_features`
|
||||
- Comma separated list of feature labels
|
||||
|
||||
|
||||
### Business Model Info
|
||||
|
||||
To edit text of business model description you can adjust the texts in resouce class (and related property files)
|
||||
|
||||
com.sap.sse.security.ui.client.i18n.subscription.SubscriptionStringConstants
|
||||
|
||||
- `businessModelTitle`
|
||||
- Titel of text shown in modal dialog
|
||||
- `businessModelDescription`
|
||||
- The text body of the modal dialog
|
||||
|
||||
### Features
|
||||
|
||||
To add, remove or edit a feature of the feature list
|
||||
|
||||
1. Add following texts to class (and related property files)
|
||||
|
||||
com.sap.sse.security.ui.client.i18n.subscription.SubscriptionStringConstants
|
||||
|
||||
- `<FEATURE-ID>_title`
|
||||
- Name or title of the feature
|
||||
- `<FEATURE-ID>_description`
|
||||
- A description of the feature
|
||||
- `<FEATURE-ID>_link`
|
||||
- An optional link to an external resource like picture, video or homepage
|
||||
|
||||
2. Register feateure with the <FEATURE-ID> in class
|
||||
|
||||
com.sap.sailing.gwt.home.desktop.partials.subscription.SubscriptionCardContainer
|
||||
|
||||
as pure textual feature or feature with link.
|
||||
|
||||
public SubscriptionCardContainer() {
|
||||
initWidget(uiBinder.createAndBindUi(this));
|
||||
addFeature("features_live_analytics");
|
||||
addFeatureWithLink("features_organize_events");
|
||||
|
||||
### Further Resources
|
||||
|
||||
com.sap.sse.security.ui.client.i18n.StringMessages
|
||||
Reference in New Issue
Block a user