CC-1939 Ability to edit name & description of a playlist, display the description somewhere

now can edit title/description of a playlist without leaving the main playlist builder screen

airtime_mvc/application/controllers/LibraryController.php

@@ -103,11 +103,7 @@ class LibraryController extends Zend_Controller_Action
                                 'title' => 'Close');
             }
 
-            $menu[] = array('action' => array('type' => 'ajax', 'url' => '/Playlist/metadata/format/json/id/#id#', 'callback' => 'window["createPlaylistMetaForm"]'), 
+            //$menu[] = array('action' => array('type' => 'ajax', 'url' => '/Playlist/metadata/format/json/id/#id#', 'callback' => 'window["createPlaylistMetaForm"]'), 'title' => 'Edit Metadata');
-                            'title' => 'Edit Metadata');
-
-            //$menu[] = array('action' => array('type' => 'ajax', 'url' => '/Playlist/delete'.$params, 'callback' => 'window["deletePlaylist"]'), 
-            //                'title' => 'Delete');
 
             $menu[] = array('action' => array('type' => 'fn',
                     'callback' => "window['confirmDeletePlaylist']('$paramsPop')"),

airtime_mvc/application/controllers/PlaylistController.php

@@ -20,6 +20,8 @@ class PlaylistController extends Zend_Controller_Action
 					->addActionContext('delete-active', 'json')
 					->addActionContext('delete', 'json')
                     ->addActionContext('set-playlist-fades', 'json')
+                    ->addActionContext('set-playlist-name', 'json')
+					->addActionContext('set-playlist-description', 'json')
                     ->initContext();
 
         $this->pl_sess = new Zend_Session_Namespace(UI_PLAYLIST_SESSNAME);
@@ -175,6 +177,7 @@ class PlaylistController extends Zend_Controller_Action
 			$this->view->html = $this->view->render('playlist/update.phtml');
 			$this->view->name = $pl->getName();
 			$this->view->length = $pl->getLength();
+            $this->view->description = $pl->getDescription();
 
 			unset($this->view->pl);
 			return;
@@ -195,6 +198,7 @@ class PlaylistController extends Zend_Controller_Action
 		$this->view->html = $this->view->render('playlist/update.phtml');
 		$this->view->name = $pl->getName();
 		$this->view->length = $pl->getLength();
+        $this->view->description = $pl->getDescription();
 
 		unset($this->view->pl);
     }
@@ -220,6 +224,7 @@ class PlaylistController extends Zend_Controller_Action
 		$this->view->html = $this->view->render('playlist/update.phtml');
 		$this->view->name = $pl->getName();
 		$this->view->length = $pl->getLength();
+        $this->view->description = $pl->getDescription();
 
 		unset($this->view->pl);
 
@@ -341,6 +346,31 @@ class PlaylistController extends Zend_Controller_Action
 		$this->view->fadeOut = $fades[1];
     }
 
+    public function setPlaylistNameAction()
+    {
+        $name = $this->_getParam('name', 'Unknown Playlist');
+
+        $pl = $this->getPlaylist();
+        $pl->setName($name);
+
+        $this->view->playlistName = $name;
+    }
+
+    public function setPlaylistDescriptionAction()
+    {
+        $description = $this->_getParam('description', false);
+        $pl = $this->getPlaylist();
+
+        if($description != false) {
+            $pl->setDescription($description);
+        }
+        else {
+            $description = $pl->getDescription();
+        }
+
+        $this->view->playlistDescription = $description;
+    }
+
 
 }
 

airtime_mvc/application/models/Playlist.php

@@ -201,6 +201,30 @@ class Playlist {
         return $pl->getDbName();
     }
 
