Dark Mode

gse-app/src/main/java/com/powsybl/gse/app/GsePane.java

@@ -152,6 +152,8 @@ private void loadPreferences() {
             } catch (Throwable t) {
                 LOGGER.error(t.toString(), t);
             }
+            boolean activeDark = Boolean.valueOf(preferences.get("darkMode", ""));
+            DefaultPreferencesPane.activeDarkMode(activeDark, getScene(), preferences);
         });
     }
 
@@ -190,6 +192,14 @@ private void showAbout() {
         popup.show(getScene().getWindow());
     }
 
+    private void showPreferences() {
+        Popup popup = new Popup();
+        popup.setAutoHide(true);
+        DefaultPreferencesPane preferencesPane = new DefaultPreferencesPane(getScene(), preferences);
+        popup.getContent().addAll(preferencesPane);
+        popup.show(getScene().getWindow());
+    }
+
     private void showShortcuts() {
         Color fillColor = Color.valueOf("#eaeaea");
         FlowPane flowPane = new FlowPane();
@@ -338,14 +348,15 @@ private GseAppBar createAppBar() {
             contextMenu.getItems().add(documentationMenuItem);
         });
 
-        MenuItem aboutMenuItem = new MenuItem(RESOURCE_BUNDLE.getString("About") + "...");
+        MenuItem aboutMenuItem = new MenuItem(RESOURCE_BUNDLE.getString("About"));
         aboutMenuItem.setOnAction(event -> showAbout());
-        MenuItem shortcutMenuItem = new MenuItem(RESOURCE_BUNDLE.getString("Shortcuts") + "...");
+        MenuItem shortcutMenuItem = new MenuItem(RESOURCE_BUNDLE.getString("Shortcuts"));
         shortcutMenuItem.setOnAction(event -> showShortcuts());
-        contextMenu.getItems().addAll(aboutMenuItem, shortcutMenuItem);
+        MenuItem preferencesMenuItem = new MenuItem(RESOURCE_BUNDLE.getString("Preferences"));
+        preferencesMenuItem.setOnAction(event -> showPreferences());
+        contextMenu.getItems().addAll(aboutMenuItem, shortcutMenuItem, preferencesMenuItem);
 
         contextMenu.getItems().addAll(initExtensions(MenuItem::new, menu -> menu::setOnAction, ext -> !ext.isMain()));
-
         appBar.getHelpButton().setOnAction(event -> contextMenu.show(appBar.getHelpButton(), Side.BOTTOM, 0, 0));
 
         return appBar;

gse-app/src/main/resources/css/gse-dark-theme.css

@@ -0,0 +1,70 @@
+.root {
+    -fx-accent: #1e74c6;
+    -fx-focus-color: -fx-accent;
+    -fx-base: #373e43;
+    -fx-control-inner-background: derive(-fx-base, 35%);
+    -fx-control-inner-background-alt: -fx-control-inner-background ;
+    -gse-app-bar-background-color: #3C3C3C;
+}
+
+.label{
+    -fx-text-fill: white;
+}
+
+.text-field {
+    -fx-prompt-text-fill: white;
+}
+
+.titulo{
+    -fx-font-weight: bold;
+    -fx-font-size: 18px;
+}
+
+.button{
+    -fx-focus-traversable: false;
+}
+
+.button:hover{
+    -fx-text-fill: white;
+}
+
+.separator *.line {
+    -fx-background-color: #3C3C3C;
+    -fx-border-style: solid;
+    -fx-border-width: 1px;
+}
+
+.scroll-bar{
+    -fx-background-color: derive(-fx-base,45%)
+}
+
+.button:default {
+    -fx-base: -fx-accent ;
+}
+
+.table-view{
+    -fx-selection-bar-non-focused: derive(-fx-base, 50%);
+}
+
+.table-view .column-header .label{
+    -fx-alignment: CENTER_LEFT;
+    -fx-font-weight: none;
+}
+
+.list-cell:even,
+.list-cell:odd,
+.table-row-cell:even,
+.table-row-cell:odd{
+    -fx-control-inner-background: derive(-fx-base, 15%);
+}
+
+.list-cell:empty,
+.table-row-cell:empty {
+    -fx-background-color: transparent;
+}
+
+.list-cell,
+.table-row-cell{
+    -fx-border-color: transparent;
+    -fx-table-cell-border-color:transparent;
+}

gse-app/src/main/resources/lang/GseAppBar.properties

@@ -1,3 +1,4 @@
 Create=Create
 Open=Open
 SignOut=Sign out
+StyleModeDark=Dark Mode

gse-app/src/main/resources/lang/GseAppBar_fr.properties

@@ -1,3 +1,4 @@
-Create=Cr�er
+Create=Cr\u00E9er
 Open=Ouvrir
-SignOut=D�connexion
+SignOut=D\u00E9connexion
+StyleModeDark=Mode Sombre

