diff --git a/application/Bootstrap.php b/application/Bootstrap.php
index f7405c561..29eecf9ad 100644
--- a/application/Bootstrap.php
+++ b/application/Bootstrap.php
@@ -54,7 +54,6 @@ class Bootstrap extends Zend_Application_Bootstrap_Bootstrap
 		$view->headScript()->appendFile('/js/libs/jquery-1.4.4.min.js','text/javascript');
 		$view->headScript()->appendFile('/js/libs/jquery-ui-1.8.8.custom.min.js','text/javascript');
 		$view->headScript()->appendFile('/js/libs/stuHover.js','text/javascript');
-		$view->headScript()->appendFile('/js/progressbar/jquery.progressbar.min.js','text/javascript');
 		$view->headScript()->appendFile('/js/playlist/playlist.js','text/javascript');
 	}
 
diff --git a/application/configs/navigation.php b/application/configs/navigation.php
index f08d48139..c6a66b77e 100644
--- a/application/configs/navigation.php
+++ b/application/configs/navigation.php
@@ -9,12 +9,43 @@
 */
 $pages = array(
 	array(
-		'label'      => 'Home',
-		'module'     => 'default',
+		'label'      => 'Now Playing',
+		'module'     => 'Nowplaying',
 		'controller' => 'index',
 		'action'     => 'index',
 		'order'      => -100 // make sure home is the first page
 	),
+	array(
+		'label'      => 'Schedule',
+		'module'     => 'default',
+		'controller' => 'Schedule',
+		'action'     => 'index',
+		'resource'   => 'schedule',
+		'pages'      => array(
+		    array(
+		        'label'      => 'Add Show',
+		        'module'     => 'default',
+		        'controller' => 'Schedule',
+		        'action'     => 'add-show-dialog',
+				'resource'	=>	'schedule'
+		    )
+		)
+	),
+	array(
+		'label'      => 'Playlist Builder',
+		'module'     => 'default',
+		'controller' => 'Library',
+		'action'     => 'index',
+		'resource'	=>	'library'
+	),
+	array(
+		'label'      => 'Add Audio',
+		'module'     => 'default',
+		'controller' => 'Plupload',
+		'action'     => 'plupload',
+		'resource'	=>	'plupload'
+	),
+	
 	array(
 		'label'      => 'Add User',
 		'module'     => 'default',
@@ -22,6 +53,24 @@ $pages = array(
 		'action'     => 'add-user',
 		'resource'	=>	'user'	
 	),
+	array(
+		'label'      => 'Configure',
+		'module'     => 'default',
+		'controller' => 'Nowplaying',
+		'pages'      => array(
+		    array(
+		        'label'      => 'Preferences',
+		        'module'     => 'default',
+		        'controller' => 'Nowplaying'
+		    ),
+			array(
+		        'label'      => 'Manage Users',
+		        'module'     => 'default',
+		        'controller' => 'Nowplaying'
+		    )
+		)
+	)
+	/*
 	array(
 		'label'      => 'Media Library',
 		'module'     => 'default',
@@ -44,36 +93,8 @@ $pages = array(
 				'resource'	=>	'search'
 		    )
 		)
-	),
-	array(
-		'label'      => 'Now Playing',
-		'module'     => 'default',
-		'controller' => 'Nowplaying',
-		'action'     => 'index'
-	),
-	array(
-		'label'      => 'Schedule',
-		'module'     => 'default',
-		'controller' => 'Schedule',
-		'action'     => 'index',
-		'resource'   => 'schedule',
-		'pages'      => array(
-		    array(
-		        'label'      => 'Add Show',
-		        'module'     => 'default',
-		        'controller' => 'Schedule',
-		        'action'     => 'add-show-dialog',
-				'resource'	=>	'schedule'
-		    )
-		)
-	),
-	array(
-		'label'      => 'Logout',
-		'module'     => 'default',
-		'controller' => 'Login',
-		'action'     => 'logout',
-		'resource'	=>	'login'
 	)
+	*/
 );
  
 // Create container from array
diff --git a/application/controllers/NowplayingController.php b/application/controllers/NowplayingController.php
index d44091a35..045bc585d 100644
--- a/application/controllers/NowplayingController.php
+++ b/application/controllers/NowplayingController.php
@@ -11,9 +11,14 @@ class NowplayingController extends Zend_Controller_Action
 
     public function indexAction()
     {
-        $this->view->headScript()->appendFile('/js/datatables/js/jquery.dataTables.min.js','text/javascript');        		
-        $this->view->headLink()->appendStylesheet('/css/datatables/css/demo_page.css');
-        $this->view->headLink()->appendStylesheet('/css/datatables/css/demo_table.css');
+        $this->view->headScript()->appendFile('/js/datatables/js/jquery.dataTables.min.js','text/javascript');
+        $this->view->headScript()->appendFile('/js/playlist/nowplayingdatagrid.js','text/javascript');
+		$this->view->headLink()->appendStylesheet('/css/pro_dropdown_3.css');
+		$this->view->headLink()->appendStylesheet('/css/styles.css');
+		//$this->view->headLink()->appendStylesheet('/css/datatables/demo_page.css');
+		//$this->view->headLink()->appendStylesheet('/css/datatables/demo_table.css');
+		//$this->view->headLink()->appendStylesheet('/css/datatables/demo_table_jui.css');
+		//$this->view->headLink()->appendStylesheet('/css/styles.css');
     }
 
     public function getDataGridDataAction()
diff --git a/application/controllers/PluploadController.php b/application/controllers/PluploadController.php
index 9b1792e7c..2939ba517 100644
--- a/application/controllers/PluploadController.php
+++ b/application/controllers/PluploadController.php
@@ -168,6 +168,8 @@ class PluploadController extends Zend_Controller_Action
 		$view->headScript()->appendFile('/js/airtime/library/plupload.js','text/javascript');
 
 		$view->headLink()->appendStylesheet('/css/plupload.queue.css');
+		$view->headLink()->appendStylesheet('/css/pro_dropdown_3.css');
+		$view->headLink()->appendStylesheet('/css/styles.css');
     }
 
 
diff --git a/application/controllers/ScheduleController.php b/application/controllers/ScheduleController.php
index 8959948a0..d7409eeb6 100644
--- a/application/controllers/ScheduleController.php
+++ b/application/controllers/ScheduleController.php
@@ -40,7 +40,8 @@ class ScheduleController extends Zend_Controller_Action
 		$this->view->headLink()->appendStylesheet('/css/jquery.contextMenu.css');
 		$this->view->headLink()->appendStylesheet('/css/fullcalendar.css');
 		$this->view->headLink()->appendStylesheet('/css/schedule.css');
-
+		$this->view->headLink()->appendStylesheet('/css/pro_dropdown_3.css');
+		$this->view->headLink()->appendStylesheet('/css/styles.css');
 
 		$eventDefaultMenu = array();
 		//$eventDefaultMenu[] = array('action' => '/Schedule/delete-show', 'text' => 'Delete');
@@ -81,6 +82,8 @@ class ScheduleController extends Zend_Controller_Action
 		$this->view->headLink()->appendStylesheet('/css/fullcalendar.css');
 		$this->view->headLink()->appendStylesheet('/css/colorpicker/css/colorpicker.css');
 		$this->view->headLink()->appendStylesheet('/css/add-show.css');
+		$this->view->headLink()->appendStylesheet('/css/pro_dropdown_3.css');
+		$this->view->headLink()->appendStylesheet('/css/styles.css');
 
         $request = $this->getRequest();
         $formWhat = new Application_Form_AddShowWhat();
@@ -224,19 +227,6 @@ class ScheduleController extends Zend_Controller_Action
 		}
     }
 
