Fix Add Show button bug and update styling
This commit is contained in:
Duncan Sommerville
parent
a9cddde877
commit
6d883d2fa4
airtime_mvc/public
|
|
@ -1,21 +1,21 @@
|
|||
#schedule-add-show,
|
||||
#fullcalendar_show_display {
|
||||
float: left;
|
||||
float: left;
|
||||
}
|
||||
|
||||
#schedule-add-show {
|
||||
font-size: 12px;
|
||||
/*width: 25%;*/
|
||||
width:310px;
|
||||
font-size: 12px;
|
||||
/*width: 25%;*/
|
||||
width: 310px;
|
||||
}
|
||||
|
||||
#schedule-add-show textarea {
|
||||
width: 99%;
|
||||
height: 80px;
|
||||
width: 99%;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
#fullcalendar_show_display {
|
||||
width: 60%;
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
#schedule-add-show .ui-tabs-panel {
|
||||
|
|
@ -23,16 +23,16 @@
|
|||
}
|
||||
|
||||
#schedule-add-show fieldset {
|
||||
padding:8px;
|
||||
margin-bottom:8px;
|
||||
padding: 8px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
#schedule-add-show dl {
|
||||
padding:8px;
|
||||
margin-bottom:8px;
|
||||
margin:0;
|
||||
padding:0;
|
||||
width:100%;
|
||||
padding: 8px;
|
||||
margin-bottom: 8px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
#schedule-add-show dd {
|
||||
|
|
@ -52,67 +52,67 @@
|
|||
margin: 0;
|
||||
padding: 4px 0;
|
||||
text-align: left;
|
||||
min-width:103px;
|
||||
clear:left;
|
||||
min-width: 103px;
|
||||
clear: left;
|
||||
}
|
||||
|
||||
#schedule-add-show dt.big {
|
||||
min-width:130px;
|
||||
min-width: 130px;
|
||||
}
|
||||
|
||||
#schedule-add-show dt.block-display, #schedule-add-show dd.block-display {
|
||||
display:block;
|
||||
float:none;
|
||||
margin-left:0;
|
||||
padding-left:0;
|
||||
display: block;
|
||||
float: none;
|
||||
margin-left: 0;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
#schedule-add-show dt label {
|
||||
padding-right:0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
.wrapp-label {
|
||||
padding:0;
|
||||
height:16px;
|
||||
display:block;
|
||||
line-height:18px;
|
||||
padding: 0;
|
||||
height: 16px;
|
||||
display: block;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
label.wrapp-label input[type="checkbox"] {
|
||||
float:left;
|
||||
margin:-1px 2px 0 0;
|
||||
float: left;
|
||||
margin: -1px 2px 0 0;
|
||||
}
|
||||
|
||||
#schedule-add-show fieldset:last-child {
|
||||
margin-bottom:0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
#schedule-add-show fieldset dd input[type="checkbox"] {
|
||||
margin-top:2px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
|
||||
#add_show_day_check-element.block-display {
|
||||
margin-bottom:15px;
|
||||
margin-top:7px;
|
||||
#add_show_day_check-element.block-display {
|
||||
margin-bottom: 15px;
|
||||
margin-top: 7px;
|
||||
}
|
||||
|
||||
#add_show_day_check-element.block-display label.wrapp-label {
|
||||
font-size:12px;
|
||||
float:left;
|
||||
margin-right:10px;
|
||||
font-size: 12px;
|
||||
float: left;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
#add_show_name-element .input_text {
|
||||
/*width:99%;*/
|
||||
/*width:99%;*/
|
||||
}
|
||||
|
||||
#schedule-add-show-overlap {
|
||||
border: 1px solid #c83f3f;
|
||||
background: #c6b4b4;
|
||||
margin-top:8px;
|
||||
padding:8px;
|
||||
color:#902d2d;
|
||||
display:none;
|
||||
border: 1px solid #c83f3f;
|
||||
background: #c6b4b4;
|
||||
margin-top: 8px;
|
||||
padding: 8px;
|
||||
color: #902d2d;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#add_show_hosts-element {
|
||||
|
|
@ -121,38 +121,90 @@ label.wrapp-label input[type="checkbox"] {
|
|||
overflow: auto;
|
||||
}
|
||||
|
||||
#add_show_start_time, #add_show_end_time {
|
||||
width: 54px;
|
||||
margin-left:10px;
|
||||
#add_show_start_time, #add_show_end_time {
|
||||
width: 54px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
#add_show_end_date_no_repeat, #add_show_start_date {
|
||||
width: 89px;
|
||||
#add_show_end_date_no_repeat, #add_show_start_date {
|
||||
width: 89px;
|
||||
}
|
||||
|
||||
#add_show_duration {
|
||||
background: #AAAAAA;
|
||||
cursor: default;
|
||||
width: 65px;
|
||||
#add_show_duration {
|
||||
background: #AAAAAA;
|
||||
cursor: default;
|
||||
width: 65px;
|
||||
}
|
||||
|
||||
[id^=add_show_instance_description] {
|
||||
display: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
#add_show_logo_current,
|
||||
#add_show_logo_current,
|
||||
#add_show_logo_preview {
|
||||
border: 1px solid #5b5b5b;
|
||||
-webkit-box-shadow: 0px 0px 2px 1px rgba(48,48,48,1);
|
||||
-moz-box-shadow: 0px 0px 2px 1px rgba(48,48,48,1);
|
||||
box-shadow: 0px 0px 2px 1px rgba(48,48,48,1);
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
display: none;
|
||||
cursor: default;
|
||||
-webkit-box-shadow: 0px 0px 2px 1px rgba(48, 48, 48, 1);
|
||||
-moz-box-shadow: 0px 0px 2px 1px rgba(48, 48, 48, 1);
|
||||
box-shadow: 0px 0px 2px 1px rgba(48, 48, 48, 1);
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
display: none;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
#add_show_logo_current_remove {
|
||||
display: none;
|
||||
height: 28px;
|
||||
height: 28px;
|
||||
}
|
||||
|
||||
.add-button {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.add-button {
|
||||
border: 1px solid #5b5b5b;
|
||||
background-color: #767676;
|
||||
background: -moz-linear-gradient(top, #868686 0, #6e6e6e 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #868686), color-stop(100%, #6e6e6e));
|
||||
color: #ffffff;
|
||||
margin:0;
|
||||
font-size:12px;
|
||||
font-weight:bold;
|
||||
padding:4px 12px 4px 22px;
|
||||
text-decoration:none;
|
||||
/*text-shadow: #000 0px -1px;*/
|
||||
display:block;
|
||||
float:left;
|
||||
position:relative;
|
||||
}
|
||||
.add-button:hover {
|
||||
border: 1px solid #000000;
|
||||
background-color: #353535;
|
||||
background: -moz-linear-gradient(top, #353535 0, #000000 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #353535), color-stop(100%, #000000));
|
||||
color: #ffffff;
|
||||
}
|
||||
.add-button span {
|
||||
position:absolute;
|
||||
top:3px;
|
||||
left:3px;
|
||||
height:16px;
|
||||
width:16px;
|
||||
display:block;
|
||||
background:url(redmond/images/ui-icons_ffffff_256x240.png) no-repeat;
|
||||
}
|
||||
/*.add-button:hover span {*/
|
||||
/*background:url(redmond/images/ui-icons_ff5d1a_256x240.png) no-repeat;*/
|
||||
/*}*/
|
||||
.add-button span.add-icon {
|
||||
background-position: -32px -129px;
|
||||
}
|
||||
|
||||
.add-button[disabled] {
|
||||
cursor: auto;
|
||||
color: #e7e7e7;
|
||||
border: 1px solid #a1a1a1;
|
||||
background-color: #b1b1b1;
|
||||
background: -moz-linear-gradient(top, #c7c7c7 0, #c7c7c7 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #c7c7c7), color-stop(100%, #c7c7c7));
|
||||
}
|
||||
|
|
@ -1901,44 +1901,6 @@ span.errors.sp-errors{
|
|||
height:38px;
|
||||
}
|
||||
|
||||
.add-button, .ui-widget-content a.add-button {
|
||||
border: 1px solid #242424;
|
||||
background-color: #353535;
|
||||
background: -moz-linear-gradient(top, #494949 0, #353535 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #494949), color-stop(100%, #353535));
|
||||
color: #ffffff;
|
||||
margin:0;
|
||||
font-size:12px;
|
||||
font-weight:bold;
|
||||
padding:4px 12px 4px 22px;
|
||||
text-decoration:none;
|
||||
text-shadow: #000 0px -1px;
|
||||
display:block;
|
||||
float:left;
|
||||
position:relative;
|
||||
}
|
||||
.add-button:hover, .ui-widget-content a.add-button:hover {
|
||||
border: 1px solid #000000;
|
||||
background-color: #353535;
|
||||
background: -moz-linear-gradient(top, #353535 0, #000000 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #353535), color-stop(100%, #000000));
|
||||
color: #ffffff;
|
||||
}
|
||||
.add-button span {
|
||||
position:absolute;
|
||||
top:3px;
|
||||
left:3px;
|
||||
height:16px;
|
||||
width:16px;
|
||||
display:block;
|
||||
background:url(redmond/images/ui-icons_ffffff_256x240.png) no-repeat;
|
||||
}
|
||||
.add-button:hover span {
|
||||
background:url(redmond/images/ui-icons_ff5d1a_256x240.png) no-repeat;
|
||||
}
|
||||
.add-button span.add-icon {
|
||||
background-position: -32px -128px;
|
||||
}
|
||||
|
||||
/*---//////////////////// NOW PLAYING COLORS ////////////////////---*/
|
||||
.playing-song, .datatable tr.playing-song:hover td {
|
||||
|
|
@ -1958,7 +1920,6 @@ span.errors.sp-errors{
|
|||
color:#FFF;
|
||||
}
|
||||
|
||||
|
||||
/*---//////////////////// END NOW PLAYING COLORS ////////////////////---*/
|
||||
.icon-link, .ui-widget-content a.icon-link {
|
||||
color: #646464;
|
||||
|
|
|
|||
|
|
@ -31,24 +31,26 @@ function openAddShowForm() {
|
|||
}
|
||||
}
|
||||
|
||||
function makeAddShowButton(){
|
||||
$('.fc-header-left')
|
||||
.append('<span class="fc-header-space"></span>')
|
||||
.append('<span class="fc-button"><a href="#" class="add-button"><span class="add-icon"></span>'+$.i18n._("Show")+'</a></span>')
|
||||
.find('span.fc-button:last > a')
|
||||
.click(function(){
|
||||
openAddShowForm();
|
||||
removeAddShowButton();
|
||||
});
|
||||
function makeAddShowButton() {
|
||||
if($('.add-button').length === 0) {
|
||||
$('.fc-header-left')
|
||||
.append('<span class="fc-header-space"></span>')
|
||||
.append('<span class="fc-button">' +
|
||||
'<button onclick="showForm()" class="add-button">' +
|
||||
'<span class="add-icon"></span>' + $.i18n._("Create New Show") +
|
||||
'</button>' +
|
||||
'</span>');
|
||||
}
|
||||
}
|
||||
|
||||
function removeAddShowButton(){
|
||||
var aTag = $('.fc-header-left')
|
||||
.find("span.fc-button:last > a");
|
||||
function showForm() {
|
||||
openAddShowForm();
|
||||
toggleAddShowButton();
|
||||
}
|
||||
|
||||
var span = aTag.parent();
|
||||
span.prev().remove();
|
||||
span.remove();
|
||||
function toggleAddShowButton(){
|
||||
var aTag = $('.add-button');
|
||||
aTag.prop('disabled', function(i, v) { return !v; });
|
||||
}
|
||||
|
||||
//$el is DOM element #add-show-form
|
||||
|
|
@ -79,11 +81,11 @@ function closeAddShowForm(event) {
|
|||
windowResize();
|
||||
|
||||
$.get(baseUrl+"Schedule/get-form", {format:"json"}, function(json) {
|
||||
|
||||
|
||||
redrawAddShowForm($el, json.form);
|
||||
});
|
||||
|
||||
makeAddShowButton();
|
||||
toggleAddShowButton();
|
||||
}
|
||||
|
||||
//dateText mm-dd-yy
|
||||
|
|
@ -162,7 +164,7 @@ function beginEditShow(data){
|
|||
}
|
||||
|
||||
redrawAddShowForm($("#add-show-form"), data.newForm);
|
||||
removeAddShowButton();
|
||||
toggleAddShowButton();
|
||||
openAddShowForm();
|
||||
}
|
||||
|
||||
|
|
@ -777,20 +779,20 @@ function setAddShowEvents(form) {
|
|||
.fullCalendar('render');
|
||||
|
||||
$addShowForm.hide();
|
||||
toggleAddShowButton();
|
||||
$.get(baseUrl+"Schedule/get-form", {format:"json"}, function(json){
|
||||
redrawAddShowForm($addShowForm, json.form);
|
||||
});
|
||||
makeAddShowButton();
|
||||
} else {
|
||||
redrawAddShowForm($addShowForm, json.newForm);
|
||||
scheduleRefetchEvents(json);
|
||||
$addShowForm.hide();
|
||||
toggleAddShowButton();
|
||||
}
|
||||
|
||||
/* CC-6062: Resize the window to avoid stretching the last column */
|
||||
windowResize();
|
||||
makeAddShowButton();
|
||||
|
||||
}
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -110,6 +110,8 @@ function dayClick(date, allDay, jsEvent, view){
|
|||
$("#schedule-show-when").show();
|
||||
|
||||
openAddShowForm();
|
||||
makeAddShowButton();
|
||||
toggleAddShowButton();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue