From 0710accbe2d342a74115ad8d564369f63ac478d8 Mon Sep 17 00:00:00 2001
From: Duncan Sommerville <duncan.sommerville@gmail.com>
Date: Fri, 18 Sep 2015 18:29:50 -0400
Subject: [PATCH] SAAS-1062 - more work on podcasting frontend

---
 .../controllers/plugins/Acl_plugin.php        |  6 ++++
 .../views/scripts/podcast/podcast.phtml       |  4 +--
 .../scripts/podcast/podcast_url_dialog.phtml  |  2 +-
 airtime_mvc/public/css/dashboard.css          |  2 +-
 airtime_mvc/public/css/styles.css             | 13 ++++++++-
 .../public/js/airtime/library/podcast.js      | 29 +++++++++++++++++--
 6 files changed, 48 insertions(+), 8 deletions(-)

diff --git a/airtime_mvc/application/controllers/plugins/Acl_plugin.php b/airtime_mvc/application/controllers/plugins/Acl_plugin.php
index 06f84b834..923b2cf05 100644
--- a/airtime_mvc/application/controllers/plugins/Acl_plugin.php
+++ b/airtime_mvc/application/controllers/plugins/Acl_plugin.php
@@ -169,6 +169,12 @@ class Zend_Controller_Plugin_Acl extends Zend_Controller_Plugin_Abstract
             // we need to check the CSRF token
             if ($_SERVER['REQUEST_METHOD'] != "GET" && $request->getModuleName() == "rest") {
                 $token = $request->getParam("csrf_token");
+                // PUT requests don't parameterize the data in the body, so we can't
+                // fetch it with getParam or getPost; instead we have to parse the body and
+                // check for the token in the JSON. (Hopefully we can find a better way to do this) -- Duncan
+                if (empty($token)) {
+                    $token = json_decode($this->getRequest()->getRawBody(), true)["csrf_token"];
+                }
                 $tokenValid = $this->verifyCSRFToken($token);
 
                 if (!$tokenValid) {
diff --git a/airtime_mvc/application/views/scripts/podcast/podcast.phtml b/airtime_mvc/application/views/scripts/podcast/podcast.phtml
index eb95e5987..70dddfc12 100644
--- a/airtime_mvc/application/views/scripts/podcast/podcast.phtml
+++ b/airtime_mvc/application/views/scripts/podcast/podcast.phtml
@@ -1,4 +1,4 @@
-<div id="podcast-wrapper" ng-controller="RestController">
+<div class="podcast-wrapper" ng-controller="RestController">
     <div class="inner_editor_title">
         <h2>
             <?php echo _("Editing ") ?>"<span ng-bind="podcast.title" class="title_obj_name"></span>"
@@ -29,6 +29,6 @@
                 <?php echo _("Save") ?>
             </button>
         </div>
-        <div id='sp-success' class='success' style='display:none'></span></div>
+        <div class='success' style='display:none'></span></div>
     </div>
 </div>
\ No newline at end of file
diff --git a/airtime_mvc/application/views/scripts/podcast/podcast_url_dialog.phtml b/airtime_mvc/application/views/scripts/podcast/podcast_url_dialog.phtml
index 0edcf4b4c..4494c297e 100644
--- a/airtime_mvc/application/views/scripts/podcast/podcast_url_dialog.phtml
+++ b/airtime_mvc/application/views/scripts/podcast/podcast_url_dialog.phtml
@@ -1,5 +1,5 @@
 <div id="podcast_url_dialog">
-    <form>
+    <form name="podcast_url_form">
         <?php echo $this->csrf ?>
         <label>
             Podcast URL
diff --git a/airtime_mvc/public/css/dashboard.css b/airtime_mvc/public/css/dashboard.css
index dcc99944b..70598fafd 100644
--- a/airtime_mvc/public/css/dashboard.css
+++ b/airtime_mvc/public/css/dashboard.css
@@ -463,7 +463,7 @@ li.ui-state-default {
     font-size: 14px;
 }
 
-.editor_pane_wrapper {
+.editor_pane_wrapper, .podcast-wrapper {
     display: -webkit-box;
     display: -moz-box;
     display: -ms-flexbox;
diff --git a/airtime_mvc/public/css/styles.css b/airtime_mvc/public/css/styles.css
index 0780d3b44..2ed387b9c 100644
--- a/airtime_mvc/public/css/styles.css
+++ b/airtime_mvc/public/css/styles.css
@@ -3914,5 +3914,16 @@ li .ui-state-hover {
     float: left;
 }
 
+/* Podcasts */
 
-
+.podcast-wrapper > .dataTables_wrapper {
+    position: relative;
+    height: 100%;
+    float: left;
+    flex: 1 100%;
+    margin: 4px 0;
+    min-height: 0;
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+}
\ No newline at end of file
diff --git a/airtime_mvc/public/js/airtime/library/podcast.js b/airtime_mvc/public/js/airtime/library/podcast.js
index e80b927ca..6ec1f2472 100644
--- a/airtime_mvc/public/js/airtime/library/podcast.js
+++ b/airtime_mvc/public/js/airtime/library/podcast.js
@@ -7,9 +7,8 @@ var podcastApp = angular.module('podcast', [])
         AIRTIME.tabs.setActiveTabName($scope.podcast.title);
 
         $scope.put = function() {
-            $http.put(endpoint + $scope.podcast.id, { csrf_token: $("#csrf").val(), podcast: $scope.podcast })
+            $http.put(endpoint + $scope.podcast.id, { csrf_token: jQuery("#csrf").val(), podcast: $scope.podcast })
                 .success(function() {
-                    AIRTIME.tabs.setActiveTabName($scope.podcast.title);
                     // TODO
                 });
         };
@@ -43,7 +42,7 @@ var AIRTIME = (function (AIRTIME) {
 
     function _bootstrapAngularApp(podcast) {
         podcastApp.value('podcast', JSON.parse(podcast));
-        angular.bootstrap(document.getElementById("podcast-wrapper"), ["podcast"]);
+        angular.bootstrap(AIRTIME.tabs.getActiveTab().find(".podcast-wrapper").get(0), ["podcast"]);
     }
 
     mod.createUrlDialog = function() {
@@ -64,6 +63,7 @@ var AIRTIME = (function (AIRTIME) {
             AIRTIME.tabs.openTab(json, AIRTIME.podcast.init);
             _bootstrapAngularApp(json.podcast);
             $("#podcast_url_dialog").dialog("close");
+            mod.initPodcastEpisodeDatatable(JSON.parse(el.podcast).episodes);
         });
     };
 
@@ -72,6 +72,7 @@ var AIRTIME = (function (AIRTIME) {
             json.forEach(function(el) {
                 AIRTIME.tabs.openTab(el, AIRTIME.podcast.init);
                 _bootstrapAngularApp(el.podcast);
+                mod.initPodcastEpisodeDatatable(JSON.parse(el.podcast).episodes);
             });
         });
     };
@@ -110,5 +111,27 @@ var AIRTIME = (function (AIRTIME) {
         });
     };
 
+    mod.initPodcastEpisodeDatatable = function(episodes) {
+        var aoColumns = [
+            /* Title */           { "sTitle" : $.i18n._("Title")              , "mDataProp" : "title"  , "sClass"      : "library_title"       , "sWidth"      : "170px"                 },
+        ];
+
+        var podcastToolbarButtons = AIRTIME.widgets.Table.getStandardToolbarButtons();
+
+        // Set up the div with id "podcast_table" as a datatable.
+        mod.podcastEpisodesTableWidget = new AIRTIME.widgets.Table(
+            AIRTIME.tabs.getActiveTab().find('.podcast_episodes'), // DOM node to create the table inside.
+            true,                // Enable item selection
+            podcastToolbarButtons, // Toolbar buttons
+            {                    // Datatables overrides.
+                'aoColumns' : aoColumns,
+                'bServerSide': false,
+                'sAjaxSource' : null,
+                'aaData' : episodes
+            });
+
+        mod.podcastEpisodesDatatable = mod.podcastEpisodesTableWidget.getDatatable();
+    };
+
     return AIRTIME;
 }(AIRTIME || {}));