Merge pull request #2 from codenift/artwork

Artwork
This commit is contained in:
Codenift 2019-09-20 13:38:46 -04:00 committed by GitHub
commit 9f3badd1e0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
30 changed files with 913 additions and 173 deletions

View file

@ -574,6 +574,18 @@ li.ui-state-default {
line-height: inherit;
}
.inner_track_editor_title h2 {
margin: 10px 0 0 0;
width: 80%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.inner_track_editor_title span {
font-size: inherit;
line-height: inherit;
}
.clearfix:after, .side_playlist li:after {
display: none !important;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

View file

@ -268,7 +268,7 @@ img.logo
overflow:hidden;
}
.now-playing-block, .show-block, .on-air-block, .time-info-block, .listen-control-block {
.now-playing-block, .now-playing-artwork, .show-block, .on-air-block, .time-info-block, .listen-control-block {
height:100px;
float:left;
margin-right:10px;
@ -280,15 +280,45 @@ img.logo
min-width:170px;
}
.now-playing-artwork {
background: url(images/masterpanel_spacer.png) no-repeat 0 0;
margin-left: 152px;
padding: 12px 3px 13px 14px;
}
div.now-playing-artwork
{
width: 75px;
height: 100px;
text-align: center;
}
div.now-playing-artwork_containter{
background: #3a3a3a url(images/playinfo_bg.png) repeat-x 0 0;
height: 75px;
weight: 75px;
border: 1px solid #242424;
border-bottom-color:#727272;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
line-height:22px;
overflow:hidden;
}
img.artwork
{
max-width: 100%;
max-height: 100%;
padding: 3em;
box-sizing: border-box;
}
.now-playing-block {
-webkit-flex: 1 0;
-moz-flex: 1 0;
-ms-flex: 1 0;
-o-flex: 1 0;
flex: 1 0;
background: url(images/masterpanel_spacer.png) no-repeat 0 0;
margin-left: 152px;
padding-left: 14px;
margin-left: 0;
}
.show-block {
-webkit-flex: 1 0;
@ -331,7 +361,7 @@ img.logo
color:#fff;
font-size:15px;
line-height:22px;
text-indent:5px;
text-indent:5px;
overflow:hidden;
margin-bottom:3px;
}
@ -361,12 +391,12 @@ img.logo
}
.now-playing-info .show-length {
color:#c4c4c4;
padding-left:6px;
padding-left:6px;
}
.now-playing-info .song-length {
color:#9b9b9b;
padding-right:6px;
padding-right:6px;
}
.on-air-block {
@ -384,7 +414,7 @@ ol.navigation {
}
}
@media screen and (max-width: 875px) {
.now-playing-block {
.now-playing-block, .now-playing-artwork {
display: none;
}
.source-info-block {
@ -415,7 +445,7 @@ ol.navigation {
margin-top:34px;
display:block;
text-align:center;
}
.listen-control-button {
margin-top:6px;
@ -573,7 +603,7 @@ table.library-track-md{
width: 280px;
}
.ui-tooltip-dark.file-md-long{
.ui-tooltip-dark.file-md-long{
max-width: 415px !important;
overflow-y: unset;
}
@ -653,7 +683,7 @@ table.library-get-file-md.table-small{
.webstream {
color: #4eba70;
}
/***** LIBRARY QTIP METADATA SPECIFIC STYLES END *****/
@ -786,11 +816,11 @@ label {
dl.inline-list {
float: left;
margin: 0;
padding: 0;
padding: 0;
}
dl.inline-list dt {
dl.inline-list dt {
clear: left;
float: left;
margin: 0;
@ -802,7 +832,7 @@ dl.inline-list dt {
text-align:left;
min-width:70px;
}
dl.inline-list dd {
dl.inline-list dd {
float: left;
margin: 0;
padding: 0px 0 4px 15px;
@ -862,7 +892,7 @@ dl.inline-list dd {
.even {
background-color: #2f2f2f;
}
.datatable tr .selected td {
background-color: #abcfe2;
}
@ -920,13 +950,13 @@ dl.inline-list dd {
.dataTables_type {
float:right;
margin:0 8px 0 0;
}
.dataTables_length {
float:left;
margin:0;
}
.dataTables_length label {
padding:0;
@ -1008,7 +1038,7 @@ div.blockOverlay {
.dataTables_empty {
cursor: auto;
}
table.dataTable tbody tr,
table.dataTable tbody tr,
table.dataTable span.DataTables_sort_icon {
cursor: pointer;
@ -1050,6 +1080,10 @@ button.ColVis_Button.ColVis_ShowAll {
text-align: right;
}
.library_artwork {
line-height: 1 !important;
}
/*----END Data Table----*/
fieldset {
@ -1391,7 +1425,7 @@ ful
/** Extremely nasty workaround for a fullcalendar bug, where clicking "Add Show"
would cause this large space under the table header. The CSS to get to that
is ridiculously complicated and set in the HTML (!) dynamically with JS,
which makes it a pain in the ass to fix. That's why we're overriding it
which makes it a pain in the ass to fix. That's why we're overriding it
with !important here.
*/
@ -1558,11 +1592,11 @@ h2#scheduled_playlist_name {
font-weight:normal;
margin:0;
padding:8px 0 0px 12px;
color:#1c1c1c;
color:#1c1c1c;
}
h2#scheduled_playlist_name span {
color:#656565;
color:#656565;
}
.time {
@ -1589,7 +1623,7 @@ h2#scheduled_playlist_name span {
#schedule_calendar .ui-progressbar {
width: 46%;
height: 5px;
margin: 9px 9px 0 0;
margin: 9px 9px 0 0;
}
#schedule_calendar .ui-progressbar.ui-widget-content {
@ -1687,7 +1721,7 @@ h2#scheduled_playlist_name span {
width: 100%;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
box-sizing: border-box;
padding: 4px 0 8px;
}
@ -1752,7 +1786,7 @@ h2#scheduled_playlist_name span {
.ui-state-default .ui-icon.crossfade-main-icon {
background:url(images/crossfade_main.png) no-repeat 0 2px;
width:25px;
width:25px;
}
.btn.crossfade-main-button span {
@ -1771,7 +1805,7 @@ h2#scheduled_playlist_name span {
line-height: 14px;
vertical-align: text-top;
margin-top: 1px;
margin-right: -5px;
margin-right: -5px;
}
.ui-button-icon-only.crossfade-main-button .ui-icon {
@ -1988,7 +2022,7 @@ div.errors, span.errors{
span.errors.sp-errors{
width: 429px;
display: block;
display: block;
}
.collapsible-header, .collapsible-header-disabled {
@ -2015,7 +2049,7 @@ span.errors.sp-errors{
position:absolute;
left:5px;
top:12px;
}
.collapsible-header.closed .arrow-icon, .collapsible-header-disabled.close .arrow-icon {
background-position: 0 -11px !important;
@ -2409,7 +2443,7 @@ dd.radio-inline-list, .preferences dd.radio-inline-list, .stream-config dd.radio
.preferences dd.block-display .input_select, .stream-config dd.block-display .input_select {
width: 100%;
}
.preferences dd.block-display .input_text_area, .preferences dd.block-display .input_text
.preferences dd.block-display .input_text_area, .preferences dd.block-display .input_text
.stream-config dd.block-display .input_text_area, .stream-config dd.block-display .input_text,
.stream-config dd.block-display input[type="text"], .stream-config dd.block-display input[type="password"] {
width: 98.5%;
@ -2650,7 +2684,7 @@ label span {
#watched-folder-section dd.block-display {
clear:both;
min-height:25px;
}
#watched-folder-section dd.block-display.selected-item {
clear:both;
@ -2832,7 +2866,7 @@ dt.block-display.info-block {
width: 99.5%;
height: 110px;
}
.input-info {
font-size:12px;
padding:0 0 0 5px;
@ -2970,8 +3004,8 @@ tfoot tr th {
font-weight:bold;
text-align:left;
}
/*---//////////////////// STATUS TABLE ////////////////////---*/
.statustable {
background-color: #D8D8D8;
@ -3147,7 +3181,7 @@ dd .stream-status {
.qtip div > span {
padding: 5px;
}
.pull-left {
float:left;
}
@ -3182,12 +3216,12 @@ dd .stream-status {
}
/*---//////////////////// NEW BUTTONS ////////////////////
/*---//////////////////// NEW BUTTONS ////////////////////
.btn {
display: inline-block;
*display: inline;
*zoom: 1;
padding: 4px 10px 4px;
margin-bottom: 0;
@ -4232,3 +4266,21 @@ li .ui-state-hover {
text-decoration: none;
color: #f0f0f0;
}
/* Library - Tracks Edit */
.track-edit-header{
padding: 5px 0 20px 5px;
}
.track-edit-left {
float: left;
width: 100px;
margin-left: -100%;
}
.track-edit-right-wrapper {
/*background-color: #333333;*/
float: left;
width: 100%;
}
.track-edit-right {
margin-left: 160px;
}

View file

@ -126,10 +126,29 @@ function updatePlaybar(){
}
if (currentSong !== null && !master_dj_on_air && !live_dj_on_air){
if (currentSong.record == "1")
if (currentSong.record == "1") {
$('#current').html("<span style='color:red; font-weight:bold'>"+$.i18n._("Recording:")+"</span>"+currentSong.name+",");
else
} else {
$('#current').text(currentSong.name+",");
if (currentSong.metadata.artwork_data) {
var check_current_song = Cookies.get('current_track');
var loaded = Cookies.get('loaded');
if (check_current_song != currentSong.name) {
$('#now-playing-artwork_containter').html("<img height='75' width='75' class'artwork' src='"+ currentSong.metadata.artwork_data +"' />");
Cookies.remove('current_track');
Cookies.set('current_track', currentSong.name);
}
// makes sure it stays updated with current track if page loads
if (loaded != UNIQID) {
Cookies.remove('current_track');
Cookies.remove('loaded');
Cookies.set('loaded', UNIQID);
}
}
}
}else{
if (master_dj_on_air) {
if (showName) {

View file

@ -53,7 +53,8 @@ var AIRTIME = (function(AIRTIME) {
"year" : "n",
"owner_id" : "s",
"info_url" : "s",
"replay_gain" : "n"
"replay_gain" : "n",
"artwork" : "s"
};
if (AIRTIME.library === undefined) {
@ -575,6 +576,7 @@ var AIRTIME = (function(AIRTIME) {
/* ftype */ { "sTitle" : "" , "mDataProp" : "ftype" , "bSearchable" : false , "bVisible" : false },
/* Checkbox */ { "sTitle" : "" , "mDataProp" : "checkbox" , "bSortable" : false , "bSearchable" : false , "sWidth" : "16px" , "sClass" : "library_checkbox" },
/* Type */ { "sTitle" : "" , "mDataProp" : "image" , "bSortable" : false , "bSearchable" : false , "sWidth" : "16px" , "sClass" : "library_type" , "iDataSort" : 0 },
/* Artwork */ { "sTitle" : "" , "mDataProp" : "artwork" , "bSortable" : false , "bSearchable" : false , "sWidth" : "28px" , "sClass" : "library_artwork" , "iDataSort" : 0 },
/* Is Scheduled */ { "sTitle" : $.i18n._("Scheduled") , "mDataProp" : "is_scheduled" , "bVisible" : false , "bSearchable" : false , "sWidth" : "90px" , "sClass" : "library_is_scheduled" },
///* Is Playlist */ { "sTitle" : $.i18n._("Playlist / Block") , "mDataProp" : "is_playlist" , "bSearchable" : false , "sWidth" : "110px" , "sClass" : "library_is_playlist"} ,
/* Title */ { "sTitle" : $.i18n._("Title") , "mDataProp" : "track_title" , "sClass" : "library_title" , "sWidth" : "170px" },
@ -613,7 +615,7 @@ var AIRTIME = (function(AIRTIME) {
);
}
var colExclude = onDashboard ? [0, 1, 2, 32] : [0, 1, 2];
var colExclude = onDashboard ? [0, 1, 2, 33] : [0, 1, 2];
/* ############################################
DATATABLES
@ -767,6 +769,11 @@ var AIRTIME = (function(AIRTIME) {
// 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">');
if (aData.artwork_data) {
$(nRow).find('td.library_artwork').html('<img class="img_small" id="'+ aData.id +'" width="28" height="28" src="'+ aData.artwork_data +'">');
} else {
$(nRow).find('td.library_artwork').html('<img class="img_small" width="28" height="28" src="' + baseUrl + 'css/images/no-cover.jpg">');
}
} else if (aData.ftype === "playlist") {
$(nRow).find('td.library_type').html('<img title="' + $.i18n._("Playlist preview") + '" src="' + baseUrl + 'css/images/icon_playlist.png">');
} else if (aData.ftype === "block") {
@ -1589,6 +1596,7 @@ var validationTypes = {
"track_title" : "s",
"track_number" : "i",
"info_url" : "s",
"artwork" : "s",
"year" : "i"
};

View file

@ -5,6 +5,7 @@
$(document).ready(function() {
var aoColumns = [
/* Artwork */ { "sTitle" : $.i18n._("Artwork") , "mDataProp" : "artwork" , "bVisible" : false , "sClass" : "library_artwork" , "sWidth" : "150px" },
/* Title */ { "sTitle" : $.i18n._("Title") , "mDataProp" : "track_title" , "sClass" : "library_title" , "sWidth" : "170px" },
/* Creator */ { "sTitle" : $.i18n._("Creator") , "mDataProp" : "artist_name" , "sClass" : "library_creator" , "sWidth" : "160px" },
/* Upload Time */ { "sTitle" : $.i18n._("Uploaded") , "mDataProp" : "utime" , "bVisible" : false , "sClass" : "library_upload_time" , "sWidth" : "155px" },