CC-3453 : Playlist

reworking inital playlist events to all use the new "on" delegation in jQuery.
fixing some out of date errors.
This commit is contained in:
Naomi Aro 2012-03-19 14:09:05 +01:00
parent b5f92dfa93
commit 9509c70595
4 changed files with 113 additions and 106 deletions

View File

@ -348,7 +348,7 @@ class PlaylistController extends Zend_Controller_Action
/** /**
* The playlist fades are stored in the elements themselves. * The playlist fades are stored in the elements themselves.
* The fade in is set to the first elements fade in and * The fade in is set to the first elements fade in and
* the fade out is set to the last elments fade out. * the fade out is set to the last elements fade out.
**/ **/
public function setPlaylistFadesAction() public function setPlaylistFadesAction()
{ {
@ -358,6 +358,7 @@ class PlaylistController extends Zend_Controller_Action
try { try {
$pl = $this->getPlaylist(); $pl = $this->getPlaylist();
$pl->setPlaylistfades($fadeIn, $fadeOut); $pl->setPlaylistfades($fadeIn, $fadeOut);
$this->view->modified = $pl->getLastModified("U");
} }
catch (PlaylistOutDatedException $e) { catch (PlaylistOutDatedException $e) {
$this->playlistOutdated($pl, $e); $this->playlistOutdated($pl, $e);

View File

@ -520,7 +520,7 @@ class Application_Model_Playlist {
throw $e; throw $e;
} }
return array("fadeIn"=> $fadeIn, "fadeOut"=> $fadeOut); return array("fadeIn" => $fadeIn, "fadeOut" => $fadeOut);
} }
public function setPlaylistfades($fadein, $fadeout) { public function setPlaylistfades($fadein, $fadeout) {
@ -536,11 +536,12 @@ class Application_Model_Playlist {
} }
if (isset($fadeout)) { if (isset($fadeout)) {
Logging::log("Setting playlist fade out {$fadeout}");
$row = CcPlaylistcontentsQuery::create() $row = CcPlaylistcontentsQuery::create()
->filterByDbPlaylistId($this->id) ->filterByDbPlaylistId($this->id)
->filterByDbPosition($this->getSize()-1) ->filterByDbPosition($this->getSize()-1)
->findOne($this->con); ->findOne($this->con);
$this->changeFadeInfo($row->getDbId(), null, $fadeout); $this->changeFadeInfo($row->getDbId(), null, $fadeout);
} }
} }

View File

@ -11,8 +11,7 @@
<input id="pl_lastMod" type="hidden" value="<?php echo $this->pl->getLastModified('U'); ?>"></input> <input id="pl_lastMod" type="hidden" value="<?php echo $this->pl->getLastModified('U'); ?>"></input>
<div class="playlist_title"> <div class="playlist_title">
<h3 id="spl_name"> <h3 id="spl_name">
<a id="playlist_name_display"><?php echo $this->pl->getName(); ?></a> <a id="playlist_name_display" contenteditable="true"><?php echo $this->pl->getName(); ?></a>
<input type="text" maxlength="255" size="40" class="element_hidden" id="playlist_name_input" />
</h3> </h3>
<h4 id="spl_length"><?php echo $this->length; ?></h4> <h4 id="spl_length"><?php echo $this->length; ?></h4>
</div> </div>
@ -36,10 +35,10 @@
<span class="ui-icon ui-icon-closethick"></span> <span class="ui-icon ui-icon-closethick"></span>
<dl id="spl_editor-main" class="inline-list"> <dl id="spl_editor-main" class="inline-list">
<dt>Fade in (s):</dt> <dt>Fade in (s):</dt>
<dd id="spl_fade_in_main"><span contenteditable="true" class="spl_text_input">00</span></dd> <dd><span contenteditable="true" class="spl_text_input spl_main_fade_in">00</span></dd>
<dd class="edit-error"></dd> <dd class="edit-error"></dd>
<dt>Fade out (s):</dt> <dt>Fade out (s):</dt>
<dd id="spl_fade_out_main"><span contenteditable="true" class="spl_text_input">00/span></dd> <dd><span contenteditable="true" class="spl_text_input spl_main_fade_out">00/span></dd>
<dd class="edit-error"></dd> <dd class="edit-error"></dd>
</dl> </dl>
</div> </div>

