Stream settings, Add Show form CSS revamp, etc.

This commit is contained in:
Albert Santoni 2015-08-12 16:44:45 -04:00
parent 21250e91c4
commit 409e9e2a78
10 changed files with 58 additions and 48 deletions

View file

@ -188,7 +188,7 @@ class Application_Form_StreamSettingSubForm extends Zend_Form_SubForm
$adminPass->setAttrib('alt', 'regular_text'); $adminPass->setAttrib('alt', 'regular_text');
$this->addElement($adminPass); $this->addElement($adminPass);
$liquidsoap_error_msg = '<div class="stream-status status-info"><h3>'._('Getting information from the server...').'</h3></div>'; $liquidsoap_error_msg = '<div class="stream-status status-info"><p>'._('Getting information from the server...').'</p></div>';
$this->setDecorators(array( $this->setDecorators(array(
array('ViewScript', array('viewScript' => 'form/stream-setting-form.phtml', array('ViewScript', array('viewScript' => 'form/stream-setting-form.phtml',

View file

@ -1,5 +1,5 @@
<fieldset class="padded stream-setting-global" style="margin-top: 15px"> <h3><?php echo _("Live Broadcasting") ?></h3>
<legend><?php echo _("Input Stream Settings") ?></legend> <fieldset class="padded stream-setting-global">
<dl class="zend_form"> <dl class="zend_form">
<?php echo $this->element->getElement('auto_transition')->render() ?> <?php echo $this->element->getElement('auto_transition')->render() ?>
<span class="icecast_metadata_help_icon" id="auto_transition_help"></span> <span class="icecast_metadata_help_icon" id="auto_transition_help"></span>

View file

@ -2,6 +2,7 @@
<div> <div>
<div><h4><?php echo _("Log Sheet Templates") ?></h4></div> <div><h4><?php echo _("Log Sheet Templates") ?></h4></div>
<button id="new_item_template" class="btn"><?php echo _("New Log Sheet Template") ?></button>
<ul id="template_list"> <ul id="template_list">
<?php if (count($this->template_list) == 0): ?> <?php if (count($this->template_list) == 0): ?>
<li><?php echo _("No Log Sheet Templates") ?></li> <li><?php echo _("No Log Sheet Templates") ?></li>
@ -28,11 +29,11 @@
</li> </li>
<?php endforeach; ?> <?php endforeach; ?>
</ul> </ul>
<button id="new_item_template" class="btn"><?php echo _("New Log Sheet Template") ?></button>
</div> </div>
<br><br> <br><br>
<div> <div>
<div><h4><?php echo _("File Summary Templates") ?></h4></div> <div><h4><?php echo _("File Summary Templates") ?></h4></div>
<button id="new_file_template" class="btn"><?php echo _("New File Summary Template") ?></button>
<ul id="template_file"> <ul id="template_file">
<?php if (count($this->template_file) == 0): ?> <?php if (count($this->template_file) == 0): ?>
<li><?php echo _("No File Summary Templates") ?></li> <li><?php echo _("No File Summary Templates") ?></li>
@ -59,6 +60,5 @@
</li> </li>
<?php endforeach; ?> <?php endforeach; ?>
</ul> </ul>
<button id="new_file_template" class="btn"><?php echo _("New File Summary Template") ?></button>
</div> </div>
</div> </div>

View file

@ -7,8 +7,9 @@
<div style="clear:both"></div> <div style="clear:both"></div>
<?php echo $this->statusMsg;?> <?php echo $this->statusMsg;?>
<div style="float: left; margin-right: 10px; width: 490px; overflow: auto;"> <div style="float: left; margin-right: 10px; width: 490px; overflow: auto;">
<h3><?php echo _("Global") ?></h3>
<fieldset class="padded stream-setting-global"> <fieldset class="padded stream-setting-global">
<legend><?php echo _("Global Settings") ?></legend>
<dl class="zend_form"> <dl class="zend_form">
<?php if($this->form->getElement('output_sound_device') != null){?> <?php if($this->form->getElement('output_sound_device') != null){?>
<dt id="hardwareOut-label"> <dt id="hardwareOut-label">
@ -102,8 +103,8 @@
<?php echo $this->form->getSubform('live_stream_subform'); ?> <?php echo $this->form->getSubform('live_stream_subform'); ?>
</div> </div>
<div style="float: left; width: 600px;"> <div style="float: left; width: 600px;">
<h3><?php echo _("Output Streams") ?></h3>
<fieldset class="padded"> <fieldset class="padded">
<legend><?php echo _("Output Stream Settings") ?></legend>
<?php <?php
// TODO: replace this with something that looks good // TODO: replace this with something that looks good
echo $this->form->getElement('customStreamSettings')->render(); echo $this->form->getElement('customStreamSettings')->render();

View file

@ -1,7 +1,7 @@
<div id="schedule-add-show" class="tabs ui-widget ui-widget-content block-shadow alpha-block padded"> <div id="schedule-add-show" class="tabs ui-widget ui-widget-content block-shadow alpha-block padded">
<div class="button-bar"> <div class="button-bar">
<a href="#" id="add-show-close" class="icon-link add-show-close"><span class="ui-icon ui-icon-circle-close"></span><?php echo _("Close") ?></a> <a href="#" id="add-show-close" class="icon-link add-show-close"><span class="ui-icon ui-icon-circle-close"></span><?php echo _("Close") ?></a>
<button data-action="<?php echo isset($this->action) ? $this->action : "add-show" ?>" aria-disabled="false" role="button" class="right-floated ui-button ui-widget ui-state-default ui-button-text-icon-primary btn btn-small"> <button data-action="<?php echo isset($this->action) ? $this->action : "add-show" ?>" aria-disabled="false" role="button" class="add-show-submit right-floated ui-button ui-widget ui-state-default ui-button-text-icon-primary btn btn-small">
<span class="ui-icon ui-icon-plusthick"></span> <span class="ui-icon ui-icon-plusthick"></span>
<span class="ui-button-text"><?php echo ($this->addNewShow ? _("Add this show") : _("Update show")); ?></span> <span class="ui-button-text"><?php echo ($this->addNewShow ? _("Add this show") : _("Update show")); ?></span>
</button> </button>

View file

@ -10,7 +10,7 @@
} }
#schedule-add-show textarea { #schedule-add-show textarea {
width: 99%; width: 96%;
height: 80px; height: 80px;
} }
@ -36,11 +36,10 @@
} }
#schedule-add-show dd { #schedule-add-show dd {
padding: 4px 0;
float: left;
font-size: 1.2em; font-size: 1.2em;
margin: 0; margin: 0;
padding: 4px 0 4px 15px; margin-bottom: 8px;
/* padding: 4px 0 4px 15px;*/
} }
#schedule-add-show dt, #schedule-add-show dt.big { #schedule-add-show dt, #schedule-add-show dt.big {
@ -49,9 +48,9 @@
font-size: 1.2em; font-size: 1.2em;
font-weight: bold; font-weight: bold;
margin: 0; margin: 0;
padding: 4px 0;
text-align: left; text-align: left;
min-width: 103px; min-width: 103px;
padding-top: 4px;
clear: left; clear: left;
} }
@ -87,7 +86,7 @@ label.wrapp-label input[type="checkbox"] {
} }
#schedule-add-show fieldset dd input[type="checkbox"] { #schedule-add-show fieldset dd input[type="checkbox"] {
margin-top: 2px; margin-top: 6px;
} }
#add_show_day_check-element.block-display { #add_show_day_check-element.block-display {
@ -117,7 +116,6 @@ label.wrapp-label input[type="checkbox"] {
#add_show_hosts-element { #add_show_hosts-element {
max-height: 80px; max-height: 80px;
min-width: 150px; min-width: 150px;
overflow: auto;
} }
#add_show_start_time, #add_show_end_time { #add_show_start_time, #add_show_end_time {
@ -209,3 +207,8 @@ label.wrapp-label input[type="checkbox"] {
.ui-state-hover { .ui-state-hover {
background: inherit; background: inherit;
} }
#cb_airtime_auth-label,
#cb_custom_auth-label {
width: 80%;
}