-/*
-    public function viewPlaylistAction()
-    {
-        $this->view->headScript()->appendFile('/js/playlist/playlist.js','text/javascript');
-        $this->view->headScript()->appendFile('/js/progressbar/jquery.progressbar.min.js','text/javascript');
-        
-        $this->_helper->viewRenderer->setResponseSegment('nowplaying');
-        
-        this->_helper->actionStack('', '');
-        
-    }
-*/
-
     public function getCurrentPlaylistAction()
     {
         $this->view->entries = Schedule::GetPlayOrderRange();
diff --git a/application/controllers/UserController.php b/application/controllers/UserController.php
index 8479fb627..164c51887 100644
--- a/application/controllers/UserController.php
+++ b/application/controllers/UserController.php
@@ -12,11 +12,14 @@ class UserController extends Zend_Controller_Action
 
     public function indexAction()
     {
-        // action body
+
     }
 
     public function addUserAction()
     {
+		$this->view->headLink()->appendStylesheet('/css/pro_dropdown_3.css');
+		$this->view->headLink()->appendStylesheet('/css/styles.css');
+		
         $request = $this->getRequest();
         $form = new Application_Form_AddUser();
  
diff --git a/application/layouts/scripts/layout.phtml b/application/layouts/scripts/layout.phtml
index 7297c6513..c0277336e 100644
--- a/application/layouts/scripts/layout.phtml
+++ b/application/layouts/scripts/layout.phtml
@@ -10,7 +10,12 @@
 <body>
 
 <div id="nowplayingbar"><?= $this->partial('partialviews/header.phtml') ?></div>
-<div id="nav"><?php echo $this->navigation()->menu()->setRenderInvisible(true) ?></div>
+<div class="logo"></div>
+
+<?php 	$partial = array('menu.phtml', 'default');
+		$this->navigation()->menu()->setPartial($partial); ?>
+
+<?php echo $this->navigation()->menu() ?>
  
 <div id="content"><?php echo $this->layout()->content ?></div>
 </body>
diff --git a/application/layouts/scripts/library.phtml b/application/layouts/scripts/library.phtml
index 13ab089e0..c64a9d832 100644
--- a/application/layouts/scripts/library.phtml
+++ b/application/layouts/scripts/library.phtml
@@ -9,10 +9,9 @@
 </head>
 <body>
 
+<div id="nowplayingbar"><?= $this->partial('partialviews/header.phtml') ?></div>
 <div class="logo"></div>
 
-<div id="master-panel"></div>
-
 <?php 	$partial = array('menu.phtml', 'default');
 		$this->navigation()->menu()->setPartial($partial); ?>
 
diff --git a/application/layouts/scripts/search.phtml b/application/layouts/scripts/search.phtml
index 2145a32e2..1d9ac2a37 100644
--- a/application/layouts/scripts/search.phtml
+++ b/application/layouts/scripts/search.phtml
@@ -8,7 +8,7 @@
 	<?php echo $this->headLink() ?>
 </head>
 <body>
-
+<div id="nowplayingbar"><?= $this->partial('partialviews/header.phtml') ?></div>
 <div id="nav"><?php echo $this->navigation()->menu()->setRenderInvisible(true) ?></div>
  
 <div id="search"><?php echo $this->layout()->search ?></div>
diff --git a/application/views/scripts/nowplaying/index.phtml b/application/views/scripts/nowplaying/index.phtml
index cc05408eb..11d775d98 100644
--- a/application/views/scripts/nowplaying/index.phtml
+++ b/application/views/scripts/nowplaying/index.phtml
@@ -1,97 +1 @@
 <div id='demo'></div>
-<script>
-function getDateText(obj){
-	//var str = "";
-	//for (s in obj.oSettings)
-	//	str += s + ", ";
-	//alert(str);
-	var str = obj.aData[ obj.iDataColumn ];
-	if (str.indexOf(" ") != -1){
-		return changeTimePrecision(str.substring(0, str.indexOf(" ")));
-	}
-	return str;
-}
-
-function getTimeText(obj){
-	var str = obj.aData[ obj.iDataColumn ];
-	if (str.indexOf(" ") != -1){
-		return changeTimePrecision(str.substring(str.indexOf(" ")+1));
-	}
-	return str;
-}
-
-function changeTimePrecisionInit(obj){
-	var str = obj.aData[ obj.iDataColumn ];
-	return changeTimePrecision(str);
-}
-
-function changeTimePrecision(str){
-	if (str.indexOf(".") != -1){
-		if (str.length - str.indexOf(".") > 2)
-			var extraLength = str.length - str.indexOf(".") -3;
-			return str.substring(0, str.length - extraLength);
-	}
-	return str;
-}
-
-function notifySongEnd(){
-	for (row in datagridData.rows){
-		if (row[0] == "c")
-			row[0] = "p";
-		if (row[0] == "n"){
-			row[0] = "c";
-			break;
-		}
-	}
-	
-	createDataGrid();
-}
-
-function createDataGrid(){
-	
-	datagridData.columnHeaders[1]["fnRender"] = getDateText;
-	datagridData.columnHeaders[2]["fnRender"] = getTimeText;
-	datagridData.columnHeaders[3]["fnRender"] = getTimeText;
-	datagridData.columnHeaders[4]["fnRender"] = changeTimePrecisionInit;
-		
-	$('#demo').html( '<table cellpadding="0" cellspacing="0" border="0" class="display" id="example"></table>' );
-	$('#example').dataTable( {
-		"bSort" : false,
-		"bJQueryUI": true,
-		"bFilter": true,
-		"bInfo": false,
-		"bLengthChange": false,
-		"aaData": datagridData.rows,
-		"aoColumns": datagridData.columnHeaders,
-		"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
-			if (aData[0] == "p"){
-				//$(nRow).attr("style", "background-color:blue;");
-			} else if (aData[0] == "c"){
-				$(nRow).attr("style", "background-color:#61B329;");
-			} else if (aData[0] == "n"){
-			}
-			return nRow;
-		}
-	} );	
-}
-
-var registered = false
-
-function init2(){
-	  $.ajax({ url: "/Nowplaying/get-data-grid-data/format/json", dataType:"json", success:function(data){
-		datagridData = data.entries;
-		createDataGrid();
-	  }});
-	  
-	  if (typeof registerSongEndListener == 'function' && !registered){
-		  registered = true;
-		  registerSongEndListener(notifySongEnd);
-	  }
-	  
-	  setTimeout(init2, 5000);
-}
-
-$(document).ready(function() {
-	init2();
-});
-</script>
diff --git a/application/views/scripts/partialviews/header.phtml b/application/views/scripts/partialviews/header.phtml
index 2bb4e380d..e2011330d 100644
--- a/application/views/scripts/partialviews/header.phtml
+++ b/application/views/scripts/partialviews/header.phtml
@@ -1,43 +1,36 @@
-<div id='col0' style='float:left; width: 10%; height: 100%;'>
-	<div><a href="Nowplaying/livestream" onClick="return popup(this)">Listen</a></div>
+<div id="master-panel">
+  <div class="now-playing-block">
+    <div class="text-row"><strong>Previous:</strong> <span id='previous'></span> <span id='prev-length'></span></div>
+    <div class="now-playing-info song">
+      <div class="time-flow"><span class="time-elapsed" id="time-elapsed"></span><span class="time-remaining" id="time-remaining"></span></div>
+      <span id='current'></span> <span class="length" id="song-length"></span> </div>
+    <div class="progressbar">
+      <div class="progress-song" id="progress-bar" style="width:0%;"></div>
+    </div>
+    <div class="text-row next-song"><strong>Next:</strong> <span id='next'></span> <span id='next-length'></span></div>
+  </div>
+  <div class="show-block">
+    <div class="text-row">&nbsp;</div>
+    <div class="now-playing-info show"> <span id='playlist'></span> <span class="length" id="show-length"></span> </div>
+    <div class="progressbar">
+      <div class="progress-show" id='progress-show' style="width:0%;"></div>
+    </div>
+  </div>
+  <div class="on-air-block">
+    <div class="on-air-info off" id="on-air-info">ON AIR</div>
+  </div>
+  <div class="time-info-block">
+    <ul>
+      <li>Station time</li>
+      <li class="time" id="time"></li>
+      <li class="time-zone">CET</li>
+    </ul>
+  </div>
+  <div class="personal-block">
+    <ul>
+      <li>Signed in:</li>
+      <li class="name">Vladimir Stefanovic</li>
+      <li><a href="/Login/logout">Logout</a></li>
+    </ul>
+  </div>
 </div>
-	
-<div id='col1' style='float:left; width: 25%; height: 100%;'>
-	<div>Show: <span id='show'></span></div>
-	<div>Playlist: <span id='playlist'></span></div>
-	<div>Host: <span id='host'></span></div>
-</div>
-	
-<div id='col2' style='float:left; width: 30%; height: 100%;'>
-	<div>Previous: <span id='previous'></span></div>
-	<div>Current: <span id='current'></span></div>
-	<div>Upcoming: <span id='next'></span></div>
-</div>
-
-<div id='list0' style='float:left; width: 35%; height: 100%;'>
-	<div>Start: <span id='start'></span></div>
-	<div>End: <span id='end'></span></div>
-	<div><span id='progressbar'></span> <span id='songposition'></span> | <span id='songlength'></span></div>
-	<div><span id='showprogressbar'></span> <span id='showposition'></span> | <span id='showlength'></span></div>
-</div>
-
-<script type="text/javascript">
-function popup(mylink){
-	if (!window.focus)
-		return true;
-	var href;
-	if (typeof(mylink) == 'string')
-	   href=mylink;
-	else
-	   href=mylink.href;
-	window.open(href, "player", 'width=300,height=100,scrollbars=yes');
-	return false;
-}
-</script>
-
-<script type="text/javascript">
-$(document).ready(function() {
-	//initialize the playlist bar in the included playlist.js
-	init("nowplayingbar");
-});
-</script>
diff --git a/application/views/scripts/schedule/view-playlist.phtml b/application/views/scripts/schedule/view-playlist.phtml
deleted file mode 100644
index a940ce285..000000000
--- a/application/views/scripts/schedule/view-playlist.phtml
+++ /dev/null
@@ -1,22 +0,0 @@
-<div id='col0' style='float:left; width: 10%; height: 100%;'>
-	<div>Listen</div>
-	<div>Volume</div>
-</div>
-	
-<div id='col1' style='float:left; width: 25%; height: 100%;'>
-	<div>Show: <span id='show'></span></div>
-	<div>Playlist: <span id='playlist'></span></div>
-	<div>Host: <span id='host'></span></div>
-</div>
-	
-<div id='col2' style='float:left; width: 30%; height: 100%;'>
-	<div>Previous: <span id='previous'></span></div>
-	<div>Current: <span id='current'></span></div>
-	<div>Upcoming: <span id='next'></span></div>
-</div>
-
-<div id='list0' style='float:left; width: 35%; height: 100%;'></div>
-	<div>Start: <span id='start'></span></div>
-	<div>End: <span id='end'></span></div>
-	<div><span id='progressbar'></span> <span id='songposition'></span> | <span id='songlength'></span></div>
-</div>
diff --git a/public/js/playlist/nowplayingdatagrid.js b/public/js/playlist/nowplayingdatagrid.js
new file mode 100644
index 000000000..2ffbfc858
--- /dev/null
+++ b/public/js/playlist/nowplayingdatagrid.js
@@ -0,0 +1,92 @@
+var registered = false;
+var datagridData;
+
+function getDateText(obj){
+	var str = obj.aData[ obj.iDataColumn ];
+	if (str.indexOf(" ") != -1){
+		return changeTimePrecision(str.substring(0, str.indexOf(" ")));
+	}
+	return str;
+}
+
+function getTimeText(obj){
+	var str = obj.aData[ obj.iDataColumn ];
+	if (str.indexOf(" ") != -1){
+		return changeTimePrecision(str.substring(str.indexOf(" ")+1));
+	}
+	return str;
+}
+
+function changeTimePrecisionInit(obj){
+	var str = obj.aData[ obj.iDataColumn ];
+	return changeTimePrecision(str);
+}
+
+function changeTimePrecision(str){
+	if (str.indexOf(".") != -1){
+		if (str.length - str.indexOf(".") > 2)
+			var extraLength = str.length - str.indexOf(".") -3;
+			return str.substring(0, str.length - extraLength);
+	}
+	return str;
+}
+
+function notifySongEnd(){
+	//alert("length " + datagridData.rows.length);
+	for (var i=0; i<datagridData.rows.length; i++){
+		if (datagridData.rows[i][0] == "c")
+			datagridData.rows[i][0] = "p";
+		if (datagridData.rows[i][0] == "n"){
+			datagridData.rows[i][0] = "c";
+			break;
+		}
+	}
+	
+	createDataGrid();
+}
+
+function createDataGrid(){
+	
+	datagridData.columnHeaders[1]["fnRender"] = getDateText;
+	datagridData.columnHeaders[2]["fnRender"] = getTimeText;
+	datagridData.columnHeaders[3]["fnRender"] = getTimeText;
+	datagridData.columnHeaders[4]["fnRender"] = changeTimePrecisionInit;
+
+	$('#demo').html( '<table cellpadding="0" cellspacing="0" border="0" width="100%" id="nowplayingtable"></table>' );
+	$('#nowplayingtable').dataTable( {
+		"bSort" : false,
+		"bJQueryUI": true,
+		"bFilter": false,
+		"bInfo": false,
+		"bLengthChange": false,
+		"aaData": datagridData.rows,
+		"aoColumns": datagridData.columnHeaders,
+		"fnRowCallback": function( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
+			if (aData[0] == "p"){
+				//$(nRow).attr("style", "background-color:blue;");
+			} else if (aData[0] == "c"){
+				$(nRow).attr("style", "background-color:#61B329;");
+			} else if (aData[0] == "n"){
+			}
+			return nRow;
+		}
+	} );
+}
+
+function init2(){
+	  $.ajax({ url: "/Nowplaying/get-data-grid-data/format/json", dataType:"json", success:function(data){
+		datagridData = data.entries;
+		createDataGrid();
+	  }});
+	  
+	  if (typeof registerSongEndListener == 'function' && !registered){
+		  registered = true;
+		  registerSongEndListener(notifySongEnd);
+	  }
+	  
+	  setTimeout(init2, 5000);
+}
+
+$(document).ready(function() {
+	init2();
+});
diff --git a/public/js/playlist/playlist.js b/public/js/playlist/playlist.js
index 77af88797..fec342ad0 100644
--- a/public/js/playlist/playlist.js
+++ b/public/js/playlist/playlist.js
@@ -46,9 +46,67 @@ function convertToHHMMSS(timeInMS){
 	
 	var seconds = parseInt(time / 1000);
 	
-	hours = "" + hours;
-	minutes = "" + minutes;
-	seconds = "" + seconds;
+	hours = hours.toString();
+	minutes = minutes.toString();
+	seconds = seconds.toString();
+	
+	if (hours.length == 1)
+		hours = "0" + hours;
+	if (minutes.length == 1)
+		minutes = "0" + minutes;
+	if (seconds.length == 1)
+		seconds = "0" + seconds;
+	if (hours == "00")
+		return minutes + ":" + seconds;
+	else
+		return "" + hours + ":" + minutes + ":" + seconds;
+}
+
+function convertToHHMMSSmm(timeInMS){
+	var time = parseInt(timeInMS);
+	
+	var hours = parseInt(time / 3600000);
+	time -= 3600000*hours;
+		
+	var minutes = parseInt(time / 60000);
+	time -= 60000*minutes;
+	
+	var seconds = parseInt(time / 1000);
+	time -= 1000*seconds;
+	
+	var ms = parseInt(time);
+	
+	hours = hours.toString();
+	minutes = minutes.toString();
+	seconds = seconds.toString();
+	ms = ms.toString();
+	
+	if (hours.length == 1)
+		hours = "0" + hours;
+	if (minutes.length == 1)
+		minutes = "0" + minutes;
+	if (seconds.length == 1)
+		seconds = "0" + seconds;
+		
+	if (ms.length == 3)
+		ms = ms.substring(0, 2);
+	else if (ms.length == 2)
+		ms = "0" + ms.substring(0,1);
+	else if (ms.length == 1)
+		ms = "00";
+		
+	if (hours == "00")
+		return minutes + ":" + seconds + "." + ms;
+	else
+		return "" + hours + ":" + minutes + ":" + seconds+ "." + ms;
+}
+
+function convertDateToHHMMSS(epochTime){
+	var d = new Date(epochTime);
+	
+	var hours = d.getUTCHours().toString();
+	var minutes = d.getUTCMinutes().toString();
+	var seconds = d.getUTCSeconds().toString();
 	
 	if (hours.length == 1)
 		hours = "0" + hours;
@@ -81,8 +139,10 @@ function getTrackInfo(song){
 		str += song.track_title;
 	if (song.artist_name != null)
 		str += " - " + song.artist_name;
-	if (song.album_title != null)
-		str += " - " + song.album_title;
+	//if (song.album_title != null)
+		//str += " - " + song.album_title;
+		
+	str += ","
 		
 	return str;
 }
@@ -115,8 +175,11 @@ function updateProgressBarValue(){
             var showPercentDone = (estimatedSchedulePosixTime - showStartPosixTime)/showLengthMs*100;
             if (showPercentDone < 0 || showPercentDone > 100){
                 showPercentDone = 0;
-            }
-            $('#showprogressbar').progressBar(showPercentDone);
+				$('#on-air-info').attr("class", "on-air-info off");
+            } else {
+				$('#on-air-info').attr("class", "on-air-info on");
+			}
+			$('#progress-show').attr("style", "width:"+showPercentDone+"%");
         }
 
         var songPercentDone = 0;
@@ -127,7 +190,7 @@ function updateProgressBarValue(){
                 currentSong = new Array();
 			}
 		}
