Having trouble with updating ImageView panes in javafx

So I have been working on a Cinema GUI app coded in javafx for about a week now. Anyways, today I decided to shift my focus towards the booking menu. Now allow me to explain my thought process before I post the code below: According to my logic, each film will have it's own separate timings, and each of these timings will have their own separate halls (or in my case, their own number of seats). Now I went for bit of amateur'ish approach and decided to create a nested HashMap of the type: *HashMap<HashMap<String, LocalTime>,Integer> * , I used another temporary HashMap to store my keys. So this way, all the films will have their own separate halls on the basis of their timings. Anyways, now moving onto the FXML part. I used scene builder to put together a scene that consists of an anchor pane: on which there is an image view (which serves as my background image). On the imageView I have two HBoxes with ImagViews (my seat logo for the cinema) parented to their stackPanes, which in turn are parented to their own separate panes. I also have a button in my scene that will process the booking part by replacing my existing image inside my "Seats images views" with new ones (the ones filled with color). Other than that, I have a label on top of my scene that keeps a count of number of seats left.

Now here's what I am hoping to achieve: When I click on my button, I want my "seat images" to be replaced with the new ones (which by the way, I already managed to achieve through a very basic approach). But the problem arises, when I store this new information (my new images, along with the number of seats left). Because when I head over to the main menu inside my GUI app, and then come back, my program always gives me weird results. Sometimes, it will leave out the first seat image, but replace the rest. Sometimes, it will give arbitrary results. I have been scratching my head in perplexity throughout the whole day. I think it is also important to mention that I am fairly new to javafx and have been training myself for the past 2 weeks. I have tried sorts of approaches throughout the day, but to no avail. Anyways, as a last resort, I come here asking for your guy's help. I am going to attach the visual screenshots pertaining to my problem inside my application down below.

Here's the current code in my HallSeats class -- the class that manages the functionality of my booking process (Also to save you some time, the two methods that I am primarily concerned with are bookSeat, a method that changes the information when I am present in the current scene, and the InitializePane method, a method that updates the state of my HBoxes during the next instance of my FXML scene):

Code:

---

public class HallSeats implements Initializable {
    @FXML
  private ImageView seat1;

    public static HashMap<HashMap<String, LocalTime>, Integer> seatInformation = new HashMap<>();

    public static String currentFilm;
    public static LocalTime currentTime;
    private MovieManager movieManager = new MovieManager();
    /**this will let user only select a seat once**/
  private int token = 0;
    private int hpaneCount = 0;

    /**temoporary hashmap**/
  HashMap<String, LocalTime> tempHashMap=  new HashMap<>();

    /**defining our HBOXES**/
  @FXML
  private HBox hpane1;
    @FXML
  private HBox hpane2;
    @FXML
  private HBox hpane3;

    /**THIS WILL DISPLAY THE NUMBER OF SEATS ON THE SCREEN**/
    @FXML
  private Label seatNumber;

    /**THIS WILL CONTROL THE NUMBER OF SEATS**/
    int totalClicks = 0;





    public void changeColour (MouseEvent e) {
      var seat =  (ImageView)e.getSource();
      seat.setImage(new Image(getClass().getResourceAsStream("/icons/booked.png")));
    }

  @Override
  public void initialize(URL url, ResourceBundle resourceBundle) {
      //check to see if we already have this movie and this local time
    // if not then we will proceed to reset the number of unbooked seats to 12

      tempHashMap.put(currentFilm, currentTime );
    if(!seatInformation.containsKey(tempHashMap)) {
      seatInformation.put(tempHashMap, 12);
    }


      totalClicks = 12 - seatInformation.get(tempHashMap);
      if(totalClicks != 0)
      initializePanes();

  seatNumber.setText(String.valueOf(seatInformation.get(tempHashMap)));


  }




  public Movie findCurrentMovie () {
      for(var a : movieManager.movieList) {
        if(a.getName().equals(currentFilm))
          return a;
      }
      return null;
  }

  public void goToMenu (MouseEvent e) {
      Thread thread = new Thread(new Runnable() {
          @Override
          public void run() {
              try {
                  Stage primaryStage = new Stage();
                  Parent root = FXMLLoader.load(getClass().getResource("MovieSection2.fxml"));
                  primaryStage.setTitle("Hello World");
                  primaryStage.setScene((new Scene(root, 1100, 618)));
                  primaryStage.initStyle(StageStyle.TRANSPARENT);
                  primaryStage.show();
              }
              catch (Exception exception) {
                  exception.printStackTrace();
              }

              Button label = (Button)e.getSource();
              label.getScene().getWindow().hide();
          }
      });
      thread.run();
  }


