diff --git a/scripts/album-info.js b/scripts/album-info.js
index e69de29b..c26a242b 100644
--- a/scripts/album-info.js
+++ b/scripts/album-info.js
@@ -0,0 +1,7 @@
+{
+	$('#album-title').text(album.title);
+	$ ('img#album-cover-art').attr('src', album.albumArtUrl);
+	$ ('.artist').text(album.artist);
+	$ ('#release-info').text(album.releaseInfo);
+	
+}
\ No newline at end of file
diff --git a/scripts/player-bar.js b/scripts/player-bar.js
index e69de29b..5d6d7a38 100644
--- a/scripts/player-bar.js
+++ b/scripts/player-bar.js
@@ -0,0 +1,47 @@
+{
+   $('button#play-pause').on('click', function() {
+     helper.playPauseAndUpdate();
+	 $(this).attr('playState', player.playState);
+   });
+
+   $('button#next').on('click', function() {
+     if (player.playState !== 'playing') { return; }
+
+     const currentSongIndex = album.songs.indexOf(player.currentlyPlaying);
+     const nextSongIndex = currentSongIndex + 1;
+     if (nextSongIndex >= album.songs.length) { return; }
+
+     const nextSong = album.songs[nextSongIndex];
+     player.playPause(nextSong);
+   });
+   
+      $('button#previous').on('click', function() {
+     if (player.playState !== 'playing') { return; }
+
+     const currentSongIndex = album.songs.indexOf(player.currentlyPlaying);
+     const prevSongIndex = currentSongIndex - 1;
+     if (prevSongIndex < 0) { return; }
+
+     const prevSong = album.songs[prevSongIndex];
+     player.playPause(prevSong);
+   });
+
+   $('#volume-control input').on ('input', function (event) {
+	   player.setVolume(event.target.value);
+	});	   
+	
+	   $('#time-control input').on('input', function (event) {
+ player.skipTo(event.target.value); 
+});
+   
+   
+   setInterval( () => {
+	if (player.playState !== 'playing'){return;}
+	const currentTime = player.getTime();
+	const duration = player.getDuration ();
+	const percent = (currentTime/duration) * 100;
+	$ ('#time-control input').val(percent);
+	$ ('#time-control .current-time').text(currentTime);
+
+	}, 1000);
+ }
\ No newline at end of file
diff --git a/scripts/song-list.js b/scripts/song-list.js
index e69de29b..269e28cd 100644
--- a/scripts/song-list.js
+++ b/scripts/song-list.js
@@ -0,0 +1,24 @@
+{
+album.songs.forEach( ( song, index) => {
+song.element = $(
+<tr>
+	<td>
+	 <button>
+            <span class="song-number">${index + 1}</span>
+            <span class="ion-play"></span>
+            <span class="ion-pause"></span>
+          </button>
+</td>
+	<td>${song.title}</td>
+    <td>${song.duration}</td>
+	</tr>
+	);
+	song.element.on('click', event => {
+		player.playPause(song);
+		$('button#play-pause').attr('playState', player.playState);
+      });
+	});
+	
+	$ ('#song-list').append(song.element);
+});	
+}