From 268591604d93a40381d47a2e0475816698aed4df Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Nicolay=20Schi=C3=B8ll-Johansen?=
<nicolayschiolljohansen@gmail.com>
Date: Wed, 8 Apr 2020 11:53:29 +0200
Subject: [PATCH] Upload page redesign
---
src/main/resources/NTNU/IDATT1002/style.css | 13 +++
src/main/resources/NTNU/IDATT1002/upload.fxml | 107 ++++++++++--------
2 files changed, 75 insertions(+), 45 deletions(-)
diff --git a/src/main/resources/NTNU/IDATT1002/style.css b/src/main/resources/NTNU/IDATT1002/style.css
index f8714021..4b0c9ceb 100644
--- a/src/main/resources/NTNU/IDATT1002/style.css
+++ b/src/main/resources/NTNU/IDATT1002/style.css
@@ -82,4 +82,17 @@
-fx-max-width: 850px;
-fx-height: auto;
-fx-width: 100%;
+}
+
+/*RESPONSIVE IMAGES END*/
+
+/*UPLOAD PAGE*/
+
+.dropMenu{
+ -fx-border-width: 2px;
+ -fx-border-color: #46b4fe;
+ -fx-border-style: dashed;
+ -fx-border-radius: 3px;
+ -fx-background-color: rgba(255, 255, 255, 0.1);
+ -fx-background-radius: 3px;
}
\ No newline at end of file
diff --git a/src/main/resources/NTNU/IDATT1002/upload.fxml b/src/main/resources/NTNU/IDATT1002/upload.fxml
index 829d5ee5..f7c73beb 100644
--- a/src/main/resources/NTNU/IDATT1002/upload.fxml
+++ b/src/main/resources/NTNU/IDATT1002/upload.fxml
@@ -4,56 +4,73 @@
<?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.layout.Pane?>
<?import javafx.scene.layout.VBox?>
<?import javafx.scene.text.Font?>
<?import javafx.scene.text.Text?>
-<AnchorPane prefHeight="1080.0" prefWidth="1920.0" xmlns="http://javafx.com/javafx" xmlns:fx="http://javafx.com/fxml" fx:controller="NTNU.IDATT1002.controllers.Upload">
-<children>
- <VBox prefHeight="1080.0" prefWidth="1920.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
- <children>
- <HBox alignment="CENTER" minHeight="100.0" prefHeight="100.0" prefWidth="1920.0" spacing="20.0" style="-fx-background-color: #0c0c0c;">
+<?import javafx.geometry.Insets?>
+<VBox prefHeight="1080.0" prefWidth="1920.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="NTNU.IDATT1002.controllers.Upload">
+ <children>
+ <HBox alignment="CENTER" prefHeight="100.0" prefWidth="200.0" styleClass="tbarbg" stylesheets="@style.css">
+ <children>
+ <HBox alignment="CENTER" minHeight="100.0" prefHeight="100.0" prefWidth="1920.0" spacing="20.0">
+ <children>
+ <HBox alignment="CENTER_LEFT" prefHeight="100.0" prefWidth="250.0">
+ <children>
+ <ImageView fx:id="tbar_logo" fitHeight="69.0" fitWidth="153.0" onMouseClicked="#switchToMain" pickOnBounds="true" preserveRatio="true">
+ <image>
+ <Image url="@../../Images/PlaceholderLogo.png" />
+ </image>
+ <HBox.margin>
+ <Insets />
+ </HBox.margin>
+ </ImageView>
+ </children>
+ <opaqueInsets>
+ <Insets />
+ </opaqueInsets>
+ </HBox>
+ <TextField fx:id="tbar_search" focusTraversable="false" minWidth="200.0" prefHeight="35.0" prefWidth="400.0" promptText="Search: Tags, Albums, Metadata, etc...">
+ <HBox.margin>
+ <Insets />
+ </HBox.margin>
+ </TextField>
+ <Button fx:id="tbar_searchBtn" minWidth="70" mnemonicParsing="false" onAction="#switchToSearch" text="SEARCH" textFill="white" />
+ <Button fx:id="tbar_explore" minWidth="70" mnemonicParsing="false" onAction="#switchToExplore" text="EXPLORE" textFill="white" />
+ <Button fx:id="tbar_albums" minWidth="70" mnemonicParsing="false" onAction="#switchToAlbums" text="ALBUMS" textFill="white" />
+ <Button fx:id="tbar_map" minWidth="50" mnemonicParsing="false" onAction="#switchToMap" text="MAP" textFill="white" />
+ <HBox alignment="CENTER_RIGHT" prefHeight="100.0" prefWidth="250.0">
+ <children>
+ <Button fx:id="tbar_upload" minWidth="70" mnemonicParsing="false" onAction="#switchToUpload" prefHeight="25.0" prefWidth="114.0" text="UPLOAD" textFill="white" />
+ </children>
+ </HBox>
+ </children>
+ </HBox>
+ </children>
+ </HBox>
+ <HBox alignment="CENTER" prefHeight="883.0" prefWidth="1791.0" styleClass="bodybg" stylesheets="@style.css" VBox.vgrow="ALWAYS">
+ <children>
+ <VBox alignment="CENTER" prefHeight="883.0" spacing="10.0">
<children>
- <ImageView fx:id="tbar_logo" fitHeight="69.0" fitWidth="153.0" onMouseClicked="#switchToMain" pickOnBounds="true" preserveRatio="true">
- <image>
- <Image url="@../../Images/PlaceholderLogo.png" />
- </image>
- </ImageView>
- <Pane prefHeight="100.0" prefWidth="343.0" />
- <TextField fx:id="tbar_search" prefHeight="25.0" prefWidth="358.0" promptText="Search: Tags, Albums, Metadata, etc..." />
- <Button fx:id="tbar_searchBtn" mnemonicParsing="false" onAction="#switchToSearch" text="SEARCH" />
- <Button fx:id="tbar_explore" mnemonicParsing="false" onAction="#switchToExplore" text="EXPLORE" />
- <Button fx:id="tbar_albums" mnemonicParsing="false" onAction="#switchToAlbums" text="ALBUMS" />
- <Button fx:id="tbar_map" mnemonicParsing="false" onAction="#switchToMap" text="MAP" />
- <Pane prefHeight="100.0" prefWidth="174.0" />
- <Button fx:id="tbar_upload" mnemonicParsing="false" onAction="#switchToUpload" prefHeight="25.0" prefWidth="114.0" text="UPLOAD" />
+ <Pane fx:id="drag_drop" maxHeight="-Infinity" maxWidth="-Infinity" onDragDropped="#droppedFiles" onDragOver="#acceptDrop" prefHeight="190.0" prefWidth="397.0" styleClass="dropMenu" stylesheets="@style.css">
+ <children>
+ <Text fill="WHITE" layoutX="94.0" layoutY="104.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Drag and drop files" wrappingWidth="209.3367156982422">
+ <font>
+ <Font size="24.0" />
+ </font>
+ </Text>
+ </children>
+ </Pane>
+ <Button fx:id="uploadBtn" alignment="CENTER" contentDisplay="CENTER" mnemonicParsing="false" onMouseClicked="#chooseFile" prefHeight="30.0" prefWidth="187.0" text="Choose files">
+ <font>
+ <Font size="18.0" />
+ </font>
+ </Button>
</children>
- </HBox>
- <HBox alignment="CENTER" prefHeight="883.0" prefWidth="1791.0">
- <children>
- <VBox alignment="CENTER" prefHeight="883.0" prefWidth="641.0">
- <children>
- <Pane fx:id="drag_drop" maxHeight="-Infinity" maxWidth="-Infinity" onDragDropped="#droppedFiles" onDragOver="#acceptDrop" prefHeight="190.0" prefWidth="397.0" style="-fx-background-color: lightgrey; -fx-border-color: grey;">
- <children>
- <Text layoutX="94.0" layoutY="104.0" strokeType="OUTSIDE" strokeWidth="0.0" text="Drag and drop files" wrappingWidth="209.3367156982422">
- <font>
- <Font size="24.0" />
- </font>
- </Text>
- </children>
- </Pane>
- <Button fx:id="uploadBtn" alignment="CENTER" contentDisplay="CENTER" mnemonicParsing="false" onMouseClicked="#chooseFile" prefHeight="30.0" prefWidth="187.0" text="Choose files">
- <font>
- <Font size="18.0" />
- </font></Button>
- </children>
- </VBox>
- </children>
- </HBox>
- </children>
- </VBox>
-</children>
-</AnchorPane>
+ </VBox>
+ </children>
+ </HBox>
+ </children>
+</VBox>
--
GitLab