View file

@ -4,13 +4,10 @@
#history_template li, #configure_item_template li { #history_template li, #configure_item_template li {
clear: both; clear: both;
background: #AAAAAA; background: #222;
margin: 2px 0 4px 0; margin: 2px 0 4px 0;
padding: 4px 8px 4px 8px; padding: 4px 8px 4px 8px;
position: relative; position: relative;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border: 1px solid #9F9F9F; border: 1px solid #9F9F9F;
min-height: 15px; min-height: 15px;
} }
@ -167,7 +164,7 @@
} }
#configure_item_template .template_item_list li.field_other { #configure_item_template .template_item_list li.field_other {
background-color: #CACACA; background-color: #333;
} }

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1,003 B

After

Width:  |  Height:  |  Size: 213 B

Before After
Before After

View file

@ -44,9 +44,11 @@ h2 {
h3 { h3 {
font-size:1.7em; font-size:1.7em;
font-weight:normal; font-weight:normal;
color:#000; color: #efefef;
padding:0 0 10px 0; padding: 10px;
margin:0; margin:0;
background-color: #5E5E5E;
border-top:1px solid #9d9d9d;
} }
a, a:focus { a, a:focus {
outline:none; outline:none;
@ -1701,6 +1703,10 @@ h2#scheduled_playlist_name span {
/*width: 60%;*/ /*width: 60%;*/
} }
.stream-setting-global {
margin-bottom: 30px;
}
.simple-formblock.padded-strong { .simple-formblock.padded-strong {
padding:12px; padding:12px;
} }
@ -2070,7 +2076,7 @@ span.errors.sp-errors{
} }
.qtip { .qtip {
font-size:11px; font-size:14px;
line-height:160%; line-height:160%;
} }
@ -2599,8 +2605,17 @@ label span {
} }
fieldset > legend { fieldset > legend {
font-size: 12px; font-size: 16px;
line-height: 140%; line-height: 140%;
background: #333;
width: 100%;
margin: 0px;
padding: 0px;
border: 0px;
}
fieldset.padded > legend {
padding-left: -8px;
} }
fieldset.closed, fieldset.display_field.closed { fieldset.closed, fieldset.display_field.closed {
border-width: 1px 0 0; border-width: 1px 0 0;
@ -2655,7 +2670,7 @@ input[type="checkbox"][disabled] {
} }
.info-text-small { .info-text-small {
color: #5B5B5B; color: #adadad;
font-size: 11px; font-size: 11px;
line-height: 150%; line-height: 150%;
margin: 0; margin: 0;
@ -2685,7 +2700,7 @@ dd .info-text-small {
.stream-config input[type="text"], .stream-config input[type="password"] { .stream-config input[type="text"], .stream-config input[type="password"] {
/*width:98.5%;*/ /*width:98.5%;*/
min-width:172px; min-width:168px;
} }
.stream-config .display_field dd input[type="text"], .stream-config .display_field dd input[type="password"], .stream-config .display_field dd textarea { .stream-config .display_field dd input[type="text"], .stream-config .display_field dd input[type="password"], .stream-config .display_field dd textarea {
min-width:99%; min-width:99%;
@ -3080,25 +3095,19 @@ tfoot tr th {
/*---//////////////////// STREAM SETTINGS STATUS ////////////////////---*/ /*---//////////////////// STREAM SETTINGS STATUS ////////////////////---*/
.stream-status { .stream-status {
border: 1px solid; border: 1px solid;
padding:2px 10px 4px 22px; padding:2px 12px 4px 26px;
margin:2px 1px 10px 0px; margin:2px 1px 10px 0px;
width: auto; width: auto;
} }
dd .stream-status { dd .stream-status {
margin-bottom:1px; margin-bottom:1px;
} }
.stream-status h3 {
font-size: 12px;
font-weight: bold;
line-height: 12px;
padding:0;
margin:5px 4px 2px 4px;
}
.stream-status p { .stream-status p {
padding:0; padding:0;
margin:2px 3px 1px 4px; padding-top: 1px;
margin:4px;
color:#4F4F4F; color:#4F4F4F;
font-size: 11px;
} }
.stream-config dd.stream-status { .stream-config dd.stream-status {
padding:2px 10px 4px 22px; padding:2px 10px 4px 22px;
@ -3106,31 +3115,31 @@ dd .stream-status {
width: 65%; width: 65%;
} }
.status-good { .status-good {
background:#e3ffc9 url(images/stream_status.png) no-repeat 5px 5px; background:#e3ffc9 url(images/stream_status.png) no-repeat 8px 5px;
border-color:#54b300; border-color:#54b300;
} }
.status-good h3 { .status-good p {
color:#54b300; color:#54b300;
} }
.status-error { .status-error {
background:#ffeded url(images/stream_status.png) no-repeat 5px -128px; background:#ffeded url(images/stream_status.png) no-repeat 8px -126px;
border-color:#f90000; border-color:#f90000;
} }
.status-error h3 { .status-error p {
color:#DA0101; color:#DA0101;
} }
.status-info { .status-info {
background:#fff7e0 url(images/stream_status.png) no-repeat 5px -278px; background:#fff7e0 url(images/stream_status.png) no-repeat 8px -275px;
border-color:#f68826; border-color:#f68826;
} }
.status-info h3 { .status-info p {
color:#f1830c; color:#f1830c;
} }
.status-disabled { .status-disabled {
background:#c8ccc8 url(images/stream_status.png) no-repeat 5px -429px; background:#c8ccc8 url(images/stream_status.png) no-repeat 8px -426px;
border-color:#7f827f; border-color:#7f827f;
} }
.status-disabled h3 { .status-disabled p {
color:#646664; color:#646664;
} }

View file

@ -94,13 +94,13 @@ function checkLiquidsoapStatus(){
} }
var html; var html;
if(status == "OK"){ if(status == "OK"){
html = '<div class="stream-status status-good"><h3>'+$.i18n._("Connected to the streaming server")+'</h3></div>'; html = '<div class="stream-status status-good"><hp3>'+$.i18n._("Connected to the streaming server")+'</p></div>';
}else if(status == "N/A"){ }else if(status == "N/A"){
html = '<div class="stream-status status-disabled"><h3>'+$.i18n._("The stream is disabled")+'</h3></div>'; html = '<div class="stream-status status-disabled"><p>'+$.i18n._("The stream is disabled")+'</p></div>';
}else if(status == "waiting"){ }else if(status == "waiting"){
html = '<div class="stream-status status-info"><h3>'+$.i18n._("Getting information from the server...")+'</h3></div>'; html = '<div class="stream-status status-info"><p>'+$.i18n._("Getting information from the server...")+'</p></div>';
}else{ }else{
html = '<div class="stream-status status-error"><h3>'+$.i18n._("Can not connect to the streaming server")+'</h3><p>'+status+'</p></div>'; html = '<div class="stream-status status-error"><p>'+$.i18n._("Can not connect to the streaming server")+'</p><p>'+status+'</p></div>';
} }
$("#s"+id+"Liquidsoap-error-msg-element").html(html); $("#s"+id+"Liquidsoap-error-msg-element").html(html);
} }