  /**THIS WILL UPDATE  THE UNBOOKED SEAT IMAGE WHENVER I CLICK ON THE UNBOOKED SEAT**/
  public void bookSeat(MouseEvent e) {
      //change colour
      //decrement integer number


      if(totalClicks < hpane1.getChildren().size()) {
          for (int i = totalClicks; i < totalClicks + 1 % hpane1.getChildren().size(); i++) {
              var tempPane = (Pane) hpane1.getChildren().get(i % hpane1.getChildren().size());
              var stackPane = (StackPane) tempPane.getChildren().get(0);
              ImageView imagePane = (ImageView) stackPane.getChildren().get(0);
              imagePane.setImage(new Image(getClass().getResourceAsStream("/icons/booked.png")));
          }
          seatInformation.put(tempHashMap, seatInformation.get(tempHashMap) - totalClicks);
          totalClicks++;
          System.out.println("Total clicks: " + totalClicks);
      }

      else if (totalClicks >= hpane1.getChildren().size() && totalClicks < hpane2.getChildren().size() + hpane1.getChildren().size()) {
          for(int i = totalClicks; i<totalClicks + 1%hpane2.getChildren().size(); i++) {
              var tempPane =(Pane)hpane2.getChildren().get(i %hpane2.getChildren().size());
              var stackPane = (StackPane) tempPane.getChildren().get(0);
              ImageView imageView = (ImageView)stackPane.getChildren().get(0);
              imageView.setImage(new Image(getClass().getResourceAsStream("/icons/booked.png")));
          }
          seatInformation.put(tempHashMap, seatInformation.get(tempHashMap) - totalClicks);
          totalClicks++;
      }

      else if (totalClicks >= hpane1.getChildren().size() && totalClicks < hpane2.getChildren().size() + hpane1.getChildren().size() + hpane3.getChildren().size()) {
          for(int i = totalClicks; i<totalClicks + 1%hpane3.getChildren().size(); i++) {
              var tempPane =(Pane)hpane3.getChildren().get(i %hpane3.getChildren().size());
              var stackPane = (StackPane) tempPane.getChildren().get(0);
              ImageView imageView = (ImageView)stackPane.getChildren().get(0);
              imageView.setImage(new Image(getClass().getResourceAsStream("/icons/booked.png")));
          }
          seatInformation.put(tempHashMap, seatInformation.get(tempHashMap) - totalClicks);
          totalClicks++;
      }

      seatNumber.setText(String.valueOf(totalClicks));



  }


  /**THIS WILL UPDATE MY HBOXES WHENEVER I COME BACK TO THIS SPECIFIC BOOKING SECTION**/
  public void initializePanes () {

      int temp = totalClicks;

      int counter =0;
      while (temp- 1>= 0) {

              var tempPane = (Pane) hpane1.getChildren().get(counter++);
              var stackPane = (StackPane) tempPane.getChildren().get(0);
              ImageView imagePane = (ImageView) stackPane.getChildren().get(0);
              imagePane.setImage(new Image(getClass().getResourceAsStream("/icons/booked.png")));

          temp--;
      }


  }
}

---

I had also tried a whole variety of other approaches towards this problem (that I ended up removing alongside as I was coding), but none of them worked. Anyways, I hope my code makes sense. I definitely didn't put much emphasis on the documentation part as I was writing it, so I apologize if you find it hard to understand it.

Alsooo here's my FXML code, in case you're interested :

Code:

---

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.text.*?>