gse-app/src/main/resources/lang/GsePane.properties

@@ -1,5 +1,4 @@
 About=About...
-Action=Action
 CreateProject=Create project
 Delete=Delete
 Documentation=Documentation
@@ -20,7 +19,6 @@ GlobalShortcutSection=General
 File=File
 Help=Help
 OpenProject=Open project
-Quit=Quit
 Rename=Rename
-Shortcut=Shortcut
 Shortcuts=Shortcuts
+Preferences=Preferences

gse-app/src/main/resources/lang/GsePane_fr.properties

@@ -1,26 +1,24 @@
 About=A propos de...
-Action=Action
-CreateProject=Cr�er un projet
+CreateProject=Cr�er un projet
 Delete=Supprimer
 Documentation=Documentation
 Edit=Editer
-Enter=Entr�e
+Enter=Entr�e
 Export=Exporter
-EditorSelectAll=S�l�ctionner tout
+EditorSelectAll=S�l�ctionner tout
 EditorCopyPaste=Copier/Coller
 EditorSave=Sauvegarder
 EditorDuplicate=Dupliquer la ligne courante
 EditorDelete=Dupliquer la ligne courante
-EditorGoto=Aller � :ligne:col
+EditorGoto=Aller � :ligne:col
 EditorSearch=Rechercher
 EditorReplace=Remplacer
 EditorShortcutSection=Editeur de texte
 NewItemShortcutSection=Nouveau..
-GlobalShortcutSection=G�n�ral
+GlobalShortcutSection=G�n�ral
 File=Fichier
 Help=Aide
 OpenProject=Ouvrir un projet
-Quit=Quitter
 Rename=Renommer
-Shortcut=Raccourci
 Shortcuts=Raccourcis
+Preferences=Pr\u00E9ferences

gse-spi/pom.xml

@@ -68,6 +68,10 @@
             <artifactId>junit</artifactId>
             <scope>test</scope>
         </dependency>
+        <dependency>
+            <groupId>org.controlsfx</groupId>
+            <artifactId>controlsfx</artifactId>
+        </dependency>
     </dependencies>
 
 </project>

gse-spi/src/main/java/com/powsybl/gse/spi/DefaultPreferencesPane.java

@@ -0,0 +1,73 @@
+/*
+ * Copyright (c) 2020, RTE (http://www.rte-france.com)
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/.
+ */
+
+package com.powsybl.gse.spi;
+
+import javafx.geometry.Insets;
+import javafx.scene.Scene;
+import javafx.scene.control.Label;
+import javafx.scene.control.TitledPane;
+import javafx.scene.layout.GridPane;
+import org.controlsfx.control.ToggleSwitch;
+
+import java.util.ResourceBundle;
+import java.util.prefs.Preferences;
+
+/**
+ * @author Valentin Berthault <valentin.berthault at rte-france.com>
+ */
+public class DefaultPreferencesPane extends TitledPane {
+
+    private final ToggleSwitch styleSwitch;
+
+    private static final ResourceBundle RESOURCE_BUNDLE = ResourceBundle.getBundle("lang.GseAppBar");
+
+    public DefaultPreferencesPane(Scene scene, Preferences preferences) {
+        this.setText("Preferences");
+        this.setCollapsible(false);
+        this.setExpanded(true);
+        this.setPadding(new Insets(10));
+
+        GridPane gridPane = new GridPane();
+        Label affichageLabel = new Label("Affichage");
+        gridPane.add(affichageLabel, 0, 0);
+
+        styleSwitch = new ToggleSwitch();
+        styleSwitch.setText(RESOURCE_BUNDLE.getString("StyleModeDark"));
+        styleSwitch.getStyleClass().add("gse-app-bar-text");
+        styleSwitch.setPadding(new Insets(10));
+
+        gridPane.add(styleSwitch, 1, 1);
+
+        if (scene.getStylesheets().contains("/css/gse-dark-theme.css")) {
+            styleSwitch.setSelected(true);
+        }
+
+        styleSwitch.selectedProperty().addListener((observable, oldValue, newValue) -> {
+            activeDarkMode(newValue, scene, preferences);
+            if (newValue) {
+                this.getScene().getStylesheets().add("/css/gse-dark-theme.css");
+            } else {
+                this.getScene().getStylesheets().remove("/css/gse-dark-theme.css");
+            }
+        });
+
+        this.setContent(gridPane);
+    }
+
+    public static void activeDarkMode(boolean active, Scene scene, Preferences preferences) {
+        if (active) {
+            scene.getStylesheets().add("/css/gse-dark-theme.css");
+            preferences.remove("darkMode");
+            preferences.put("darkMode", "true");
+        } else {
+            scene.getStylesheets().remove("/css/gse-dark-theme.css");
+            preferences.remove("darkMode");
+            preferences.put("darkMode", "false");
+        }
+    }
+}