Congegni
/
sintonia
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

CC-6118: Playlist crossfade panel needs restyling 

Started re-styling the playlist fade editor
This commit is contained in:
drigato 2015-09-01 12:05:08 -04:00
parent c7d926f8e8
commit 34e7c09ab7
3 changed files with 29 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
airtime_mvc/application/views/scripts/playlist/playlist.phtml
View File

@ -57,11 +57,11 @@ if (isset($this->obj)) {
<div id="crossfade_main" class="crossfade-main clearfix" style="display:none;"> <div id="crossfade_main" class="crossfade-main clearfix" style="display:none;">
<span class="ui-icon ui-icon-closethick sp-closethick-center"></span> <span class="ui-icon ui-icon-closethick sp-closethick-center"></span>
<dl id="spl_editor-main" class="inline-list"> <dl id="spl_editor-main" class="inline-list">
<dt><?php echo _("Fade in: "); ?><span class='spl_cue_hint'>(ss.msec)</span></dt> <dt><?php echo _("Fade in: "); ?><span class='spl_cue_hint'>(ss.m)</span></dt>
<dd><span contenteditable="true" class="spl_text_input spl_main_fade_in">00</span></dd> <dd><input class="playlist_main_fade_input spl_main_fade_in" value="00" /></dd>
<dd class="edit-error"></dd> <dd class="edit-error"></dd>
<dt><?php echo _("Fade out: "); ?><span class='spl_cue_hint'>(ss.msec)</span></dt> <dt><?php echo _("Fade out: "); ?><span class='spl_cue_hint'>(ss.m)</span></dt>
<dd><span contenteditable="true" class="spl_text_input spl_main_fade_out">00</span></dd> <dd><input class="playlist_main_fade_input spl_main_fade_out" value="00" /></dd>
<dd class="edit-error"></dd> <dd class="edit-error"></dd>
</dl> </dl>
</div> </div>

13
airtime_mvc/public/css/playlist_builder.css
View File

@ -345,7 +345,7 @@
} }
.edit-error { .edit-error {
color: #b80000; color: #bd362f;
margin: 0; margin: 0;
padding-bottom: 0; padding-bottom: 0;
font-size: 12px; font-size: 12px;
@ -359,14 +359,23 @@
color: #fff; color: #fff;
} }
.playlist_main_fade_input {
width: 100px;
}
.crossfade-main { .crossfade-main {
background: #debc9e; /*background: #debc9e;*/
border: 1px solid #5b5b5b; border: 1px solid #5b5b5b;
padding: 10px 10px 0 10px; padding: 10px 10px 0 10px;
margin: 0 1px 16px 0; margin: 0 1px 16px 0;
position: relative; position: relative;
} }
.crossfade-main dt {
color: #ffffff !important;
width: 100px;
}
.crossfade-main .edit-error { .crossfade-main .edit-error {
padding-bottom: 4px; padding-bottom: 4px;
margin: 0; margin: 0;

25
airtime_mvc/public/js/airtime/library/spl.js
View File

@ -763,15 +763,18 @@ var AIRTIME = (function(AIRTIME){
playlistError(json); playlistError(json);
} }
else { else {
var fadeIn = $pl.find("span.spl_main_fade_in"); var fadeIn = $pl.find("input.spl_main_fade_in");
var fadeOut = $pl.find("span.spl_main_fade_out"); var fadeOut = $pl.find("span.spl_main_fade_out");
if (json.fadeIn == null) { if (json.fadeIn == null) {
fadeIn.parent().prev().hide(); fadeIn.parent().prev().hide();
fadeIn.hide(); fadeIn.hide();
} else { } else {
console.log(json.fadeIn);
//console.log(fadeIn.val());
fadeIn.parent().prev().show(); fadeIn.parent().prev().show();
fadeIn.show(); fadeIn.show();
fadeIn.empty().append(json.fadeIn); fadeIn.val(json.fadeIn);
fadeIn.text(json.fadeIn);
} }
if (json.fadeOut == null) { if (json.fadeOut == null) {
fadeOut.parent().prev().hide(); fadeOut.parent().prev().hide();
@ -789,41 +792,41 @@ var AIRTIME = (function(AIRTIME){
} }
}); });
$pl.on("blur", "span.spl_main_fade_in", function(event){ $pl.on("blur", "input.spl_main_fade_in", function(event){
event.stopPropagation(); event.stopPropagation();
var url = baseUrl+"playlist/set-playlist-fades", var url = baseUrl+"playlist/set-playlist-fades",
span = $(this), input = $(this),
fadeIn = $.trim(span.text()), fadeIn = $.trim(input.val()),
lastMod = mod.getModified(), lastMod = mod.getModified(),
type = $pl.find('.obj_type').val(); type = $pl.find('.obj_type').val();
if (!isFadeValid(fadeIn)){ if (!isFadeValid(fadeIn)){
showError(span, $.i18n._("please put in a time in seconds '00 (.0)'")); showError(input, $.i18n._("please put in a time in seconds '00 (.0)'"));
return; return;
} }
$.post(url, $.post(url,
{format: "json", fadeIn: fadeIn, modified: lastMod, type: type}, {format: "json", fadeIn: fadeIn, modified: lastMod, type: type},
function(json){ function(json){
hideError(span); hideError(input);
if (json.modified !== undefined) { if (json.modified !== undefined) {
mod.setModified(json.modified); mod.setModified(json.modified);
} }
}); });
}); });
$pl.on("blur", "span.spl_main_fade_out", function(event){ $pl.on("blur", "input.spl_main_fade_out", function(event){
event.stopPropagation(); event.stopPropagation();
var url = baseUrl+"playlist/set-playlist-fades", var url = baseUrl+"playlist/set-playlist-fades",
span = $(this), input = $(this),
fadeOut = $.trim(span.text()), fadeOut = $.trim(input.text()),
lastMod = mod.getModified(), lastMod = mod.getModified(),
type = $pl.find('.obj_type').val(); type = $pl.find('.obj_type').val();
if (!isFadeValid(fadeOut)){ if (!isFadeValid(fadeOut)){
showError(span, $.i18n._("please put in a time in seconds '00 (.0)'")); showError(input, $.i18n._("please put in a time in seconds '00 (.0)'"));
return; return;
} }