+    public function setDescription($p_description)
+    {
+        $pl = CcPlaylistQuery::create()->findPK($this->id);
+
+    	if($pl === NULL)
+    	    return FALSE;
+
+    	$pl->setDbDescription($p_description);
+    	$pl->setDbMtime(new DateTime("now"));
+    	$pl->save();
+
+        //$this->name = $p_newname;
+        return TRUE;
+    }
+
+    public function getDescription()
+    {
+        $pl = CcPlaylistQuery::create()->findPK($this->id);
+        if ($pl === NULL)
+    	    return FALSE;
+
+        return $pl->getDbDescription();
+    }
+
 	/**
      * Set state of virtual playlist
      *

airtime_mvc/application/views/scripts/playlist/index.phtml

@@ -1,35 +1,55 @@
 <button id="spl_new" class="ui-button" role="button" aria-disabled="false">New</button>
 <?php if (isset($this->pl)) : ?>
-<button id="spl_delete" class="ui-button" role="button" aria-disabled="false">Delete</button>
+    <button id="spl_delete" class="ui-button" role="button" aria-disabled="false">Delete</button>
-<a href="#" id="spl_crossfade" class="ui-button ui-button-icon-only ui-widget ui-state-default crossfade-main-button">
+    <a href="#" id="spl_crossfade" class="ui-button ui-button-icon-only ui-widget ui-state-default crossfade-main-button">
-    <span class="ui-icon crossfade-main-icon"></span><span class="ui-button-text">Playlist crossfade</span>
+        <span class="ui-icon crossfade-main-icon"></span><span class="ui-button-text">Playlist crossfade</span>
-</a>
+    </a>
-<button id="spl_close" class="ui-button right-floated" role="button" aria-disabled="false">Done Editing</button>
+    <button id="spl_close" class="ui-button right-floated" role="button" aria-disabled="false">Done Editing</button>
 <?php endif; ?>
 
 <?php if (isset($this->pl)) : ?>
-<h3 id="spl_name"><?php echo $this->pl->getName(); ?></h3>
+    <div class="playlist_title">
-<h4 id="spl_length"><?php echo $this->pl->getLength(); ?></h4>
+        <h3 id="spl_name">
+            <a id="playlist_name_display"><?php echo $this->pl->getName(); ?></a>
+            <input type="text" maxlength="255" size="40" class="element_hidden" id="playlist_name_input" />
+        </h3>
+        <h4 id="spl_length"><?php echo $this->pl->getLength(); ?></h4>
+    </div>
 
-<div id="crossfade_main" class="crossfade-main clearfix" style="display:none;">
+    <fieldset class="toggle closed" id="fieldset-metadate_change">
-  	<span class="ui-icon ui-icon-closethick"></span>
+        <legend style="cursor: pointer;"><span class="ui-icon ui-icon-triangle-2-n-s"></span>View / edit description</legend>
-	<dl id="spl_editor-main" class="inline-list">
+        <dl class="zend_form">
-        <dt>Fade in:</dt>
+            <dt id="description-label"><label for="description">Description</label></dt>
-        <dd id="spl_fade_in_main"><span contenteditable="true" class="spl_text_input">00:00:00</span></dd>
+            <dd id="description-element">
-        <dd class="edit-error"></dd>
+                <textarea cols="80" rows="24" id="description" name="description"><?php echo $this->pl->getDescription(); ?></textarea>
-        <dt>Fade out:</dt>
+            </dd>
-        <dd id="spl_fade_out_main"><span contenteditable="true" class="spl_text_input">00:00:00</span></dd>
+            <dt id="submit-label" style="display: none;">&nbsp;</dt>
-        <dd class="edit-error"></dd>
+            <dd id="submit-element" class="buttons">
-    </dl>
+                <input class="ui-button ui-state-default" type="submit" value="Cancel" id="description_cancel" name="cancel">
-</div>
+                <input class="ui-button ui-state-default" type="submit" value="Save" id="description_save" name="submit">
+            </dd>
+        </dl>
+    </fieldset>
 
-<div class="clear"></div>
+    <div id="crossfade_main" class="crossfade-main clearfix" style="display:none;">
-<div class="" style="clear:both; float:none; width:100%;">
+      	<span class="ui-icon ui-icon-closethick"></span>
-	<ul id="spl_sortable">	
+	    <dl id="spl_editor-main" class="inline-list">
-        <?php echo $this->render('playlist/update.phtml') ?>
+            <dt>Fade in:</dt>
-	</ul>
+            <dd id="spl_fade_in_main"><span contenteditable="true" class="spl_text_input">00:00:00</span></dd>
-</div>
+            <dd class="edit-error"></dd>
+            <dt>Fade out:</dt>
+            <dd id="spl_fade_out_main"><span contenteditable="true" class="spl_text_input">00:00:00</span></dd>
+            <dd class="edit-error"></dd>
+        </dl>
+    </div>
+
+    <div class="clear"></div>
+    <div class="" style="clear:both; float:none; width:100%;">
+	    <ul id="spl_sortable">
+            <?php echo $this->render('playlist/update.phtml') ?>
+	    </ul>
+    </div>
 
 <?php else : ?>
-<div>No open playlist</div>
+    <div>No open playlist</div>
 <?php endif; ?>

airtime_mvc/public/css/playlist_builder.css

@@ -121,7 +121,7 @@
 	font-size:15px;
 	margin:8px 0 10px 0;
 	padding:0;
-	color:#6e6e6e;
+	color:#4f4f4f;
 	font-weight:normal;
 	clear:both;
 	float:left;
@@ -315,3 +315,123 @@
 	background: transparent url(images/cue_playlist.png) no-repeat 0 -30px;
 	border:none;
 }
+
+/*--/////////////// Changes 16.05.2011 ////////////--*/
+
+.playlist_title {
+	margin: 16px 0 10px 0;
+	height:26px;
+	clear:both;
+}
+#side_playlist .playlist_title h3, #side_playlist .playlist_title h4 {
+    margin: 0;
+    padding: 0;
+}
+#side_playlist .playlist_title h3 {
+	float:left;
+	width:84%;
+}
+#side_playlist .playlist_title h4 {
+	float:right;
+	clear:none;
+	font-size: 16px;
+	padding-top:4px;
+}
+
+#side_playlist .playlist_title h3 a {
+    padding: 0 22px 0 2px;
+	background:url(images/icon_edit_l.png) no-repeat right center;
+	text-decoration:none;
+
+}
+#side_playlist .playlist_title h3 a:hover {
+	background-color:#D8D8D8;
+}
+.element_hidden {
+	display: none;
+}
+#side_playlist .playlist_title h3 input[type="text"] {
+    background-color: #dddddd;
+    border: 1px solid #8F8F8F;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 12px;
+    height: 23px;
+    margin: 0;
+    padding: 0;
+    text-indent: 3px;
+    -moz-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
+    -webkit-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
+    box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
+	width:95%;
+}
+
+#side_playlist .zend_form {
+    margin: 0;
+    padding: 0;
+}
+#side_playlist .zend_form dt, #side_playlist .zend_form dd {
+    display: block;
+    float: none;
+    margin: 4px 0 0;
+    padding: 0;
+	width:100%;
+}
+#side_playlist .zend_form dd.buttons {
+    margin-top: 8px;
+	text-align:right;
+}
+#side_playlist .zend_form dd.buttons .ui-button {
+    margin: 0 0 0 10px;
+}
+
+#side_playlist .zend_form dt {
+	color:#5B5B5B;
+    font-weight: bold;
+    margin: 9px 0 0;
+    padding: 0 2px;
+}
+
+#side_playlist .zend_form dt:first-child {
+    margin-top: 0;
+}
+
+#side_playlist .zend_form dd textarea {
+    background-color: #dddddd;
+    border: 1px solid #5B5B5B;
+    font-family: Arial,Helvetica,sans-serif;
+    font-size: 12px;
+    margin: 0;
+    padding: 2px 0 0 0;
+    text-indent: 3px;
+    -moz-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
+    -webkit-box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
+    box-shadow: inset 0px 2px 2px rgba(0, 0, 0, 0.1);
+	width:99.7%;
+}
+
+#side_playlist fieldset {
+    border: 1px solid #9a9a9a;
+    margin: 0 0 8px 0;
+    padding: 8px;
+}
+#side_playlist fieldset.closed .zend_form{
+	display:none;
+}
+#side_playlist fieldset.closed {
+    border-width: 1px 0 0;
+    margin-bottom: -6px;
+	margin-left:1px;
+}
+fieldset > legend {
+    color: #4f4f4f;
+    font-size: 12px;
+    line-height: 140%;
+}
+.ui-widget-content fieldset legend .ui-icon {
+    float: left;
+	background-image:url(redmond/images/ui-icons_454545_256x240.png);
+}
+#side_playlist .zend_form input, #side_playlist .zend_form textarea {
+    width: auto;
+}
+	

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

