From 8c65ba8f66ae0d6cf4eaa73e3f9f913fa0ea4947 Mon Sep 17 00:00:00 2001
From: Duncan Sommerville <duncan.sommerville@gmail.com>
Date: Mon, 14 Sep 2015 18:26:28 -0400
Subject: [PATCH] SAAS-1061 - implement podcast list view skeleton; small
 bugfixes

Conflicts:
	airtime_mvc/public/js/airtime/library/library.js
---
 airtime_mvc/application/Bootstrap.php         |   1 +
 airtime_mvc/application/airtime-boot.php      |   2 +
 airtime_mvc/application/common/enum/Enum.php  |  47 +++
 .../application/common/enum/MediaType.php     |  14 +
 .../application/layouts/scripts/layout.phtml  |  22 +-
 airtime_mvc/application/models/StoredFile.php |  12 +-
 .../partialviews/dashboard-sub-nav.php        |  30 ++
 .../scripts/showbuilder/builderDialog.phtml   |  25 +-
 .../views/scripts/showbuilder/index.phtml     |   1 +
 .../public/ajax/library_placeholders.json     |  28 --
 airtime_mvc/public/css/dashboard.css          |  12 +
 airtime_mvc/public/css/styles.css             |   2 +-
 .../library/events/library_showbuilder.js     |  28 +-
 .../public/js/airtime/library/library.js      | 366 +++++++++++-------
 .../public/js/airtime/library/plupload.js     | 127 ++----
 .../js/airtime/showbuilder/main_builder.js    |  22 +-
 16 files changed, 406 insertions(+), 333 deletions(-)
 create mode 100644 airtime_mvc/application/common/enum/Enum.php
 create mode 100644 airtime_mvc/application/common/enum/MediaType.php
 create mode 100644 airtime_mvc/application/views/scripts/partialviews/dashboard-sub-nav.php
 delete mode 100644 airtime_mvc/public/ajax/library_placeholders.json

diff --git a/airtime_mvc/application/Bootstrap.php b/airtime_mvc/application/Bootstrap.php
index 26a6843c7..e64c74136 100644
--- a/airtime_mvc/application/Bootstrap.php
+++ b/airtime_mvc/application/Bootstrap.php
@@ -31,6 +31,7 @@ require_once "Auth.php";
 require_once "interface/OAuth2.php";
 require_once "TaskManager.php";
 require_once "UsabilityHints.php";
+require_once "MediaType.php";
 require_once __DIR__.'/models/formatters/LengthFormatter.php';
 require_once __DIR__.'/services/CeleryService.php';
 require_once __DIR__.'/services/SoundcloudService.php';
diff --git a/airtime_mvc/application/airtime-boot.php b/airtime_mvc/application/airtime-boot.php
index 08a5b9869..5ed3cb4bc 100644
--- a/airtime_mvc/application/airtime-boot.php
+++ b/airtime_mvc/application/airtime-boot.php
@@ -36,6 +36,8 @@ set_include_path(implode(PATH_SEPARATOR, array(
 )));
 
 set_include_path(APPLICATION_PATH . 'common' . PATH_SEPARATOR . get_include_path());
+set_include_path(APPLICATION_PATH . 'common/enum' . PATH_SEPARATOR . get_include_path());
+set_include_path(APPLICATION_PATH . 'common/interface' . PATH_SEPARATOR . get_include_path());
 
 //Propel classes.
 set_include_path(APPLICATION_PATH . 'models' . PATH_SEPARATOR . get_include_path());
diff --git a/airtime_mvc/application/common/enum/Enum.php b/airtime_mvc/application/common/enum/Enum.php
new file mode 100644
index 000000000..b0d34fbc3
--- /dev/null
+++ b/airtime_mvc/application/common/enum/Enum.php
@@ -0,0 +1,47 @@
+<?php
+
+/**
+ * Basic enumeration implementation; from http://stackoverflow.com/questions/254514/php-and-enumerations
+ *
+ * Class Enum
+ */
+abstract class Enum {
+
+    const __default = NULL;
+    private static $constCacheArray = NULL;
+
+    private function __construct() {}
+
+    private static function getConstants() {
+        if (self::$constCacheArray == NULL) {
+            self::$constCacheArray = [];
+        }
+        $calledClass = get_called_class();
+        if (!array_key_exists($calledClass, self::$constCacheArray)) {
+            $reflect = new ReflectionClass($calledClass);
+            self::$constCacheArray[$calledClass] = $reflect->getConstants();
+        }
+        return self::$constCacheArray[$calledClass];
+    }
+
+    public static function isValidName($name, $strict = false) {
+        $constants = self::getConstants();
+
+        if ($strict) {
+            return array_key_exists($name, $constants);
+        }
+
+        $keys = array_map('strtolower', array_keys($constants));
+        return in_array(strtolower($name), $keys);
+    }
+
+    public static function isValidValue($value) {
+        $values = array_values(self::getConstants());
+        return in_array($value, $values, $strict = true);
+    }
+
+    public static function getDefault() {
+        return static::__default;
+    }
+
+}
\ No newline at end of file
diff --git a/airtime_mvc/application/common/enum/MediaType.php b/airtime_mvc/application/common/enum/MediaType.php
new file mode 100644
index 000000000..69843c0d7
--- /dev/null
+++ b/airtime_mvc/application/common/enum/MediaType.php
@@ -0,0 +1,14 @@
+<?php
+
+require_once "Enum.php";
+final class MediaType extends Enum {
+
+    const __default = self::FILE;
+
+    const FILE = 1;
+    const PLAYLIST = 2;
+    const BLOCK = 3;
+    const WEBSTREAM = 4;
+    const PODCAST = 5;
+
+}
\ No newline at end of file
diff --git a/airtime_mvc/application/layouts/scripts/layout.phtml b/airtime_mvc/application/layouts/scripts/layout.phtml
index e2e486415..83b55c87f 100644
--- a/airtime_mvc/application/layouts/scripts/layout.phtml
+++ b/airtime_mvc/application/layouts/scripts/layout.phtml
@@ -66,22 +66,21 @@ j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
                 <a href="#"><?php echo _("Webstream") ?></a>
             </li>
         </ul>
