cntk-video-tagging-tool
Version:
An electron app for building end to end Object Detection Models with CNTK from Sample Videos.
91 lines (78 loc) • 4.04 kB
HTML
<!--
Demo html page for an example of hosting the
video-tagging control.
-->
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>Video Tagging Tool</title>
<!-- Insert this line above script imports for jquery -->
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
<script src="./bower_components/webcomponentsjs/webcomponents.min.js"></script>
<link rel="import" href="./bower_components/video-tagging/video-tagging.html">
<script src="./public/js/bootstrap.min.js"></script>
<script src="./public/js/bootstrap-tagsinput.min.js"></script>
<script src="./public/js/videotagging-ctnk-extension.js"></script>
<script src="./public/js/camshift.js"></script>
<script src="./public/js/scene-change-detector.js"></script>
<script src="./public/js/videotagging-tracking-extension.js"></script>
<script src="./index.js"></script>
<link rel="stylesheet" href="./public/css/bootstrap-tagsinput.css" />
<link rel="stylesheet" href="./public/css/styles.css">
</head>
<body>
<div id="container">
<div id ='load-message' onclick="fileSelected();">
<div id = "load-text"><h2>Please <b>Drag in</b> or <b>Click</b> to load a video for tagging.</h2></div>
<img id="vidImage" src ="./public/images/Wikiversity-Mooc-Icon-Video.svg.png" ></img>
</div>
<div id ='load-form-container' style ="display: none">
<h2>Tagging Job Configuration</h2>
<div class="form-group" id="framerateGroup">
<label for="exampleTextarea" title="(How many frames to extract per a second of video!)">Frame Extraction Rate (frames per a video second)</label>
<input id="framerate" type="number" min="1" max="60" value="1" maxlength="3" size="3" class="form-control" />
</div>
<div class="form-group">
<label for="exampleTextarea" title="(Type of region selector to tag frames)">Region Type</label>
<select id="regiontype" class="form-control" id="text" onchange="checkPointRegion();">
<option selected="selected">Rectangle</option>
<!--option>Point</option-->
<option>Square</option>
</select>
</div>
<div class="regionGroup">
<div class="form-group" id="regionPointGroup" style ="display: none">
<label for="exampleTextarea" title="(Region Size for point selector!)">Point Region Size</label>
<input class="form-control" type="text" value="25" id="regionsize"/>
</div>
</div>
<div class="form-group">
<label for="exampleTextarea" title="(Which frame to Export to.)">Export Until: </label>
<select id="exportTo" class="form-control" id="text" >
<option value="tagged" selected="selected">Last Tagged Region</option>
<option value="visited">Last Visited Frame</option>
<option value="last">Last Frame</option>
</select>
</div>
<div class="form-group">
<label for="Out"> Output Path</label>
<input id="output" class="form-control" type="text" />
</div>
<div class="form-group">
<label for="Model"> Model Path</label>
<input id="model" class="form-control" type="text" />
</div>
<div class="form-group">
<label for="Tags"> Labels (Required)</label>
<input id="inputtags" class="form-control" type="text" data-role="tagsinput" required/>
</div>
<div id="loadButton" class="btn btn-primary">Continue</div>
</div>
<div id='video-tagging-container' style="display: none">
<video-tagging id='video-tagging' ></video-tagging>
</div>
</div>
</body>
</html>