Part 1: A Basic JavaFX Graph Editor Build a simple GUI in JavaFX that allows the user to create and manipulate a graph Interface requirements A main panel with size 500x500; this is the area where the user will interact with the graph (see below) . The main panel shows all graph vertices, labels, and edges Interaction requirements Clicking on the background of the main panel creates a new vertex, drawn as a blue circle with an integer label Clicking down on an existing vertex selects that vertex (shown by drawing the vertex in orange); dragging then moves the vertex. Releasing the mouse returns the vertex to blue If the user Shift-Clicks a vertex, the vertex gets a thicker black border, and then when the user drags, an edge is drawn to the mouse location. If the user releases the mouse on another vertex, the edge is added to the graph (if the user releases on the background, the edge is discarded) Graph Demo! Graph Demo! Graph Demo 4 4 Main graph view User clicks on vertex 1 User shift-clicks on vertex 0 then drags Software requirements: . You must implement the system using Model-View-Controller, with correct separation between these components Create separate classes for the Model, the View, and the Controller, following the examples given in class Implement publish-subscribe communication to notify Views of changes to the Model; other communication between the MVC components can be through direct links (i.e., instance variables) . Build the system using the following classes o GraphDemo o GraphModel o Vertex JavaFX application class Class to store the model Represents a vertex in the graph o Edge o GraphView o GraphViewController Represents an edge in the graph A custom view for drawing the graph Controller for the GraphView Resources for part 1 Blob MVC example from class in Examples folder on the course Moodle Part 1: A Basic JavaFX Graph Editor Build a simple GUI in JavaFX that allows the user to create and manipulate a graph Interface requirements A main panel with size 500x500; this is the area where the user will interact with the graph (see below) . The main panel shows all graph vertices, labels, and edges Interaction requirements Clicking on the background of the main panel creates a new vertex, drawn as a blue circle with an integer label Clicking down on an existing vertex selects that vertex (shown by drawing the vertex in orange); dragging then moves the vertex. Releasing the mouse returns the vertex to blue If the user Shift-Clicks a vertex, the vertex gets a thicker black border, and then when the user drags, an edge is drawn to the mouse location. If the user releases the mouse on another vertex, the edge is added to the graph (if the user releases on the background, the edge is discarded) Graph Demo! Graph Demo! Graph Demo 4 4 Main graph view User clicks on vertex 1 User shift-clicks on vertex 0 then drags Software requirements: . You must implement the system using Model-View-Controller, with correct separation between these components Create separate classes for the Model, the View, and the Controller, following the examples given in class Implement publish-subscribe communication to notify Views of changes to the Model; other communication between the MVC components can be through direct links (i.e., instance variables) . Build the system using the following classes o GraphDemo o GraphModel o Vertex JavaFX application class Class to store the model Represents a vertex in the graph o Edge o GraphView o GraphViewController Represents an edge in the graph A custom view for drawing the graph Controller for the GraphView Resources for part 1 Blob MVC example from class in Examples folder on the course Moodle