-        $('#progressbar').progressBar(songPercentDone);
+        $('#progress-bar').attr("style", "width:"+songPercentDone+"%");
 
         //calculate how much time left to next song if there is any
         if (nextSongs.length > 0 && nextSongPrepare){
@@ -144,35 +207,28 @@ function updateProgressBarValue(){
 
 function updatePlaybar(){
 	/* Column 0 update */
-	
-	/* Column 1 update */
-    $('#playlist').empty();
-	for (var i=0; i<currentSong.length; i++){
-		//alert (currentSong[i].playlistname);
-		//$('#show').text(currentSong[i].show);
-		$('#playlist').text(currentSong[i].name);
-		//$('#host').text(currentSong[i].creator);
+    $('#previous').text("Prev Song: N/A");
+    $('#prev-length').text("n/a,");
+    $('#current').text("Current Song: N/A");
+    $('#next').text("Next Song: N/A");
+    $('#next-length').empty();
+	if (previousSongs.length > 0){
+		$('#previous').text(getTrackInfo(previousSongs[previousSongs.length-1]));
+		$('#prev-length').text(convertToHHMMSSmm(previousSongs[previousSongs.length-1].songLengthMs));
+	}
+	if (currentSong.length > 0){
+		$('#current').text(getTrackInfo(currentSong[0]));
+	}
+	if (nextSongs.length > 0){
+		$('#next').text(getTrackInfo(nextSongs[0]));
+		$('#next-length').text(convertToHHMMSSmm(nextSongs[0].songLengthMs));
 	}
 	
-	/* Column 2 update */
-    $('#previous').empty();
-    $('#current').empty();
-    $('#next').empty();
-	for (var i=0; i<previousSongs.length; i++){
-		$('#previous').text(getTrackInfo(previousSongs[i]));
-	}
-	for (var i=0; i<currentSong.length; i++){
-		$('#current').text(getTrackInfo(currentSong[i]));
-	}
-	for (var i=0; i<nextSongs.length; i++){
-		$('#next').text(getTrackInfo(nextSongs[i]));
-	}
-	
-	/* Column 3 update */
     $('#start').empty();
     $('#end').empty();
-    $('#songposition').empty();
-    $('#songlength').empty();
+    $('#time-elapsed').empty();
+    $('#time-remaining').empty();
+    $('#song-length').empty();
     $('#showposition').empty();
     $('#showlength').empty();
 	for (var i=0; i<currentSong.length; i++){
@@ -181,15 +237,26 @@ function updatePlaybar(){
 
         /* Get rid of the millisecond accuracy so that the second counters for both
          * show and song change at the same time. */
-        var songStartRoughly = parseInt(currentSong[i].songStartPosixTime/1000)*1000;
+        var songStartRoughly = parseInt(Math.round(currentSong[i].songStartPosixTime/1000))*1000;
+        var songEndRoughly = parseInt(Math.round(currentSong[i].songEndPosixTime/1000))*1000;
         
-		$('#songposition').text(convertToHHMMSS(estimatedSchedulePosixTime - songStartRoughly));
-		$('#songlength').text(currentSong[i].clip_length);
-	}
-    if (estimatedSchedulePosixTime < showEndPosixTime){
-        $('#showposition').text(convertToHHMMSS(estimatedSchedulePosixTime - showStartPosixTime));
-        $('#showlength').text(convertToHHMMSS(showEndPosixTime - showStartPosixTime));
+		$('#time-elapsed').text(convertToHHMMSS(estimatedSchedulePosixTime - songStartRoughly));
+		$('#time-remaining').text(convertToHHMMSS(songEndRoughly - estimatedSchedulePosixTime));
+		$('#song-length').text(convertToHHMMSSmm(currentSong[i].songLengthMs));
+	}	
+	
+	/* Column 1 update */
+    $('#playlist').text("Current Show: N/A");
+	for (var i=0; i<currentSong.length; i++){
+		$('#playlist').text(currentSong[i].name);
+	}	
+	$('#show-length').empty();
+	if (estimatedSchedulePosixTime < showEndPosixTime){
+        $('#show-length').text(convertDateToHHMMSS(showStartPosixTime) + " - " + convertDateToHHMMSS(showEndPosixTime));
     }
+	
+	/* Column 2 update */
+	$('#time').text(convertDateToHHMMSS(estimatedSchedulePosixTime));
 }
 
 function calcAdditionalData(currentItem, bUpdateGlobalValues){
@@ -241,15 +308,26 @@ function getScheduleFromServer(){
 }
 
 function init(elemID) {
-	var currentElem = $("#" + elemID).attr("style", "z-index: 1; width: 100%; left: 0px; right: 0px; bottom: 0px; color: black; min-height: 100px; background-color: #FEF1B5;");
-	
-	$('#progressbar').progressBar(0, {showText : false});
-	$('#showprogressbar').progressBar(0, {showText : false, barImage:'/js/progressbar/images/progressbg_red.gif'});
-
     //begin producer "thread"
 	getScheduleFromServer();
 
     //begin consumer "thread"
-	updateProgressBarValue();
-	
+	updateProgressBarValue();	
 }
+
+function popup(mylink){
+	if (!window.focus)
+		return true;
+	var href;
+	if (typeof(mylink) == 'string')
+	   href=mylink;
+	else
+	   href=mylink.href;
+	window.open(href, "player", 'width=300,height=100,scrollbars=yes');
+	return false;
+}
+
+$(document).ready(function() {
+	//initialize the playlist bar in the included playlist.js
+	init("nowplayingbar");
+});
diff --git a/public/js/progressbar/images/progressbar.gif b/public/js/progressbar/images/progressbar.gif
deleted file mode 100644
index abe588c15..000000000
Binary files a/public/js/progressbar/images/progressbar.gif and /dev/null differ
diff --git a/public/js/progressbar/images/progressbg_black.gif b/public/js/progressbar/images/progressbg_black.gif
deleted file mode 100644
index 74fd1f9b3..000000000
Binary files a/public/js/progressbar/images/progressbg_black.gif and /dev/null differ
diff --git a/public/js/progressbar/images/progressbg_green.gif b/public/js/progressbar/images/progressbg_green.gif
deleted file mode 100644
index f3f3bf681..000000000
Binary files a/public/js/progressbar/images/progressbg_green.gif and /dev/null differ
diff --git a/public/js/progressbar/images/progressbg_orange.gif b/public/js/progressbar/images/progressbg_orange.gif
deleted file mode 100644
index 808cac7cf..000000000
Binary files a/public/js/progressbar/images/progressbg_orange.gif and /dev/null differ
diff --git a/public/js/progressbar/images/progressbg_red.gif b/public/js/progressbar/images/progressbg_red.gif
deleted file mode 100644
index 54dfa135f..000000000
Binary files a/public/js/progressbar/images/progressbg_red.gif and /dev/null differ
diff --git a/public/js/progressbar/images/progressbg_yellow.gif b/public/js/progressbar/images/progressbg_yellow.gif
deleted file mode 100644
index fdb0dfc98..000000000
Binary files a/public/js/progressbar/images/progressbg_yellow.gif and /dev/null differ
diff --git a/public/js/progressbar/jquery.progressbar.min.js b/public/js/progressbar/jquery.progressbar.min.js
deleted file mode 100644
index 4689bc4d2..000000000
--- a/public/js/progressbar/jquery.progressbar.min.js
+++ /dev/null
@@ -1,9 +0,0 @@
-
-(function($){$.extend({progressBar:new function(){this.defaults={increment:2,speed:15,showText:true,width:120,boxImage:'/js/progressbar/images/progressbar.gif',barImage:'/js/progressbar/images/progressbg_green.gif',height:12};this.construct=function(arg1,arg2){var argpercentage=null;var argconfig=null;if(arg1!=null){if(!isNaN(arg1)){argpercentage=arg1;if(arg2!=null){argconfig=arg2;}}else{argconfig=arg1;}}
-return this.each(function(child){var pb=this;if(argpercentage!=null&&this.bar!=null&&this.config!=null){this.config.tpercentage=argpercentage;if(argconfig!=null)
-pb.config=$.extend(this.config,argconfig);}else{var $this=$(this);var config=$.extend({},$.progressBar.defaults,argconfig);var percentage=argpercentage;if(argpercentage==null)
-var percentage=$this.html().replace("%","");$this.html("");var bar=document.createElement('img');var text=document.createElement('span');bar.id=this.id+"_percentImage";text.id=this.id+"_percentText";bar.src=config.boxImage;bar.width=config.width;var $bar=$(bar);var $text=$(text);this.bar=$bar;this.ntext=$text;this.config=config;this.config.cpercentage=0;this.config.tpercentage=percentage;$bar.css("width",config.width+"px");$bar.css("height",config.height+"px");$bar.css("background-image","url("+config.barImage+")");$bar.css("padding","0");$bar.css("margin","0");$this.append($bar);$this.append($text);bar.alt=this.tpercentage;bar.title=this.tpercentage;}
-var t=setInterval(function(){var config=pb.config;var cpercentage=parseInt(config.cpercentage);var tpercentage=parseInt(config.tpercentage);var increment=parseInt(config.increment);var bar=pb.bar;var text=pb.ntext;var pixels=config.width/100;bar.css("background-position",(((config.width*-1))+(cpercentage*pixels))+'px 50%');if(config.showText)
-text.html(" "+Math.round(cpercentage)+"%");if(cpercentage>tpercentage){if(cpercentage-increment<tpercentage){pb.config.cpercentage=0+tpercentage}else{pb.config.cpercentage-=increment;}}
-else if(pb.config.cpercentage<pb.config.tpercentage){if(cpercentage+increment>tpercentage){pb.config.cpercentage=tpercentage}else{pb.config.cpercentage+=increment;}}
-else{clearInterval(t);}},pb.config.speed);});};}});$.fn.extend({progressBar:$.progressBar.construct});})(jQuery);
diff --git a/pypo/pypo-cli.py b/pypo/pypo-cli.py
index fb518b554..98e61c42e 100755
--- a/pypo/pypo-cli.py
+++ b/pypo/pypo-cli.py
@@ -117,7 +117,15 @@ class Playout:
         self.api_client = api_client.api_client_factory(config)
         self.cue_file = CueFile()
         self.silence_file = config["file_dir"] + 'basic/silence.mp3'
+        
+        """
+        push_ahead2 MUST be < push_ahead. The difference in these two values 
+        gives the number of seconds of the window of opportunity for the scheduler
+        to catch when a playlist is to be played.
+        """
         self.push_ahead = 15
+        self.push_ahead2 = 10
+        
         self.range_updated = False
         
     
@@ -578,10 +586,13 @@ class Playout:
         playedItems = self.load_schedule_tracker()
         
         tcoming = time.localtime(time.time() + self.push_ahead)
+        tcoming2 = time.localtime(time.time() + self.push_ahead2)
         tnow = time.localtime(time.time())
         
+        
         str_tcoming_s = "%04d-%02d-%02d-%02d-%02d-%02d" % (tcoming[0], tcoming[1], tcoming[2], tcoming[3], tcoming[4], tcoming[5])
-    
+        str_tcoming2_s = "%04d-%02d-%02d-%02d-%02d-%02d" % (tcoming2[0], tcoming2[1], tcoming2[2], tcoming2[3], tcoming2[4], tcoming2[5])
+        
         if self.schedule == None:
             logger.warn('Unable to loop schedule - maybe write in progress?')
             logger.warn('Will try again in next loop.')
@@ -589,7 +600,7 @@ class Playout:
         else:    
             for pkey in self.schedule:
                 playedFlag = (pkey in playedItems) and playedItems[pkey].get("played", 0)                
-                if pkey[0:19] <= str_tcoming_s and not playedFlag:
+                if pkey[0:19] == str_tcoming_s or (pkey[0:19] < str_tcoming_s and pkey[0:19] > str_tcoming2_s and not playedFlag):
                     logger.debug('Preparing to push playlist scheduled at: %s', pkey)
                     playlist = self.schedule[pkey]
                     
diff --git a/pypo/scripts/ls_script.liq b/pypo/scripts/ls_script.liq
index c28d235e5..d799fcaf6 100644
--- a/pypo/scripts/ls_script.liq
+++ b/pypo/scripts/ls_script.liq
@@ -60,7 +60,7 @@ radio = fallback(track_sensitive=false, [switch(track_sensitive=false, [(fun ()
 
 radio = crossfade(radio)
 
-#out(radio)
+out(radio)
 clock(id="clock_icecast",
   output.icecast(%mp3,
    host = icecast_host, port = icecast_port,