Add API to set globalOptions

vaadin/vaadin-charts-flow#357 Fixes: Web-component: vaadin-charts
vaadin · Jun 10, 2020 · a197dbc · a197dbc
1 parent b135af0
commit a197dbc
Show file tree

Hide file tree

Showing 9 changed files with 452 additions and 4 deletions.
diff --git a/...low-demo/src/main/java/com/vaadin/flow/component/charts/examples/other/GlobalOptions.java b/...low-demo/src/main/java/com/vaadin/flow/component/charts/examples/other/GlobalOptions.java
@@ -0,0 +1,78 @@
+package com.vaadin.flow.component.charts.examples.other;
+
+import com.vaadin.flow.component.charts.AbstractChartExample;
+import com.vaadin.flow.component.charts.Chart;
+import com.vaadin.flow.component.charts.ChartOptions;
+import com.vaadin.flow.component.charts.SkipFromDemo;
+import com.vaadin.flow.component.charts.model.AxisType;
+import com.vaadin.flow.component.charts.model.ChartType;
+import com.vaadin.flow.component.charts.model.Configuration;
+import com.vaadin.flow.component.charts.model.IntervalUnit;
+import com.vaadin.flow.component.charts.model.Lang;
+import com.vaadin.flow.component.charts.model.ListSeries;
+import com.vaadin.flow.component.charts.model.PlotOptionsSeries;
+import com.vaadin.flow.component.charts.model.Tooltip;
+import com.vaadin.flow.component.charts.model.XAxis;
+import com.vaadin.flow.component.charts.model.YAxis;
+import com.vaadin.flow.component.html.NativeButton;
+
+@SkipFromDemo
+public class GlobalOptions extends AbstractChartExample {
+
+    @Override
+    public void initDemo() {
+        NativeButton changeTitleButton = new NativeButton();
+        changeTitleButton.setId("add_chart");
+        changeTitleButton.setText("Add chart");
+        changeTitleButton.addClickListener(e -> {
+            final Chart chart = new Chart();
+
+            Configuration configuration = chart.getConfiguration();
+            configuration.setTitle("First Chart for Flow");
+            chart.getConfiguration().getChart().setType(ChartType.AREA);
+            Tooltip tooltip = configuration.getTooltip();
+            tooltip.setEnabled(true);
+            tooltip.setShared(true);
+
+            PlotOptionsSeries options = new PlotOptionsSeries();
+            options.setPointStart(0);
+            options.setPointIntervalUnit(IntervalUnit.DAY);
+            configuration.setPlotOptions(options);
+            configuration.addSeries(new ListSeries("Tokyo", 20, 12, 34, 23, 65,
+                    8, 4, 7, 76, 19, 20, 8));
+            configuration.addSeries(new ListSeries("Miami", 34, 29, 23, 65, 8,
+                    4, 7, 7, 59, 8, 9, 19));
+
+            XAxis x = new XAxis();
+            x.setType(AxisType.DATETIME);
+            x.getLabels().setFormat("{value:%a}");
+            configuration.addxAxis(x);
+            YAxis y = new YAxis();
+            y.setMin(0);
+            y.setTitle("Rainfall (mm)");
+            configuration.addyAxis(y);
+            add(chart);
+        });
+        add(changeTitleButton);
+
+        NativeButton changeLangButton = new NativeButton();
+        changeLangButton.setId("change_lang");
+        changeLangButton.setText("Change lang");
+        changeLangButton.addClickListener(e -> {
+            Lang lang = new Lang();
+            lang.setShortMonths(new String[] { "Tammi", "Helmi", "Maalis",
+                    "Huhti", "Touko", "Kesä", "Heinä", "Elo", "Syys", "Loka",
+                    "Marras", "Joulu" });
+            lang.setMonths(new String[] { "Tammikuu", "Helmikuu", "Maaliskuu",
+                    "Huhtikuu", "Toukokuu", "Kesäkuu", "Heinäkuu", "Elokuu",
+                    "Syyskuu", "Lokakuu", "Marraskuu", "Joulukuu" });
+            lang.setWeekdays(new String[] { "Sunnuntai", "Maanantai", "Tiistai",
+                    "Keskiviikko", "Torstai", "Perjantai", "Lauantai" });
+            lang.setShortWeekdays(
+                    new String[] { "su", "ma", "ti", "ke", "to", "pe", "la" });
+            ChartOptions.get().setLang(lang);
+        });
+        add(changeLangButton);
+    }
+
+}
diff --git a/...ts-flow-integration-tests/src/main/java/com/vaadin/flow/component/charts/ui/MainView.java b/...ts-flow-integration-tests/src/main/java/com/vaadin/flow/component/charts/ui/MainView.java
@@ -21,7 +21,6 @@
 import com.vaadin.flow.component.Component;
 import com.vaadin.flow.component.charts.AbstractChartExample;
 import com.vaadin.flow.component.charts.examples.area.AreaChart;
