Event view compress header
Combine all three lines of event view to 2.
This commit is contained in:
parent
50d5a8991d
commit
bf5c928e38
|
@ -349,6 +349,7 @@ th.table-th-sort-rev span.table-th-sort-span {
|
|||
margin: 4px auto;
|
||||
line-height: 1;
|
||||
text-align: left;
|
||||
padding: 3px 0;
|
||||
}
|
||||
|
||||
#header h2 {
|
||||
|
|
|
@ -29,87 +29,42 @@ span.noneCue {
|
|||
background: none;
|
||||
}
|
||||
|
||||
#header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#header h2, #header a {
|
||||
line-height: 1.1;
|
||||
margin:5px 0 0 0;
|
||||
}
|
||||
|
||||
#dataBar {
|
||||
width: 100%;
|
||||
margin: 2px auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#dataBar #dataTable {
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
#dataBar #dataTable td {
|
||||
text-align: center;
|
||||
padding: 2px;
|
||||
display: flex;
|
||||
flex-wrap:wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#menuBar1 {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
#menuBar1 #nameControl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
#menuBar1 #nameControl #eventName {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
#menuBar1 #replayControl {
|
||||
float: right;
|
||||
margin-left: 8px;
|
||||
margin: 4px 0 0 0;
|
||||
}
|
||||
|
||||
#menuBar1 #scaleControl {
|
||||
float: right;
|
||||
margin-left: 8px;
|
||||
margin: 0 4px 0 auto;
|
||||
}
|
||||
|
||||
#menuBar2 {
|
||||
width: 100%;
|
||||
margin-bottom: 4px;
|
||||
#menuBar1 div {
|
||||
margin: auto 5px;
|
||||
}
|
||||
|
||||
#menuBar2 div {
|
||||
text-align: left;
|
||||
float: left;
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
#menuBar2 #closeWindow {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#menuBar1:after,
|
||||
#menuBar2:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
height: 0;
|
||||
font-size: 0;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
#videoBar1 div {
|
||||
text-align: center;
|
||||
float: center;
|
||||
}
|
||||
|
||||
#videoBar1 #prevEvent {
|
||||
float: left;
|
||||
}
|
||||
|
||||
#videoBar1 #dlEvent {
|
||||
float: center;
|
||||
}
|
||||
|
||||
#videoBar1 #nextEvent {
|
||||
float: right;
|
||||
#nameControl input[type="button"]{
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#eventVideo {
|
||||
|
|
|
@ -29,70 +29,42 @@ span.noneCue {
|
|||
background: none;
|
||||
}
|
||||
|
||||
#header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#header h2, #header a {
|
||||
line-height: 1.1;
|
||||
margin:5px 0 0 0;
|
||||
}
|
||||
|
||||
#dataBar {
|
||||
width: 100%;
|
||||
margin: 2px auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#dataBar #dataTable {
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
#dataBar #dataTable td {
|
||||
text-align: center;
|
||||
padding: 2px;
|
||||
display: flex;
|
||||
flex-wrap:wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#menuBar1 {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
#menuBar1 #nameControl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
#menuBar1 #nameControl #eventName {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
#menuBar1 #replayControl {
|
||||
float: right;
|
||||
margin-left: 8px;
|
||||
margin: 4px 0 0 0;
|
||||
}
|
||||
|
||||
#menuBar1 #scaleControl {
|
||||
float: right;
|
||||
margin-left: 8px;
|
||||
margin: 0 4px 0 auto;
|
||||
}
|
||||
|
||||
#menuBar2 {
|
||||
width: 100%;
|
||||
margin-bottom: 4px;
|
||||
#menuBar1 div {
|
||||
margin: auto 5px;
|
||||
}
|
||||
|
||||
#menuBar2 div {
|
||||
text-align: left;
|
||||
float: left;
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
#menuBar2 #closeWindow {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#menuBar1:after,
|
||||
#menuBar2:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
height: 0;
|
||||
font-size: 0;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
#nameControl input[type="button"]{
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#eventVideo {
|
||||
|
|
|
@ -29,70 +29,47 @@ span.noneCue {
|
|||
background: none;
|
||||
}
|
||||
|
||||
#header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
flex-direction: column;
|
||||
margin: 0 0 4px 0;
|
||||
}
|
||||
|
||||
#header h2, #header a {
|
||||
line-height: 1.1;
|
||||
margin:5px 0 0 0;
|
||||
}
|
||||
|
||||
#dataBar {
|
||||
width: 100%;
|
||||
margin: 2px auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#dataBar #dataTable {
|
||||
width: 100%;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
#dataBar #dataTable td {
|
||||
text-align: center;
|
||||
padding: 2px;
|
||||
display: flex;
|
||||
flex-wrap:wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
#menuBar1 {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
clear: both;
|
||||
margin: 4px 0 0 0;
|
||||
}
|
||||
|
||||
#menuBar1 #nameControl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
#menuBar1 #nameControl #eventName {
|
||||
margin-right: 4px;
|
||||
}
|
||||
|
||||
#menuBar1 #replayControl {
|
||||
float: right;
|
||||
margin-left: 8px;
|
||||
#menuBar1 input, #menuBar1 select {
|
||||
padding: 2px 5px;
|
||||
}
|
||||
|
||||
#menuBar1 #scaleControl {
|
||||
float: right;
|
||||
margin-left: 8px;
|
||||
margin: 0 4px 0 auto;
|
||||
}
|
||||
|
||||
#menuBar2 {
|
||||
width: 100%;
|
||||
margin-bottom: 4px;
|
||||
#menuBar1 div {
|
||||
margin: auto 5px;
|
||||
}
|
||||
|
||||
#menuBar2 div {
|
||||
text-align: left;
|
||||
float: left;
|
||||
padding: 0 12px;
|
||||
}
|
||||
|
||||
#menuBar2 #closeWindow {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#menuBar1:after,
|
||||
#menuBar2:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
height: 0;
|
||||
font-size: 0;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
#nameControl input[type="button"]{
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#eventVideo {
|
||||
|
|
|
@ -97,34 +97,26 @@ xhtmlHeaders(__FILE__, translate('Event') );
|
|||
<body>
|
||||
<div id="page">
|
||||
<?php echo getNavBarHTML() ?>
|
||||
<div id="content">
|
||||
<div id="header">
|
||||
<?php
|
||||
if ( ! $Event->Id() ) {
|
||||
echo 'Event was not found.';
|
||||
} else {
|
||||
?>
|
||||
<div id="dataBar">
|
||||
<table id="dataTable" class="major">
|
||||
<tr>
|
||||
<td><span id="dataId" title="<?php echo translate('Id') ?>"><?php echo $Event->Id() ?></span></td>
|
||||
<td><span id="dataCause" title="<?php echo $Event->Notes()?validHtmlStr($Event->Notes()):translate('AttrCause') ?>"><?php echo validHtmlStr($Event->Cause()) ?></span></td>
|
||||
<td><span id="dataTime" title="<?php echo translate('Time') ?>"><?php echo strftime( STRF_FMT_DATETIME_SHORT, strtotime($Event->StartTime() ) ) ?></span></td>
|
||||
<td><span id="dataDuration" title="<?php echo translate('Duration') ?>"><?php echo $Event->Length() ?></span>s</td>
|
||||
<td><span id="dataFrames" title="<?php echo translate('AttrFrames')."/".translate('AttrAlarmFrames') ?>"><?php echo $Event->Frames() ?>/<?php echo $Event->AlarmFrames() ?></span></td>
|
||||
<td><span id="dataScore" title="<?php echo translate('AttrTotalScore')."/".translate('AttrAvgScore')."/".translate('AttrMaxScore') ?>"><?php echo $Event->TotScore() ?>/<?php echo $Event->AvgScore() ?>/<?php echo $Event->MaxScore() ?></span></td>
|
||||
</tr>
|
||||
</table>
|
||||
<span id="dataId" title="<?php echo translate('Id') ?>"><?php echo $Event->Id() ?></span>
|
||||
<span id="dataCause" title="<?php echo $Event->Notes()?validHtmlStr($Event->Notes()):translate('AttrCause') ?>"><?php echo validHtmlStr($Event->Cause()) ?></span>
|
||||
<span id="dataTime" title="<?php echo translate('Time') ?>"><?php echo strftime( STRF_FMT_DATETIME_SHORT, strtotime($Event->StartTime() ) ) ?></span>
|
||||
<span id="dataDuration" title="<?php echo translate('Duration') ?>"><?php echo $Event->Length().'s' ?></span>
|
||||
<span id="dataFrames" title="<?php echo translate('AttrFrames')."/".translate('AttrAlarmFrames') ?>"><?php echo $Event->Frames() ?>/<?php echo $Event->AlarmFrames() ?></span>
|
||||
<span id="dataScore" title="<?php echo translate('AttrTotalScore')."/".translate('AttrAvgScore')."/".translate('AttrMaxScore') ?>"><?php echo $Event->TotScore() ?>/<?php echo $Event->AvgScore() ?>/<?php echo $Event->MaxScore() ?></span>
|
||||
<div id="closeWindow"><a href="#" onclick="window.history.back();"><?php echo translate('Back') ?></a></div>
|
||||
</div>
|
||||
<div id="menuBar1">
|
||||
<div id="scaleControl"><label for="scale"><?php echo translate('Scale') ?></label><?php echo buildSelect( "scale", $scales, "changeScale();" ); ?></div>
|
||||
<div id="replayControl"><label for="replayMode"><?php echo translate('Replay') ?></label><?php echo buildSelect( "replayMode", $replayModes, "changeReplayMode();" ); ?></div>
|
||||
<div id="nameControl">
|
||||
<input type="text" id="eventName" name="eventName" value="<?php echo validHtmlStr($Event->Name()) ?>" />
|
||||
<input type="button" value="<?php echo translate('Rename') ?>" onclick="renameEvent()"<?php if ( !canEdit( 'Events' ) ) { ?> disabled="disabled"<?php } ?>/>
|
||||
</div>
|
||||
</div>
|
||||
<div id="menuBar2">
|
||||
<div id="closeWindow"><a href="#" onclick="window.history.back();"><?php echo translate('Back') ?></a></div>
|
||||
<?php
|
||||
if ( canEdit('Events') ) {
|
||||
?>
|
||||
|
@ -150,7 +142,11 @@ if ( canEdit('Events') ) {
|
|||
} // end if Event->DefaultVideo
|
||||
?>
|
||||
<div id="exportEvent"><a href="#" onclick="exportEvent();"><?php echo translate('Export') ?></a></div>
|
||||
<div id="scaleControl"><label for="scale"><?php echo translate('Scale') ?></label><?php echo buildSelect( "scale", $scales, "changeScale();" ); ?></div>
|
||||
<div id="replayControl"><label for="replayMode"><?php echo translate('Replay') ?></label><?php echo buildSelect( "replayMode", $replayModes, "changeReplayMode();" ); ?></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="content">
|
||||
<div id="eventVideo" class="">
|
||||
<?php
|
||||
if ( $Event->DefaultVideo() ) {
|
||||
|
|
Loading…
Reference in New Issue