82 lines
2.7 KiB
HTML
82 lines
2.7 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<!-- vim: set et: -->
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<title>moonfire ui</title>
|
||
|
|
<script src="bundle.js"></script>
|
||
|
|
<style type="text/css">
|
||
|
|
#nav {
|
||
|
|
position: fixed;
|
||
|
|
left: 0px;
|
||
|
|
top: 0px;
|
||
|
|
width: 17em;
|
||
|
|
}
|
||
|
|
.ui-datepicker { width: 100%; }
|
||
|
|
|
||
|
|
#videos {
|
||
|
|
margin-left: 18em;
|
||
|
|
}
|
||
|
|
#videos tbody:after {
|
||
|
|
content: '';
|
||
|
|
display: block;
|
||
|
|
height: 3ex;
|
||
|
|
}
|
||
|
|
tbody .name {
|
||
|
|
background-color: #eee;
|
||
|
|
}
|
||
|
|
tr.r:hover { background-color: #ddd; }
|
||
|
|
tr.r th, tr.r td { padding: 0.5ex 1.5em; text-align: right; }
|
||
|
|
|
||
|
|
.ui-dialog .ui-dialog-content {
|
||
|
|
overflow: visible; /* remove stupid scroll bars when resizing. */
|
||
|
|
padding: 0;
|
||
|
|
}
|
||
|
|
video {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div id="nav">
|
||
|
|
<form action="#">
|
||
|
|
<fieldset id="cameras">
|
||
|
|
<legend>Cameras</legend>
|
||
|
|
</fieldset>
|
||
|
|
<fieldset id="datetime">
|
||
|
|
<legend>Datetime range</legend>
|
||
|
|
<div id="start-date"></div>
|
||
|
|
<input id="start-time" name="start-time" type="text" title="Starting
|
||
|
|
time within the day. Blank for the beginning of the day. Otherwise
|
||
|
|
HH:mm[:ss[:FFFFF]][+-HH:mm], where F is 90,000ths of a second.
|
||
|
|
Timezone is normally left out; it's useful once a year during the
|
||
|
|
ambiguous times of the "fall back" hour."><br>
|
||
|
|
<input type="radio" name="end-date-type" id="end-date-same" checked>
|
||
|
|
<label for="end-date-same">to same day</label><br>
|
||
|
|
<input type="radio" name="end-date-type" id="end-date-other">
|
||
|
|
<label for="end-date-other">to other day</label>
|
||
|
|
<div id="end-date"></div>
|
||
|
|
<input id="end-time" name="end-time" type="text" title="Ending
|
||
|
|
time within the day. Blank for the end of the day. Otherwise
|
||
|
|
HH:mm[:ss[:FFFFF]][+-HH:mm], where F is 90,000ths of a second.
|
||
|
|
Timezone is normally left out; it's useful once a year during the
|
||
|
|
ambiguous times of the "fall back" hour."><br>
|
||
|
|
</fieldset>
|
||
|
|
<label for="split">Max video length</label>
|
||
|
|
<select name="split" id="split">
|
||
|
|
<option value="324000000">1 hour</option>
|
||
|
|
<option value="1296000000">4 hours</option>
|
||
|
|
<option value="7776000000">24 hours</option>
|
||
|
|
<option value="">infinite</option>
|
||
|
|
</select><br>
|
||
|
|
<input type="checkbox" checked id="trim" name="trim">
|
||
|
|
<label for="trim">Trim segment start/end</label><br>
|
||
|
|
<input type="checkbox" checked id="ts" name="ts">
|
||
|
|
<label for="ts">Timestamp track</label>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
<table id="videos"></table>
|
||
|
|
</body>
|
||
|
|
</html>
|
||
|
|
|