<AnchorPane prefHeight="618.0" prefWidth="1100.0" xmlns="http://javafx.com/javafx/10.0.2-internal" xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample.HallSeats">
  <children>
      <ImageView fitHeight="618.0" fitWidth="1100.0" pickOnBounds="true">
        <image>
            <Image url="@../MovieSectionMenuImage/RetroAesthetic.jpg" />
        </image>
      </ImageView>
      <Pane layoutX="116.0" layoutY="45.0" prefHeight="498.0" prefWidth="849.0" style="-fx-background-color: rgb(27, 38, 44, 0.7);">
        <children>
            <HBox fx:id="hpane2" layoutX="44.0" layoutY="166.0" prefHeight="154.0" prefWidth="791.0" style="-fx-background-color: rgb(255,255, 255, 0.4);">
              <children>
                  <Pane prefHeight="155.0" prefWidth="184.0">
                    <children>
                        <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                          <children>
                              <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                                <image>
                                    <Image url="@../icons/armchair.png" />
                                </image>
                              </ImageView>
                          </children>
                        </StackPane>
                    </children>
                  </Pane>
                  <Pane layoutX="10.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
                    <children>
                        <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                          <children>
                              <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                                <image>
                                    <Image url="@../icons/armchair.png" />
                                </image>
                              </ImageView>
                          </children>
                        </StackPane>
                    </children>
                  </Pane>
                  <Pane layoutX="194.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
                    <children>
                        <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                          <children>
                              <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                                <image>
                                    <Image url="@../icons/armchair.png" />
                                </image>
                              </ImageView>
                          </children>
                        </StackPane>
                    </children>
                  </Pane>
                  <Pane layoutX="378.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
                    <children>
                        <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                          <children>
                              <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                                <image>
                                    <Image url="@../icons/armchair.png" />
                                </image>
                              </ImageView>
                          </children>
                        </StackPane>
                    </children>
                  </Pane>
              </children>
            </HBox>
            <HBox fx:id="hpane3" layoutX="44.0" layoutY="317.0" prefHeight="169.0" prefWidth="791.0" style="-fx-background-color: rgb(255,255, 255, 0.4);">
              <children>
                  <Pane prefHeight="155.0" prefWidth="184.0">
                    <children>
                        <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                          <children>
                              <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                                <image>
                                    <Image url="@../icons/armchair.png" />
                                </image>
                              </ImageView>
                          </children>
                        </StackPane>
                    </children>
                  </Pane>
                  <Pane layoutX="10.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
                    <children>
                        <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                          <children>
                              <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                                <image>
                                    <Image url="@../icons/armchair.png" />
                                </image>
                              </ImageView>
                          </children>
                        </StackPane>
                    </children>
                  </Pane>
                  <Pane layoutX="194.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
                    <children>
                        <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                          <children>
                              <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                                <image>
                                    <Image url="@../icons/armchair.png" />
                                </image>
                              </ImageView>
                          </children>
                        </StackPane>
                    </children>
                  </Pane>
                  <Pane layoutX="378.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
                    <children>
                        <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                          <children>
                              <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                                <image>
                                    <Image url="@../icons/armchair.png" />
                                </image>
                              </ImageView>
                          </children>
                        </StackPane>
                    </children>
                  </Pane>
              </children>
            </HBox>
        </children></Pane>
      <HBox fx:id="hpane1" layoutX="160.0" layoutY="52.0" prefHeight="161.0" prefWidth="791.0" style="-fx-background-color: rgb(255,255, 255, 0.4);">
        <children>
            <Pane prefHeight="155.0" prefWidth="184.0">
              <children>
                  <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                    <children>
                        <ImageView fx:id="seat1" fitHeight="98.0" fitWidth="150.0" onMouseClicked="#bookSeat" pickOnBounds="true" preserveRatio="true">
                          <image>
                              <Image url="@../icons/armchair.png" />
                          </image>
                        </ImageView>
                    </children>
                  </StackPane>
              </children></Pane>
            <Pane layoutX="10.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
              <children>
                  <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                    <children>
                        <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                          <image>
                              <Image url="@../icons/armchair.png" />
                          </image>
                        </ImageView>
                    </children>
                  </StackPane>
              </children>
            </Pane>
            <Pane layoutX="194.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
              <children>
                  <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                    <children>
                        <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                          <image>
                              <Image url="@../icons/armchair.png" />
                          </image>
                        </ImageView>
                    </children>
                  </StackPane>
              </children>
            </Pane>
            <Pane layoutX="378.0" layoutY="10.0" prefHeight="155.0" prefWidth="184.0">
              <children>
                  <StackPane layoutX="8.0" layoutY="11.0" prefHeight="141.0" prefWidth="167.0">
                    <children>
                        <ImageView fitHeight="98.0" fitWidth="150.0" pickOnBounds="true" preserveRatio="true">
                          <image>
                              <Image url="@../icons/armchair.png" />
                          </image>
                        </ImageView>
                    </children>
                  </StackPane>
              </children>
            </Pane>
        </children></HBox>
      <Label fx:id="seatNumber" layoutX="258.0" layoutY="8.0" prefHeight="65.0" prefWidth="263.0" text="Total Seats" textFill="WHITE">
        <font>
            <Font size="44.0" />
        </font>
      </Label>
      <Button layoutX="405.0" layoutY="543.0" mnemonicParsing="false" onMouseClicked="#goToMenu" text="Go to menu" />
      <Button layoutX="575.0" layoutY="543.0" mnemonicParsing="false" onMouseClicked="#bookSeat" style="-fx-background-color: red;" text="BOOK Seat" />
  </children>
</AnchorPane>

---

Here are the screenshots from my scene: https://imgur.com/a/s1VfcMc