-        <a href="/Plupload">
+        <a href="/plupload">
             <button id="add_media_btn" class="btn btn-small dashboard-btn btn-new">
                 <span><?php echo _("Upload") ?></span>
             </button>
         </a>
     </div>
-    <div class="media_type_selector top-link" data-selection-id="1">
-        <a href="/showbuilder#"><i class='icon-home icon-white'></i><?php echo _("Dashboard") ?></a></div>
-    <div class="media_type_selector dashboard_sub_nav" data-selection-id="1">
-        <a href="/showbuilder#tracks"><i class='icon-music icon-white'></i><?php echo _("Tracks") ?></a></div>
-    <div class="media_type_selector dashboard_sub_nav" data-selection-id="2">
-        <a href="/showbuilder#playlists"><i class='icon-list icon-white'></i><?php echo _("Playlists") ?></a></div>
-    <div class="media_type_selector dashboard_sub_nav" data-selection-id="3">
-        <a href="/showbuilder#smart-blocks"><i class='icon-time icon-white'></i><?php echo _("Smart Blocks") ?></a></div>
-    <div class="media_type_selector dashboard_sub_nav" data-selection-id="4">
-        <a href="/showbuilder#webstreams"><i class='icon-random icon-white'></i><?php echo _("Webstreams") ?></a></div>
+
+    <div class="media_type_selector top-link" data-selection-id="<?php echo MediaType::getDefault(); ?>">
+        <a href="/showbuilder#">
+            <i class='icon-home icon-white'></i>
+            <?php echo _("Dashboard") ?>
+        </a>
+    </div>
+    <?php $subnavPrefix = "/showbuilder"; require_once APPLICATION_PATH . "views/scripts/partialviews/dashboard-sub-nav.php"; ?>
+
     <hr style="margin-left: 5px; margin-right: 5px">
     <div id="nav">
         <?php echo $this->navigation()->menu(); ?>
@@ -90,7 +89,6 @@ j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
     <?php
     $partitions = Application_Model_Systemstatus::GetDiskInfo();
     $status = new StdClass;
-    $partitions = $partitions;
     $disk = $partitions[0];
     $used = $disk->totalSpace-$disk->totalFreeSpace;
     $total = $disk->totalSpace;
diff --git a/airtime_mvc/application/models/StoredFile.php b/airtime_mvc/application/models/StoredFile.php
index bad64204f..847586d03 100644
--- a/airtime_mvc/application/models/StoredFile.php
+++ b/airtime_mvc/application/models/StoredFile.php
@@ -806,21 +806,17 @@ SQL;
         $unionTable = "({$plTable} UNION {$blTable} UNION {$fileTable} UNION {$streamTable}) AS RESULTS";
 
         //choose which table we need to select data from.
