CC-3174 : showbuilder

fixing some css/js for display.

airtime_mvc/application/controllers/LibraryController.php

@@ -239,7 +239,6 @@ class LibraryController extends Zend_Controller_Action
         $params = $this->getRequest()->getParams();
         $datatables = Application_Model_StoredFile::searchFilesForPlaylistBuilder($params);
 
-        //format clip lengh to 1 decimal
         /*
         foreach($datatables["aaData"] as &$data){
             if($data['ftype'] == 'audioclip'){
@@ -253,8 +252,6 @@ class LibraryController extends Zend_Controller_Action
                     $data['track_title'] .= '<span id="'.$data['id'].'" class="small-icon soundcloud"></span>';
                 }
             }
-            $sec = Application_Model_Playlist::playlistTimeToSeconds($data['length']);
-            $data['length'] = Application_Model_Playlist::secondsToPlaylistTime($sec);
         }
         */
 

airtime_mvc/application/controllers/ShowbuilderController.php

@@ -33,6 +33,7 @@ class ShowbuilderController extends Zend_Controller_Action
         $this->view->headScript()->appendFile($baseUrl.'/js/airtime/showbuilder/builder.js','text/javascript');
 
         $this->view->headLink()->appendStylesheet($baseUrl.'/css/jquery.ui.timepicker.css');
+        $this->view->headLink()->appendStylesheet($baseUrl.'/css/showbuilder.css');
 
         $this->_helper->viewRenderer->setResponseSegment('builder');
     }

airtime_mvc/application/layouts/scripts/builder.phtml

@@ -22,7 +22,7 @@
 <div class="wrapper">
     <!--Set to z-index 254 to make it lower than the top-panel and the ZFDebug info bar, but higher than the side-playlist-->
 	<div id="library_content" class="tabs ui-widget ui-widget-content block-shadow alpha-block padded" style="z-index:254"><?php echo $this->layout()->library ?></div>
-	<div id="show_builder" class="ui-widget ui-widget-content block-shadow omega-block padded"><?php echo $this->layout()->builder ?></div>
+	<div id="show_builder" style="width:600px;" class="ui-widget ui-widget-content block-shadow omega-block padded"><?php echo $this->layout()->builder ?></div>
 </div>
 </body>
 </html>

airtime_mvc/application/models/StoredFile.php

@@ -642,6 +642,34 @@ class Application_Model_StoredFile {
         return $res;
     }
 
