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

Layout and styling fixes for sub-menu layout pages

Browse source
This commit is contained in:
Duncan Sommerville 2015-08-21 10:43:20 -04:00
parent beb0eed1c8
commit 277a066534
6 changed files with 88 additions and 65 deletions
Download patch file Download diff file Expand all files Collapse all files

1
airtime_mvc/application/controllers/ShowbuilderController.php
View file

@ -38,6 +38,7 @@ class ShowbuilderController extends Zend_Controller_Action
$this->view->headScript()->appendFile($baseUrl.'js/datatables/plugin/dataTables.ColVis.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/datatables/plugin/dataTables.colReorder.min.js?'.$CC_CONFIG['airtime_version'], 'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/datatables/plugin/dataTables.FixedColumns.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/datatables/plugin/dataTables.FixedHeader.js?'.$CC_CONFIG['airtime_version'],'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/datatables/plugin/dataTables.columnFilter.js?'.$CC_CONFIG['airtime_version'], 'text/javascript');
$this->view->headScript()->appendFile($baseUrl.'js/blockui/jquery.blockUI.js?'.$CC_CONFIG['airtime_version'],'text/javascript');

29
airtime_mvc/application/layouts/scripts/page-sub-menu.phtml
View file

@ -106,21 +106,22 @@
<div class="wrapper wrapper_panel" id="content">
<div style="display: flex; width: 100%">
<div style="flex: 0 140px;"> <!-- placeholder object so we can fixed position the submenu -->
<div id="sub-menu">
<h3><?php //parent_page is passed in from controller
echo $this->layout()->parent_page; ?></h3>
<hr>
<?php
$page = $this->navigation()->findOneBy('title', $this->layout()->parent_page);
echo $this->navigation()->menu()->renderMenu($page);
?>
</div>
</div>
<div id="sub-menu-content-panel">
<!-- <div style="display: flex; width: 100%">-->
<!-- <div id="sub-menu-content-panel">-->
<?php echo $this->layout()->content ?>
</div>
<!-- </div>-->
<!-- </div>-->
</div>
<!-- Since we're position fixing the submenu, we don't need it to be inside the page wrapper -->
<div id="sub-menu-wrapper"> <!-- placeholder object so we can fixed position the submenu -->
<div id="sub-menu">
<h3><?php //parent_page is passed in from controller
echo $this->layout()->parent_page; ?></h3>
<hr>
<?php
$page = $this->navigation()->findOneBy('title', $this->layout()->parent_page);
echo $this->navigation()->menu()->renderMenu($page);
?>
</div>
</div>

35
airtime_mvc/public/css/_showbuilder.css
View file