-        // TODO : use constants instead of numbers -- RG
         switch ($type) {
-            case 0:
-                $fromTable = $unionTable;
-                break;
-            case 1:
+            case MediaType::FILE:
                 $fromTable = $fileTable." AS File"; //need an alias for the table if it's standalone.
                 break;
-            case 2:
+            case MediaType::PLAYLIST:
                 $fromTable = $plTable." AS Playlist"; //need an alias for the table if it's standalone.
                 break;
-            case 3:
+            case MediaType::BLOCK:
                 $fromTable = $blTable." AS Block"; //need an alias for the table if it's standalone.
                 break;
-            case 4:
+            case MediaType::WEBSTREAM:
                 $fromTable = $streamTable." AS StreamTable"; //need an alias for the table if it's standalone.
                 break;
             default:
diff --git a/airtime_mvc/application/views/scripts/partialviews/dashboard-sub-nav.php b/airtime_mvc/application/views/scripts/partialviews/dashboard-sub-nav.php
new file mode 100644
index 000000000..fe9428f1e
--- /dev/null
+++ b/airtime_mvc/application/views/scripts/partialviews/dashboard-sub-nav.php
@@ -0,0 +1,30 @@
+<div class="media_type_selector dashboard_sub_nav" data-selection-id="<?php echo MediaType::FILE ?>">
+    <a href="<?php echo $subnavPrefix; ?>#tracks">
+        <i class='icon-music icon-white'></i>
+        <span class="selector-name"><?php echo _("Tracks") ?></span>
+    </a>
+</div>
+<div class="media_type_selector dashboard_sub_nav" data-selection-id="<?php echo MediaType::PLAYLIST ?>">
+    <a href="<?php echo $subnavPrefix; ?>#playlists">
+        <i class='icon-list icon-white'></i>
+        <span class="selector-name"><?php echo _("Playlists") ?></span>
+    </a>
+</div>
+<div class="media_type_selector dashboard_sub_nav" data-selection-id="<?php echo MediaType::BLOCK ?>">
+    <a href="<?php echo $subnavPrefix; ?>#smart-blocks">
+        <i class='icon-time icon-white'></i>
+        <span class="selector-name"><?php echo _("Smart Blocks") ?></span>
+    </a>
+</div>
+<div class="media_type_selector dashboard_sub_nav" data-selection-id="<?php echo MediaType::WEBSTREAM ?>">
+    <a href="<?php echo $subnavPrefix; ?>#webstreams">
+        <i class='icon-random icon-white'></i>
+        <span class="selector-name"><?php echo _("Webstreams") ?></span>
+    </a>
+</div>
+<div class="media_type_selector dashboard_sub_nav" data-selection-id="<?php echo MediaType::PODCAST ?>">
+    <a href="<?php echo $subnavPrefix; ?>#podcasts">
+        <i class='icon-headphones icon-white'></i>
+        <span class="selector-name"><?php echo _("Podcasts") ?></span>
+    </a>
+</div>
diff --git a/airtime_mvc/application/views/scripts/showbuilder/builderDialog.phtml b/airtime_mvc/application/views/scripts/showbuilder/builderDialog.phtml
index fb346cc94..9ac17f639 100644
--- a/airtime_mvc/application/views/scripts/showbuilder/builderDialog.phtml
+++ b/airtime_mvc/application/views/scripts/showbuilder/builderDialog.phtml
@@ -1,30 +1,7 @@
 <div><!-- jQuery UI changes the styling on the outermost div; use a blank div so as not to break the .wrapper styling-->
     <div class="wrapper">
         <div id="media_selector_wrapper">
-            <div class="media_type_selector dashboard_sub_nav" data-selection-id="1">
-                <a href="#tracks">
-                    <i class='icon-music icon-white'></i>
-                    <span class="selector-name"><?php echo _("Tracks") ?></span>
-                </a>
-            </div>
-            <div class="media_type_selector dashboard_sub_nav" data-selection-id="2">
-                <a href="#playlists">
-                    <i class='icon-list icon-white'></i>
-                    <span class="selector-name"><?php echo _("Playlists") ?></span>
-                </a>
-            </div>
-            <div class="media_type_selector dashboard_sub_nav" data-selection-id="3">
-                <a href="#smart-blocks">
-                    <i class='icon-time icon-white'></i>
-                    <span class="selector-name"><?php echo _("Smart Blocks") ?></span>
-                </a>
-            </div>
-            <div class="media_type_selector dashboard_sub_nav" data-selection-id="4">
-                <a href="#webstreams">
-                    <i class='icon-random icon-white'></i>
-                    <span class="selector-name"><?php echo _("Webstreams") ?></span>
-                </a>
-            </div>
+            <?php $subnavPrefix = ""; require_once APPLICATION_PATH . "views/scripts/partialviews/dashboard-sub-nav.php"; ?>
         </div>
         <?php echo $this->csrf ?>
 
diff --git a/airtime_mvc/application/views/scripts/showbuilder/index.phtml b/airtime_mvc/application/views/scripts/showbuilder/index.phtml
index b3f90508b..d36794257 100644
--- a/airtime_mvc/application/views/scripts/showbuilder/index.phtml
+++ b/airtime_mvc/application/views/scripts/showbuilder/index.phtml
@@ -15,6 +15,7 @@
     </div>
     <div class="outer-datatable-wrapper">
         <table id="library_display" cellpadding="0" cellspacing="0" class="datatable"></table>
+        <table id="podcast_table" cellpadding="0" cellspacing="0" class="datatable"></table>
     </div>
 </div>
 
diff --git a/airtime_mvc/public/ajax/library_placeholders.json b/airtime_mvc/public/ajax/library_placeholders.json
deleted file mode 100644
index d1fa5f8af..000000000
--- a/airtime_mvc/public/ajax/library_placeholders.json
+++ /dev/null
@@ -1,28 +0,0 @@
-{
-  "1": {
-    "media": "tracks",
-    "icon": "icon-music",
-    "subtext": "Click 'Upload' to add some now.",
-    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/add-media/"
-  },
-  "2": {
-    "media": "playlists",
-    "icon": "icon-list",
-    "subtext": "Click 'New' to create one now.",
-    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
-  },
-  "3": {
-    "media": "smart blocks",
-    "icon": "icon-time",
-    "subtext": "Click 'New' to create one now.",
-    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
-
-  },
-  "4": {
-    "media": "webstreams",
-    "icon": "icon-random",
-    "subtext": "Click 'New' to create one now.",
-    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
-  },
-  "unauthorized": "You don't have permission to view the library."
-}
\ No newline at end of file
diff --git a/airtime_mvc/public/css/dashboard.css b/airtime_mvc/public/css/dashboard.css
index 4cb70ee68..d6a668d48 100644
--- a/airtime_mvc/public/css/dashboard.css
+++ b/airtime_mvc/public/css/dashboard.css
@@ -716,3 +716,15 @@ th.library_checkbox {
     background-color: #FF5D1A !important;
     height: 38px !important;
 }
+
+/*  ~~~~~~~~~~~~~~~~
+        Podcasts
+    ~~~~~~~~~~~~~~~~ */
+
+#podcast_table {
+    display: none;
+}
+
+/*  ~~~~~~~~~~~~~~~~
+      END Podcasts
+    ~~~~~~~~~~~~~~~~ */
diff --git a/airtime_mvc/public/css/styles.css b/airtime_mvc/public/css/styles.css
index 9f4294be8..0780d3b44 100644
--- a/airtime_mvc/public/css/styles.css
+++ b/airtime_mvc/public/css/styles.css
@@ -3598,7 +3598,7 @@ button.btn-icon-text > i.icon-white {
 .media_type_selector a {
     text-decoration: none;
     color: #cecece;
-    padding: 10px 10px 10px 10px;
+    padding: 10px 0 10px 10px;
     display: block;
 }
 
diff --git a/airtime_mvc/public/js/airtime/library/events/library_showbuilder.js b/airtime_mvc/public/js/airtime/library/events/library_showbuilder.js
index c6d8f8bbd..4be63d7c9 100644
--- a/airtime_mvc/public/js/airtime/library/events/library_showbuilder.js
+++ b/airtime_mvc/public/js/airtime/library/events/library_showbuilder.js
@@ -80,22 +80,20 @@ var AIRTIME = (function(AIRTIME) {
         var libEmpty = $('#library_empty');
         if (emptyRow.length > 0) {
             emptyRow.hide();
-            var mediaType = parseInt($('.media_type_selector.selected').attr('data-selection-id')),
+            var mediaType = parseInt($('.media_type_selector.selected').data('selection-id')),
                 img = $('#library_empty_image');
             // Remove all classes for when we change between empty media types
             img.removeClass(function() {
                 return $( this ).attr( "class" );
             });
-            // TODO: once the new manual pages are added, change links!
-            $.getJSON( "ajax/library_placeholders.json", function( data ) {
-                var opts = data[mediaType];
-                img.addClass("icon-white " + opts.icon);
-                $('#library_empty_text').html(
-                    $.i18n._("You haven't added any " + opts.media + ".")
-                    + "<br/>" + $.i18n._(opts.subtext)
-                    + "<br/><a target='_blank' href='" + opts.href + "'>" + $.i18n._("Learn about " + opts.media) + "</a>"
-                );
-            });
+
+            var opts = AIRTIME.library.placeholder(mediaType);
+            img.addClass("icon-white " + opts.icon);
+            $('#library_empty_text').html(
+                $.i18n._("You haven't added any " + opts.media + ".")
+                + "<br/>" + $.i18n._(opts.subtext)
+                + "<br/><a target='_blank' href='" + opts.href + "'>" + $.i18n._("Learn about " + opts.media) + "</a>"
+            );
 
             libEmpty.show();
         } else {
@@ -333,13 +331,13 @@ var AIRTIME = (function(AIRTIME) {
                     return;
                 }
 
-                var selection = $(".media_type_selector.selected").attr("data-selection-id");
+                var selection = $(".media_type_selector.selected").data("selection-id");
 
-                if (selection == 2) {
+                if (selection == AIRTIME.library.MediaTypeEnum.PLAYLIST) {
                     AIRTIME.playlist.fnNew();
-                } else if (selection == 3) {
+                } else if (selection == AIRTIME.library.MediaTypeEnum.BLOCK) {
                     AIRTIME.playlist.fnNewBlock();
-                } else if (selection == 4) {
+                } else if (selection == AIRTIME.library.MediaTypeEnum.WEBSTREAM) {
                     AIRTIME.playlist.fnWsNew();
                 }
             });
diff --git a/airtime_mvc/public/js/airtime/library/library.js b/airtime_mvc/public/js/airtime/library/library.js
index 2c6fe6ad9..760998b00 100644
--- a/airtime_mvc/public/js/airtime/library/library.js
+++ b/airtime_mvc/public/js/airtime/library/library.js
@@ -59,6 +59,67 @@ var AIRTIME = (function(AIRTIME) {
     }
     mod = AIRTIME.library;
 
+    /*  ############################################
+                       CONFIGURATION
+        ############################################ */
+
+    mod.MediaTypeEnum = Object.freeze({
+        DEFAULT: 1,
+        FILE: 1,
+        PLAYLIST: 2,
+        BLOCK: 3,
+        WEBSTREAM: 4,
+        PODCAST: 5
+    });
+
+    // TODO: once the new manual pages are added, change links!
+    mod.placeholder = function(mediaType) {
+        switch (mediaType) {
+            // TODO: remove duplication in a nice way?
+            case MediaTypeEnum.FILE:
+                return {
+                    "media": "tracks",
+                    "icon": "icon-music",
+                    "subtext": "Click 'Upload' to add some now.",
+                    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/add-media/"
+                };
+            case MediaTypeEnum.PLAYLIST:
+                return {
+                    "media": "playlists",
+                    "icon": "icon-list",
+                    "subtext": "Click 'New' to create one now.",
+                    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
+                };
+            case MediaTypeEnum.BLOCK:
+                return {
+                    "media": "smart blocks",
+                    "icon": "icon-time",
+                    "subtext": "Click 'New' to create one now.",
+                    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
+                };
+            case MediaTypeEnum.WEBSTREAM:
+                return {
+                    "media": "webstreams",
+                    "icon": "icon-random",
+                    "subtext": "Click 'New' to create one now.",
+                    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
+                };
+            case MediaTypeEnum.PODCAST:
+                return {
+                    "media": "podcasts",
+                    "icon": "icon-headphones",
+                    "subtext": "Click 'Add' to create one now.",
+                    "href": "http://sourcefabric.booktype.pro/airtime-pro-for-broadcasters/library/"
+                };
+            default:
+                break;
+        }
+    };
+
+    /*  ############################################
+                     END CONFIGURATION
+        ############################################ */
+
     mod.getChosenItemsLength = function(){
         var cItem,
             selected,
@@ -199,10 +260,10 @@ var AIRTIME = (function(AIRTIME) {
     };
 
     mod.checkNewButton = function() {
-        var selected = $(".media_type_selector.selected").attr("data-selection-id"),
+        var selected = $(".media_type_selector.selected").data("selection-id"),
             check = false;
 
-        if (selected != 1) {
+        if (selected != AIRTIME.library.MediaTypeEnum.FILE) {
             check = true;
         }
 
@@ -455,131 +516,13 @@ var AIRTIME = (function(AIRTIME) {
 
         var colReorderMap = new Array();
 
-        $libTable = $libContent.find("table");
+        $libTable = $("#library_display");
 
-        function getTableHeight() {
-            return $libContent.height() - 175;
-        }
+        /*  ############################################
+                            DATATABLES
+            ############################################ */
 
-        function setColumnFilter(oTable){
-            // TODO : remove this dirty hack once js is refactored
-            if (!oTable.fnSettings()) { return ; }
-            var aoCols = oTable.fnSettings().aoColumns;
-            var colsForAdvancedSearch = new Array();
-            var advanceSearchDiv = $("div#advanced_search");
-            advanceSearchDiv.empty();
-            $.each(aoCols, function(i,ele){
-                if (ele.bSearchable) {
-                    var currentColId = ele._ColReorder_iOrigCol;
-
-                    var inputClass = 'filter_column filter_number_text';
-                    var labelStyle = "style='margin-right:35px;'";
-                    if (libraryColumnTypes[ele.mDataProp] != "s") {
-                        inputClass = 'filterColumn filter_number_range';
-                        labelStyle = "";
-                    }
-
-                    if (ele.bVisible) {
-                        advanceSearchDiv.append(
-                            "<div id='advanced_search_col_"+currentColId+"' class='control-group'>" +
-                            "<label class='control-label'"+labelStyle+">"+ele.sTitle+"</label>" +
-                            "<div id='"+ele.mDataProp+"' class='controls "+inputClass+"'></div>" +
-                            "</div>");
-                    } else {
-                        advanceSearchDiv.append(
-                            "<div id='advanced_search_col_"+currentColId+"' class='control-group' style='display:none;'>" +
-                            "<label class='control-label'"+labelStyle+">"+ele.sTitle+"</label>" +
-                            "<div id='"+ele.mDataProp+"' class='controls "+inputClass+"'></div>" +
-                            "</div>");
-                    }
-
-                    if (libraryColumnTypes[ele.mDataProp] == "s") {
-                        var obj = { sSelector: "#"+ele.mDataProp }
-                    } else {
-                        var obj = { sSelector: "#"+ele.mDataProp, type: "number-range" }
-                    }
-                    colsForAdvancedSearch.push(obj);
-                } else {
-                    colsForAdvancedSearch.push(null);
-                }
-            });
-
-            oTable.columnFilter({
-                    aoColumns: colsForAdvancedSearch,
-                    bUseColVis: true,
-                    sPlaceHolder: "head:before"
-                }
-            );
-        }
-
-        function setFilterElement(iColumn, bVisible){
-            var actualId = colReorderMap[iColumn];
-            var selector = "div#advanced_search_col_"+actualId;
-            var $el = $(selector);
-
-            if (bVisible) {
-                $el.show();
-            } else {
-                $el.hide();
-            }
-        }
-
-        function getLibraryDatatableStrings() {
-            //Set up the datatables string translation table with different strings depending on
-            //whether you're viewing files, playlists, smart blocks, etc.
-            var type = parseInt($(".media_type_selector.selected").attr("data-selection-id"));
-            type = (type === undefined) ? 1 : type;
-
-            //FIXME: The code that calls this function doesn't work as intended because you can't
-            //       change the oLanguage property of a datatable dynamically. :(
-
-            switch (type) {
-                /*
-                 case 0:
-                 return getDatatablesStrings({
-                 "sEmptyTable": $.i18n._("No files found"),
-                 });
-                 break;
-                 case 1:
-                 return getDatatablesStrings({
-                 "sEmptyTable": $.i18n._("No playlists found"),
-                 });
-                 break;
-                 case 2:
-                 return getDatatablesStrings({
-                 "sEmptyTable": $.i18n._("No smart blocks found"),
-                 });
-                 break;*/
-                default:
-                    return getDatatablesStrings({
-                        "sEmptyTable": $.i18n._(""),
-                        "sZeroRecords": $.i18n._("No matching results found.")
-                        //"oPaginate": {
-                        //    "sFirst":    "<<",
-                        //    "sLast":     ">>",
-                        //    "sNext":     ">",
-                        //    "sPrevious": "<"
-                        //}
-                    });
-                    break;
-            }
-
-        }
-
-        function handleAjaxError(r) {
-            // If the request was denied due to permissioning
-            if (r.status === 403) {
-                // Hide the processing div
-                $("#library_display_wrapper").find(".dt-process-rel").hide();
-                $.getJSON( "ajax/library_placeholders.json", function( data ) {
-                    $('#library_empty_text').text($.i18n._(data.unauthorized));
-                })  ;
-
-                $('#library_empty').show();
-            }
-        }
-
-        oTable = $libTable.dataTable( {
+        mod.libraryDataTable = $libTable.dataTable({
 
             // put hidden columns at the top to insure they can never be visible
             // on the table through column reordering.
@@ -688,10 +631,10 @@ var AIRTIME = (function(AIRTIME) {
                 oData.iCreate = parseInt(oData.iCreate, 10);
             },
 
-            "sAjaxSource": baseUrl+"Library/contents-feed",
+            "sAjaxSource": baseUrl + "Library/contents-feed",
             "sAjaxDataProp": "files",
 
-            "fnServerData": function ( sSource, aoData, fnCallback ) {
+            "fnServerData": function (sSource, aoData, fnCallback) {
                 /*
                  * The real validation check is done in
                  * dataTables.columnFilter.js We also need to check it here
@@ -702,13 +645,13 @@ var AIRTIME = (function(AIRTIME) {
                 var advSearchFields = $("div#advanced_search").children(':visible');
                 var advSearchValid = validateAdvancedSearch(advSearchFields);
                 var type;
-                aoData.push( { name: "format", value: "json"} );
-                aoData.push( { name: "advSearch", value: advSearchValid} );
+                aoData.push({name: "format", value: "json"});
+                aoData.push({name: "advSearch", value: advSearchValid});
 
                 // push whether to search files/playlists or all.
-                type = $(".media_type_selector.selected").attr("data-selection-id");
-                type = (type === undefined) ? 1 : type;
-                aoData.push( { name: "type", value: type} );
+                type = $(".media_type_selector.selected").data("selection-id");
+                type = (type === undefined) ? AIRTIME.library.MediaTypeEnum.DEFAULT : type;
+                aoData.push({name: "type", value: type});
 
                 //getUsabilityHint();
 
@@ -719,7 +662,7 @@ var AIRTIME = (function(AIRTIME) {
                     "data": aoData,
                     "success": fnCallback,
                     "error": handleAjaxError
-                }).done(function(data) {
+                }).done(function (data) {
                     if (data.iTotalRecords > data.iTotalDisplayRecords) {
                         $('#filter_message').text(
                             $.i18n._("Filtering out ") + (data.iTotalRecords - data.iTotalDisplayRecords)
@@ -736,25 +679,25 @@ var AIRTIME = (function(AIRTIME) {
                 });
             },
             "fnRowCallback": AIRTIME.library.fnRowCallback,
-            "fnCreatedRow": function( nRow, aData, iDataIndex ) {
+            "fnCreatedRow": function (nRow, aData, iDataIndex) {
                 // add checkbox
-                $(nRow).find('td.library_checkbox').html("<input type='checkbox' name='cb_"+aData.id+"'>");
+                $(nRow).find('td.library_checkbox').html("<input type='checkbox' name='cb_" + aData.id + "'>");
 
                 $(nRow).find('td.library_actions')
                     .text("...")
-                    .on('click', function(e) {
+                    .on('click', function (e) {
                         $(this).contextMenu({x: $(e.target).offset().left, y: $(e.target).offset().top})
                     }).html("<div class='library_actions_btn'>...</div>");
 
                 // add audio preview image/button
                 if (aData.ftype === "audioclip") {
-                    $(nRow).find('td.library_type').html('<img title="'+$.i18n._("Track preview")+'" src="'+baseUrl+'css/images/icon_audioclip.png">');
+                    $(nRow).find('td.library_type').html('<img title="' + $.i18n._("Track preview") + '" src="' + baseUrl + 'css/images/icon_audioclip.png">');
                 } else if (aData.ftype === "playlist") {
-                    $(nRow).find('td.library_type').html('<img title="'+$.i18n._("Playlist preview")+'" src="'+baseUrl+'css/images/icon_playlist.png">');
+                    $(nRow).find('td.library_type').html('<img title="' + $.i18n._("Playlist preview") + '" src="' + baseUrl + 'css/images/icon_playlist.png">');
                 } else if (aData.ftype === "block") {
-                    $(nRow).find('td.library_type').html('<img title="'+$.i18n._("Smart Block")+'" src="'+baseUrl+'css/images/icon_smart-block.png">');
+                    $(nRow).find('td.library_type').html('<img title="' + $.i18n._("Smart Block") + '" src="' + baseUrl + 'css/images/icon_smart-block.png">');
                 } else if (aData.ftype === "stream") {
-                    $(nRow).find('td.library_type').html('<img title="'+$.i18n._("Webstream preview")+'" src="'+baseUrl+'css/images/icon_webstream.png">');
+                    $(nRow).find('td.library_type').html('<img title="' + $.i18n._("Webstream preview") + '" src="' + baseUrl + 'css/images/icon_webstream.png">');
                 }
 
                 if (aData.is_scheduled) {
@@ -769,8 +712,8 @@ var AIRTIME = (function(AIRTIME) {
                 }
 
                 // add the play function to the library_type td
-                $(nRow).find('td.library_type').click(function(){
-                    if (aData.ftype === 'playlist' && aData.length !== '0.0'){
+                $(nRow).find('td.library_type').click(function () {
+                    if (aData.ftype === 'playlist' && aData.length !== '0.0') {
                         open_playlist_preview(aData.audioFile, 0);
                     } else if (aData.ftype === 'audioclip') {
                         if (isAudioSupported(aData.mime)) {
@@ -787,7 +730,7 @@ var AIRTIME = (function(AIRTIME) {
                 });
             },
             // remove any selected nodes before the draw.
-            "fnPreDrawCallback": function( oSettings ) {
+            "fnPreDrawCallback": function (oSettings) {
 
                 // make sure any dragging helpers are removed or else they'll be
                 // stranded on the screen.
@@ -822,6 +765,143 @@ var AIRTIME = (function(AIRTIME) {
 
         });
 
+        /* TODO: implement podcast datatable
+         * mod.podcastDataTable = $("#podcast_table").dataTable({});
+         */
+        mod.podcastDataTable = mod.libraryDataTable;
+
+        /*  ############################################
+                          END DATATABLES
+            ############################################ */
+
+        function getTableHeight() {
+            return $libContent.height() - 175;
+        }
+
+        function setColumnFilter(oTable){
+            // TODO : remove this dirty hack once js is refactored
+            if (!oTable.fnSettings()) { return ; }
+            var aoCols = oTable.fnSettings().aoColumns;
+            var colsForAdvancedSearch = new Array();
+            var advanceSearchDiv = $("div#advanced_search");
+            advanceSearchDiv.empty();
+            $.each(aoCols, function(i,ele){
+                if (ele.bSearchable) {
+                    var currentColId = ele._ColReorder_iOrigCol;
+
+                    var inputClass = 'filter_column filter_number_text';
+                    var labelStyle = "style='margin-right:35px;'";
+                    if (libraryColumnTypes[ele.mDataProp] != "s") {
+                        inputClass = 'filterColumn filter_number_range';
+                        labelStyle = "";
+                    }
+
+                    if (ele.bVisible) {
+                        advanceSearchDiv.append(
+                            "<div id='advanced_search_col_"+currentColId+"' class='control-group'>" +
+                            "<label class='control-label'"+labelStyle+">"+ele.sTitle+"</label>" +
+                            "<div id='"+ele.mDataProp+"' class='controls "+inputClass+"'></div>" +
+                            "</div>");
+                    } else {
+                        advanceSearchDiv.append(
+                            "<div id='advanced_search_col_"+currentColId+"' class='control-group' style='display:none;'>" +
+                            "<label class='control-label'"+labelStyle+">"+ele.sTitle+"</label>" +
+                            "<div id='"+ele.mDataProp+"' class='controls "+inputClass+"'></div>" +
+                            "</div>");
+                    }
+
+                    if (libraryColumnTypes[ele.mDataProp] == "s") {
+                        var obj = { sSelector: "#"+ele.mDataProp }
+                    } else {
+                        var obj = { sSelector: "#"+ele.mDataProp, type: "number-range" }
+                    }
+                    colsForAdvancedSearch.push(obj);
+                } else {
+                    colsForAdvancedSearch.push(null);
+                }
+            });
+
+            oTable.columnFilter({
+                    aoColumns: colsForAdvancedSearch,
+                    bUseColVis: true,
+                    sPlaceHolder: "head:before"
+                }
+            );
+        }
+
+        function setFilterElement(iColumn, bVisible){
+            var actualId = colReorderMap[iColumn];
+            var selector = "div#advanced_search_col_"+actualId;
+            var $el = $(selector);
+
+            if (bVisible) {
+                $el.show();
+            } else {
+                $el.hide();
+            }
+        }
+
+        function getLibraryDatatableStrings() {
+            //Set up the datatables string translation table with different strings depending on
+            //whether you're viewing files, playlists, smart blocks, etc.
+            var type = parseInt($(".media_type_selector.selected").data("selection-id"));
+            type = (type === undefined) ? AIRTIME.library.MediaTypeEnum.DEFAULT : type;
+
+            //FIXME: The code that calls this function doesn't work as intended because you can't
+            //       change the oLanguage property of a datatable dynamically. :(
+
+            switch (type) {
+                /*
+                 case 0:
+                 return getDatatablesStrings({
+                 "sEmptyTable": $.i18n._("No files found"),
+                 });
+                 break;
+                 case 1:
+                 return getDatatablesStrings({
+                 "sEmptyTable": $.i18n._("No playlists found"),
+                 });
+                 break;
+                 case 2:
+                 return getDatatablesStrings({
+                 "sEmptyTable": $.i18n._("No smart blocks found"),
+                 });
+                 break;*/
+                default:
+                    return getDatatablesStrings({
+                        "sEmptyTable": $.i18n._(""),
+                        "sZeroRecords": $.i18n._("No matching results found.")
+                        //"oPaginate": {
+                        //    "sFirst":    "<<",
+                        //    "sLast":     ">>",
+                        //    "sNext":     ">",
+                        //    "sPrevious": "<"
+                        //}
+                    });
+                    break;
+            }
+
+        }
+
+        function handleAjaxError(r) {
+            // If the request was denied due to permissioning
+            if (r.status === 403) {
+                // Hide the processing div
+                $("#library_display_wrapper").find(".dt-process-rel").hide();
+                $('#library_empty_text').text($.i18n._("You don't have permission to view the library."));
+
+                $('#library_empty').show();
+            }
+        }
+
+        var selected = $("a[href$='"+location.hash+"']");
+        if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeEnum.PODCAST) {
+            $("#library_display_wrapper").hide();
+            oTable = mod.podcastDataTable.show();
+        } else {
+            oTable = mod.libraryDataTable;
+        }
+
         setColumnFilter(oTable);
         oTable.fnSetFilteringDelay(350);
 
diff --git a/airtime_mvc/public/js/airtime/library/plupload.js b/airtime_mvc/public/js/airtime/library/plupload.js
index b8f1d2a32..21a92de9f 100644
--- a/airtime_mvc/public/js/airtime/library/plupload.js
+++ b/airtime_mvc/public/js/airtime/library/plupload.js
@@ -37,90 +37,13 @@ $(document).ready(function () {
                 self.recentUploadsTable.fnDraw(); //Only works because we're using bServerSide
                 //In DataTables 1.10 and greater, we can use .fnAjaxReload()
             });
-            this.on("complete", function() {
+
+            this.on("queuecomplete", function() {
                 uploadProgress = false;
             });
         }
     };
 
-    /*
-     var uploader = new plupload.Uploader({
-     runtimes: 'html5, flash, html4',
-     browse_button: 'pickfiles',
-     container: $("#container"),
-     url :  baseUrl+'rest/media',
-     filters : [
-     {title: "Audio Files", extensions: "ogg,mp3,oga,flac,wav,m4a,mp4,opus,aac,oga,mp1,mp2,wma,au"}
-     ],
-     multipart_params : {
-     "csrf_token" : $("#csrf").attr('value')
-     },
-
-     init: {
-     PostInit: function() {
-     document.getElementById('filelist').innerHTML = '';
-
-     document.getElementById('uploadfiles').onclick = function() {
-     uploader.start();
-     return false;
-     };
-     },
-
-     FilesAdded: function(up, files) {
-     plupload.each(files, function(file) {
-     document.getElementById('filelist').innerHTML += '<div id="' + file.id + '">' + file.name + ' (' + plupload.formatSize(file.size) + ') <b></b></div>';
-     });
-     },
-
-     UploadProgress: function(up, file) {
-     document.getElementById(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
-     },
-
-     Error: function(up, err) {
-     document.getElementById('console').innerHTML += "\nError #" + err.code + ": " + err.message;
-     }
-     }
-     });
-
-     uploader.init();
-     */
-
-
-    /*
-     $("#plupload_files").pluploadQueue({
-     // General settings
-     runtimes        : 'gears, html5, html4',
-     url             :  baseUrl+'rest/media',
-     //chunk_size      : '5mb', //Disabling chunking since we're using the File Upload REST API now
-     unique_names    : 'true',
-     multiple_queues : 'true',
-     filters : [
-     {title: "Audio Files", extensions: "ogg,mp3,oga,flac,wav,m4a,mp4,opus,aac,oga,mp1,mp2,wma,au"}
-     ],
-     multipart_params : {
-     "csrf_token" : $("#csrf").attr('value'),
-     }
-     });
-
-     uploader = $("#plupload_files").pluploadQueue();
-
-     uploader.bind('FileUploaded', function(up, file, json)
-     {
-     //Refresh the upload table:
-     self.recentUploadsTable.fnDraw(); //Only works because we're using bServerSide
-     //In DataTables 1.10 and greater, we can use .fnAjaxReload()
-     });
-
-     var uploadProgress = false;
-
-     uploader.bind('QueueChanged', function(){
-     uploadProgress = (uploader.files.length > 0);
-     });
-
-     uploader.bind('UploadComplete', function(){
-     uploadProgress = false;
-     });*/
-
     $(window).bind('beforeunload', function () {
         if (uploadProgress) {
             return sprintf($.i18n._("You are currently uploading files. %sGoing to another screen will cancel the upload process. %sAre you sure you want to leave the page?"),
@@ -173,11 +96,11 @@ $(document).ready(function () {
     });
 
     self.setupRecentUploadsTable = function () {
-        recentUploadsTable = $("#recent_uploads_table").dataTable({
+        return $("#recent_uploads_table").dataTable({
             "bJQueryUI": true,
             "bProcessing": false,
             "bServerSide": true,
-            "sAjaxSource": '/Plupload/recent-uploads/format/json',
+            "sAjaxSource": '/plupload/recent-uploads/format/json',
             "sAjaxDataProp": 'files',
             "bSearchable": false,
             "bInfo": true,
@@ -221,11 +144,13 @@ $(document).ready(function () {
                                 areAnyFileImportsPending = true;
                             }
                         }
+
                         if (areAnyFileImportsPending) {
                             //alert("pending uploads, starting refresh on timer");
                             self.startRefreshingRecentUploads();
-                        } else {
+                        } else if (self.isRecentUploadsRefreshTimerActive) {
                             self.stopRefreshingRecentUploads();
+                            self.recentUploadsTable.fnDraw();
                         }
 
                         // Update usability hint - in common.js
@@ -239,7 +164,7 @@ $(document).ready(function () {
                         var sw = $(this)[0].scrollWidth, iw = $(this).innerWidth();
                         if (sw > iw) {
                             $(this).stop().animate({
-                                textIndent: "-" + (sw + 2 - iw) + "px"
+                                textIndent: "-" + (sw - iw) + "px"
                             }, sw * 8);
                         }
                     },
@@ -251,37 +176,41 @@ $(document).ready(function () {
                 );
             }
         });
-
-        return recentUploadsTable;
     };
 
+    self.isRecentUploadsRefreshTimerActive = false;
+
     self.startRefreshingRecentUploads = function () {
-        if (self.isRecentUploadsRefreshTimerActive()) { //Prevent multiple timers from running
-            return;
+        if (!self.isRecentUploadsRefreshTimerActive) { //Prevent multiple timers from running
+            self.recentUploadsRefreshTimer = setInterval(function() {
+                self.recentUploadsTable.fnDraw();
+            }, 3000);
+            self.isRecentUploadsRefreshTimerActive = true;
         }
-        self.recentUploadsRefreshTimer = setInterval("self.recentUploadsTable.fnDraw()", 3000);
-    };
-
-    self.isRecentUploadsRefreshTimerActive = function () {
-        return (self.recentUploadsRefreshTimer != null);
     };
 
     self.stopRefreshingRecentUploads = function () {
         clearInterval(self.recentUploadsRefreshTimer);
-        self.recentUploadsRefreshTimer = null;
+        self.isRecentUploadsRefreshTimerActive = false;
     };
 
     $("#upload_status_all").click(function () {
-        self.uploadFilter = "all";
-        self.recentUploadsTable.fnPageChange(0).fnDraw();
+        if (self.uploadFilter !== "all") {
+            self.uploadFilter = "all";
+            self.recentUploadsTable.fnPageChange(0).fnDraw();
+        }
     });
     $("#upload_status_pending").click(function () {
-        self.uploadFilter = "pending";
-        self.recentUploadsTable.fnPageChange(0).fnDraw();
+        if (self.uploadFilter !== "pending") {
+            self.uploadFilter = "pending";
+            self.recentUploadsTable.fnPageChange(0).fnDraw();
+        }
     });
     $("#upload_status_failed").click(function () {
-        self.uploadFilter = "failed";
-        self.recentUploadsTable.fnPageChange(0).fnDraw();
+        if (self.uploadFilter !== "failed") {
+            self.uploadFilter = "failed";
+            self.recentUploadsTable.fnPageChange(0).fnDraw();
+        }
     });
 
     //Create the recent uploads table.
diff --git a/airtime_mvc/public/js/airtime/showbuilder/main_builder.js b/airtime_mvc/public/js/airtime/showbuilder/main_builder.js
index e114d677e..6ea091420 100644
--- a/airtime_mvc/public/js/airtime/showbuilder/main_builder.js
+++ b/airtime_mvc/public/js/airtime/showbuilder/main_builder.js
@@ -137,8 +137,24 @@ AIRTIME = (function(AIRTIME) {
         });
 
         $(window).on('hashchange', function() {
-            var selected = $("a[href$='"+location.hash+"']");
-            var dashboardLink = $(".media_type_selector:first");
+            var selected = $("a[href$='"+location.hash+"']"),
+                dashboardLink = $(".media_type_selector:first"),
+                t;
+
+            if (selected.parent().data("selection-id") == AIRTIME.library.MediaTypeEnum.PODCAST) {
+                $("#library_display_wrapper").hide();
+                $("#podcast_table").show();
+
+                t = AIRTIME.library.podcastDataTable;
+            } else {
+                if (typeof oTable === 'undefined') {
+                    oTable = AIRTIME.library.libraryDataTable;
+                }
+
+                $("#library_display_wrapper").show();
+                $("#podcast_table").hide();
+                t = oTable;
+            }
 
             dashboardLink.find("a").attr("href", selected.attr("href"));
             AIRTIME.library.selectNone();
@@ -146,7 +162,7 @@ AIRTIME = (function(AIRTIME) {
                 $(this).removeClass("selected");
             });
             selected.parent().addClass("selected");
-            oTable.fnDraw();
+            t.fnDraw();
             $("#library_filter").text(selected.text());
             // Highlight the dashboard link
             dashboardLink.addClass("highlight");