+/*
+     * @param DateInterval $p_interval
+     *
+     * @return string $runtime
+     */
+    private static function formatDuration($dt){
+
+        $hours = $dt->format("H");
+        $min = $dt->format("i");
+        $sec = $dt->format("s");
+
+        $time = "PT{$hours}H{$min}M{$sec}S";
+
+        $p_interval = new DateInterval($time);
+
+        $hours = $p_interval->format("%h");
+        $mins = $p_interval->format("%i");
+
+        if( $hours == 0) {
+            $runtime = $p_interval->format("%i:%S");
+        }
+        else {
+            $runtime = $p_interval->format("%h:%I:%S");
+        }
+
+        return $runtime;
+    }
+
     public static function searchFilesForPlaylistBuilder($datatables)
     {
         global $CC_CONFIG;
@@ -691,6 +719,9 @@ class Application_Model_StoredFile {
 
             $row['id'] = intval($row['id']);
 
+            $length = new DateTime($row['length']);
+            $row['length'] = self::formatDuration($length);
+
             // add checkbox row
             $row['checkbox'] = "<input type='checkbox' name='cb_".$row['id']."'>";
 
@@ -701,7 +732,7 @@ class Application_Model_StoredFile {
 
             $type = substr($row['ftype'], 0, 2);
 
-            $row['row_id'] = "{$type}_{$row['id']}";
+            $row['tr_id'] = "{$type}_{$row['id']}";
 
             //TODO url like this to work on both playlist/showbuilder screens.
             //datatable stuff really needs to be pulled out and generalized within the project

airtime_mvc/application/models/airtime/CcSchedule.php

@@ -15,6 +15,28 @@
  */
 class CcSchedule extends BaseCcSchedule {
 
+    public function getDbClipLength($format = 'H:i:s.u')
+    {
+        if ($this->clip_length === null) {
+            return null;
+        }
+
+        try {
+            $dt = new DateTime($this->clip_length);
+        } catch (Exception $x) {
+            throw new PropelException("Internally stored date/time/timestamp value could not be converted to DateTime: " . var_export($this->clip_length, true), $x);
+        }
+
+        if ($format === null) {
+            // Because propel.useDateTimeClass is TRUE, we return a DateTime object.
+            return $dt;
+        } elseif (strpos($format, '%') !== false) {
+            return strftime($format, $dt->format('U'));
+        } else {
+            return $dt->format($format);
+        }
+    }
+
     /**
      * Get the [optionally formatted] temporal [starts] column value.
      *

airtime_mvc/application/views/scripts/showbuilder/builder.phtml

@@ -1,8 +1,6 @@
-<div style="width:800px" id="show_builder">
+<input type="text" id="show_builder_datepicker_start" class="input_text"></input>
-    <input type="text" id="show_builder_datepicker_start" class="input_text"></input>
+<input type="text" id="show_builder_timepicker_start" class="input_text"></input>
-    <input type="text" id="show_builder_timepicker_start" class="input_text"></input>
+<input type="text" id="show_builder_datepicker_end" class="input_text"></input>
-    <input type="text" id="show_builder_datepicker_end" class="input_text"></input>
+<input type="text" id="show_builder_timepicker_end" class="input_text"></input>
-    <input type="text" id="show_builder_timepicker_end" class="input_text"></input>
+<input type="button" id="show_builder_timerange_button" class="ui-button ui-state-default" value="GO"></input>
-    <input type="button" id="show_builder_timerange_button" class="ui-button ui-state-default" value="GO"></input>
+<table id="show_builder_table" cellpadding="0" cellspacing="0" class="datatable"></table>
-    <table id="show_builder_table" cellpadding="0" cellspacing="0" class="datatable"></table>
-</div>

airtime_mvc/public/css/showbuilder.css

@@ -0,0 +1,5 @@
+@CHARSET "UTF-8";
+
+#show_builder > input.input_text {
+    width:100px;
+}

airtime_mvc/public/js/airtime/library/events/library_playlistbuilder.js

@@ -1,15 +1,12 @@
 function fnLibraryTableRowCallback( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
 
-    $(nRow).attr("id", aData["row_id"]);
+    $(nRow).attr("id", aData["tr_id"]);
 
     return nRow;
 }
 
 function fnLibraryTableDrawCallback() {
-    addLibraryItemEvents();
     addMetadataQtip();
-    //saveNumEntriesSetting();
-    //setupGroupActions();
 }
 
 function addLibraryItemEvents() {

airtime_mvc/public/js/airtime/library/events/library_showbuilder.js

@@ -1,6 +1,6 @@
 function fnLibraryTableRowCallback( nRow, aData, iDisplayIndex, iDisplayIndexFull ) {
 
-    $(nRow).attr("id", aData["id"]);
+    $(nRow).attr("id", aData["tr_id"]);
     
     $(nRow).data("show_builder", {"id": aData["id"], "length": aData["length"]});
 
@@ -15,7 +15,7 @@ function fnLibraryTableDrawCallback() {
 
 function addLibraryItemEvents() {
 
-	$('#library_display tr')
+	$('#library_display tr:not(:first)')
 		.draggable({
 			helper: 'clone',
 			cursor: 'pointer',

airtime_mvc/public/js/airtime/library/library.js

@@ -318,6 +318,10 @@ function createDataTable(data) {
 		},
 		"fnRowCallback": fnLibraryTableRowCallback,
 		"fnDrawCallback": fnLibraryTableDrawCallback,
+		"fnHeaderCallback": function(nHead) {
+			$(nHead).find("input[type=checkbox]").attr("checked", false);
+		},
+		
 		"aoColumns": [
                 /* Checkbox */      {"sTitle": "<input type='checkbox' name='pl_cb_all'>", "bSortable": false, "bSearchable": false, "mDataProp": "checkbox", "sWidth": "25px", "sClass": "library_checkbox"},
                 /* Id */            {"sName": "id", "bSearchable": false, "bVisible": false, "mDataProp": "id", "sClass": "library_id"},
@@ -327,7 +331,7 @@ function createDataTable(data) {
                 /* Genre */         {"sTitle": "Genre", "sName": "genre", "mDataProp": "genre", "sWidth": "10%", "sClass": "library_genre"},
                 /* Year */          {"sTitle": "Year", "sName": "year", "mDataProp": "year", "sWidth": "8%", "sClass": "library_year"},
                 /* Length */        {"sTitle": "Length", "sName": "length", "mDataProp": "length", "sWidth": "10%", "sClass": "library_length"},
-                /* Type */          {"sTitle": "Type", "sName": "ftype", "bSearchable": false, "mDataProp": "image", "sWidth": "9%", "sClass": "library_type"},
+                /* Type */          {"sTitle": "", "sName": "ftype", "bSearchable": false, "mDataProp": "image", "sWidth": "25px", "sClass": "library_type"},
                 /* Upload Time */   {"sTitle": "Upload Time", "sName": "utime", "mDataProp": "utime", "sClass": "library_upload_time"},
                 /* Last Modified */ {"sTitle": "Last Modified", "sName": "mtime", "bVisible": false, "mDataProp": "mtime", "sClass": "library_modified_time"},
             ],
@@ -340,7 +344,7 @@ function createDataTable(data) {
         },
         "iDisplayLength": getNumEntriesPreference(data),
 
-        // R = ColReorder, C = ColVis, see datatables doc for others
+        // R = ColReorder, C = ColVis, T = TableTools
         "sDom": 'Rlfr<"H"T<"library_toolbar"C>>t<"F"ip>',
         
         "oTableTools": {
@@ -374,7 +378,12 @@ function createDataTable(data) {
             "aiExclude": [0, 1, 2],
             "sSize": "css",
             "bShowAll": true
+		},
+		
+		"oColReorder": {
+			"iFixedColumns": 1
 		}
+		
     });
     oTable.fnSetFilteringDelay(350);
     

airtime_mvc/public/js/airtime/showbuilder/builder.js

@@ -223,11 +223,18 @@ $(document).ready(function() {
         
 		"fnServerData": fnServerData,
 		"fnRowCallback": fnShowBuilderRowCallback,
+		"fnHeaderCallback": function(nHead) {
+			$(nHead).find("input[type=checkbox]").attr("checked", false);
+		},
 		
 		"oColVis": {
 			"aiExclude": [ 0, 1 ]
 		},
 		
+		"oColReorder": {
+			"iFixedColumns": 1
+		},
+		
 		"oTableTools": {
         	"sRowSelect": "multi",
 			"aButtons": [],
@@ -312,7 +319,7 @@ $(document).ready(function() {
 		placeholder: "placeholder show-builder-placeholder",
 		forceHelperSize: true,
 		forcePlaceholderSize: true,
-		items: 'tr:not(.show-builder-header):not(.show-builder-footer):not(.show-builder-not-allowed):not(.show-builder-empty)',
+		items: 'tr:not(:first):not(.show-builder-header):not(.show-builder-footer):not(.show-builder-not-allowed):not(.show-builder-empty)',
 		//cancel: ".show-builder-header .show-builder-footer",
 		receive: function(event, ui) {
 			var x;