View File

@ -212,14 +212,14 @@ var AIRTIME = (function(AIRTIME){
} }
function openFadeEditor(event) { function openFadeEditor(event) {
var pos, url, li; var li;
event.stopPropagation(); event.stopPropagation();
li = $(this).parent().parent(); li = $(this).parents("li");
li.find(".crossfade").toggle(); li.find(".crossfade").toggle();
if($(this).hasClass("ui-state-active")) { if ($(this).hasClass("ui-state-active")) {
unHighlightActive(this); unHighlightActive(this);
} }
else { else {
@ -228,12 +228,12 @@ var AIRTIME = (function(AIRTIME){
} }
function openCueEditor(event) { function openCueEditor(event) {
var pos, url, li, icon; var li, icon;
event.stopPropagation(); event.stopPropagation();
icon = $(this); icon = $(this);
li = $(this).parent().parent().parent(); li = $(this).parents("li");
li.find(".cue-edit").toggle(); li.find(".cue-edit").toggle();
if (li.hasClass("ui-state-active")) { if (li.hasClass("ui-state-active")) {
@ -248,35 +248,23 @@ var AIRTIME = (function(AIRTIME){
function editName() { function editName() {
var nameElement = $(this), var nameElement = $(this),
playlistName = nameElement.text(),
lastMod = getModified(); lastMod = getModified();
$("#playlist_name_input") url = '/Playlist/set-playlist-name';
.removeClass('element_hidden')
.val(playlistName)
.keydown(function(event){
if (event.keyCode === 13) {
event.preventDefault();
var input = $(this),
url = '/Playlist/set-playlist-name';
$.post(url, $.post(url,
{format: "json", name: input.val(), modified: lastMod}, {format: "json", name: nameElement.text(), modified: lastMod},
function(json){ function(json){
if (json.error !== undefined) { if (json.error !== undefined) {
playlistError(json); playlistError(json);
} }
else { else {
setModified(json.modified); setModified(json.modified);
input.addClass('element_hidden'); nameElement.text(json.playlistName);
nameElement.text(json.playlistName); redrawLib();
redrawLib(); }
} });
});
}
})
.focus();
} }
function redrawLib() { function redrawLib() {
@ -372,13 +360,13 @@ var AIRTIME = (function(AIRTIME){
"keydown": submitOnEnter}); "keydown": submitOnEnter});
} }
function setUpPlaylist(playlist) { function initialEvents() {
var playlist = $("#side_playlist"), var playlist = $("#side_playlist"),
sortableConf,
cachedDescription; cachedDescription;
playlist.find("#spl_crossfade").on("click", function() {
//main playlist fades events
playlist.on("click", "#spl_crossfade", function() {
var lastMod = getModified(); var lastMod = getModified();
if ($(this).hasClass("ui-state-active")) { if ($(this).hasClass("ui-state-active")) {
@ -397,10 +385,11 @@ var AIRTIME = (function(AIRTIME){
playlistError(json); playlistError(json);
} }
else { else {
playlist.find("#spl_fade_in_main").find("span") playlist.find("span.spl_main_fade_in")
.empty() .empty()
.append(json.fadeIn); .append(json.fadeIn);
playlist.find("#spl_fade_out_main").find("span")
playlist.find("span.spl_main_fade_out")
.empty() .empty()
.append(json.fadeOut); .append(json.fadeOut);
@ -409,22 +398,79 @@ var AIRTIME = (function(AIRTIME){
}); });
} }
}); });
playlist.on("blur", "span.spl_main_fade_in", function(event){
event.stopPropagation();
playlist.find("#playlist_name_display").on("click", editName); var url = "/Playlist/set-playlist-fades",
span = $(this),
playlist.find("#fieldset-metadate_change > legend").on("click", function(){ fadeIn = $.trim(span.text()),
var descriptionElement = $(this).parent(); lastMod = getModified();
if (!isFadeValid(fadeIn)){
showError(span, "please put in a time in seconds '00 (.000000)'");
return;
}
if (descriptionElement.hasClass("closed")) { $.post(url,
cachedDescription = playlist.find("#fieldset-metadate_change textarea").val(); {format: "json", fadeIn: fadeIn, modified: lastMod},
descriptionElement.removeClass("closed"); function(json){
} hideError(span);
else { if (json.modified !== undefined) {
descriptionElement.addClass("closed"); setModified(json.modified);
} }
});
}); });
playlist.find("#description_save").on("click", function(){ playlist.on("blur", "span.spl_main_fade_out", function(event){
event.stopPropagation();
var url = "/Playlist/set-playlist-fades",
span = $(this),
fadeOut = $.trim(span.text()),
lastMod = getModified();
if (!isFadeValid(fadeOut)){
showError(span, "please put in a time in seconds '00 (.000000)'");
return;
}
$.post(url,
{format: "json", fadeOut: fadeOut, modified: lastMod},
function(json){
hideError(span);
if (json.modified !== undefined) {
setModified(json.modified);
}
});
});
playlist.on("keydown", "span.spl_main_fade_in, span.spl_main_fade_out", submitOnEnter);
playlist.on("click", "#crossfade_main > .ui-icon-closethick", function(){
playlist.find("#spl_crossfade").removeClass("ui-state-active");
playlist.find("#crossfade_main").hide();
});
//end main playlist fades.
//edit playlist name event
playlist.on("keydown", "#playlist_name_display", submitOnEnter);
playlist.on("blur", "#playlist_name_display", editName);
//edit playlist description events
playlist.on("click", "fieldset", function(){
var $fs = $(this);
if ($fs.hasClass("closed")) {
cachedDescription = $fs.find("textarea").val();
$fs.removeClass("closed");
}
else {
$fs.addClass("closed");
}
});
playlist.on("click", "#description_save", function(){
var textarea = playlist.find("#fieldset-metadate_change textarea"), var textarea = playlist.find("#fieldset-metadate_change textarea"),
description = textarea.val(), description = textarea.val(),
url, url,
@ -447,60 +493,19 @@ var AIRTIME = (function(AIRTIME){
}); });
}); });
playlist.find("#description_cancel").on("click", function(){ playlist.on("click", "#description_cancel", function(){
var textarea = playlist.find("#fieldset-metadate_change textarea"); var textarea = playlist.find("#fieldset-metadate_change textarea");
textarea.val(cachedDescription); textarea.val(cachedDescription);
playlist.find("#fieldset-metadate_change").addClass("closed"); playlist.find("#fieldset-metadate_change").addClass("closed");
}); });
//end edit playlist description events.
playlist.find("#spl_fade_in_main span:first").on("blur", function(event){
event.stopPropagation(); }
var url = "/Playlist/set-playlist-fades", function setUpPlaylist(playlist) {
span = $(this), var playlist = $("#side_playlist"),
fadeIn = $.trim(span.text()), sortableConf;
lastMod = getModified();
if (!isFadeValid(fadeIn)){
showError(span, "please put in a time in seconds '00 (.000000)'");
return;
}
$.post(url,
{format: "json", fadeIn: fadeIn, modified: lastMod},
function(json){
hideError(span);
});
});
playlist.find("#spl_fade_out_main span:last").on("blur", function(event){
event.stopPropagation();
var url = "/Playlist/set-playlist-fades",
span = $(this),
fadeOut = $.trim(span.text()),
lastMod = getModified();
if(!isFadeValid(fadeOut)){
showError(span, "please put in a time in seconds '00 (.000000)'");
return;
}
$.post(url,
{format: "json", fadeOut: fadeOut, modified: lastMod},
function(json){
hideError(span);
});
});
playlist.find("#spl_fade_in_main span:first, #spl_fade_out_main span:first")
.on("keydown", submitOnEnter);
playlist.find("#crossfade_main > .ui-icon-closethick").on("click", function(){
playlist.find("#spl_crossfade").removeClass("ui-state-active");
playlist.find("#crossfade_main").hide();
});
sortableConf = (function(){ sortableConf = (function(){
var aReceiveItems, var aReceiveItems,
@ -728,6 +733,7 @@ var AIRTIME = (function(AIRTIME){
setCueEvents(playlist); setCueEvents(playlist);
setFadeEvents(playlist); setFadeEvents(playlist);
initialEvents();
setUpPlaylist(playlist); setUpPlaylist(playlist);
}; };