Merge branch 'improve-view-picture' into 'dev'

Improve view picture

See merge request !152

src/main/java/NTNU/IDATT1002/controllers/Explore.java

@@ -9,6 +9,7 @@ import javafx.event.EventHandler;
 import javafx.fxml.Initializable;
 import javafx.geometry.Pos;
 import javafx.scene.Node;
+import javafx.scene.Parent;
 import javafx.scene.control.Button;
 import javafx.scene.control.ScrollPane;
 import javafx.scene.control.TextField;
@@ -43,6 +44,9 @@ public class Explore implements Initializable {
     public Button footer_previousBtn;
     public Button footer_nextBtn;
 
+    private List<NTNU.IDATT1002.models.Image> images;
+    private int start;
+    private int end;
 
     /**
      * Method that runs when explore.fxml is set as scene
@@ -52,21 +56,21 @@ public class Explore implements Initializable {
      */
     @Override
     public void initialize(URL url, ResourceBundle resourceBundle) {
-        List<NTNU.IDATT1002.models.Image> images = new ImageService(App.ex.getEntityManager()).getAllImages();
+        images = new ImageService(App.ex.getEntityManager()).getAllImages();
+        start = 0;
+        end = 15;
+
+        generateImages(start, end);
+    }
+
+    public void generateImages(int start, int end){
+        gridPane.getChildren().clear();
         //Limited elements to 15 since grid pane since is 3x5
-        //Can implement automatic row adding when this limit exceeded later
-        for(int i = 0; i < images.size() && i < 100; i++) {
+        for(int i = start; i < images.size() && i < end; i++) {
+            int index = i%15;
             //Row and column in gripdane
-            int column = i%3;
-            int row = (i-column)/3;
-
-            //Add rows
-            if(images.size() > 15){
-                gridPane.setMinHeight(1600 + (((i-15)*160)));
-                for (int j = 0; j < ((i-15)/3); j++){
-                    gridPane.addRow(j);
-                }
-            }
+            int column = index%3;
+            int row = (index-column)/3;
 
             //Make vbox container for content
             VBox vBox = new VBox();
@@ -88,7 +92,7 @@ public class Explore implements Initializable {
             imageView.setOnMouseClicked(new EventHandler<MouseEvent>() {
                 @Override public void handle(MouseEvent e) {
                     try{
-                        switchToPicture(e);
+                        switchToViewImage(e);
                     } catch (IOException ex) {
                         ex.printStackTrace();
                     }
@@ -96,10 +100,10 @@ public class Explore implements Initializable {
             });
 
             //Text describing the picture's title and tag
-            Text title = new Text("TITLE:");
+            Text title = new Text("LEGG IN TITTEL I DB");
             title.setFont(Font.font("System Bold", 24));
             String tagsAsString = TagService.getTagsAsString(images.get(i).getTags());
-            Text tag = new Text("TAGS:\n " + tagsAsString);
+            Text tag = new Text(tagsAsString);
             tag.setFont(Font.font("System Bold", 18));
 
             //Add elements to vbox
@@ -173,7 +177,7 @@ public class Explore implements Initializable {
      * @param mouseEvent
      * @throws IOException
      */
-    public void switchToPicture(MouseEvent mouseEvent) throws IOException {
+    public void switchToViewImage(MouseEvent mouseEvent) throws IOException {
         long imageId = 0;
         Node node = (Node) mouseEvent.getSource();
         if (node.getId() != null){
@@ -182,7 +186,7 @@ public class Explore implements Initializable {
 
         if (imageId != 0) {
             App.ex.setChosenImg(imageId);
-            App.setRoot("view_picture");
+            App.setRoot("view_image");
         }
     }
 
@@ -192,7 +196,16 @@ public class Explore implements Initializable {
      * @throws IOException
      */
     public void switchToPrevious(ActionEvent actionEvent) throws IOException {
-        //TODO: Make method that updates content to previous "page"
+        if (start - 15 >= 0){
+            start -= 15;
+            end -= 15;
+            generateImages(start, end);
+
+            if (start == 0){
+                footer_previousBtn.setDisable(true);
+            }
+            footer_nextBtn.setDisable(false);
+        }
     }
 
     /**
@@ -201,6 +214,15 @@ public class Explore implements Initializable {
      * @throws IOException
      */
     public void switchToNext(ActionEvent actionEvent) throws IOException {
-        //TODO: Make method that updates content to next "page"
+        if (start + 15 < images.size()){
+            start += 15;
+            end += 15;
+            generateImages(start, end);
+
+            if (end >= images.size()){
+                footer_nextBtn.setDisable(true);
+            }
+            footer_previousBtn.setDisable(false);
+        }
     }
 }

src/main/java/NTNU/IDATT1002/controllers/ExploreAlbums.java

@@ -127,7 +127,7 @@ public class ExploreAlbums implements Initializable {
      */
     public VBox createAlbumVBox(ObservableList<Album> listOfAlbums){
         VBox albumVBox = new VBox();
-        int maxPerPage = Math.min(listOfAlbums.size(), 100);
+        int maxPerPage = Math.min(listOfAlbums.size(), 50);
         
         for (int i = 0; i < maxPerPage; i++) {
             Album album = listOfAlbums.get(i);

src/main/java/NTNU/IDATT1002/controllers/Search.java

@@ -84,7 +84,7 @@ public class Search implements Initializable {
             imageView.setOnMouseClicked(new EventHandler<MouseEvent>() {
                 @Override public void handle(MouseEvent e) {
                     try{
-                        switchToPicture(e);
+                        switchToViewImage(e);
                     } catch (IOException ex) {
                         ex.printStackTrace();
                     }
@@ -235,7 +235,7 @@ public class Search implements Initializable {
      * @param mouseEvent what is clicked on
      * @throws IOException
      */
-    public void switchToPicture(MouseEvent mouseEvent) throws IOException {
+    public void switchToViewImage(MouseEvent mouseEvent) throws IOException {
         long imageId = 0;
         Node node = (Node) mouseEvent.getSource();
         if (node.getId() != null){

src/main/java/NTNU/IDATT1002/controllers/ViewAlbum.java

@@ -13,17 +13,24 @@ import javafx.event.EventHandler;
 import javafx.fxml.FXML;
 import javafx.fxml.Initializable;
 import javafx.geometry.Insets;
+import javafx.scene.Node;
+import javafx.scene.Scene;
 import javafx.scene.control.Button;
 import javafx.scene.control.TextField;
 import javafx.scene.image.Image;
 import javafx.scene.image.ImageView;
 import javafx.scene.input.MouseEvent;
+import javafx.scene.layout.BorderPane;
 import javafx.scene.layout.HBox;
 import javafx.scene.layout.Pane;
 import javafx.scene.layout.VBox;
 import javafx.scene.text.Font;
 import javafx.scene.text.FontWeight;
 import javafx.scene.text.Text;
+import javax.persistence.EntityManager;
+
+import javafx.stage.Stage;
+import org.slf4j.LoggerFactory;
 
 import javax.persistence.EntityManager;
 import java.io.File;
@@ -107,7 +114,6 @@ public class ViewAlbum implements Initializable {
 
     /**
      * Changes the current main picture
-     * //TODO: Make it change main picture title and tags
      * @param mouseEvent something is clicked
      */
     private void setActiveImage(MouseEvent mouseEvent) {
@@ -284,8 +290,30 @@ public class ViewAlbum implements Initializable {
         App.setRoot("upload");
     }
 
-    public void openPopUpPicture(MouseEvent mouseEvent) {
-        //write method that opens a pop-up view of the main picture
+    /**
+     * Makes a new stage and display the clicked image in max size
+     * @param mouseEvent
+     */
+    public void openPopUpImage(MouseEvent mouseEvent) {
+        Node clickedObject = (Node) mouseEvent.getSource();
+        if (clickedObject instanceof ImageView){
+            Stage stage = new Stage();
+            BorderPane pane = new BorderPane();
+
+            ImageView imageView = new ImageView();
+            imageView.fitWidthProperty().bind(stage.widthProperty());
+            imageView.fitHeightProperty().bind(stage.heightProperty());
+            imageView.setPreserveRatio(true);
+            imageView.setPickOnBounds(true);
+            imageView.setImage(((ImageView) clickedObject).getImage());
+            pane.setCenter(imageView);
+
+
+            Scene scene = new Scene(pane);
+            stage.setMaximized(true);
+            stage.setScene(scene);
+            stage.showAndWait();
+        }
     }
 
     /**

src/main/java/NTNU/IDATT1002/controllers/ViewPicture.java → src/main/java/NTNU/IDATT1002/controllers/ViewImage.java

@@ -2,41 +2,49 @@ package NTNU.IDATT1002.controllers;
 
 import NTNU.IDATT1002.App;
 import NTNU.IDATT1002.service.ImageService;
+import NTNU.IDATT1002.service.TagService;
 import NTNU.IDATT1002.utils.ImageUtil;
+import NTNU.IDATT1002.utils.MetaDataExtractor;
 import javafx.event.ActionEvent;
 import javafx.fxml.Initializable;
+import javafx.scene.Node;
+import javafx.scene.Scene;
 import javafx.scene.control.Button;
 import javafx.scene.control.TextField;
 import javafx.scene.image.Image;
 import javafx.scene.image.ImageView;
 import javafx.scene.input.MouseEvent;
+import javafx.scene.layout.BorderPane;
 import javafx.scene.layout.Pane;
 import javafx.scene.text.Text;
+import javafx.stage.Stage;
 
 import javax.persistence.EntityManager;
 import java.io.IOException;
 import java.net.URL;
+import java.util.Optional;
 import java.util.ResourceBundle;
 
 
 /**
  * Controls the buttons and changeable elements on view_.fxml,
- * a page where get a more detailed view of a picture
+ * a page where get a more detailed view of a image
  * @version 1.0 22.03.2020
  */
-public class ViewPicture implements Initializable{
+public class ViewImage implements Initializable{
     public ImageView tbar_logo;
     public TextField tbar_search;
     public Button tbar_explore;
     public Button tbar_map;
     public Button tbar_upload;
-    public ImageView picture;
-    public Text picture_tagsField;
-    public Text picture_title_field;
-    public Text picture_descField;
-    public Pane metadata_pane;
     public Button tbar_searchBtn;
     public Button tbar_albums;
+
+    public ImageView imageContainer;
+    public Text imageTagsField;
+    public Text imageTitleField;
+    public Text imageMetadataField;
+
     private ImageService imageService;
 
     @Override
@@ -44,11 +52,16 @@ public class ViewPicture implements Initializable{
         EntityManager entityManager = App.ex.getEntityManager();
         imageService = new ImageService(entityManager);
         Long currentImageId = App.ex.getChosenImg();
-        NTNU.IDATT1002.models.Image foundImage = imageService.findById(currentImageId).get();
-        Image image = ImageUtil.convertToFXImage(foundImage);
-
-        picture.setImage(image);
-
+        Optional<NTNU.IDATT1002.models.Image> foundImage = imageService.findById(currentImageId);
+        imageContainer.setFitHeight(540);
+        imageContainer.setFitWidth(960);
+        foundImage.ifPresent(image -> {
+            Image convertedImage = ImageUtil.convertToFXImage(image);
+            imageContainer.setImage(convertedImage);
+            imageTitleField.setText("KAN VI PLIS LEGGE INN TITTEL I DB");
+            imageTagsField.setText(TagService.getTagsAsString(image.getTags()));
+            imageMetadataField.setText(image.getMetadata().toString());
+        });
     }
 
     /**
@@ -110,10 +123,28 @@ public class ViewPicture implements Initializable{
     }
 
     /**
-     * Method that opens large version of image in popup
+     * Makes a new stage and display the clicked image in max size
      * @param mouseEvent
      */
-    public void openPopUpPicture(MouseEvent mouseEvent) {
-        //method that opens pop-up of picture
+    public void openPopUpImage(MouseEvent mouseEvent) {
+        Node clickedObject = (Node) mouseEvent.getSource();
+        if (clickedObject instanceof ImageView){
+            Stage stage = new Stage();
+            BorderPane pane = new BorderPane();
+
+            ImageView imageView = new ImageView();
+            imageView.fitWidthProperty().bind(stage.widthProperty());
+            imageView.fitHeightProperty().bind(stage.heightProperty());
+            imageView.setPreserveRatio(true);
+            imageView.setPickOnBounds(true);
+            imageView.setImage(((ImageView) clickedObject).getImage());
+            pane.setCenter(imageView);
+
+
+            Scene scene = new Scene(pane);
+            stage.setMaximized(true);
+            stage.setScene(scene);
+            stage.showAndWait();
+        }
     }
 }

src/main/resources/NTNU/IDATT1002/explore.fxml

@@ -85,7 +85,7 @@
                <bottom>
                   <HBox alignment="CENTER" minHeight="200.0" prefHeight="200.0" prefWidth="1920.0" spacing="20.0" BorderPane.alignment="TOP_CENTER">
                      <children>
-                        <Button fx:id="footer_previousBtn" mnemonicParsing="false" onAction="#switchToPrevious" text="PREVIOUS" />
+                        <Button fx:id="footer_previousBtn" disable="true" mnemonicParsing="false" onAction="#switchToPrevious" text="PREVIOUS" />
                         <Button fx:id="footer_nextBtn" layoutX="944.0" layoutY="48.0" mnemonicParsing="false" onAction="#switchToNext" text="NEXT" />
                      </children>
                      <padding>

src/main/resources/NTNU/IDATT1002/view_album.fxml

@@ -67,7 +67,7 @@
                               <Font size="18.0" />
                            </font>
                         </Text>
-                        <ImageView fx:id="mainImageContainer" fitWidth="840.0" onMouseClicked="#openPopUpPicture" pickOnBounds="true" preserveRatio="true" style="-fx-max-width: 840" styleClass="viewAlbumImage">
+                        <ImageView fx:id="mainImageContainer" fitWidth="840.0" fitHeight="450.0" onMouseClicked="#openPopUpImage" pickOnBounds="true" preserveRatio="true"  styleClass="viewAlbumImage">
                            <image>
                               <Image url="@../../Images/placeholder-1920x1080.png" />
                            </image>

src/main/resources/NTNU/IDATT1002/view_picture.fxml → src/main/resources/NTNU/IDATT1002/view_image.fxml

@@ -11,7 +11,7 @@
 <?import javafx.scene.text.Font?>
 <?import javafx.scene.text.Text?>
 
-<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.ViewPicture">
+<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.ViewImage">
    <children>
       <HBox alignment="CENTER" prefHeight="100.0" prefWidth="200.0" styleClass="tbarbg" stylesheets="@style.css">
          <children>
@@ -56,31 +56,21 @@
                <children>
                   <VBox alignment="CENTER_LEFT" maxHeight="981.0" maxWidth="966.0">
                      <children>
-                        <Text fx:id="picture_title_field" fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="Picturetitle" textAlignment="CENTER">
+                        <Text fx:id="imageTitleField" fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="Picturetitle" textAlignment="CENTER">
                            <font>
                               <Font name="System Bold Italic" size="36.0" />
                            </font>
                         </Text>
-                        <ImageView fx:id="picture" fitHeight="543.0" fitWidth="969.0" onMouseClicked="#openPopUpPicture" pickOnBounds="true" preserveRatio="true">
+                        <ImageView fx:id="imageContainer" onMouseClicked="#openPopUpImage" pickOnBounds="true" preserveRatio="true">
                            <image>
                               <Image url="@../../Images/placeholder-1920x1080.png" />
                            </image>
                         </ImageView>
-                        <Text fx:id="picture_tagsField" fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="#tags">
+                        <Text fx:id="imageTagsField" fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="#tags">
                            <font>
                               <Font size="18.0" />
                            </font>
                         </Text>
-                        <Text fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="DESCRIPTION:" wrappingWidth="164.24609375">
-                           <font>
-                              <Font name="System Bold" size="24.0" />
-                           </font>
-                        </Text>
-                        <Text fx:id="picture_descField" fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." wrappingWidth="700.0">
-                           <font>
-                              <Font size="14.0" />
-                           </font>
-                        </Text>
                      </children>
                   </VBox>
                </children>
@@ -92,7 +82,13 @@
                         <Font name="System Bold" size="24.0" />
                      </font>
                   </Text>
-                  <Pane fx:id="metadata_pane" prefHeight="906.0" prefWidth="854.0" style="-fx-background-color: #ffffff;" VBox.vgrow="ALWAYS" />
+                  <Pane prefHeight="906.0" prefWidth="854.0" style="-fx-background-color: #ffffff;" VBox.vgrow="ALWAYS">
+                     <Text fx:id="imageMetadataField" fill="WHITE" strokeType="OUTSIDE" strokeWidth="0.0" text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." wrappingWidth="700.0">
+                        <font>
+                           <Font size="14.0" />
+                        </font>
+                     </Text>
+                  </Pane>
                </children>
                <HBox.margin>
                   <Insets />