-import com.vaadin.flow.component.charts.examples.dynamic.ServerSideEvents;
 import com.vaadin.flow.component.dependency.StyleSheet;
 import com.vaadin.flow.component.html.Div;
 import com.vaadin.flow.router.BeforeEvent;
@@ -39,8 +38,6 @@ public class MainView extends Div implements HasUrlParameter<String> {
 
     @Override
     public void setParameter(BeforeEvent event, @WildcardParameter String parameter) {
-        // workaround for https://github.com/vaadin/flow/issues/5509
-        new ServerSideEvents();
         removeAll();
         Optional<Component> content = getContentFromParameter(parameter);
         if (content.isPresent()) {

diff --git a/...tegration-tests/src/test/java/com/vaadin/flow/component/charts/tests/GlobalOptionsIT.java b/...tegration-tests/src/test/java/com/vaadin/flow/component/charts/tests/GlobalOptionsIT.java
@@ -0,0 +1,84 @@
+/*
+ * #%L
+ * Vaadin Charts
+ * %%
+ * Copyright (C) 2014 Vaadin Ltd
+ * %%
+ * This program is available under Commercial Vaadin Add-On License 3.0
+ * (CVALv3).
+ *
+ * See the file licensing.txt distributed with this software for more
+ * information about licensing.
+ *
+ * You should have received a copy of the CVALv3 along with this program.
+ * If not, see <https://vaadin.com/license/cval-3>.
+ * #L%
+ */
+package com.vaadin.flow.component.charts.tests;
+
+import java.text.DateFormatSymbols;
+import java.util.Arrays;
+import java.util.List;
+import java.util.Locale;
+import java.util.stream.Collectors;
+
+import org.junit.Assert;
+import org.junit.Test;
+import org.openqa.selenium.By;
+import org.openqa.selenium.WebElement;
+
+import com.vaadin.flow.component.charts.AbstractChartExample;
+import com.vaadin.flow.component.charts.examples.other.GlobalOptions;
+import com.vaadin.flow.component.charts.testbench.ChartElement;
+
+public class GlobalOptionsIT extends AbstractTBTest {
+
+    @Override
+    protected Class<? extends AbstractChartExample> getTestView() {
+        return GlobalOptions.class;
+    }
+
+    @Test
+    public void addChart_defaultLangUsed() {
+        addChart();
+        final ChartElement chart = getChartElement();
+        assertAxisLabels(chart, Locale.ENGLISH);
+    }
+
+    @Test
+    public void addChart_setLang_newLangUsed() {
+        addChart();
+        final ChartElement chart = getChartElement();
+        assertAxisLabels(chart, Locale.ENGLISH);
+        setLang();
+        assertAxisLabels(chart, new Locale("fi"));
+    }
+
+    @Test
+    public void setLang_addChart_newLangUsed() {
+        setLang();
+        addChart();
+        final ChartElement chart = getChartElement();
+        assertAxisLabels(chart, new Locale("fi"));
+    }
+
+    private void addChart() {
+        findElement(By.id("add_chart")).click();
+    }
+
+    private void setLang() {
+        findElement(By.id("change_lang")).click();
+    }
+
+    private void assertAxisLabels(ChartElement chart, Locale locale) {
+        WebElement container = chart.$("div").id("chart");
+        List<WebElement> axisLabels = container.findElements(
+                By.cssSelector(".highcharts-xaxis-labels > text"));
+        List<String> actual = axisLabels.stream().map(WebElement::getText)
+                .collect(Collectors.toList());
+        List<String> expected = Arrays
+                .asList(new DateFormatSymbols(locale).getShortWeekdays());
+        Assert.assertTrue(expected.containsAll(actual));
+    }
+
+}
diff --git a/vaadin-charts-flow-parent/vaadin-charts-flow/pom.xml b/vaadin-charts-flow-parent/vaadin-charts-flow/pom.xml
@@ -43,6 +43,11 @@
             <version>3.1.0</version>
             <scope>test</scope>
         </dependency>
+        <dependency>
+            <groupId>org.mockito</groupId>
+            <artifactId>mockito-all</artifactId>
+            <scope>test</scope>
+        </dependency>
     </dependencies>
 
     <build>

diff --git a/...-flow-parent/vaadin-charts-flow/src/main/java/com/vaadin/flow/component/charts/Chart.java b/...-flow-parent/vaadin-charts-flow/src/main/java/com/vaadin/flow/component/charts/Chart.java
@@ -70,7 +70,7 @@
 import elemental.json.impl.JreJsonFactory;
 
 @Tag("vaadin-chart")
-@NpmPackage(value="@vaadin/vaadin-charts", version = "7.0.0-alpha2")
+@NpmPackage(value="@vaadin/vaadin-charts", version = "7.0.0-alpha3")
 @JsModule("@vaadin/vaadin-charts/vaadin-chart.js")
 public class Chart extends Component implements HasStyle, HasSize {
 

diff --git a/...arent/vaadin-charts-flow/src/main/java/com/vaadin/flow/component/charts/ChartOptions.java b/...arent/vaadin-charts-flow/src/main/java/com/vaadin/flow/component/charts/ChartOptions.java
@@ -0,0 +1,110 @@
+package com.vaadin.flow.component.charts;
+
+import java.util.Objects;
+
+import com.vaadin.flow.component.ComponentUtil;
+import com.vaadin.flow.component.UI;
+import com.vaadin.flow.component.charts.model.AbstractConfigurationObject;
+import com.vaadin.flow.component.charts.model.Lang;
+import com.vaadin.flow.component.charts.util.ChartSerialization;
+
+import elemental.json.JsonObject;
+import elemental.json.impl.JreJsonFactory;
+
+/**
+ * The ChartOptions configures a page local global options like localized texts
+ * for charts.
+ * <p>
+ * Use {@link ChartOptions#get()} or {@link ChartOptions#get(UI)} to get an
+ * instance for the current or specified {@link UI}.
+ */
+public class ChartOptions extends AbstractConfigurationObject {
+
+    private Lang lang;
+    private transient JreJsonFactory jsonFactory;
+
+    protected ChartOptions() {
+    }
+
+    private JreJsonFactory getJsonFactory() {
+        if (jsonFactory == null) {
+            jsonFactory = new JreJsonFactory();
+        }
+        return jsonFactory;
+    }
+
+    private void updateOptions() {
+        UI ui = UI.getCurrent();
+
+        if (ui == null) {
+            return;
+        }
+
+        JsonObject configurationNode = getJsonFactory()
+                .parse(ChartSerialization.toJSON(this));
+        ui.getElement().executeJs(
+                "customElements.get('vaadin-chart').__callHighchartsFunction('setOptions',$0,$1)",
+                true, configurationNode);
+    }
+
+    /**
+     * Changes the language of all charts.
+     *
+     * @param lang
+     */
+    public void setLang(Lang lang) {
+        this.lang = lang;
+        updateOptions();
+    }
+
+    /**
+     * Returns the {@link Lang} in use or {@code null} if no lang configuration
+     * has been set.
+     *
+     * @return the {@link Lang} in use or {@code null}.
+     */
+    public Lang getLang() {
+        return lang;
+    }
+
+    /**
+     * Returns a ChartOptions instance for the given UI. If a ChartOptions
+     * extension has not yet been added, a new one is created and added.
+     *
+     * @param ui
+     *            the UI for which the ChartOptions should be returned, not
+     *            <code>null</code>
+     * @return the ChartOptions instance connected to the given UI
+     */
+    public static ChartOptions get(UI ui) {
+        Objects.requireNonNull(ui, "Given root items may not be null");
+
+        ChartOptions options = ComponentUtil.getData(ui, ChartOptions.class);
+
+        // Create new options if not found
+        if (options == null) {
+            options = new ChartOptions();
+            ComponentUtil.setData(ui, ChartOptions.class, options);
+        }
+
+        return options;
+
+    }
+
+    /**
+     * Returns a ChartOptions instance for the current UI. If a ChartOptions extension
+     * has not yet been added, a new one is created and added.
+     *
+     * @return a ChartOptions instance connected to the currently active UI
+     */
+    public static ChartOptions get() {
+        UI ui = UI.getCurrent();
+
+        if (ui == null) {
+            throw new IllegalStateException(
+                    "This method must be used from UI thread");
+        }
+        return get(ui);
+    }
+
+}
diff --git a/...aadin-charts-flow/src/main/java/com/vaadin/flow/component/charts/model/Configuration.java b/...aadin-charts-flow/src/main/java/com/vaadin/flow/component/charts/model/Configuration.java
@@ -69,6 +69,7 @@ public class Configuration extends AbstractConfigurationObject
     private Navigation navigation;
     private NoData noData;
     private Navigator navigator;
+    private Time time;
 
     @JsonIgnore
     private final List<ConfigurationChangeListener> changeListeners = new ArrayList<>();
@@ -822,6 +823,22 @@ public void setNavigator(Navigator navigator) {
         this.navigator = navigator;
     }
 
+    /**
+     * @see #setTime(Time)
+     */
+    public Time getTime() {
+        return time;
+    }
+
+    /**
+     * Set configuration for time options
+     * 
+     * @param time
+     */
+    public void setTime(Time time) {
+        this.time = time;
+    }
+
     /**
      * Reverses the ListSeries (transposes it such that categories would be
      * series names and vice versa) to help stacking