@ -1,34 +1,3 @@
div.ColVis_collectionBackground {
background-color: transparent;
}
/* Scroll bars */
::-webkit-scrollbar {
width: 7px;
height: 7px;
}
::-webkit-scrollbar-track {
background: transparent none;
}
.wrapper::-webkit-scrollbar-track {
background-color: rgba(255, 93, 26, .2);
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.75);
}
::-webkit-scrollbar-thumb {
background-color: #ff5d1a;
border-radius: 10px;
-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.75);
}
::-webkit-scrollbar-corner {
background-color: #000;
}
/* Show Builder*/
.content-pane {
@ -581,6 +550,10 @@ li.ui-state-default {
margin: 0;
}
div.ColVis_collectionBackground {
background-color: transparent;
}
.ColVis_collection.TableTools_collection.ui-buttonset.ui-buttonset-multi {
max-height: 50%;
overflow: auto;

71
airtime_mvc/public/css/styles.css
View file

@ -60,13 +60,42 @@ select {
border:1px solid #9d9d9d;
}
/* Scroll bars */
::-webkit-scrollbar {
width: 7px;
height: 7px;
}
::-webkit-scrollbar-track {
background: transparent none;
}
.wrapper::-webkit-scrollbar-track {
background-color: rgba(255, 93, 26, .2);
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.75);
}
::-webkit-scrollbar-thumb {
background-color: #ff5d1a;
border-radius: 10px;
-webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.75);
}
::-webkit-scrollbar-corner {
background-color: #000;
}
.wrapper_panel::-webkit-scrollbar-corner {
background-color: #242424;
}
/* Fix for Firefox */
.logo {
position: absolute;
float: left;
left: 22px;
left: 23px;
top: 30px;
width: 100px;
height: 46px;
@ -253,7 +282,7 @@ select {
.now-playing-block {
width:35%;
background: url(images/masterpanel_spacer.png) no-repeat 0 0;
margin-left: 149px;
margin-left: 152px;
padding-left: 14px;
}
.show-block {
@ -373,21 +402,21 @@ select {
width: 30%;
/*display: none;*/
}
#nav li.top {
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
width: 110px;
}
/*#nav li.top {*/
/*display: -webkit-box;*/
/*display: -moz-box;*/
/*display: -ms-flexbox;*/
/*display: -webkit-flex;*/
/*display: flex;*/
/*width: 110px;*/
/*}*/
}
@media screen and (max-width: 775px) {
.now-playing-block {
display: none;
}
.source-info-block {
margin-left: 149px;
margin-left: 152px;
}
}
@media screen and (max-width: 520px) {
@ -3443,7 +3472,7 @@ button.btn-icon-text > i.icon-white {
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 150px;
width: 152px;
flex: 1 auto;
padding: 0;
@ -3528,7 +3557,7 @@ button.btn-icon-text > i.icon-white {
position: absolute;
top: 102px;
left: 150px;
left: 152px;
right: 0;
bottom: 0;
padding: 10px 10px 40px;
@ -3554,6 +3583,7 @@ button.btn-icon-text > i.icon-white {
}
.wrapper_panel {
left: 303px;
background-color: #242424;
}
@ -3562,7 +3592,7 @@ button.btn-icon-text > i.icon-white {
.usability_hint {
position: fixed;
top: 102px;
left: 150px;
left: 152px;
width: 100%;
flex: 0 100%;
@ -3590,17 +3620,23 @@ button.btn-icon-text > i.icon-white {
margin-bottom: 10px;
}
#sub-menu-wrapper {
flex: 0 140px;
min-width: 140px;
}
#sub-menu {
position: fixed;
left: 150px;
top: 130px;
height: 100%;
left: 152px;
top: 102px;
bottom: 0; /* Account for scrollbars */
min-width: 130px;
border-right: 1px solid #5b5b5b;
background: #242424;
font-size: 14px;
color: #cecece;
padding: 10px;
z-index: 1;
}
#sub-menu h3 {
@ -3638,6 +3674,7 @@ button.btn-icon-text > i.icon-white {
#listenerstat_content {
width: 100%;
display: block;
box-sizing: border-box;
}
#listenerstat_content .legendLabel

11
airtime_mvc/public/js/airtime/common/common.js
View file

@ -1,6 +1,7 @@
var previewWidth = 482,
previewHeight = 110,
USABILITY_HINT_TOP = 130;
USABILITY_HINT_HIDDEN_TOP = 102,
USABILITY_HINT_VISIBLE_TOP = 130;
$(document).ready(function() {
@ -13,6 +14,7 @@ $(document).ready(function() {
//this statement tells the browser to fade out any success message after 5 seconds
setTimeout(function(){$(".success").fadeOut("slow", function(){$(this).empty()});}, 5000);
adjustForUsabilityHint();
});
/*
@ -192,13 +194,18 @@ function removeSuccessMsg() {
$status.fadeOut("slow", function(){$status.empty()});
}
function adjustForUsabilityHint() {
var topVal = ($(".usability_hint").is(":visible") ? USABILITY_HINT_VISIBLE_TOP : USABILITY_HINT_HIDDEN_TOP);
$("#sub-menu").css("top", topVal);
}
function hideHint(h) {
h.hide("slow").addClass("hidden");
}
function showHint(h) {
h.show("slow").removeClass("hidden");
$(".wrapper").css("top", USABILITY_HINT_TOP); // Account for usability hint
$(".wrapper, #sub-menu").css("top", USABILITY_HINT_VISIBLE_TOP);
}
function getUsabilityHint() {

6
airtime_mvc/public/js/airtime/showbuilder/builder.js
View file

@ -151,7 +151,7 @@ var AIRTIME = (function(AIRTIME){
};
mod.checkDeleteButton = function() {
var $selected = $sbTable.find("tr."+SB_SELECTED_CLASS);
var $selected = $("."+SB_SELECTED_CLASS);
var button = $("#show_builder").find(".icon-trash").parent();
if ($selected.length !== 0) {
@ -849,6 +849,7 @@ var AIRTIME = (function(AIRTIME){
$tr.addClass(SB_SELECTED_CLASS);
$tr.find(".sb-checkbox > input").prop('checked', true);
mod.checkToolBarIcons();
} else if (ev.ctrlKey) {
$tr.removeClass(SB_SELECTED_CLASS);
$tr.find(".sb-checkbox > input").prop('checked', false);
@ -866,8 +867,10 @@ var AIRTIME = (function(AIRTIME){
$previouslySelected = undefined;
tr.removeClass(SB_SELECTED_CLASS);
tr.find(".sb-checkbox > input").prop('checked', false);
mod.checkToolBarIcons();
} else {
tr.find(".sb-checkbox > input").prop('checked', true);
mod.checkToolBarIcons();
}
selectedRows = $("." + SB_SELECTED_CLASS);
});
@ -879,6 +882,7 @@ var AIRTIME = (function(AIRTIME){
tr.addClass(SB_SELECTED_CLASS);
tr.find(".sb-checkbox > input").prop('checked', true);
$previouslySelected = tr;
mod.checkToolBarIcons();
}
selectedRows = $("." + SB_SELECTED_CLASS);
});