commit 77c87820260f17d37d533a311c08ec0542d84d19 Author: Paul Schaub Date: Mon Aug 6 02:03:13 2018 +0200 Initial commit diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e746b1d --- /dev/null +++ b/.gitignore @@ -0,0 +1,6 @@ +.gradle/ +.idea/ + +*.iml +*/out +*/build/ diff --git a/build.gradle b/build.gradle new file mode 100644 index 0000000..1b53e6e --- /dev/null +++ b/build.gradle @@ -0,0 +1,15 @@ +buildscript { + dependencies { + classpath group: 'de.dynamicfiles.projects.gradle.plugins', name: 'javafx-gradle-plugin', version: '8.8.2' + } + repositories { + mavenLocal() + mavenCentral() + + } +} + +allprojects { + +} +apply plugin: 'java' diff --git a/fasel-jfx/build.gradle b/fasel-jfx/build.gradle new file mode 100644 index 0000000..1e15f7f --- /dev/null +++ b/fasel-jfx/build.gradle @@ -0,0 +1,26 @@ +apply plugin: 'java' +apply plugin: 'javafx-gradle-plugin' + +repositories { + mavenLocal() + mavenCentral() +} + +// Note that the test dependencies (junit, …) are inferred from the +// sourceSet.test of the core subproject +dependencies { + implementation 'com.jfoenix:jfoenix:8.0.7' +} + +repositories { + mavenLocal() + mavenCentral() +} + +jfx { + // minimal requirement for jfxJar-task + mainClass = 'de.vanitasvitae.fasel.sample.Main' + + // minimal requirement for jfxNative-task + vendor = 'vanitasvitae' +} \ No newline at end of file diff --git a/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/Controller.java b/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/Controller.java new file mode 100644 index 0000000..592e5bd --- /dev/null +++ b/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/Controller.java @@ -0,0 +1,4 @@ +package de.vanitasvitae.fasel.sample; + +public class Controller { +} diff --git a/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/JavaFXTrayIconSample.java b/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/JavaFXTrayIconSample.java new file mode 100644 index 0000000..80b105f --- /dev/null +++ b/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/JavaFXTrayIconSample.java @@ -0,0 +1,180 @@ +package de.vanitasvitae.fasel.sample; +import javafx.application.*; +import javafx.geometry.Pos; +import javafx.scene.*; +import javafx.scene.control.Label; +import javafx.scene.layout.*; +import javafx.scene.paint.Color; +import javafx.stage.*; + +import javax.imageio.ImageIO; +import java.io.IOException; +import java.net.URL; +import java.text.*; +import java.util.*; + +// Java 8 code +public class JavaFXTrayIconSample extends Application { + + // one icon location is shared between the application tray icon and task bar icon. + // you could also use multiple icons to allow for clean display of tray icons on hi-dpi devices. + private static final String iconImageLoc = + "http://icons.iconarchive.com/icons/scafer31000/bubble-circle-3/16/GameCenter-icon.png"; + + // application stage is stored so that it can be shown and hidden based on system tray icon operations. + private Stage stage; + + // a timer allowing the tray icon to provide a periodic notification event. + private Timer notificationTimer = new Timer(); + + // format used to display the current time in a tray icon notification. + private DateFormat timeFormat = SimpleDateFormat.getTimeInstance(); + + // sets up the javafx application. + // a tray icon is setup for the icon, but the main stage remains invisible until the user + // interacts with the tray icon. + @Override public void start(final Stage stage) { + // stores a reference to the stage. + this.stage = stage; + + // instructs the javafx system not to exit implicitly when the last application window is shut. + Platform.setImplicitExit(false); + + // sets up the tray icon (using awt code run on the swing thread). + javax.swing.SwingUtilities.invokeLater(this::addAppToTray); + + // out stage will be translucent, so give it a transparent style. + stage.initStyle(StageStyle.TRANSPARENT); + + // create the layout for the javafx stage. + StackPane layout = new StackPane(createContent()); + layout.setStyle( + "-fx-background-color: rgba(255, 255, 255, 0.5);" + ); + layout.setPrefSize(300, 200); + + // this dummy app just hides itself when the app screen is clicked. + // a real app might have some interactive UI and a separate icon which hides the app window. + layout.setOnMouseClicked(event -> stage.hide()); + + // a scene with a transparent fill is necessary to implement the translucent app window. + Scene scene = new Scene(layout); + scene.setFill(Color.TRANSPARENT); + + stage.setScene(scene); + } + + /** + * For this dummy app, the (JavaFX scenegraph) content, just says "hello, world". + * A real app, might load an FXML or something like that. + * + * @return the main window application content. + */ + private Node createContent() { + Label hello = new Label("hello, world"); + hello.setStyle("-fx-font-size: 40px; -fx-text-fill: forestgreen;"); + Label instructions = new Label("(click to hide)"); + instructions.setStyle("-fx-font-size: 12px; -fx-text-fill: orange;"); + + VBox content = new VBox(10, hello, instructions); + content.setAlignment(Pos.CENTER); + + return content; + } + + /** + * Sets up a system tray icon for the application. + */ + private void addAppToTray() { + try { + // ensure awt toolkit is initialized. + java.awt.Toolkit.getDefaultToolkit(); + + // app requires system tray support, just exit if there is no support. + if (!java.awt.SystemTray.isSupported()) { + System.out.println("No system tray support, application exiting."); + Platform.exit(); + } + + // set up a system tray icon. + java.awt.SystemTray tray = java.awt.SystemTray.getSystemTray(); + URL imageLoc = new URL( + iconImageLoc + ); + java.awt.Image image = ImageIO.read(imageLoc); + java.awt.TrayIcon trayIcon = new java.awt.TrayIcon(image); + + // if the user double-clicks on the tray icon, show the main app stage. + trayIcon.addActionListener(event -> Platform.runLater(this::showStage)); + + // if the user selects the default menu item (which includes the app name), + // show the main app stage. + java.awt.MenuItem openItem = new java.awt.MenuItem("hello, world"); + openItem.addActionListener(event -> Platform.runLater(this::showStage)); + + // the convention for tray icons seems to be to set the default icon for opening + // the application stage in a bold font. + java.awt.Font defaultFont = java.awt.Font.decode(null); + java.awt.Font boldFont = defaultFont.deriveFont(java.awt.Font.BOLD); + openItem.setFont(boldFont); + + // to really exit the application, the user must go to the system tray icon + // and select the exit option, this will shutdown JavaFX and remove the + // tray icon (removing the tray icon will also shut down AWT). + java.awt.MenuItem exitItem = new java.awt.MenuItem("Exit"); + exitItem.addActionListener(event -> { + notificationTimer.cancel(); + Platform.exit(); + tray.remove(trayIcon); + }); + + // setup the popup menu for the application. + final java.awt.PopupMenu popup = new java.awt.PopupMenu(); + popup.add(openItem); + popup.addSeparator(); + popup.add(exitItem); + trayIcon.setPopupMenu(popup); + + // create a timer which periodically displays a notification message. + notificationTimer.schedule( + new TimerTask() { + @Override + public void run() { + javax.swing.SwingUtilities.invokeLater(() -> + trayIcon.displayMessage( + "hello", + "The time is now " + timeFormat.format(new Date()), + java.awt.TrayIcon.MessageType.INFO + ) + ); + } + }, + 5_000, + 60_000 + ); + + // add the application tray icon to the system tray. + tray.add(trayIcon); + } catch (java.awt.AWTException | IOException e) { + System.out.println("Unable to init system tray"); + e.printStackTrace(); + } + } + + /** + * Shows the application stage and ensures that it is brought ot the front of all stages. + */ + private void showStage() { + if (stage != null) { + stage.show(); + stage.toFront(); + } + } + + public static void main(String[] args) throws IOException, java.awt.AWTException { + // Just launches the JavaFX application. + // Due to way the application is coded, the application will remain running + // until the user selects the Exit menu option from the tray icon. + launch(args); + } +} \ No newline at end of file diff --git a/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/LoginController.java b/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/LoginController.java new file mode 100644 index 0000000..47175f5 --- /dev/null +++ b/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/LoginController.java @@ -0,0 +1,60 @@ +package de.vanitasvitae.fasel.sample; + +import java.io.IOException; + +import com.jfoenix.controls.JFXButton; +import com.jfoenix.controls.JFXPasswordField; +import com.jfoenix.controls.JFXTextField; +import javafx.event.ActionEvent; +import javafx.event.EventHandler; +import javafx.fxml.FXML; +import javafx.fxml.FXMLLoader; +import javafx.scene.Parent; +import javafx.scene.Scene; +import javafx.scene.input.MouseEvent; + +public class LoginController { + + @FXML + private JFXTextField text_username; + + @FXML + private JFXPasswordField text_password; + + @FXML + private JFXButton button_login; + + private Main main; + + @FXML + private void initialize() { + button_login.setOnAction(new EventHandler() { + @Override + public void handle(ActionEvent actionEvent) { + String username = text_username.getText(); + String password = text_password.getText(); + + try { + switchToMainScene(); + } catch (IOException e) { + e.printStackTrace(); + } + } + }); + } + + private void switchToMainScene() throws IOException { + FXMLLoader loader = new FXMLLoader(); + loader.setLocation(getClass().getResource("/fxml/sample.fxml")); + Parent root = loader.load(); + + Scene scene = new Scene(root, 1200, 741); + main.getPrimaryStage().setTitle("Hello World"); + main.getPrimaryStage().setScene(scene); + // primaryStage.show(); + } + + public void setApplication(Main main) { + this.main = main; + } +} diff --git a/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/Main.java b/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/Main.java new file mode 100644 index 0000000..eae514d --- /dev/null +++ b/fasel-jfx/src/main/java/de/vanitasvitae/fasel/sample/Main.java @@ -0,0 +1,36 @@ +package de.vanitasvitae.fasel.sample; + +import javafx.application.Application; +import javafx.fxml.FXMLLoader; +import javafx.scene.Parent; +import javafx.scene.Scene; +import javafx.stage.Stage; + +public class Main extends Application { + + private Stage primaryStage; + + @Override + public void start(Stage primaryStage) throws Exception{ + this.primaryStage = primaryStage; + FXMLLoader loader = new FXMLLoader(); + loader.setLocation(getClass().getResource("/fxml/layout/login.fxml")); + + Parent root = loader.load(); + loader.setLocation(getClass().getResource("/fxml/fragment/login.fxml")); + LoginController controller = loader.getController(); + controller.setApplication(this); + Scene scene = new Scene(root, 1200, 741); + primaryStage.setTitle("Hello World"); + primaryStage.setScene(scene); + primaryStage.show(); + } + + public Stage getPrimaryStage() { + return primaryStage; + } + + public static void main(String[] args) { + launch(args); + } +} diff --git a/fasel-jfx/src/main/resources/css/material-fx-v0_3.css b/fasel-jfx/src/main/resources/css/material-fx-v0_3.css new file mode 100644 index 0000000..1296411 --- /dev/null +++ b/fasel-jfx/src/main/resources/css/material-fx-v0_3.css @@ -0,0 +1,801 @@ +/* + * The MIT License (MIT) + * + * Copyright (c) 2015 - AGIX | Innovative Engineering + * + * Permission is hereby granted, free of charge, to any person obtaining a copy + * of this software and associated documentation files (the "Software"), to deal + * in the Software without restriction, including without limitation the rights + * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell + * copies of the Software, and to permit persons to whom the Software is + * furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in all + * copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, + * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE + * SOFTWARE. + * + */ + +/* + * This is a Material Design CSS for JavaFX + */ + +/******************************************************************************* + * * + * Root * + * * + ******************************************************************************/ +.root { + /* Swatch Colors - Blue*/ + -swatch-100: #BBDEFB; + -swatch-200: #90CAF9; + -swatch-300: #64BEF6; + -swatch-400: #42A5F5; + -swatch-500: #2196F3; + /*default text */ + -fx-text-base-color: rgb(100.0, 100.0, 100.0); + -fx-text-button-normal: -swatch-500; + -fx-text-button-colored: rgb(255.0, 255.0, 255.0); + -fx-text-button-text: rgb(100.0, 100.0, 100.0); + -fx-text-title-color: rgb(45.0, 45.0, 45.0); + -fx-text-subtitle-color: rgb(65.0, 65.0, 65.0); + -fx-text-control-title-color: rgb(130.0, 130.0, 130.0); + -fx-text-fill: -fx-text-base-color; + -dark: rgb(47.0, 52.0, 57.0); + -fx-background-color: -dark; + /*default font */ + -fx-font-family: 'Roboto Medium'; + -fx-font-size: 14.0px; + -fx-disabled-opacity: 0.6; + /*default colors */ + -swatch-grey: rgb(200.0, 200.0, 200.0); + -swatch-dark-grey: rgb(150.0, 150.0, 150.0); + -swatch-light-grey: rgb(230.0, 230.0, 230.0); + -swatch-toolbar: rgb(245.0, 245.0, 245.0); + -swatch-toolbar-selected: rgb(215.0, 215.0, 215.0); + /* + Modena colors + */ + -fx-dark-text-color: white; /* Text color when selected*/ + -fx-mid-text-color: -fx-text-base-color; + -fx-light-text-color: -swatch-light-grey; + -fx-body-color: white; + /* A bright blue for the focus indicator of objects. Typically used as the + * first color in -fx-background-color for the "focused" pseudo-class. Also + * typically used with insets of -1.4 to provide a glowing effect. + */ + -fx-focus-color: -swatch-400; + -fx-faint-focus-color: -swatch-200; + /* A bright blue for highlighting/accenting objects. For example: selected + * text; selected items in menus, lists, trees, and tables; progress bars */ + -fx-accent: -swatch-400; + -fx-dark-text-color: white; +} + +/******************************************************************************* + * * + * Material Design - Cards * + * * + ******************************************************************************/ +.card { + -fx-background-color: rgb(255.0, 255.0, 255.0); + -fx-background-radius: 4.0; + -fx-effect: dropshadow(gaussian, rgb(0.0, 0.0, 0.0, 0.15), 6.0, 0.7, 0.0, + 1.5); + -fx-padding: 16 16 16 16; +} + +.card-title { + -fx-font-size: 20.0px; + -fx-padding: 5 0 5 0; +} + +.card-title .text { + -fx-fill: -fx-text-title-color; +} + +.card-subtitle { + -fx-font-size: 16.0px; + -fx-padding: 5 0 5 0; +} + +.card-subtitle .text { + -fx-fill: -fx-text-subtitle-color; +} + +.control-label { + -fx-font-size: 12.0px; + -fx-padding: 16 0 0 0; +} + +.control-label .text { + -fx-fill: -fx-text-control-title-color; +} + +.card-button { + -fx-effect: null; +} + +/******************************************************************************* + * * + * Button & ToggleButton * + * * + ******************************************************************************/ +.button-raised { + -fx-effect: dropshadow(gaussian, rgb(0.0, 0.0, 0.0, 0.30), 6.0, 0.3, 0, + 1); + -fx-background-color: rgb(250, 250, 250); +} + +.button-flat { + -fx-effect: null; + -fx-background-color: transparent; +} + +.toggle-button, .button { + -fx-text-fill: -fx-text-button-normal; + -fx-font-family: 'Roboto'; + -fx-font-weight: bold; + -fx-background-insets: 0.0; + -fx-background-radius: 4.0; + -fx-padding: 0.7em; + -fx-alignment: CENTER; +} + +.button-raised .button .text, .button-flat .button .text { + -fx-text-weight: Bold; +} + +.button:default { + -fx-background-color: -swatch-500; + -fx-text-fill: -fx-text-button-colored; +} + +.toggle-button:focused, .button:focused, .button:default:focused { + -fx-background-color: -swatch-light-grey; +} + +.toggle-button:focused:selected { + -fx-background-color: derive(-swatch-500, 50.0%), + derive(-swatch-500, -20.0%); + -fx-background-insets: 0.0, 0.2em; + -fx-text-fill: -fx-text-button-colored; +} + +.toggle-button:armed, .toggle-button:selected, .button:armed, .button:default:armed + { + -fx-background-color: -swatch-grey; + -fx-text-fill: -fx-text-button-colored; +} + +.icon-button { + -fx-background-color: transparent; + -fx-pref-height: 42; + -fx-pref-width: 42; + -fx-min-height: 42; + -fx-min-width: 42; + -fx-padding: 0; +} + +.icon-button .text { + -fx-font-family: 'MaterialDesignIconicFont'; + -fx-font-size: 24px; +} + +/******************************************************************************* + * * + * ComboBox, ChoiceBox COMMON * + * * + ******************************************************************************/ +.combo-box-base, .choice-box { + -fx-background-color: transparent; + -fx-border-color: -swatch-grey; + -fx-border-width: 0 0 2 0; + -fx-background-radius: 0; + -fx-border-radius: 0; +} + +.combo-box:focused, .choice-box:focused { + -fx-border-color: -swatch-500; +} + +.combo-box-base>.label, .choice-box>.label { + -fx-padding: 0.7em 0.7em 0.7em 0em; +} + +.combo-box-base>.arrow-button, .choice-box>.open-button { + -fx-padding: 1.2em 0.7em 1.2em 0.5em; + -fx-background-radius: 0.0 2.0 2.0 0.0; +} + +.combo-box-base>.arrow-button>.arrow, .choice-box>.open-button>.arrow { + -fx-background-color: -swatch-grey; +} + +.combo-box-base .arrow-button:hover .arrow, .spinner .increment-arrow-button:hover .increment-arrow, + .spinner .decrement-arrow-button:hover .decrement-arrow { + -fx-background-color: -swatch-dark-grey; +} + +.menu-item:focused { + -fx-background-color: -swatch-light-grey; +} + +/******************************************************************************* + * * + * CheckBox * + * * + ******************************************************************************/ +.check-box { + -fx-padding: 10; +} + +.check-box .text { + -fx-fill: -fx-text-base-color; +} + +.check-box>.box, .check-box>.box.unfocused, .check-box:disabled>.box, + .check-box:indeterminate>.box { + -fx-border-radius: 4.0; + -fx-border-color: -swatch-grey; + -fx-border-width: 2; + -fx-background-radius: 4; + -fx-background-color: transparent; + -fx-padding: 1; +} + +.check-box:selected>.box { + -fx-border-color: -swatch-500; + -fx-background-color: -swatch-500; +} + +.check-box:focused>.box { + -fx-effect: dropshadow(gaussian, rgb(0.0, 0.0, 0.0, 0.30), 6.0, 0.3, 0, + 0); +} + +.check-box:selected>.box>.mark { + -fx-background-color: white; +} + +.check-box:indeterminate>.box>.mark { + -fx-background-color: -swatch-grey; + -fx-padding: 0.45em; +} + +/******************************************************************************* + * * + * ChoiceBox * + * * + ******************************************************************************/ +.context-menu { + -fx-background-color: rgb(255.0, 255.0, 255.0, 0.95); + -fx-background-radius: 2.0; +} + +.radio-menu-item, .check-menu-item { + -fx-padding: 0.7em 0.7em 0.7em 0em; +} + +.radio-menu-item:checked .label, .check-menu-item:checked .label { + -fx-text-fill: -swatch-500; +} + +.radio-menu-item:checked>.left-container>.radio, .check-menu-item:checked>.left-container>.check + { + -fx-background-color: -swatch-dark-grey; + -fx-padding: 0.68em 0.5em 0.0em 0.0em; + -fx-effect: dropshadow(gaussian, rgb(0.0, 0.0, 0.0, 0.2), 0.0, 0.0, 0.0, + 1.0); +} + +.radio-menu-item>.left-container>.radio, .check-menu-item>.left-container>.check + { + -fx-background-color: transparent; + -fx-padding: 0.68em 0.68em 0.0em 0.0em; +} + +/******************************************************************************* + * * + * ComboBox * + * * + ******************************************************************************/ +.combo-box .list-cell { + -fx-padding: 0.7em 0.7em 0.7em 0em; +} + +.popup-overlay { + -fx-background-color: white; + -fx-border-color: -swatch-grey; + -fx-border-width: 0 0 2 0; + -fx-background-radius: 0; + -fx-border-radius: 0; +} + +.title-bar { + -fx-padding: 10; +} + +.title-bar .icon { + -fx-alignment: center-left; + -fx-effect: dropshadow(gaussian, rgb(0.0, 0.0, 0.0, 0.2), 0.0, 0.0, 0.0, + 1.0); +} + +.title-bar .title-label { + -fx-padding: 0 10 0 10; + -fx-alignment: center; + -fx-font-size: 36; + -fx-font-weight: bolder; +} + +.content-area { + -fx-background-color: -dark; +} + +.content-background { + -fx-background-color: white; + -fx-background-radius: 0.0 0.0 11.0 11.0; + -fx-padding: 0 10 10 10; +} + +/******************************************************************************* + * * + * Date Picker * + * * + ******************************************************************************/ +.date-picker-popup .button { + -fx-background-color: -swatch-500; +} + +.date-picker-popup>.month-year-pane { + -fx-background-color: -swatch-500; +} + +.date-picker-popup>*>.spinner>.button>.left-arrow, .date-picker-popup>*>.spinner>.button>.right-arrow + { + -fx-background-color: white; +} + +.date-picker-popup>*>.spinner { + -fx-border-width: 0; +} + +.date-picker-popup>*>.spinner>.label { + -fx-text-fill: white; + -fx-font-weight: bold; +} + +.date-picker-popup>*>.day-name-cell, .date-picker-popup>*>.week-number-cell + { + -fx-font-weight: normal; + -fx-text-fill: -swatch-dark-grey; + -fx-font-size: 1em; +} + +/******************************************************************************* + * * + * Date picker * + * * + ******************************************************************************/ +.date-picker .arrow-button { + -fx-background-color: transparent; +} + +.date-picker .arrow-button .arrow { + -fx-background-insets: -4; +} + +.date-picker .date-picker-display-node { + -fx-border-width: 0; +} + +/******************************************************************************* + * * + * HTML Editor * + * * + ******************************************************************************/ +.html-editor { + -fx-background-color: white; + -fx-border-width: 2 0 2 0; + -fx-border-color: -swatch-grey; +} + +.html-editor .web-view { + -fx-border-color: grey; + -fx-border-width: grey; +} + +.web-view { + -fx-font-smoothing-type: gray; +} + +/******************************************************************************* + * * + * Label * + * * + ******************************************************************************/ +.label { + -fx-text-fill: -fx-text-base-color; +} + +.label:disabled { + -fx-opacity: -fx-disabled-opacity; +} + +.label:show-mnemonics>.mnemonic-underline { + -fx-stroke: -fx-text-base-color; +} + +/******************************************************************************* + * * + * List, Tree, Table COMMON * + * * + ******************************************************************************/ +.list-view:focused .list-cell:filled:focused:selected { + -fx-background-color: -swatch-light-grey; + -fx-text-fill: -swatch-500; +} + +.list-view:hover .list-cell:hover { + -fx-background-color: -swatch-light-grey; + -fx-text-fill: -fx-text-base-color; +} + +.list-cell { + -fx-cell-size: 40; +} + +/******************************************************************************* + * * + * ProgressBar * + * * + ******************************************************************************/ +.progress-bar>.track { + -fx-background-color: derive(-swatch-grey, 50.0%); + -fx-background-radius: 2.0; + -fx-padding: 0.0; +} + +.progress-bar>.bar { + -fx-background-color: -swatch-500; + -fx-background-radius: 2.0; + -fx-background-insets: 0.0; + -fx-border-width: 0.0; + -fx-effect: null; +} + +.progress-bar:indeterminate>.bar { + -fx-background-color: derive(-swatch-500, 50.0%); + -fx-background-radius: 2.0; + -fx-background-insets: 0.0; + -fx-border-width: 0.0; + -fx-effect: null; +} + +/******************************************************************************* + * * + * ProgressIndicator * + * * + ******************************************************************************/ +.progress-indicator>.spinner { + -fx-border-width: 0; +} + +.progress-indicator>.determinate-indicator>.indicator { + -fx-background-color: rgb(255.0, 255.0, 255.0, 0.5); + -fx-padding: 0.0; +} + +.progress-indicator>.determinate-indicator>.progress { + -fx-background-color: -swatch-500; +} + +.progress-indicator>.determinate-indicator>.percentage { + -fx-fill: -fx-text-base-color; + -fx-translate-y: 0em; + -fx-padding: 0.0; + -fx-font-size: 11px; +} + +/******************************************************************************* + * * + * RadioButton * + * * + ******************************************************************************/ +.radio-button { + -fx-padding: 10; +} + +.radio-button .text { + -fx-fill: -fx-text-base-color; +} + +.radio-button>.radio, .radio-button>.radio.unfocused, .radio-button:disabled>.radio, + .radio-button:selected>.radio { + -fx-border-radius: 100.0; + -fx-border-color: -swatch-grey; + -fx-border-width: 2; + -fx-background-radius: 100; + -fx-background-color: transparent; + -fx-padding: 3 3 3 3; +} + +.radio-button:focused>.radio { + -fx-background-color: -swatch-100; +} + +.radio-button:focused:armed>.radio { + -fx-background-color: -swatch-100; +} + +.radio-button:selected>.radio>.dot { + -fx-background-color: -swatch-500; + -fx-background-insets: 0; +} + +/******************************************************************************* + * * + * Separators * + * * + ******************************************************************************/ +.separator { + -fx-padding: 16 -16 16 -16; +} + +/******************************************************************************* + * * + * Scroll Bar * + * * + ******************************************************************************/ +.scroll-bar:vertical>.track-background, .scroll-bar:horizontal>.track-background + { + -fx-background-color: -swatch-light-grey; + -fx-background-insets: 0.0; +} + +.scroll-bar:vertical>.thumb, .scroll-bar:horizontal>.thumb { + -fx-background-color: -swatch-grey; + -fx-background-insets: 0.0; + -fx-background-radius: 4.0; +} + +.scroll-bar>.increment-button, .scroll-bar>.decrement-button, + .scroll-bar:hover>.increment-button, .scroll-bar:hover>.decrement-button + { + -fx-background-color: transparent; +} + +.scroll-bar>.increment-button>.increment-arrow, .scroll-bar>.decrement-button>.decrement-arrow + { + -fx-background-color: -swatch-dark-grey; +} + +.scroll-bar>.track-background { + -fx-background-color: transparent; +} + +/******************************************************************************* + * * + * Slider * + * * + ******************************************************************************/ +.slider { + -fx-padding: 10 0 10 0; +} + +.slider:vertical { + -fx-padding: 0 10 0 10; +} + +.slider>.track { + -fx-background-color: -swatch-grey; + -fx-background-insets: 1.5; +} + +.slider>.thumb { + -fx-background-color: -swatch-500; +} + +/******************************************************************************* + * * + * Spinner * + * * + ******************************************************************************/ +.spinner { + -fx-background-color: transparent; + -fx-border-width: 0 0 2 0; + -fx-border-color: -swatch-grey; +} + +.spinner:focused { + -fx-border-color: -swatch-500; +} + +.spinner .text-field { + -fx-background-color: transparent; + -fx-background-radius: 0; + -fx-border-width: 0; + -fx-padding: 0.5em 0.5em 0.5em 0.1em; + -fx-prompt-text-fill: derive(-dark, 50.0%); + -fx-highlight-fill: rgb(94.0, 203.0, 234.0); +} + +.spinner .increment-arrow-button, .spinner .decrement-arrow-button { + -fx-background-color: transparent; + -fx-fill: swatch-500; +} + +.spinner .increment-arrow-button .increment-arrow, .spinner .decrement-arrow-button .decrement-arrow + { + -fx-background-color: -swatch-grey; +} + +.spinner .increment-arrow-button, .spinner .decrement-arrow-button { + -fx-background-color: transparent; + -fx-fill: swatch-500; +} + +/******************************************************************************* + * * + * Tables * + * * + ******************************************************************************/ +.table-view, .tree-table-view { + /* Constants used throughout the tableview. */ + -fx-table-header-border-color: transparent; + -fx-table-cell-border-color: -fx-box-border; /* Horizontal Lines*/ + -fx-background-color: transparent; +} + +/* The column header row is made up of a number of column-header, one for each + TableColumn, and a 'filler' area that extends from the right-most column + to the edge of the tableview, or up to the 'column control' button. */ +.table-view .filler, .tree-table-view .filler, .table-view .column-header, + .tree-table-view .column-header { + -fx-size: 65; + -fx-border-style: null; + -fx-border-color: -swatch-grey; + -fx-border-width: 0 0 2 0; + -fx-background-color: transparent; +} + +.table-view .show-hide-columns-button, .tree-table-view .show-hide-columns-button + { + -fx-background-color: transparent; +} + +.table-view .column-header .label, .table-view .filler .label, + .table-view .column-drag-header .label, .tree-table-view .column-header .label, + .tree-table-view .filler .label, .tree-table-view .column-drag-header .label + { + -fx-alignment: CENTER_LEFT; +} + +.table-view .column-header-background, .tree-table-view .column-header-background + { + -fx-background-color: transparent; +} + +.table-row-cell, .tree-table-row-cell { + -fx-cell-size: 40px; +} + +.table-cell { + -fx-border-color: transparent; /* Vertical Lines*/ + -fx-border-width: 1; +} + +/******************************************************************************* + * * + * Text, Text field & Text area * + * * + ******************************************************************************/ +.text { + -fx-font-smoothing-type: gray; +} + +.text-area, .text-field { + -fx-background-color: transparent; + -fx-background-radius: 2.0; + -fx-padding: 0.5em 0.5em 0.5em 0.1em; + -fx-border-color: -swatch-grey; + -fx-border-width: 0 0 2 0; + -fx-prompt-text-fill: derive(-dark, 50.0%); + -fx-highlight-fill: rgb(94.0, 203.0, 234.0); +} + +.text-area .text, .text-field>*>.text { + -fx-effect: null; + -fx-fill: -dark; +} + +.text-area { + -fx-padding: 0.15em; +} + +.text-area .content { + -fx-padding: 0.7em; + -fx-border-width: 0.0; + -fx-background-color: transparent; +} + +.text-area:focused .content { + -fx-background-color: transparent; +} + +.text-area:focused, .text-field:focused { + -fx-border-color: -swatch-500; +} + +/******************************************************************************* + * * + * Tool bar & Menu bar * + * * + ******************************************************************************/ +.tool-bar, .menu-bar { /* top */ + -fx-background-color: -swatch-toolbar; + -fx-border-width: 0 0 2 0; + -fx-border-color: -swatch-grey; + -fx-min-height: 48; + -fx-alignment: CENTER_LEFT; +} + +.tool-bar .label { + -fx-font-size: 18; +} + +.tool-bar .combo-box-base, .menu-bar .combo-base { + -fx-border-width: 0; +} + +.tool-bar .button, .tool-bar .toggle-button { + -fx-background-color: -swatch-toolbar; + -fx-text-fill: -fx-text-base-color; + -fx-pref-height: 42; + -fx-pref-width: 42; + -fx-min-height: 42; + -fx-min-width: 42; + -fx-padding: 0; + -fx-background-radius: 0; +} + +.tool-bar .button:pressed, .tool-bar .toggle-button:pressed, .tool-bar .toggle-button:selected + { + -fx-background-color: -swatch-grey; +} + +.tool-bar .toggle-button { + -fx-background-color: -swatch-toolbar; +} + +.tool-bar .separator { + -fx-padding: 5 10 5 10; +} + +.toolbar-colored { + -fx-background-color: -swatch-500; + -fx-border-width: 0 0 2 0; + -fx-border-color: -swatch-grey; +} + +.toolbar-colored .button, .toolbar-colored .toggle-button { + -fx-background-color: -swatch-500; + -fx-text-fill: white; +} + +.toolbar-colored .button:pressed, .toolbar-colored .toggle-button:pressed, + .toolbar-colored .toggle-button:selected { + -fx-background-color: -swatch-200; +} + +.toolbar-colored .text { + -fx-fill: white; +} \ No newline at end of file diff --git a/fasel-jfx/src/main/resources/css/material/cards.css b/fasel-jfx/src/main/resources/css/material/cards.css new file mode 100644 index 0000000..3eea1c1 --- /dev/null +++ b/fasel-jfx/src/main/resources/css/material/cards.css @@ -0,0 +1,25 @@ +.card { + -fx-background-color: rgb(255.0, 255.0, 255.0); + -fx-background-radius: 4.0; + -fx-effect: dropshadow(gaussian, rgb(0.0, 0.0, 0.0, 0.15), 6.0, 0.7, 0.0, + 1.5); + -fx-padding: 16 16 16 16; +} + +.card-title { + -fx-font-size: 20.0px; + -fx-padding: 5 0 5 0; +} + +.card-title .text { + -fx-fill: -fx-text-title-color; +} + +.card-subtitle { + -fx-font-size: 16.0px; + -fx-padding: 5 0 5 0; +} + +.card-subtitle .text { + -fx-fill: -fx-text-subtitle-color; +} diff --git a/fasel-jfx/src/main/resources/css/send_button.css b/fasel-jfx/src/main/resources/css/send_button.css new file mode 100644 index 0000000..e0797d9 --- /dev/null +++ b/fasel-jfx/src/main/resources/css/send_button.css @@ -0,0 +1,11 @@ +.toggle-button { + -fx-graphic: url('/img/icons/baseline_send_black_18dp.png'); + -fx-effect: null; + -fx-background-color: transparent; +} + +.toggle-button:selected { + -fx-graphic: url('/img/icons/baseline_send_black_18dp.png'); + -fx-effect: null; + -fx-background-color: transparent; +} \ No newline at end of file diff --git a/fasel-jfx/src/main/resources/css/share_button.css b/fasel-jfx/src/main/resources/css/share_button.css new file mode 100644 index 0000000..f3f7a0b --- /dev/null +++ b/fasel-jfx/src/main/resources/css/share_button.css @@ -0,0 +1,11 @@ +.toggle-button { + -fx-graphic: url('/img/icons/baseline_attach_file_black_18dp.png'); + -fx-effect: null; + -fx-background-color: transparent; +} + +.toggle-button:selected { + -fx-graphic: url('/img/icons/baseline_attach_file_black_18dp.png'); + -fx-effect: null; + -fx-background-color: transparent; +} \ No newline at end of file diff --git a/fasel-jfx/src/main/resources/fxml/fragment/login.fxml b/fasel-jfx/src/main/resources/fxml/fragment/login.fxml new file mode 100644 index 0000000..8c1c796 --- /dev/null +++ b/fasel-jfx/src/main/resources/fxml/fragment/login.fxml @@ -0,0 +1,19 @@ + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/fasel-jfx/src/main/resources/fxml/layout/chat_input_toolbar.fxml b/fasel-jfx/src/main/resources/fxml/layout/chat_input_toolbar.fxml new file mode 100644 index 0000000..19932c2 --- /dev/null +++ b/fasel-jfx/src/main/resources/fxml/layout/chat_input_toolbar.fxml @@ -0,0 +1,24 @@ + + + + + + + + + + +
+ + + + + +
+ + + + diff --git a/fasel-jfx/src/main/resources/fxml/layout/login.fxml b/fasel-jfx/src/main/resources/fxml/layout/login.fxml new file mode 100644 index 0000000..5309258 --- /dev/null +++ b/fasel-jfx/src/main/resources/fxml/layout/login.fxml @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/fasel-jfx/src/main/resources/fxml/main_headerbar.fxml b/fasel-jfx/src/main/resources/fxml/main_headerbar.fxml new file mode 100644 index 0000000..2aff274 --- /dev/null +++ b/fasel-jfx/src/main/resources/fxml/main_headerbar.fxml @@ -0,0 +1,26 @@ + + + + + + + + + + + + + + + + + +
+ + + + +
+ + + diff --git a/fasel-jfx/src/main/resources/fxml/sample.fxml b/fasel-jfx/src/main/resources/fxml/sample.fxml new file mode 100644 index 0000000..09eef88 --- /dev/null +++ b/fasel-jfx/src/main/resources/fxml/sample.fxml @@ -0,0 +1,37 @@ + + + + + + + + + + + + + + + +
+ +
+ + + + + + + + +
+ +
+ + + + + + + + diff --git a/fasel-jfx/src/main/resources/img/icons/baseline_attach_file_black_18dp.png b/fasel-jfx/src/main/resources/img/icons/baseline_attach_file_black_18dp.png new file mode 100755 index 0000000..a14e564 Binary files /dev/null and b/fasel-jfx/src/main/resources/img/icons/baseline_attach_file_black_18dp.png differ diff --git a/fasel-jfx/src/main/resources/img/icons/baseline_menu_black_18dp.png b/fasel-jfx/src/main/resources/img/icons/baseline_menu_black_18dp.png new file mode 100755 index 0000000..8b5e0b9 Binary files /dev/null and b/fasel-jfx/src/main/resources/img/icons/baseline_menu_black_18dp.png differ diff --git a/fasel-jfx/src/main/resources/img/icons/baseline_send_black_18dp.png b/fasel-jfx/src/main/resources/img/icons/baseline_send_black_18dp.png new file mode 100755 index 0000000..71bb600 Binary files /dev/null and b/fasel-jfx/src/main/resources/img/icons/baseline_send_black_18dp.png differ diff --git a/settings.gradle b/settings.gradle new file mode 100644 index 0000000..cc1162d --- /dev/null +++ b/settings.gradle @@ -0,0 +1 @@ +include 'fasel-jfx' \ No newline at end of file