@@ -238,6 +238,12 @@ function openCueEditor(event) {
 	});
 }
 
+function redrawDataTablePage() {
+    var dt;
+    dt = $("#library_display").dataTable();
+    dt.fnStandingRedraw();
+}
+
 function setSPLContent(json) {
 
 	if(json.message) {
@@ -245,10 +251,13 @@ function setSPLContent(json) {
 		return;
 	}
 
-	$('#spl_name').empty()
+	$('#spl_name > a').empty()
 		.append(json.name);
 	$('#spl_length').empty()
 		.append(json.length);
+    $('#fieldset-metadate_change textarea')
+        .empty()
+        .val(json.description);
 	$('#spl_sortable').empty()
 		.append(json.html);
 	$("#spl_editor")
@@ -256,12 +265,10 @@ function setSPLContent(json) {
 
 	$("#spl_sortable .ui-icon-closethick").click(deleteSPLItem);
 	$(".spl_fade_control").click(openFadeEditor);
-	//$(".spl_playlength").click(openCueEditor);
 	$(".spl_cue").click(openCueEditor);
 
 	//redraw the library list
-	dt = $("#library_display").dataTable();
+	redrawDataTablePage();
-	dt.fnStandingRedraw();
 
 	return false;
 }
@@ -364,8 +371,7 @@ function createPlaylistMetaForm(json) {
 			$.post(url, data, function(json){
 				openDiffSPL(json);
 				//redraw the library list
-				dt = $("#library_display").dataTable();
+				redrawDataTablePage();
-				dt.fnStandingRedraw();
 			})
 
 		});
@@ -393,8 +399,7 @@ function deleteSPL() {
 	$.post(url, function(){
 		noOpenPL;
 		//redraw the library list
-		dt = $("#library_display").dataTable();
+		redrawDataTablePage();
-		dt.fnStandingRedraw();
 	});
 }
 
@@ -409,6 +414,27 @@ function openDiffSPL(json) {
 		setUpSPL();
 }
 
+function editName() {
+    var nameElement = $(this);
+    var playlistName = nameElement.text();
+
+    $("#playlist_name_input")
+        .removeClass('element_hidden')
+        .val(playlistName)
+        .blur(function(){
+            var input = $(this);
+            var url;
+	        url = '/Playlist/set-playlist-name';
+
+	        $.post(url, {format: "json", name: input.val()}, function(json){
+                input.addClass('element_hidden');
+                nameElement.text(json.playlistName);
+                redrawDataTablePage();
+	        });
+        })
+        .keydown(submitOnEnter);
+}
+
 function setUpSPL() {
 
     $("#spl_sortable").sortable({
@@ -448,6 +474,39 @@ function setUpSPL() {
         }
     });
 
+    $("#playlist_name_display").click(editName);
+    $("#fieldset-metadate_change > legend").click(function(){
+        var descriptionElement = $(this).parent();
+
+        if(descriptionElement.hasClass("closed")) {
+            descriptionElement.removeClass("closed");
+        }
+        else {
+            descriptionElement.addClass("closed");
+        }
+    });
+
+    $("#description_save").click(function(){
+        var textarea = $("#fieldset-metadate_change textarea");
+        var description = textarea.val();
+        var url;
+        url = '/Playlist/set-playlist-description';
+
+        $.post(url, {format: "json", description: description}, function(json){
+            textarea.val(json.playlistDescription);
+        });
+    });
+
+    $("#description_cancel").click(function(){
+        var textarea = $("#fieldset-metadate_change textarea");
+        var url;
+        url = '/Playlist/set-playlist-description';
+
+        $.post(url, {format: "json"}, function(json){
+            textarea.val(json.playlistDescription);
+        });
+    });
+
     $("#spl_fade_in_main span:first").blur(function(event){
         event.stopPropagation();
 
@@ -508,7 +567,6 @@ function setUpSPL() {
 
 	$("#spl_sortable .ui-icon-closethick").click(deleteSPLItem);
 	$(".spl_fade_control").click(openFadeEditor);
-	//$(".spl_playlength").click(openCueEditor);
 	$(".spl_cue").click(openCueEditor);
 
 	$("#spl_sortable").droppable();