SAAS-948 - ShowBuilder redesign editors and fixes

airtime_mvc/application/controllers/LibraryController.php

@@ -11,7 +11,6 @@ class LibraryController extends Zend_Controller_Action
     {
         $ajaxContext = $this->_helper->getHelper('AjaxContext');
         $ajaxContext->addActionContext('contents-feed', 'json')
-                    ->addActionContext('contents-feed-test', 'json')
                     ->addActionContext('delete', 'json')
                     ->addActionContext('duplicate', 'json')
                     ->addActionContext('delete-group', 'json')
@@ -424,19 +423,6 @@ class LibraryController extends Zend_Controller_Action
         $this->view->files = SecurityHelper::htmlescape_recursive($r["aaData"]);
     }
 
-    public function contentsFeedTestAction()
-    {
-        $params = $this->getRequest()->getParams();
-
-        # terrible name for the method below. it does not only search files.
-        $r = Application_Model_StoredFile::searchLibraryFiles($params);
-
-        $this->view->sEcho = $r["sEcho"];
-        $this->view->iTotalDisplayRecords = $r["iTotalDisplayRecords"];
-        $this->view->iTotalRecords = $r["iTotalRecords"];
-        $this->view->files = SecurityHelper::htmlescape_recursive($r["aaData"]);
-    }
-
     public function editFileMdAction()
     {
         $user = Application_Model_User::getCurrentUser();

airtime_mvc/application/controllers/ShowBuilderController.php

@@ -30,7 +30,7 @@ class ShowBuilderController extends Zend_Controller_Action {
         $this->view->headLink()->appendStylesheet($baseUrl.'css/datatables/css/ColVis.css?'.$CC_CONFIG['airtime_version']);
         $this->view->headLink()->appendStylesheet($baseUrl.'css/datatables/css/ColReorder.css?'.$CC_CONFIG['airtime_version']);
         $this->view->headScript()->appendFile($baseUrl.'js/airtime/library/library-test.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
-        $this->view->headScript()->appendFile($baseUrl.'js/airtime/library/events/library_showbuilder.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
+        $this->view->headScript()->appendFile($baseUrl.'js/airtime/library/events/library_showbuilder_test.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
 
         // PLUPLOAD
         $this->view->headScript()->appendFile($baseUrl.'js/libs/dropzone.min.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
@@ -40,8 +40,14 @@ class ShowBuilderController extends Zend_Controller_Action {
         $this->view->headScript()->appendFile($baseUrl.'js/airtime/showbuilder/builder_test.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
         $this->view->headScript()->appendFile($baseUrl.'js/airtime/showbuilder/main_builder_test.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
 
+        // MEDIA BUILDER
+        $this->view->headScript()->appendFile($baseUrl.'js/airtime/library/spl-test.js?'.$CC_CONFIG['airtime_version'], 'text/javascript');
+        $this->view->headScript()->appendFile($baseUrl.'js/airtime/playlist/smart_blockbuilder.js?'.$CC_CONFIG['airtime_version'], 'text/javascript');
+        $this->view->headLink()->appendStylesheet($baseUrl.'css/playlist_builder.css?'.$CC_CONFIG['airtime_version']);
+
         $this->view->headLink()->appendStylesheet($baseUrl.'css/jquery.ui.timepicker.css?'.$CC_CONFIG['airtime_version']);
         $this->view->headLink()->appendStylesheet($baseUrl.'css/showbuilder.css?'.$CC_CONFIG['airtime_version']);
+        $this->view->headLink()->appendStylesheet($baseUrl.'css/showbuilder-test.css?'.$CC_CONFIG['airtime_version']);
 
         $csrf_namespace = new Zend_Session_Namespace('csrf_namespace');
         $csrf_element = new Zend_Form_Element_Hidden('csrf');

airtime_mvc/application/models/StoredFile.php

@@ -907,112 +907,6 @@ SQL;
         return $results;
     }
 
-    public static function searchLibraryFilesTest($datatables)
-    {
-        $con = Propel::getConnection(CcFilesPeer::DATABASE_NAME);
-        $displayColumns = self::getLibraryColumns();
-
-        $fileSelect   = array();
-        foreach ($displayColumns as $key) {
-            if ($key === "id") {
-                $fileSelect[]   = "FILES.id AS $key";
-            } elseif ($key === "owner_id") {
-                $fileSelect[]   = "sub.login AS $key";
-            } //file length is displayed based on cueout - cuein.
-            else if ($key === "length") {
-                $fileSelect[]   = "(cueout - cuein)::INTERVAL AS length";
-            } elseif ($key === "year") {
-                $fileSelect[]   = "year AS ".$key;
-            } else {
-                $fileSelect[]   = $key;
-            }
-        }
-
-        $fileSelect   = "SELECT ". join(",", $fileSelect);
-        $fileTable = "({$fileSelect} FROM cc_files AS FILES LEFT JOIN cc_subjs AS sub ON (sub.id = FILES.owner_id) WHERE file_exists = 'TRUE' AND hidden='FALSE')";
-        $fromTable = $fileTable." AS File"; //need an alias for the table if it's standalone.
-
-        // update is_scheduled to false for tracks that
-        // have already played out
-        self::updatePastFilesIsScheduled();
-        $results = Application_Model_Datatables::findEntries($con, $displayColumns, $fromTable, $datatables);
-
-        $displayTimezone = new DateTimeZone(Application_Model_Preference::GetUserTimezone());
-        $utcTimezone = new DateTimeZone("UTC");
-
-        foreach ($results['aaData'] as &$row) {
-            $row['id'] = intval($row['id']);
-
-            //taken from Datatables.php, needs to be cleaned up there.
-            if (isset($r['ftype'])) {
-                if ($r['ftype'] == 'playlist') {
-                    $pl = new Application_Model_Playlist($r['id']);
-                    $r['length'] = $pl->getLength();
-                } elseif ($r['ftype'] == "block") {
-                    $bl = new Application_Model_Block($r['id']);
-                    $r['bl_type'] = $bl->isStatic() ? 'static' : 'dynamic';
-                    $r['length']  = $bl->getLength();
-                }
-            }
-
-            if ($row['ftype'] === "audioclip") {
-
-                $cuein_formatter = new LengthFormatter($row["cuein"]);
-                $row["cuein"] = $cuein_formatter->format();
-
-                $cueout_formatter = new LengthFormatter($row["cueout"]);
-                $row["cueout"] = $cueout_formatter->format();
-
-                $cuein = Application_Common_DateHelper::playlistTimeToSeconds($row["cuein"]);
-                $cueout = Application_Common_DateHelper::playlistTimeToSeconds($row["cueout"]);
-                $row_length = Application_Common_DateHelper::secondsToPlaylistTime($cueout - $cuein);
-
-                $formatter = new SamplerateFormatter($row['sample_rate']);
-                $row['sample_rate'] = $formatter->format();
-
-                $formatter = new BitrateFormatter($row['bit_rate']);
-                $row['bit_rate'] = $formatter->format();
-
-                // for audio preview
-                $row['audioFile'] = $row['id'].".".pathinfo($row['filepath'], PATHINFO_EXTENSION);
-
-            }
-            else {
-
-                $row['audioFile'] = $row['id'];
-                $row_length = $row['length'];
-            }
-
-            $len_formatter = new LengthFormatter($row_length);
-            $row['length'] = $len_formatter->format();
-
-            //convert mtime and utime to localtime
-            $row['mtime'] = new DateTime($row['mtime'], $utcTimezone);
-            $row['mtime']->setTimeZone($displayTimezone);
-            $row['mtime'] = $row['mtime']->format(DEFAULT_TIMESTAMP_FORMAT);
-            $row['utime'] = new DateTime($row['utime'], $utcTimezone);
-            $row['utime']->setTimeZone($displayTimezone);
-            $row['utime'] = $row['utime']->format(DEFAULT_TIMESTAMP_FORMAT);
-
-            //need to convert last played to localtime if it exists.
-            if (isset($row['lptime'])) {
-                $row['lptime'] = new DateTime($row['lptime'], $utcTimezone);
-                $row['lptime']->setTimeZone($displayTimezone);
-                $row['lptime'] = $row['lptime']->format(DEFAULT_TIMESTAMP_FORMAT);
-            }
-
-            // we need to initalize the checkbox and image row because we do not retrieve
-            // any data from the db for these and datatables will complain
-            $row['checkbox'] = "";
-            $row['image'] = "";
-
-            $type = substr($row['ftype'], 0, 2);
-            $row['tr_id'] = "{$type}_{$row['id']}";
-        }
-
-        return $results;
-    }
-
     /**
      * Copy a newly uploaded audio file from its temporary upload directory 
      * on the local disk (like /tmp) over to Airtime's "stor" directory, 

airtime_mvc/application/views/scripts/show-builder/index.phtml

@@ -1,8 +1,12 @@
 <style>
-    body {
+    html, body {
         background: #242424;
     }
 
+    div.ColVis_collectionBackground {
+        background-color: transparent;
+    }
+
     .wrapper {
         position: absolute;
         background: #242424;
@@ -21,13 +25,26 @@
 </form>
 
 <div id="media_type_nav">
-    <button id="new_media_selector" class="btn btn-small dropdown-toggle" data-toggle="dropdown">
+    <div class="btn-group">
-        New <span class="caret"></span>
+        <button id="new_media_selector" class="btn btn-small dropdown-toggle" data-toggle="dropdown">
-    </button>
+            New <span class="caret"></span>
-    <div class="media_type_selector selected" selection_id="1">Files</div>
+        </button>
-    <div class="media_type_selector" selection_id="2">Playlists</div>
+        <ul class="dropdown-menu">
-    <div class="media_type_selector" selection_id="3">Smart Blocks</div>
+            <li id="new-playlist">
-    <div class="media_type_selector" selection_id="4">Webstreams</div>
+                <a href="#"><?php echo _("Playlist") ?></a>
+            </li>
+            <li id="new-smart-block">
+                <a href="#"><?php echo _("Smart Block") ?></a>
+            </li>
+            <li id="new-webstream">
+                <a href="#"><?php echo _("Webstream") ?></a>
+            </li>
+        </ul>
+    </div>
+    <div class="media_type_selector selected" selection_id="1"><?php echo _("Files") ?></div>
+    <div class="media_type_selector" selection_id="2"><?php echo _("Playlists") ?></div>
+    <div class="media_type_selector" selection_id="3"><?php echo _("Smart Blocks") ?></div>
+    <div class="media_type_selector" selection_id="4"><?php echo _("Webstreams") ?></div>
 </div>
 
 <div id="library_content" class="lib-content tabs lib-test">
@@ -40,4 +57,8 @@
     </div>
     <table id="show_builder_table" cellpadding="0" cellspacing="0" class="datatable"></table>
 </div>
+
+<div id="side_playlist" class="pl-content media-builder-test">
+</div>
+
 <?php echo $this->dialog ?>

airtime_mvc/application/views/scripts/webstream/webstream.phtml

@@ -22,9 +22,9 @@
 </div>
 
 <?php if (isset($this->obj)) : ?>
-    <input id="obj_id" type="hidden" value="<?php echo $this->obj->getId(); ?>"></input>
+    <input id="obj_id" type="hidden" value="<?php echo $this->obj->getId(); ?>"/>
-    <input id="obj_lastMod" type="hidden" value="<?php echo "1";//$this->obj->getLastModified('U'); ?>"></input>
+    <input id="obj_lastMod" type="hidden" value="<?php echo "1";//$this->obj->getLastModified('U'); ?>"/>
-    <input id="obj_type" type="hidden" value="webstream"></input>
+    <input id="obj_type" type="hidden" value="webstream"/>
     <div class="status" style="display:none;"></div>
 
     <div class="playlist_title">

airtime_mvc/public/css/add-show.css

@@ -169,7 +169,7 @@ label.wrapp-label input[type="checkbox"] {
     color: #ffffff;
     margin:0;
     font-size:12px;
-    font-weight:bold;
+    /*font-weight:bold;*/
     padding:4px 12px 4px 22px;
     text-decoration:none;
     /*text-shadow: #000 0px -1px;*/

airtime_mvc/public/css/bootstrap.css

@@ -972,7 +972,7 @@ input[type="submit"].btn.btn-mini {
   margin-left: 5px;
 }
 .btn-toolbar {
-  font-size: 0;
+  /*font-size: 0;*/
   margin-top: 10px;
   margin-bottom: 10px;
 }

airtime_mvc/public/css/showbuilder-test.css

@@ -0,0 +1,144 @@
+/* Show Builder*/
+
+@media screen and (max-width: 1015px) {
+    .lib-test, .sb-test, .media-builder-test, #media_type_nav {
+        width: 100% !important;
+    }
+    .media-builder-test {
+        margin-top: 0 !important;
+    }
+    #media_type_nav div {
+        float: left;
+        width: 20%;
+        text-align: center;
+        margin: auto;
+    }
+    #media_type_nav .media_type_selector {
+        margin-top: .25em;
+    }
+}
+
+@media screen and (max-width: 780px) {
+    .lib-test .dataTables_filter input[type="text"] {
+        position: relative;
+        width: calc(100% - 1em) !important;
+        margin: 0 .5em .5em 0;
+    }
+}
+
+.lib-test .dataTables_filter {
+    margin: 0;
+}
+
+.lib-test .dataTables_filter input[type="text"], .lib-test .dataTables_filter select {
+    margin-top: .5em;
+    width: 30%;
+    float: right;
+    height: 26px;
+}
+
+.lib-test label {
+    padding: 0;
+}
+
+.lib-test .dataTables_length {
+    padding: 5px;
+}
+
+.lib-test .dataTables_length label {
+    color: #555555;
+}
+
+.lib-test legend, .lib-test span, .lib-test label {
+    font-weight: normal;
+    color: #efefef;
+}
+
+.lib-test {
+    margin: 2em 2em 2em 0;
+    overflow: hidden !important;
+}
+
+.sb-test, .media-builder-test {
+    margin-top: 4.6em; /* Standardize this somehow */
+}
+
+.lib-test, .sb-test, .media-builder-test {
+    /* 1em for the middle margin, 6 for half the width of the left pane */
+    width: calc(50% - 8em);
+    min-width: 470px;
+}
+
+/* Media builder */
+
+.media-builder-test {
+    color: #efefef;
+}
+
+#side_playlist {
+    width: calc(50% - 8em);
+    font-size: inherit;
+}
+
+/* Media type selector */
+
+#media_type_nav {
+    float: left;
+    margin: 2em 0 0 0;
+
+    width: 12em;
+
+    background: none;
+    padding: 0 2em 0 0;
+}
+
+#new_media_selector {
+    width: 100%;
+}
+
+.media_type_selector {
+    cursor: pointer;
+    color: #cecece;
+    font-family: Roboto, "Open Sans", sans-serif;
+    font-size: 16px;
+    font-weight: 400;
+    width: 100%;
+    margin: 1em 1em 0 0;
+
+    -webkit-transition: color 0.2s linear;
+    -moz-transition: color 0.2s linear;
+    -o-transition: color 0.2s linear;
+    transition: color 0.2s linear;
+}
+
+.media_type_selector.selected {
+    color: #fff;
+    -webkit-transition: color 0.2s linear;
+    -moz-transition: color 0.2s linear;
+    -o-transition: color 0.2s linear;
+    transition: color 0.2s linear;
+}
+
+.media_type_selector:hover {
+    color: #fff;
+    -webkit-transition: color 0.2s linear;
+    -moz-transition: color 0.2s linear;
+    -o-transition: color 0.2s linear;
+    transition: color 0.2s linear;
+}
+
+/* Uploads/Dropzone */
+
+#upload_form {
+    width: 100%;
+    min-width: 470px;
+
+    background: none;
+    border: 2px dashed #efefef;
+
+    color: #efefef;
+    font-family: Roboto, "Open Sans", sans-serif;
+    font-size: 20px;
+    font-weight: 300;
+    line-height: 1.4rem;
+}

airtime_mvc/public/css/styles.css

@@ -937,7 +937,7 @@ dl.inline-list dd {
 
 .dataTables_info {
     float: left;
-    padding: 8px 0 0 8px;
+    padding: 10px;
     font-size:12px;
     color:#555555;
     font-weight:normal;
@@ -3308,85 +3308,6 @@ dd .stream-status {
     margin: 0 auto;
 }
 
-/* Show Builder*/
-
-@media screen and (max-width: 1015px) {
-    .lib-test, .sb-test {
-        width: 100% !important;
-    }
-}
-
-.lib-test legend, .lib-test label, .lib-test span {
-    color: #efefef;
-}
-
-.lib-test {
-    margin: 2em 2em 2em 0;
-    overflow: hidden !important;
-}
-
-.sb-test {
-    margin-top: 2em;
-}
-
-.lib-test, .sb-test {
-    /* 1em for the middle margin, 6 for half the width of the left pane */
-    width: calc(50% - 8em);
-    min-width: 470px;
-}
-
-#media_type_nav {
-    float: left;
-    margin: 2em 0 0 0;
-
-    width: 12em;
-
-    background: none;
-    padding: 0 2em 0 0;
-}
-
-#new_media_selector {
-    width: 100%;
-}
-
-.media_type_selector {
-    cursor: pointer;
-    color: #cecece;
-    font-family: Roboto, "Open Sans", sans-serif;
-    font-size: 16px;
-    font-weight: 400;
-    width: 100%;
-    margin: 1em 1em 0 0;
-}
-
-.media_type_selector.selected {
-    color: #fff;
-}
-
-.media_type_selector:hover {
-    color: #fff;
-    -webkit-transition: color 0.2s linear;
-    -moz-transition: color 0.2s linear;
-    -o-transition: color 0.2s linear;
-    transition: color 0.2s linear;
-}
-
-/* Uploads */
-
-#upload_form {
-    width: 100%;
-    min-width: 470px;
-
-    background: none;
-    border: 2px dashed #efefef;
-
-    color: #efefef;
-    font-family: Roboto, "Open Sans", sans-serif;
-    font-size: 20px;
-    font-weight: 300;
-    line-height: 1.4rem;
-}
-
 /* Usability Hints */
 
 .usability_hint {

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

@@ -0,0 +1,325 @@
+var AIRTIME = (function(AIRTIME) {
+    var mod;
+
+    if (AIRTIME.library === undefined) {
+        AIRTIME.library = {};
+    }
+
+    mod = AIRTIME.library;
+
+    mod.checkAddButton = function() {
+        var selected = mod.getChosenItemsLength(), $cursor = $('tr.sb-selected'), check = false,
+            shows = $('tr.sb-header'), current = $('tr.sb-current-show'),
+        // TODO: this is an ugly way of doing this... we should find a more robust way of checking which view we're in.
+            btnText = (window.location.href.toLowerCase().indexOf("schedule") > -1) ? $.i18n._('Add to show') : $.i18n._('Add to next show');
+
+        // make sure library items are selected and a cursor is selected.
+        if (selected !== 0) {
+            check = true;
+        }
+
+        if (shows.length === 0) {
+            check = false;
+        }
+
+        if (check) {
+            AIRTIME.button.enableButton("btn-group #library-plus", false);
+        } else {
+            AIRTIME.button.disableButton("btn-group #library-plus", false);
+        }
+
+        if ($("#show_builder").is(":visible")) {
+            if ($cursor.length !== 0) {
+                btnText = $.i18n._('Add after selected items');
+            } else if (current.length !== 0) {
+                btnText = $.i18n._('Add to current show');
+            }
+        } else {
+            var objType = $('#obj_type').val();
+            if (objType === 'block') {
+                btnText = ' ' + $.i18n._('Add to current smart block');
+            } else {
+                btnText = ' ' + $.i18n._('Add to current playlist');
+            }
+        }
+        AIRTIME.library.changeAddButtonText($('.btn-group #library-plus #lib-plus-text'), ' '+ btnText);
+    };
+
+    mod.fnRowCallback = function(nRow, aData, iDisplayIndex, iDisplayIndexFull) {
+        var $nRow = $(nRow);
+
+        if (aData.ftype === "audioclip") {
+            $nRow.addClass("lib-audio");
+            $image = $nRow.find('td.library_type');
+            if (!isAudioSupported(aData.mime)) {
+                $image.html('<span class="ui-icon ui-icon-locked"></span>');
+                aData.image = '<span class="ui-icon ui-icon-locked"></span>';
+            }
+        } else if (aData.ftype === "stream") {
+            $nRow.addClass("lib-stream");
+        } else {
+            $nRow.addClass("lib-pl");
+        }
+
+        $nRow.attr("id", aData["tr_id"]).data("aData", aData).data("screen",
+            "timeline");
+    };
+
+    mod.fnDrawCallback = function fnLibDrawCallback() {
+
+        mod.redrawChosen();
+        mod.checkToolBarIcons();
+
+        if ($("#show_builder").is(":visible")) {
+            $('#library_display tr.lib-audio, tr.lib-pl, tr.lib-stream')
+                .draggable(
+                {
+                    helper: function () {
+
+                        var $el = $(this), selected = mod
+                            .getChosenItemsLength(), container, thead = $("#show_builder_table thead"), colspan = thead
+                            .find("th").length, width = $el.width(), message;
+
+                        // dragging an element that has an unselected
+                        // checkbox.
+                        if (mod.isChosenItem($el) === false) {
+                            selected++;
+                        }
+
+                        if (selected === 1) {
+                            message = $.i18n._("Adding 1 Item");
+                        } else {
+                            message = sprintf($.i18n._("Adding %s Items"), selected);
+                        }
+
+                        container = $('<div/>').attr('id',
+                            'draggingContainer').append('<tr/>')
+                            .find("tr").append('<td/>').find("td")
+                            .attr("colspan", colspan).width(width)
+                            .addClass("ui-state-highlight").append(
+                            message).end().end();
+
+                        return container;
+                    },
+                    cursor: 'pointer',
+                    cursorAt: {
+                        top: 30,
+                        left: 100
+                    },
+                    connectToSortable: '#show_builder_table'
+                });
+        } else {
+            $('#library_display tr.lib-audio, tr.lib-stream, tr.lib-pl, tr.lib-block')
+                .draggable(
+                {
+                    helper: function () {
+
+                        var $el = $(this), selected = mod
+                                .getChosenAudioFilesLength(), container, message, li = $("#side_playlist ul[id='spl_sortable'] li:first"),
+                            width = li.width(), height = 55;
+                        if (width > 798) width = 798;
+
+                        // dragging an element that has an unselected
+                        // checkbox.
+                        if (mod.isChosenItem($el) === false) {
+                            selected++;
+                        }
+
+                        if (selected === 1) {
+                            message = $.i18n._("Adding 1 Item");
+                        } else {
+                            message = sprintf($.i18n._("Adding %s Items"), selected);
+                        }
+
+                        container = $('<div class="helper"/>').append(
+                            "<li/>").find("li").addClass(
+                            "ui-state-default").append("<div/>")
+                            .find("div").addClass(
+                            "list-item-container").append(
+                            message).end().width(width)
+                            .height(height).end();
+
+                        return container;
+                    },
+                    cursor: 'pointer',
+                    cursorAt: {
+                        top: 30,
+                        left: 100
+                    },
+                    connectToSortable: '#spl_sortable'
+                });
+        }
+    };
+
+    mod.dblClickAdd = function(data, type) {
+        var i, length, temp, aMediaIds = [], aSchedIds = [], aData = [];
+
+        if ($("#show_builder").is(":visible")) {
+            // process selected files/playlists.
+            aMediaIds.push({
+                "id": data.id,
+                "type": type
+            });
+
+            $("#show_builder_table tr.sb-selected").each(function (i, el) {
+                aData.push($(el).data("aData"));
+            });
+
+            // process selected schedule rows to add media after.
+            for (i = 0, length = aData.length; i < length; i++) {
+                temp = aData[i];
+                aSchedIds.push({
+                    "id": temp.id,
+                    "instance": temp.instance,
+                    "timestamp": temp.timestamp
+                });
+            }
+
+            if (aSchedIds.length == 0) {
+                if (!addToCurrentOrNext(aSchedIds)) {
+                    return;
+                }
+            }
+
+            AIRTIME.showbuilder.fnAdd(aMediaIds, aSchedIds);
+        } else {
+            // process selected files/playlists.
+            aMediaIds.push(new Array(data.id, data.ftype));
+
+            // check if a playlist/block is open before adding items
+            if ($('input[id="obj_type"]').val() == 'playlist'
+                || $('input[id="obj_type"]').val() == 'block') {
+                AIRTIME.playlist.fnAddItems(aMediaIds, undefined, 'after');
+            }
+        }
+    };
+
+    function addToCurrentOrNext(arr) {
+        var el;
+        // Add to the end of the current show by getting the footer
+        el = $(".sb-footer.sb-current-show");
+        var data = el.prev().data("aData");
+
+        if (data === undefined) {
+            alert($.i18n._("Cannot schedule outside a show."));
+            return false;
+        }
+
+        arr.push({
+            "id" : data.id,
+            "instance" : data.instance,
+            "timestamp" : data.timestamp
+        });
+
+        if (!isInView(el)) {
+            $('.dataTables_scrolling.sb-padded').animate({
+                scrollTop: el.offset().top
+            }, 0);
+        }
+
+        return true;
+    }
+
+    mod.setupLibraryToolbar = function() {
+        var $toolbar = $(".lib-content .fg-toolbar:first");
+
+        mod.createToolbarButtons();
+        
+        $toolbar.append($menu);
+        // add to timeline button
+        $toolbar
+            .find('.icon-plus').parent()
+            .click(
+                    function() {
+
+                        if (AIRTIME.button.isDisabled('btn-group #library-plus') === true) {
+                            return;
+                        }
+    
+                        var selected = AIRTIME.library.getSelectedData(), data, i, length, temp, aMediaIds = [], aSchedIds = [], aData = [];
+    
+                        // process selected files/playlists.
+                        for (i = 0, length = selected.length; i < length; i++) {
+                            data = selected[i];
+                            aMediaIds.push( {
+                                "id" : data.id,
+                                "type" : data.ftype
+                            });
+                        }
+    
+                        $("#show_builder_table tr.sb-selected")
+                                .each(function(i, el) {
+                                    aData.push($(el).data("aData"));
+                                });
+    
+                        // process selected schedule rows to add media
+                        // after.
+                        for (i = 0, length = aData.length; i < length; i++) {
+                            temp = aData[i];
+                            aSchedIds.push( {
+                                "id" : temp.id,
+                                "instance" : temp.instance,
+                                "timestamp" : temp.timestamp
+                            });
+                        }
+
+                        if (aSchedIds.length == 0) {
+                            addToCurrentOrNext(aSchedIds);
+                        }
+    
+                        AIRTIME.showbuilder.fnAdd(aMediaIds, aSchedIds);
+                    });
+
+        // delete from library.
+        $toolbar.find('.icon-trash').parent().click(function() {
+
+            if (AIRTIME.button.isDisabled('icon-trash') === true) {
+                return;
+            }
+
+            AIRTIME.library.fnDeleteSelectedItems();
+        });
+
+        $toolbar.find('#sb-new').click(function() {
+            if (AIRTIME.button.isDisabled('btn-group #sb-new') === true) {
+                return;
+            }
+
+            var selection = $(".media_type_selector.selected").attr("selection_id");
+            console.log(selection);
+
+            if (selection == 2) {
+                AIRTIME.playlist.fnNew();
+            } else if (selection == 3) {
+                AIRTIME.playlist.fnNewBlock();
+            } else if (selection == 4) {
+                AIRTIME.playlist.fnWsNew();
+            }
+        });
+
+
+        $toolbar.find('#sb-edit').click(function() {
+            if (AIRTIME.button.isDisabled('btn-group #sb-edit') === true) {
+                return;
+            }
+
+            var data = $(".lib-selected:first").data("aData");
+
+            if (data.ftype === "audioclip") {
+                $.get(baseUrl + "library/edit-file-md/id/" + data.id, {format: "json"}, function(json){
+                    buildEditMetadataDialog(json);
+                });
+            } else if (data.ftype === "playlist" || data.ftype === "block") {
+                AIRTIME.playlist.fnEdit(data.id, data.ftype, baseUrl+'Playlist/edit');
+                AIRTIME.playlist.validatePlaylistElements();
+            } else if (data.ftype === "stream") {
+                AIRTIME.playlist.fnEdit(data.id, data.ftype, baseUrl + 'Webstream/edit');
+            }
+        });
+
+        mod.createToolbarDropDown();
+    };
+
+    return AIRTIME;
+
+}(AIRTIME || {}));

airtime_mvc/public/js/airtime/library/library-test.js

@@ -131,10 +131,20 @@ var AIRTIME = (function(AIRTIME) {
                             "<span id='lib-plus-text'></span>" +
                         "</button>" +
                     "</div>")
-            .append("<div class='btn-group'>" +
+            .append("<div class='btn-group' title=" + $.i18n._('Delete') + ">" +
                         "<button class='btn btn-small' id='sb-trash'>" +
                             "<i class='icon-white icon-trash'></i>" +
                         "</button>" +
+                    "</div>")
+            .append("<div class='btn-group' title=" + $.i18n._('Edit') + ">" +
+                        "<button class='btn btn-small' id='sb-edit'>" +
+                            "<i class='icon-white icon-pencil'></i>" +
+                        "</button>" +
+                    "</div>")
+            .append("<div class='btn-group' title=" + $.i18n._('New') + ">" +
+                        "<button class='btn btn-small' id='sb-new'>" +
+                            "<i class='icon-white icon-plus'></i>" +
+                        "</button>" +
                     "</div>");
     };
     
@@ -160,10 +170,43 @@ var AIRTIME = (function(AIRTIME) {
         }
     };
 
-    mod.checkToolBarIcons = function() {
+    mod.checkEditButton = function() {
+        var selected = mod.getChosenItemsLength(),
+            check = false;
 
+        if (selected === 1) {
+            check = true;
+        }
+
+        if (check === true) {
+            AIRTIME.button.enableButton("btn-group #sb-edit", false);
+        }
+        else {
+            AIRTIME.button.disableButton("btn-group #sb-edit", false);
+        }
+    };
+
+    mod.checkNewButton = function() {
+        var selected = $(".media_type_selector.selected").attr("selection_id"),
+            check = false;
+
+        if (selected != 1) {
+            check = true;
+        }
+
+        if (check === true) {
+            AIRTIME.button.enableButton("btn-group #sb-new", false);
+        }
+        else {
+            AIRTIME.button.disableButton("btn-group #sb-new", false);
+        }
+    };
+
+    mod.checkToolBarIcons = function() {
         AIRTIME.library.checkAddButton();
         AIRTIME.library.checkDeleteButton();
+        AIRTIME.library.checkEditButton();
+        AIRTIME.library.checkNewButton();
     };
     
     mod.getSelectedData = function() {
@@ -301,8 +344,6 @@ var AIRTIME = (function(AIRTIME) {
 
         //Prevent the user from spamming the delete button while the AJAX request is in progress
         AIRTIME.button.disableButton("btn-group #sb-trash", false);
-        //Hack to immediately show the "Processing" div in DataTables to give the user some sort of feedback.
-        $(".dataTables_processing").css('visibility','visible');
 
         $.post(baseUrl+"library/delete", 
             {"format": "json", "media": aMedia}, 
@@ -560,7 +601,7 @@ var AIRTIME = (function(AIRTIME) {
                 oData.iCreate = parseInt(oData.iCreate, 10);
             },
             
-            "sAjaxSource": baseUrl+"Library/contents-feed-test",
+            "sAjaxSource": baseUrl+"Library/contents-feed",
             "sAjaxDataProp": "files",
             
             "fnServerData": function ( sSource, aoData, fnCallback ) {
@@ -648,7 +689,7 @@ var AIRTIME = (function(AIRTIME) {
             "oLanguage": datatables_dict,
             
             // R = ColReorder, C = ColVis
-            "sDom": 'Rl<"#library_display_type">f<"dt-process-rel"r><"H"<"library_toolbar"C>><"dataTables_scrolling"t><"F"ip>',
+            "sDom": 'R<"#library_display_type"><"dt-process-rel"r><"H"<"library_toolbar"Cf>><"dataTables_scrolling"t><"F"ilp>>',
             
             "oColVis": {
                 "sAlign": "right",

airtime_mvc/public/js/airtime/showbuilder/builder_test.js

@@ -305,13 +305,6 @@ var AIRTIME = (function(AIRTIME){
         
     mod.fnAdd = function(aMediaIds, aSchedIds) {
         mod.disableUI();
-        for (var i in aSchedIds) {
-            if ($("#"+aSchedIds[i].id).hasClass("sb-past")) {
-                alert($.i18n._("Cannot add media before currently playing track."));
-                mod.enableUI();
-                return;
-            }
-        }
 
         $.post(baseUrl+"showbuilder/schedule-add",
             {"format": "json", "mediaIds": aMediaIds, "schedIds": aSchedIds},
@@ -381,7 +374,7 @@ var AIRTIME = (function(AIRTIME){
             "url": sSource,
             "data": aoData,
             "success": function(json) {
-                mod.updateCalendarStatusIcon(json)
+                mod.updateCalendarStatusIcon(json);
                 mod.setTimestamp(json.timestamp);
                 mod.setShowInstances(json.instances);
                 mod.getSelectedCursors();
@@ -402,7 +395,7 @@ var AIRTIME = (function(AIRTIME){
 
     mod.builderDataTable = function() {
         $sbContent = $('#show_builder');
-        $lib = $("#library_content"),
+        $lib = $("#library_content");
         $sbTable = $sbContent.find('table');
         var isInitialized = false;
 

airtime_mvc/public/js/airtime/showbuilder/main_builder_test.js

@@ -144,8 +144,27 @@ AIRTIME = (function(AIRTIME) {
     }
 
     mod.onReady = function() {
+        // Normally we would just use audio/*, but it includes file types that we can't handle (like .m4a)
+        var acceptedTypes = ["audio/ogg",
+                             "application/ogg",
+                             "audio/vorbis",
+                             "audio/mp3",
+                             "audio/mpeg",
+                             "audio/mpeg3",
+                             "audio/x-aac",
+                             "audio/aac",
+                             "audio/aacp",
+                             "audio/mp4",
+                             "audio/x-flac",
+                             "audio/wav",
+                             "audio/x-wav",
+                             "audio/mp2",
+                             "audio/mp1",
+                             "audio/x-ms-wma",
+                             "audio/basic"];
 
         Dropzone.options.uploadForm = {
+            acceptedFiles: acceptedTypes.join(),
             init: function () {
                 this.on("sending", function (file, xhr, data) {
                     data.append("csrf_token", $("#csrf").val());