ZaneYork
/
zoneminder
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add dateTime picker to filter

This commit is contained in:
digital-gnome 2017-12-15 22:57:42 -05:00
parent 2e56210007
commit d7532b0340
6 changed files with 3590 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/skins/classic/includes/functions.php
View File

@ -97,6 +97,10 @@ if ( file_exists( "skins/$skin/css/$css/graphics/favicon.ico" ) ) {
<script type="text/javascript" src="skins/<?php echo $skin; ?>/js/jquery-ui.js"></script>
<script type="text/javascript" src="skins/<?php echo $skin; ?>/js/bootstrap.min.js"></script>
<script type="text/javascript" src="skins/<?php echo $skin; ?>/js/chosen/chosen.jquery.min.js"></script>
<script type="text/javascript" src="skins/<?php echo $skin; ?>/js/jquery-ui-timepicker-addon.js"></script>
<link href="skins/<?php echo $skin ?>/js/jquery-ui-timepicker-addon.css" rel="stylesheet">
<link href="skins/<?php echo $skin ?>/js/jquery-ui.css" rel="stylesheet">
<link href="skins/<?php echo $skin ?>/js/chosen/chosen.min.css" rel="stylesheet">
<script type="text/javascript">
//<![CDATA[

30
web/skins/classic/js/dateTimePicker/jquery-ui-timepicker-addon.css Normal file
View File

@ -0,0 +1,30 @@
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 40%; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }
.ui-timepicker-div .ui_tpicker_unit_hide{ display: none; }
.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { background: none; color: inherit; border: none; outline: none; border-bottom: solid 1px #555; width: 95%; }
.ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus { border-bottom-color: #aaa; }
.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
.ui-timepicker-rtl dl dt{ float: right; clear: right; }
.ui-timepicker-rtl dl dd { margin: 0 40% 10px 10px; }
/* Shortened version style */
.ui-timepicker-div.ui-timepicker-oneLine { padding-right: 2px; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time,
.ui-timepicker-div.ui-timepicker-oneLine dt { display: none; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time_label { display: block; padding-top: 2px; }
.ui-timepicker-div.ui-timepicker-oneLine dl { text-align: right; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd,
.ui-timepicker-div.ui-timepicker-oneLine dl dd > div { display:inline-block; margin:0; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_minute:before,
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_second:before { content:':'; display:inline-block; }
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_millisec:before,
.ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_microsec:before { content:'.'; display:inline-block; }
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide,
.ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide:before{ display: none; }

2291
web/skins/classic/js/dateTimePicker/jquery-ui-timepicker-addon.js vendored Normal file
View File

File diff suppressed because it is too large Load Diff

1225
web/skins/classic/js/jquery-ui.css vendored Normal file
View File

File diff suppressed because it is too large Load Diff

22
web/skins/classic/views/filter.php
View File

@ -125,8 +125,6 @@ $archiveTypes = array(
'1' => translate('ArchArchived')
);
$hasCal = file_exists( 'tools/jscalendar/calendar.js' );
$focusWindow = true;
$storageareas = array();
@ -235,19 +233,23 @@ for ( $i=0; $i < count($terms); $i++ ) {
<td><?php echo htmlSelect( "filter[Query][terms][$i][op]", $opTypes, $term['op'] ); ?></td>
<td>
<input type="text" name="filter[Query][terms][<?php echo $i ?>][val]" id="filter[Query][terms][<?php echo $i ?>][val]" value="<?php echo isset($term['val'])?validHtmlStr($term['val']):'' ?>"/>
<?php if ( $hasCal ) { ?>
<script type="text/javascript">Calendar.setup( { inputField: "filter[Query][terms][<?php echo $i ?>][val]", ifFormat: "%Y-%m-%d %H:%M", showsTime: true, timeFormat: "24", showOthers: true, weekNumbers: false });</script>
<?php } ?>
<script type="text/javascript">$j("[name$='\\[<?php echo $i ?>\\]\\[val\\]']").datetimepicker({timeFormat: "HH:mm:ss", dateFormat: "yy-mm-dd"}); </script>
</td>
<?php
} elseif ( $term['attr'] == 'Date' ) {
} elseif ( $term['attr'] == 'Date' || $term['attr'] == 'StartDate' || $term['attr'] == 'EndDate') {
?>
<td><?php echo htmlSelect( "filter[Query][terms][$i][op]", $opTypes, $term['op'] ); ?></td>
<td>
<input name="filter[Query][terms][<?php echo $i ?>][val]" id="filter[Query][terms][<?php echo $i ?>][val]" value="<?php echo isset($term['val'])?validHtmlStr($term['val']):'' ?>"/>
<?php if ( $hasCal ) { ?>
<script type="text/javascript">Calendar.setup( { inputField: "filter[Query][terms][<?php echo $i ?>][val]", ifFormat: "%Y-%m-%d", showOthers: true, weekNumbers: false });</script>
<?php } ?>
<input type="text" name="filter[Query][terms][<?php echo $i ?>][val]" id="filter[Query][terms][<?php echo $i ?>][val]" value="<?php echo isset($term['val'])?validHtmlStr($term['val']):'' ?>"/>
<script type="text/javascript">$j("[name$='\\[<?php echo $i ?>\\]\\[val\\]']").datepicker({dateFormat: "yy-mm-dd"}); </script>
</td>
<?php
} elseif ( $term['attr'] == 'StartTime' || $term['attr'] == 'EndTime') {
?>
<td><?php echo htmlSelect( "filter[Query][terms][$i][op]", $opTypes, $term['op'] ); ?></td>
<td>
<input type="text" name="filter[Query][terms][<?php echo $i ?>][val]" id="filter[Query][terms][<?php echo $i ?>][val]" value="<?php echo isset($term['val'])?validHtmlStr($term['val']):'' ?>"/>
<script type="text/javascript">$j("[name$='\\[<?php echo $i ?>\\]\\[val\\]']").timepicker({timeFormat: "HH:mm:ss"}); </script>
</td>
<?php
} elseif ( $term['attr'] == 'StateId' ) {

32
web/skins/classic/views/js/filter.js
View File

@ -127,17 +127,17 @@ function parseRows (rows) {
inputTds.eq(1).html(obrSelect).children().val(obrVal); //Set bracket contents and assign saved value
inputTds.eq(5).html(cbrSelect).children().val(cbrVal);
} else {
inputTds.eq(1).html('&nbsp');
inputTds.eq(1).html('&nbsp'); //Blank if there aren't enough terms for brackets
inputTds.eq(5).html('&nbsp');
}
if (rows.length == 1) {
inputTds.eq(6).find(':input[value="-"]').prop('disabled', true);
inputTds.eq(6).find(':input[value="-"]').prop('disabled', true); //enable/disable remove row button
} else {
inputTds.eq(6).find(':input[value="-"]').prop('disabled', false);
}
if (inputTds.eq(2).children().val() == "Archived") {
if (inputTds.eq(2).children().val() == "Archived") { //Archived types
inputTds.eq(3).html('equal to<input type="hidden" name="filter[Query][terms][' + rowNum + '][op]" value="=">');
let archiveSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (let i = 0; i < archiveTypes.length; i++) {
@ -146,7 +146,7 @@ function parseRows (rows) {
let archiveVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(archiveSelect).children().val(archiveVal);
} else if (inputTds.eq(2).children().val().indexOf('Weekday') >= 0) {
} else if (inputTds.eq(2).children().val().indexOf('Weekday') >= 0) { //Weekday selection
let weekdaySelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (let i = 0; i < weekdays.length; i++) {
weekdaySelect.append('<option value="' + i + '">' + weekdays[i] + '</option>');
@ -154,24 +154,24 @@ function parseRows (rows) {
let weekdayVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(weekdaySelect).children().val(weekdayVal);
} else if (inputTds.eq(2).children().val() == 'StateId') {
} else if (inputTds.eq(2).children().val() == 'StateId') { //Run state
let stateSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (let key in states) {
stateSelect.append('<option value="' + key + '">' + states[key] + '</option>');
}
let stateVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(weekdaySelect).children().val(stateVal)
inputTds.eq(4).html(stateSelect).children().val(stateVal)
} else if (inputTds.eq(2).children().val() == 'ServerId') {
} else if (inputTds.eq(2).children().val() == 'ServerId') { //Select Server
let serverSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (let key in servers) {
serverSelect.append('<option value="' + key + '">' + servers[key] + '</option>');
}
let serverVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(weekdaySelect).children().val(serverVal)
inputTds.eq(4).html(serverSelect).children().val(serverVal)
} else if (inputTds.eq(2).children().val() == 'StorageId') {
} else if (inputTds.eq(2).children().val() == 'StorageId') { //Choose by storagearea
let storageSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (let i=0; i < storageareas.length; i++) {
storageSelect.append('<option value="' + i + '">' + storageareas[i] + '</option>');
@ -179,14 +179,14 @@ function parseRows (rows) {
let storageVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(storageSelect).children().val(storageVal)
} else if (inputTds.eq(2).children().val() == 'MonitorName') {
} else if (inputTds.eq(2).children().val() == 'MonitorName') { //Monitor names
let monitorSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][val]').attr('id', queryPrefix + rowNum + '][val]');
for (let key in monitors) {
monitorSelect.append('<option value="' + key + '">' + monitors[key] + '</option>');
}
let monitorVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(monitorSelect).children().val(monitorVal)
} else {
} else { //Reset to regular text field and operator for everything that isn't special
let opSelect = $j('<select></select>').attr('name', queryPrefix + rowNum + '][op]').attr('id', queryPrefix + rowNum + '][op]');
for (let key in opTypes) {
opSelect.append('<option value="' + key + '">' + opTypes[key] + '</option>');
@ -197,6 +197,14 @@ function parseRows (rows) {
let textVal = inputTds.eq(4).children().val();
inputTds.eq(4).html(textInput).children().val(textVal);
}
if (inputTds.eq(2).children().val().endsWith('DateTime')) { //Start/End DateTime
inputTds.eq(4).children().datetimepicker({timeFormat: "HH:mm:ss", dateFormat: "yy-mm-dd"});
} else if (inputTds.eq(2).children().val().endsWith('Date')) { //Start/End Date
inputTds.eq(4).children().datepicker({dateFormat: "yy-mm-dd"});
} else if (inputTds.eq(2).children().val().endsWith('Time')) { //Start/End Time
inputTds.eq(4).children().timepicker({timeFormat: "HH:mm:ss"});
}
let attr = inputTds.find("[name$='attr\\]']") // Set attr list id and name
let term = attr.attr('name').split(/[[\]]{1,2}/);
term.length--;
@ -204,7 +212,7 @@ function parseRows (rows) {
term[2] = rowNum;
inputTds.eq(2).children().attr('name', 'filter'+stringFilter(term));
inputTds.eq(2).children().attr('id', 'filter'+stringFilter(term));
}
}//End for each term/row
history.replaceState(null, null, '?view=filter&' + $j('#contentForm').serialize());
}