sem/Greenify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

EDIT::finished home section of calculator

Browse Source
This commit is contained in:
Sem van der Hoeven
2019-03-27 20:51:14 +01:00
parent 3dec44ada1
commit 980e64657a
4 changed files with 261 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
src/Client/src/main/java/greenify/client/controller/CalculatorController.java
View File

@@ -10,6 +10,7 @@ import javafx.scene.control.Label;
import javafx.scene.control.Slider;
import javafx.scene.control.TextField;
import javafx.scene.layout.AnchorPane;
import javafx.util.StringConverter;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
@@ -18,6 +19,7 @@ public class CalculatorController {
@Autowired
UserService userService;
//navigation panes
@FXML
private AnchorPane getStartedPane;
@FXML
@@ -28,6 +30,8 @@ public class CalculatorController {
private AnchorPane foodPane;
@FXML
private AnchorPane shoppingPane;
//'get started' pane
@FXML
private Slider peopleInHouseholdSlider;
@FXML
@@ -38,6 +42,7 @@ public class CalculatorController {
private Label annualIncomeLabel;
@FXML
private Button saveButton;
//travel pane
@FXML
private TextField publicTransitField;
@@ -62,14 +67,23 @@ public class CalculatorController {
@FXML
private Label carTravelElectricLabel;
//home pane
@FXML
private Slider cleanEnergyPurchasedSlider;
@FXML
private Label cleanEnergyPurchasedLabel;
@FXML
private Slider waterUsageSlider;
@FXML
private Label waterUsageLabel;
/**
* initializes the window, performs some actions before loading all other things.
* it sets the sliders to snap to the ticks
* it adds listeners to all the sliders for updating the label next to them
* it sets the sliders to snap to the ticks.
* it adds listeners to all the sliders for updating the label they are associated with.
*/
public void initialize() {
peopleInHouseholdSlider.setSnapToTicks(true);
annualIncomeSlider.setSnapToTicks(true);
//add listener to slider for amount of people in household
peopleInHouseholdSlider.valueProperty().addListener(new ChangeListener<Number>() {
@@ -88,17 +102,83 @@ public class CalculatorController {
}
});
addSliderListenerCarUsage(carTravelGasolineSlider, carTravelGasolineLabel);
addSliderListenerCarUsage(carTravelDieselSlider, carTravelDieselLabel);
addSliderListenerCarUsage(carTravelElectricSlider, carTravelElectricLabel);
addSliderListenerCarUsage(carTravelGasolineSlider, carTravelGasolineLabel, " km/L");
addSliderListenerCarUsage(carTravelDieselSlider, carTravelDieselLabel, " km/L");
addSliderListenerCarUsage(carTravelElectricSlider, carTravelElectricLabel, " km/Le");
cleanEnergyPurchasedSlider.valueProperty().addListener(new ChangeListener<Number>() {
@Override
public void changed(ObservableValue<? extends Number> observable,
Number oldValue, Number newValue) {
cleanEnergyPurchasedLabel.setText(newValue.intValue() + " %");
}
});
waterUsageSlider.valueProperty().addListener(new ChangeListener<Number>() {
@Override
public void changed(ObservableValue<? extends Number> observable,
Number oldValue, Number newValue) {
waterUsageLabel.setText(newValue.intValue() + "% of similar households");
}
});
// addLabelFormatterToSlider(waterUsageSlider);
}
private void addSliderListenerCarUsage(Slider slider, Label label) {
/**
* Adds a label formatter to the given slider.
* sets the tick labels to be either 0, 1x, 2x or 3x.
* @param slider the slider to change the tick labels of.
*/
private void addLabelFormatterToSlider(Slider slider) {
slider.setLabelFormatter(new StringConverter<Double>() {
@Override
public String toString(Double object) {
if (object < 0.5) {
return "0";
}
if (object < 1.5) {
return "1x";
}
if (object < 2.5) {
return "2x";
}
return "3x";
}
@Override
public Double fromString(String string) {
switch (string) {
case "0":
return 0d;
case "1x":
return 1d;
case "2x":
return 2d;
case "3x":
return 3d;
default:
return 3d;
}
}
});
}
/**
* adds the listener to the given slider and displays it's output on a given label.
* @param slider the slider to attach the listener to.
* @param label the label to display the slider output on.
*/
private void addSliderListenerCarUsage(Slider slider, Label label, String unit) {
slider.valueProperty().addListener(new ChangeListener<Number>() {
@Override
public void changed(ObservableValue<? extends Number> observable,
Number oldValue, Number newValue) {
label.setText(newValue.intValue() + "L/km");
label.setText(newValue.intValue() + unit);
}
});
}

181
src/Client/src/main/resources/fxml/calculator.fxml
View File

@@ -1,16 +1,19 @@
<?xml version="1.0" encoding="UTF-8"?>
<?import javafx.geometry.*?>
<?import com.jfoenix.controls.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.text.*?>
<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.Slider?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.image.Image?>
<?import javafx.scene.image.ImageView?>
<?import javafx.scene.layout.AnchorPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.text.Text?>
<AnchorPane prefHeight="703.0" prefWidth="820.0" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="greenify.client.controller.CalculatorController">
<AnchorPane prefHeight="703.0" prefWidth="820.0" xmlns="http://javafx.com/javafx/8.0.172-ea" xmlns:fx="http://javafx.com/fxml/1" fx:controller="greenify.client.controller.CalculatorController">
<children>
<AnchorPane fx:id="calculatorTabs" prefHeight="92.0" prefWidth="820.0" style="-fx-background-color: #677069;">
<children>
@@ -104,14 +107,14 @@
</font></Button>
</children>
</AnchorPane>
<AnchorPane fx:id="getStartedPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" AnchorPane.leftAnchor="0.0">
<AnchorPane fx:id="getStartedPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" AnchorPane.leftAnchor="0.0">
<children>
<Text layoutX="224.0" layoutY="96.0" strokeType="OUTSIDE" strokeWidth="0.0" text="1. How many people live in your household?">
<font>
<Font size="19.0" />
</font>
</Text>
<Slider fx:id="peopleInHouseholdSlider" blockIncrement="1.0" layoutX="260.0" layoutY="147.0" majorTickUnit="1.0" max="6.0" min="1.0" minorTickCount="0" prefHeight="38.0" prefWidth="300.0" showTickLabels="true" showTickMarks="true" snapToTicks="true" />
<Slider fx:id="peopleInHouseholdSlider" blockIncrement="1.0" layoutX="260.0" layoutY="147.0" majorTickUnit="1.0" max="6.0" min="1.0" minorTickCount="0" prefHeight="38.0" prefWidth="300.0" showTickLabels="true" showTickMarks="true" snapToTicks="true" styleClass="slidertje" />
<Label fx:id="peopleInHouseHoldLabel" alignment="CENTER" contentDisplay="CENTER" layoutX="612.0" layoutY="70.0" prefHeight="38.0" prefWidth="44.0" text="0">
<font>
<Font size="20.0" />
@@ -137,7 +140,7 @@
</Label>
<Button fx:id="getStartedNextButton" layoutX="383.0" layoutY="406.0" mnemonicParsing="false" onAction="#displayTravel" styleClass="nextButton" text="Next" />
</children></AnchorPane>
<AnchorPane fx:id="travelPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0">
<AnchorPane fx:id="travelPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false">
<children>
<ScrollPane layoutX="158.0" layoutY="109.0" prefHeight="215.0" prefWidth="499.0">
<content>
@@ -148,7 +151,11 @@
<Font size="16.0" />
</font>
</Text>
<TextField fx:id="carTravelGasolineField" layoutX="14.0" layoutY="38.0" prefHeight="31.0" prefWidth="405.0" promptText="16.400" />
<TextField fx:id="carTravelGasolineField" layoutX="14.0" layoutY="38.0" prefHeight="31.0" prefWidth="405.0" promptText="16.400">
<font>
<Font size="15.0" />
</font>
</TextField>
<HBox alignment="CENTER_LEFT" layoutX="419.0" layoutY="38.0" prefHeight="31.0" prefWidth="54.0" styleClass="km-yearBox">
<children>
<Text layoutY="3.0" strokeType="OUTSIDE" strokeWidth="0.0" text="km/year" wrappingWidth="49.0">
@@ -161,7 +168,7 @@
<Slider fx:id="carTravelGasolineSlider" layoutX="14.0" layoutY="122.0" majorTickUnit="15.0" max="115.0" min="10.0" minorTickCount="0" prefHeight="14.0" prefWidth="453.0" showTickLabels="true" showTickMarks="true" />
<HBox alignment="CENTER" layoutX="204.0" layoutY="77.0" prefHeight="31.0" prefWidth="89.0" styleClass="km-indicator">
<children>
<Label fx:id="carTravelGasolineLabel" alignment="TOP_CENTER" contentDisplay="CENTER" text="0 L/km">
<Label fx:id="carTravelGasolineLabel" alignment="TOP_CENTER" contentDisplay="CENTER" text="0 km/L">
<font>
<Font size="13.0" />
</font>
@@ -170,7 +177,7 @@
</HBox>
<HBox alignment="CENTER" layoutX="204.0" layoutY="239.0" prefHeight="31.0" prefWidth="89.0" styleClass="km-indicator">
<children>
<Label fx:id="carTravelDieselLabel" alignment="TOP_CENTER" contentDisplay="CENTER" text="0 L/km">
<Label fx:id="carTravelDieselLabel" alignment="TOP_CENTER" contentDisplay="CENTER" text="0 km/L">
<font>
<Font size="13.0" />
</font>
@@ -187,7 +194,11 @@
</Text>
</children>
</HBox>
<TextField fx:id="carTravelDieselField" layoutX="14.0" layoutY="200.0" prefHeight="31.0" prefWidth="405.0" promptText="15.400" />
<TextField fx:id="carTravelDieselField" layoutX="14.0" layoutY="200.0" prefHeight="31.0" prefWidth="405.0" promptText="15.400">
<font>
<Font size="15.0" />
</font>
</TextField>
<Text fill="#505050" layoutX="14.0" layoutY="189.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Diesel">
<font>
<Font size="16.0" />
@@ -198,7 +209,11 @@
<Font size="16.0" />
</font>
</Text>
<TextField fx:id="carTravelElectricField" layoutX="14.0" layoutY="365.0" prefHeight="31.0" prefWidth="405.0" promptText="15.400" />
<TextField fx:id="carTravelElectricField" layoutX="14.0" layoutY="365.0" prefHeight="31.0" prefWidth="405.0" promptText="14.900">
<font>
<Font size="15.0" />
</font>
</TextField>
<HBox alignment="CENTER_LEFT" layoutX="419.0" layoutY="365.0" prefHeight="31.0" prefWidth="54.0" styleClass="km-yearBox">
<children>
<Text layoutY="3.0" strokeType="OUTSIDE" strokeWidth="0.0" text="km/year" wrappingWidth="49.0">
@@ -211,7 +226,7 @@
<Slider fx:id="carTravelElectricSlider" layoutX="14.0" layoutY="450.0" majorTickUnit="15.0" max="115.0" min="10.0" minorTickCount="0" prefHeight="14.0" prefWidth="453.0" showTickLabels="true" showTickMarks="true" />
<HBox alignment="CENTER" layoutX="204.0" layoutY="404.0" prefHeight="31.0" prefWidth="89.0" styleClass="km-indicator">
<children>
<Label fx:id="carTravelElectricLabel" alignment="TOP_CENTER" contentDisplay="CENTER" text="0 L/km">
<Label fx:id="carTravelElectricLabel" alignment="TOP_CENTER" contentDisplay="CENTER" text="0 km/Le">
<font>
<Font size="13.0" />
</font>
@@ -269,7 +284,133 @@
<Button fx:id="travelNextButton" layoutX="383.0" layoutY="559.0" mnemonicParsing="false" onAction="#displayHome" styleClass="nextButton" text="Next" />
</children>
</AnchorPane>
<AnchorPane fx:id="homePane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<AnchorPane fx:id="homePane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false">
<children>
<Text layoutX="245.0" layoutY="36.0" strokeType="OUTSIDE" strokeWidth="0.0" text="How much do you use in your home?">
<font>
<Font size="20.0" />
</font>
</Text>
<Text fill="#727272" layoutX="177.0" layoutY="85.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Electricity">
<font>
<Font size="18.0" />
</font>
</Text>
<TextField layoutX="177.0" layoutY="105.0" prefHeight="31.0" prefWidth="434.0" promptText="1,570">
<font>
<Font size="15.0" />
</font>
</TextField>
<HBox alignment="CENTER_LEFT" layoutX="616.0" layoutY="105.0" prefHeight="31.0" prefWidth="54.0" styleClass="km-yearBox">
<children>
<Text layoutY="3.0" strokeType="OUTSIDE" strokeWidth="0.0" text="€/year" wrappingWidth="41.0">
<font>
<Font size="13.0" />
</font>
<HBox.margin>
<Insets left="3.0" />
</HBox.margin>
</Text>
</children>
</HBox>
<Slider fx:id="waterUsageSlider" blockIncrement="100.0" layoutX="177.0" layoutY="509.0" majorTickUnit="100.0" max="300.0" minorTickCount="0" prefHeight="24.0" prefWidth="499.0" showTickLabels="true" showTickMarks="true" />
<Slider fx:id="cleanEnergyPurchasedSlider" blockIncrement="25.0" layoutX="177.0" layoutY="188.0" minorTickCount="0" prefHeight="24.0" prefWidth="499.0" showTickLabels="true" showTickMarks="true" />
<Text fill="#6f6f6f" layoutX="238.0" layoutY="165.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Percent purchased from clean energy program:">
<font>
<Font size="15.0" />
</font>
</Text>
<HBox alignment="CENTER" layoutX="553.0" layoutY="146.0" prefHeight="27.0" prefWidth="55.0" styleClass="km-indicator">
<children>
<Label fx:id="cleanEnergyPurchasedLabel" text="0 %">
<font>
<Font size="15.0" />
</font>
</Label>
</children>
</HBox>
<Button layoutX="400.0" layoutY="547.0" mnemonicParsing="false" onAction="#displayFood" styleClass="nextButton" text="Next" />
<Text fill="#727272" layoutX="177.0" layoutY="255.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Natural gas">
<font>
<Font size="18.0" />
</font>
</Text>
<HBox alignment="CENTER_LEFT" layoutX="616.0" layoutY="262.0" prefHeight="31.0" prefWidth="54.0" styleClass="km-yearBox">
<children>
<Text layoutY="3.0" strokeType="OUTSIDE" strokeWidth="0.0" text="€/year" wrappingWidth="41.0">
<font>
<Font size="13.0" />
</font>
<HBox.margin>
<Insets left="3.0" />
</HBox.margin>
</Text>
</children>
</HBox>
<TextField layoutX="177.0" layoutY="262.0" prefHeight="31.0" prefWidth="434.0" promptText="2,000">
<font>
<Font size="15.0" />
</font>
</TextField>
<HBox alignment="CENTER_LEFT" layoutX="616.0" layoutY="325.0" prefHeight="31.0" prefWidth="54.0" styleClass="km-yearBox">
<children>
<Text layoutY="3.0" strokeType="OUTSIDE" strokeWidth="0.0" text="€/year" wrappingWidth="41.0">
<font>
<Font size="13.0" />
</font>
<HBox.margin>
<Insets left="3.0" />
</HBox.margin>
</Text>
</children>
</HBox>
<TextField layoutX="177.0" layoutY="325.0" prefHeight="31.0" prefWidth="434.0" promptText="3,100">
<font>
<Font size="15.0" />
</font>
</TextField>
<Text fill="#727272" layoutX="177.0" layoutY="316.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Heating oil &amp; other fuels">
<font>
<Font size="18.0" />
</font>
</Text>
<Text fill="#727272" layoutX="177.0" layoutY="383.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Living space area">
<font>
<Font size="18.0" />
</font>
</Text>
<TextField layoutX="177.0" layoutY="390.0" prefHeight="31.0" prefWidth="434.0" promptText="1,570">
<font>
<Font size="15.0" />
</font>
</TextField>
<HBox alignment="CENTER_LEFT" layoutX="616.0" layoutY="390.0" prefHeight="31.0" prefWidth="0.0" styleClass="km-yearBox">
<children>
<Text layoutY="3.0" strokeType="OUTSIDE" strokeWidth="0.0" text="m²" textAlignment="CENTER" wrappingWidth="41.0">
<font>
<Font size="19.0" />
</font>
<HBox.margin>
<Insets left="3.0" />
</HBox.margin>
</Text>
</children>
</HBox>
<Text fill="#727272" layoutX="177.0" layoutY="454.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Water usage">
<font>
<Font size="18.0" />
</font>
</Text>
<HBox alignment="CENTER" layoutX="298.0" layoutY="459.0" prefHeight="27.0" prefWidth="258.0" styleClass="km-indicator">
<children>
<Label fx:id="waterUsageLabel" text="0% of similar households">
<font>
<Font size="15.0" />
</font>
</Label>
</children>
</HBox>
</children></AnchorPane>
<AnchorPane fx:id="foodPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
<AnchorPane fx:id="shoppingPane" layoutY="85.0" prefHeight="618.0" prefWidth="820.0" visible="false" />
</children>

BIN
src/Client/src/main/resources/icons/leaficon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.2 KiB

12
src/Client/src/main/resources/stylesheets/calculatorStyle.css
View File

@@ -14,6 +14,9 @@
-fx-font-size: 16px;
-fx-font-weight: regular;
}
#calculatorTabs #saveButton:hover {
-fx-background-color: #9ec19c;
}
.nextButton {
-fx-background-color: #89a888;
@@ -42,6 +45,15 @@
-fx-border-radius: 5px;
}
.slider .track {
-fx-background-color: #d3d3d3;
}
.slider .thumb {
-fx-background-color: transparent;
-fx-background-image: url('../icons/leaficon.png');
-fx-padding: 12;
}