{{template "base" .}}
{{define "head"}}
<script src="/static/js/add_stream.js"></script>
{{end}}
{{define "content"}}
<h1>Add Stream</h1>
<form method="POST" class="pure-form pure-form-stacked">
    <label for="name">Stream Name:</label>
    <input type="text" id="name" name="name" placeholder="Stream Name" size="30">
    <span class="pure-form-message">{{.NameMessage}}</span>

    <label for="URL">URL:</label>
    <input type="text" id="URL" name="URL" placeholder="URL" size="100">
    <span class="pure-form-message">{{.URLMessage}}</span>

    <label for="interval">Interval (MS):</label>
    <input type="number" id="interval" name="interval" onchange="intervalChange()" value="5000" min="100">
    <span class="pure-form-message">{{.IntervalMessage}}</span>

    <label id="motion_interval_label" for="motion_interval">Motion Interval (MS): 1000</label>
    <input type="range" id="motion_interval" name="motion_interval" onchange="motionIntervalChange()" value="1000" min="50" max="5000">
    <span class="pure-form-message">{{.MotionIntervalMessage}}</span>
    
    <button type="submit" class="pure-button pure-button-primary">Submit</button>
</form>
{{end}}