diff --git a/Video.java b/Video.java
new file mode 100644
index 0000000..3722c84
--- /dev/null
+++ b/Video.java
@@ -0,0 +1,29 @@
+import java.awt.Color;
+
+import javafx.scene.SubScene;
+import javafx.scene.layout.StackPane;
+
+public class Video {
+	int xstart;
+	int ystart;
+	int startTime;
+	int canvasWidth;
+	int canvasHeight;
+	String urlName;
+	Boolean loop;
+	SubScene subScene;
+	
+	public Video(String urlName, int startTime, Boolean loop, int xStart, int yStart, int canvasWidth, int canvasHeight) {
+		// construct video object using these
+		//create the SubScene object
+	}
+	public SubScene get() {
+		return subScene;
+	}
+	public void remove() {
+		//remove video from the subscene
+	}
+	public void start() {
+		//starts playing the video
+	}
+}
diff --git a/VideoLayer.java b/VideoLayer.java
new file mode 100644
index 0000000..1c939a8
--- /dev/null
+++ b/VideoLayer.java
@@ -0,0 +1,35 @@
+package media;
+
+import java.util.ArrayList;
+
+import javafx.scene.SubScene;
+import javafx.scene.canvas.Canvas;
+import javafx.scene.layout.StackPane;
+
+public class VideoLayer {
+	int height;
+	int width;
+	StackPane sp = new StackPane();
+	ArrayList<Video> videos = new ArrayList<Video>();
+	SubScene window = new SubScene(sp,width,height);
+	
+	public VideoLayer(int width,int height){
+		this.height = height;
+		this.width = width;
+		sp.setMinSize(width,height);
+	}
+	
+	public void add(String urlName, int startTime, Boolean loop, int xStart, int yStart) {
+		Video video = new Video( urlName, startTime, loop, xStart, yStart, width, height);//creates te video object and its subscene
+		videos.add(video);// adds the video object to the array list
+		sp.getChildren().add(video.get());// adds the SubScene(created with the constructor) to the video layer stack pane
+	}
+	
+	public void remove(Video video) {
+		sp.getChildren().remove(video.get());
+	}
+	
+	public SubScene get() {
+		return (window);
+	}
+}
\ No newline at end of file
diff --git a/sugestedFrameVideo/Video.java b/sugestedFrameVideo/Video.java
new file mode 100644
index 0000000..4555c65
--- /dev/null
+++ b/sugestedFrameVideo/Video.java
@@ -0,0 +1,215 @@
+package sugestedFrameVideo;
+
+import java.io.IOException;
+
+import javafx.application.Platform;
+import javafx.beans.InvalidationListener;
+import javafx.beans.Observable;
+import javafx.fxml.FXMLLoader;
+import javafx.scene.SubScene;
+import javafx.scene.control.Button;
+import javafx.scene.control.Label;
+import javafx.scene.control.Slider;
+import javafx.scene.image.Image;
+import javafx.scene.image.ImageView;
+import javafx.scene.layout.BorderPane;
+import javafx.scene.layout.Pane;
+import javafx.scene.media.Media;
+import javafx.scene.media.MediaPlayer;
+import javafx.scene.media.MediaView;
+import javafx.scene.media.MediaPlayer.Status;
+import javafx.util.Duration;
+
+public class Video {
+
+	int xstart;
+	int ystart;
+	int startTime;
+	int canvasWidth;
+	int canvasHeight;
+	String urlName;
+	Boolean loop;
+	SubScene subScene;
+
+	private MediaPlayer mp;
+	private Duration totTime;
+	private Pane toolbarNode;
+	private Slider volumeSlider;
+	private Label currentTimeLabel;
+	private Label totTimeLabel;
+
+	public Video(String urlName, int startTime, Boolean loop, int xStart, int yStart, int canvasWidth, int canvasHeight)
+			throws IOException {
+
+		// Loads the media player layout from a FXML file
+		BorderPane root = FXMLLoader.load(getClass().getClassLoader().getResource("videoPlayer.fxml"));
+
+		// creates a subscene
+		subScene = new SubScene(root, 600, 400);
+		// Set subscene position
+		subScene.setLayoutX(xStart);
+		subScene.setLayoutY(yStart);
+
+		// Video control bar, retrieved from the root
+		toolbarNode = (Pane) root.getBottom();
+		currentTimeLabel = (Label) toolbarNode.getChildren().get(7);
+		totTimeLabel = (Label) toolbarNode.getChildren().get(9);
+
+		// video media file
+		Media media = new Media(urlName);
+
+		// Create media player with the video media file
+		mp = new MediaPlayer(media);
+
+		// Volume slider
+		volumeSlider = (Slider) toolbarNode.getChildren().get(6);
+		volumeSlider.setValue(mp.getVolume() * 100);
+
+		volumeSlider.valueProperty().addListener(new InvalidationListener() {
+			@Override
+			public void invalidated(Observable arg0) {
+				mp.setVolume(volumeSlider.getValue() / 100);
+			}
+		});
+
+		// Set the video to auto play[Not sure if needed, video is auto played when the
+		// there is a delay set
+		// mp.setAutoPlay(true);
+
+		// Set video to loop
+		if (loop) {
+			mp.setCycleCount(MediaPlayer.INDEFINITE);
+		}
+
+		// Video control bar
+		toolbarNode = (Pane) root.getBottom();
+
+		// Playback slider
+		Slider playbackSlider = (Slider) toolbarNode.getChildren().get(5);
+
+		// Set the current play time to the time specified by the play back slider
+		playbackSlider.valueProperty().addListener(new InvalidationListener() {
+			@Override
+			public void invalidated(Observable arg0) {
+
+				if (playbackSlider.isValueChanging() || playbackSlider.isPressed()) {
+					if (mp.getStatus() == Status.PLAYING || mp.getStatus() == Status.PAUSED) {
+
+						mp.seek(totTime.multiply(playbackSlider.getValue() / 100));
+						setTimeLabel(mp.getCurrentTime(), currentTimeLabel);
+					}
+					// When the video is stopped and the slider is moved then set media player to
+					// paused since seek function cannot be used while the status is STOPPED
+					else if (mp.getStatus() == Status.STOPPED) {
+						mp.pause();
+						mp.seek(totTime.multiply(playbackSlider.getValue() / 100));
+					}
+				}
+			}
+		});
+
+		// when the video is paused, change the icon of the play button to play icon
+		mp.setOnPaused(new Runnable() {
+			@Override
+			public void run() {
+				Button play = (Button) toolbarNode.getChildren().get(0);
+				ImageView playImg = (ImageView) play.getGraphic();
+				playImg.setImage(new Image(getClass().getResourceAsStream("/graphics/play.png")));
+				setTimeLabel(mp.getCurrentTime(), currentTimeLabel);
+			}
+		});
+
+		// Set on halted: when critical error occurs
+		mp.setOnHalted(new Runnable() {
+			@Override
+			public void run() {
+				System.out.println("HALTED");
+			}
+		});
+
+		// when video is stopped, time should go back to 0
+		mp.setOnStopped(new Runnable() {
+			@Override
+			public void run() {
+				playbackSlider.setValue(0);
+				// Sets the current time to 0
+				setTimeLabel(mp.getCurrentTime(), currentTimeLabel);
+				Button play = (Button) toolbarNode.getChildren().get(0);
+				ImageView playImg = (ImageView) play.getGraphic();
+				//play button should have play icon on
+				playImg.setImage(new Image(getClass().getResourceAsStream("/graphics/play.png")));
+			}
+		});
+
+		// when the video is ready (loaded), set the total time of the video label
+		mp.setOnReady(new Runnable() {
+			public void run() {
+				Platform.runLater(new Runnable() {
+					public void run() {
+						totTime = mp.getMedia().getDuration();
+						setTimeLabel(totTime, totTimeLabel);
+					}
+				});
+			}
+		});
+
+		// set the slider to the beginning after video ends and stop the player
+		mp.setOnEndOfMedia(new Runnable() {
+			@Override
+			public void run() {
+				if (!loop) {
+					mp.stop();
+				}
+				mp.seek(totTime.multiply(playbackSlider.getValue() / 100));
+			}
+		});
+
+		// Set the play button to display pause icon when the video is playing
+		mp.setOnPlaying(new Runnable() {
+			@Override
+			public void run() {
+				Button play = (Button) toolbarNode.getChildren().get(0);
+				ImageView playImg = (ImageView) play.getGraphic();
+				playImg.setImage(new Image(getClass().getResourceAsStream("/graphics/pause.png")));
+			}
+		});
+
+		// Set the current time label and play back slider to follow the current time of
+		// the video being played
+		mp.currentTimeProperty().addListener(new InvalidationListener() {
+			@Override
+			public void invalidated(Observable arg0) {
+				Duration currentTime = mp.getCurrentTime();
+				playbackSlider.setValue(currentTime.toMillis() / totTime.toMillis() * 100);
+				setTimeLabel(currentTime, currentTimeLabel);
+			}
+		});
+
+		// Add media player to media view
+		Pane p = (Pane) root.getCenter();
+		p.getChildren().get(0);
+		MediaView mv = (MediaView) p.getChildren().get(0);
+		mv.setMediaPlayer(mp);
+	}
+
+	public SubScene get() {
+		return subScene;
+	}
+
+	// removes video from the subscene
+	public void remove() {
+		BorderPane root = (BorderPane) subScene.getRoot();
+		root.getChildren().clear();
+	}
+
+	// Set the text of the label to display the time
+	private void setTimeLabel(Duration time, Label label) {
+		int min = (int) time.toMinutes();
+		int sec = (int) (time.toSeconds() - 60 * min);
+		if (sec < 10) {
+			label.setText(min + ":0" + sec);
+		} else {
+			label.setText(min + ":" + sec);
+		}
+	}
+}
diff --git a/sugestedFrameVideo/VideoController.java b/sugestedFrameVideo/VideoController.java
new file mode 100644
index 0000000..e9cb237
--- /dev/null
+++ b/sugestedFrameVideo/VideoController.java
@@ -0,0 +1,123 @@
+package sugestedFrameVideo;
+
+import java.io.IOException;
+
+import javafx.event.ActionEvent;
+import javafx.fxml.FXML;
+import javafx.geometry.Bounds;
+import javafx.scene.Scene;
+import javafx.scene.SubScene;
+import javafx.scene.control.Button;
+import javafx.scene.control.Label;
+import javafx.scene.control.Slider;
+import javafx.scene.image.Image;
+import javafx.scene.image.ImageView;
+import javafx.scene.layout.AnchorPane;
+import javafx.scene.layout.BorderPane;
+import javafx.scene.layout.Pane;
+import javafx.scene.media.MediaPlayer;
+import javafx.scene.media.MediaView;
+import javafx.stage.Stage;
+
+public class VideoController {
+	@FXML
+	private Button play;
+	@FXML
+	private MediaView mediaView;
+	@FXML
+	private BorderPane vidBPane;
+	@FXML
+	private Slider volSlider;
+	@FXML
+	private Label subtitleLB;
+	@FXML
+	private ImageView fulsrcBtImg;
+	@FXML
+	private ImageView muteBtImg;
+
+	private Bounds vidSubBounds;
+
+	// Play button control
+	@FXML
+	public void play(ActionEvent event) {
+
+		if (mediaView.getMediaPlayer().getStatus() == MediaPlayer.Status.PLAYING) {
+			mediaView.getMediaPlayer().pause();
+
+		} else if (mediaView.getMediaPlayer().getStatus() != MediaPlayer.Status.PLAYING) {
+			mediaView.getMediaPlayer().play();
+		}
+	}
+
+	// Stop button control
+	public void stop(ActionEvent event) {
+		mediaView.getMediaPlayer().stop();
+		play.setText("Play");
+	}
+
+	// Full screen button control
+	public void setFullScreen(ActionEvent event) {
+		// Retrieve the correct containers
+		// TODO: adapt to the main program
+		// This only works for this structure
+		Scene pane = vidBPane.getScene();
+		Stage mainStage = (Stage) pane.getWindow();
+
+		Scene mainScene = mainStage.getScene();
+		AnchorPane root = (AnchorPane) mainScene.getRoot();
+		Pane slidePane = (Pane) root.getChildren().get(2);
+		Pane videoContainerPane = (Pane) slidePane.getChildren().get(0);
+		SubScene videoSubscene = (SubScene) videoContainerPane.getChildren().get(0);
+
+		if (mainStage.isFullScreen()) {
+			mainStage.setFullScreen(false);
+			videoSubscene.setLayoutX(vidSubBounds.getMinX());
+			videoSubscene.setLayoutY(vidSubBounds.getMinY());
+			videoSubscene.setHeight(vidSubBounds.getHeight());
+			videoSubscene.setWidth(vidSubBounds.getWidth());
+			mediaView.setFitHeight(vidSubBounds.getHeight() - 50);
+			mediaView.setFitWidth(vidSubBounds.getWidth());
+			fulsrcBtImg.setImage(new Image(getClass().getResourceAsStream("/graphics/fullscreen.png")));
+
+		} else {
+			if (!mainStage.isFullScreen()) {
+				vidSubBounds = videoSubscene.getBoundsInParent();
+			}
+			// Set the main stage to fullscreen
+			mainStage.setFullScreen(true);
+			// Put the video to the top left corner
+			videoSubscene.setLayoutX(0);
+			videoSubscene.setLayoutY(0);
+			// setHeight
+			videoSubscene.setHeight(mainStage.getHeight() - 30);
+			videoSubscene.setWidth(mainStage.getWidth());
+
+			mediaView.setFitHeight(mainStage.getHeight() - 80);
+			mediaView.setFitWidth(mainStage.getWidth());
+
+			fulsrcBtImg.setImage(new Image(getClass().getResourceAsStream("/graphics/back_from_fullscreen.png")));
+		}
+	}
+
+	public void captionOn(ActionEvent event) throws IOException, InterruptedException {
+		// TODO: turn on captions
+		//need .srt file, .srt parser and implementation onto the video
+	}
+
+	// Mute and unmute the audio
+	public void muteAudio(ActionEvent event) {
+		// mute
+		if (mediaView.getMediaPlayer().isMute() == false) {
+			mediaView.getMediaPlayer().setMute(true);
+			// changes the icon to muted
+			muteBtImg.setImage(new Image(getClass().getResourceAsStream("/graphics/mute.png")));
+
+		}
+		// unmute
+		else if (mediaView.getMediaPlayer().isMute() == true) {
+			mediaView.getMediaPlayer().setMute(false);
+			// changes the icon to sound
+			muteBtImg.setImage(new Image(getClass().getResourceAsStream("/graphics/sound.png")));
+		}
+	}
+}
diff --git a/sugestedFrameVideo/VideoLayer.java b/sugestedFrameVideo/VideoLayer.java
new file mode 100644
index 0000000..ae5790c
--- /dev/null
+++ b/sugestedFrameVideo/VideoLayer.java
@@ -0,0 +1,39 @@
+package sugestedFrameVideo;
+
+import java.io.IOException;
+import java.util.ArrayList;
+
+import javafx.scene.SubScene;
+import javafx.scene.layout.StackPane;
+
+public class VideoLayer {
+	int height;
+	int width;
+	StackPane sp = new StackPane();
+	ArrayList<Video> videos = new ArrayList<Video>();
+	SubScene window = new SubScene(sp, width, height);
+
+	public VideoLayer(int width, int height) {
+		this.height = height;
+		this.width = width;
+		sp.setMinSize(width, height);
+	}
+
+	public void addVideo(String urlName, int startTime, Boolean loop, int xStart, int yStart) throws IOException {
+		// creates the video object and its subscene
+		Video video = new Video(urlName, startTime, loop, xStart, yStart, width, height);
+		// adds the video object to the array list
+		videos.add(video);
+		// adds the SubScene(created with the constructor) to the video layer stack pane
+		sp.getChildren().add(video.get());
+	}
+
+	public void removeVideo(Video video) {
+		sp.getChildren().remove(video.get());
+	}
+
+	//please comment on what this exactly is
+	public SubScene get() {
+		return (window);
+	}
+}
diff --git a/sugestedFrameVideo/graphics/back_from_fullscreen.png b/sugestedFrameVideo/graphics/back_from_fullscreen.png
new file mode 100644
index 0000000..0880194
Binary files /dev/null and b/sugestedFrameVideo/graphics/back_from_fullscreen.png differ
diff --git a/sugestedFrameVideo/graphics/fullscreen.png b/sugestedFrameVideo/graphics/fullscreen.png
new file mode 100644
index 0000000..52a3faa
Binary files /dev/null and b/sugestedFrameVideo/graphics/fullscreen.png differ
diff --git a/sugestedFrameVideo/graphics/mute.png b/sugestedFrameVideo/graphics/mute.png
new file mode 100644
index 0000000..1b9c94e
Binary files /dev/null and b/sugestedFrameVideo/graphics/mute.png differ
diff --git a/sugestedFrameVideo/graphics/pause.png b/sugestedFrameVideo/graphics/pause.png
new file mode 100644
index 0000000..465e278
Binary files /dev/null and b/sugestedFrameVideo/graphics/pause.png differ
diff --git a/sugestedFrameVideo/graphics/play.png b/sugestedFrameVideo/graphics/play.png
new file mode 100644
index 0000000..4b6076c
Binary files /dev/null and b/sugestedFrameVideo/graphics/play.png differ
diff --git a/sugestedFrameVideo/graphics/sound.png b/sugestedFrameVideo/graphics/sound.png
new file mode 100644
index 0000000..2bbade3
Binary files /dev/null and b/sugestedFrameVideo/graphics/sound.png differ
diff --git a/sugestedFrameVideo/graphics/stop.png b/sugestedFrameVideo/graphics/stop.png
new file mode 100644
index 0000000..86da844
Binary files /dev/null and b/sugestedFrameVideo/graphics/stop.png differ
diff --git a/sugestedFrameVideo/imgresources/videoCtrlBra/play.png b/sugestedFrameVideo/imgresources/videoCtrlBra/play.png
new file mode 100644
index 0000000..0bb36a6
Binary files /dev/null and b/sugestedFrameVideo/imgresources/videoCtrlBra/play.png differ
diff --git a/sugestedFrameVideo/videoPlayer.fxml b/sugestedFrameVideo/videoPlayer.fxml
new file mode 100644
index 0000000..eed737f
--- /dev/null
+++ b/sugestedFrameVideo/videoPlayer.fxml
@@ -0,0 +1,77 @@
+<?xml version="1.0" encoding="UTF-8"?>
+
+<?import javafx.geometry.Insets?>
+<?import javafx.scene.control.Button?>
+<?import javafx.scene.control.Label?>
+<?import javafx.scene.control.Slider?>
+<?import javafx.scene.image.Image?>
+<?import javafx.scene.image.ImageView?>
+<?import javafx.scene.layout.BorderPane?>
+<?import javafx.scene.layout.Pane?>
+<?import javafx.scene.media.MediaView?>
+<?import javafx.scene.text.Font?>
+
+<BorderPane fx:id="vidBPane" minHeight="400.0" minWidth="600.0" prefHeight="400.0" prefWidth="600.0" scaleShape="false" style="-fx-background-color: black;" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="VideoPlayerController">
+   <bottom>
+      <Pane maxHeight="50.0" maxWidth="600.0" minHeight="50.0" minWidth="600.0" prefHeight="50.0" prefWidth="600.0" style="-fx-background-color: grey;" BorderPane.alignment="CENTER">
+         <children>
+          <Button fx:id="play" alignment="CENTER" layoutX="14.0" layoutY="15.0" maxHeight="30.0" maxWidth="30.0" minHeight="30.0" minWidth="30.0" mnemonicParsing="false" onAction="#play" prefHeight="30.0" prefWidth="30.0">
+               <graphic>
+                  <ImageView fitHeight="15.0" fitWidth="15.0" pickOnBounds="true" preserveRatio="true">
+                     <image>
+                        <Image url="@graphics/play.png" />
+                     </image>
+                  </ImageView>
+               </graphic>
+               <opaqueInsets>
+                  <Insets />
+               </opaqueInsets></Button>
+            <Button fx:id="stop" alignment="CENTER" layoutX="59.0" layoutY="15.0" maxHeight="30.0" maxWidth="30.0" minHeight="30.0" minWidth="30.0" mnemonicParsing="false" onAction="#stop" prefHeight="30.0" prefWidth="30.0">
+               <graphic>
+                  <ImageView fitHeight="15.0" fitWidth="15.0" pickOnBounds="true" preserveRatio="true">
+                     <image>
+                        <Image url="@graphics/stop.png" />
+                     </image>
+                  </ImageView>
+               </graphic></Button>
+            <Button fx:id="fullscrnBT" layoutX="512.0" layoutY="15.0" maxHeight="30.0" maxWidth="30.0" minHeight="33.0" minWidth="43.0" mnemonicParsing="false" onAction="#setFullScreen" prefHeight="30.0" prefWidth="30.0">
+               <graphic>
+                  <ImageView fx:id="fulsrcBtImg" fitHeight="29.0" fitWidth="38.0" pickOnBounds="true" preserveRatio="true">
+                     <image>
+                        <Image url="@graphics/Fullscreen.png" />
+                     </image>
+                  </ImageView>
+               </graphic></Button>
+            <Button fx:id="caption" layoutX="452.0" layoutY="15.0" mnemonicParsing="false" onAction="#captionOn" prefHeight="30.0" prefWidth="31.0" text="CC">
+               <font>
+                  <Font name="System Bold" size="12.0" />
+               </font></Button>
+            <Button fx:id="muteBT" alignment="CENTER" layoutX="293.0" layoutY="16.0" maxHeight="30.0" maxWidth="30.0" minHeight="30.0" minWidth="30.0" mnemonicParsing="false" onAction="#muteAudio" prefHeight="30.0" prefWidth="30.0">
+               <graphic>
+                  <ImageView fx:id="muteBtImg" fitHeight="20.0" fitWidth="20.0" pickOnBounds="true" preserveRatio="true">
+                     <image>
+                        <Image url="@graphics/sound.png" />
+                     </image>
+                  </ImageView>
+               </graphic></Button>
+            <Slider fx:id="ctrlbar" layoutX="15.0" layoutY="1.0" prefHeight="14.0" prefWidth="570.0" />
+            <Slider fx:id="volSlider" layoutX="352.0" layoutY="21.0" prefHeight="14.0" prefWidth="86.0" />
+            <Label fx:id="totTime" alignment="CENTER_RIGHT" layoutX="105.0" layoutY="20.0" prefHeight="7.0" prefWidth="35.0" text="0:00" />
+            <Label alignment="CENTER" layoutX="140.0" layoutY="20.0" prefHeight="17.0" prefWidth="5.0" text="/" />
+            <Label fx:id="curTime" layoutX="145.0" layoutY="20.0" prefHeight="7.0" prefWidth="35.0" text="0:00" textOverrun="CLIP" />
+         </children>
+      </Pane>
+   </bottom>
+   <center>
+      <Pane BorderPane.alignment="CENTER">
+         <children>
+            <MediaView fx:id="mediaView" fitHeight="350.0" fitWidth="600.0" />
+            <Label alignment="CENTER" layoutX="2.0" layoutY="262.0" prefHeight="72.0" prefWidth="592.0" text="Label" textFill="#fbff00">
+               <font>
+                  <Font size="23.0" />
+               </font>
+            </Label>
+         </children>
+      </Pane>
+   </center>
+</BorderPane>