feedizer/cmd/feedizer/internal/templates/pages/home.html

160 lines
8.7 KiB
HTML

<!DOCTYPE html>
<html lang='en'>
<head>
{{ template "partials/head" . }}
<script type='text/javascript'>
function updateDescriptionCharCount() {
var desclen = document.getElementById('description').value.length;
document.getElementById('descriptionCharCount').innerHTML = desclen;
if (desclen < 1000)
document.getElementById('descriptionContainer').setAttribute('class', 'columns small-12');
else
document.getElementById('descriptionContainer').setAttribute('class', 'columns small-12 error');
}
</script>
</head>
<body>
{{ template "partials/header" . }}
<div class='grid-x grid-margin-x'>
<div class='cell small-12 medium-5 large-6'>
<p>
Make a feed of almost anything!*<br>
<span style='font-size: small;'>* Currently, everything means only HTTP(S)</span>
</p>
</div>
<div class='cell small-12 medium-7 large-6'>
<form action='/feed' method='post'>
<div class='grid-x grid-margin-x'>
<div class='cell small-12{{ if .Form.Name.HasError }} error{{ end }}'>
<label for=slug>Name <small>Required. Allowed Chars: a-z A-Z 0-9 _ . -</small></label>
<input type=text name=slug id=slug required pattern='^[a-zA-Z0-9_\.\+-]+$' placeholder='Name'
autofocus value='{{ .Form.Name.Value }}'>
{{ if .Form.Name.HasError }}<small class='error'>{{ .Form.Name.ErrorMessage }}</small>{{ end }}
</div>
</div>
<div class='grid-x grid-margin-x'>
<div class='cell small-12{{ if .Form.URI.HasError }} error{{ end }}'>
<label for=uri>URI <small>Required</small></label>
<input type=text name=uri id=uri required
pattern='^https?://[a-zA-Z0-9_\.-]+\.[a-zA-Z0-9]{2,}(/.*)?$'
placeholder='https://example.com/news/' value='{{ .Form.URI.Value }}'>
{{ if .Form.URI.HasError }}<small class='error'>{{ .Form.URI.ErrorMessage }}</small>{{ end }}
</div>
</div>
<div class='grid-x grid-margin-x'>
<div class='cell small-12 medium-12 large-12 {{ if .Form.Interval.HasError }} error{{ end }}'>
<label for=refresh_interval><span>Refresh interval</span></label>
<select name=interval id=interval required>
<option value=request {{ if eq .Form.Interval.Value "request" }}selected{{ end }}>on request
</option>
<option value='900' {{ if eq .Form.Interval.Value 900 }}selected{{ end }}>15 minutes
</option>
<option value='1800' {{ if eq .Form.Interval.Value 1800 }}selected{{ end }}>30 minutes
</option>
<option value='3600' {{ if or (eq .Form.Interval.Value 3600) (not .Form.Interval.Value)
}}selected{{ end }}>1 hour</option>
<option value='7200' {{ if eq .Form.Interval.Value 7200 }}selected{{ end }}>2 hours</option>
<option value='10800' {{ if eq .Form.Interval.Value 10800 }}selected{{ end }}>3 hours
</option>
<option value='21600' {{ if eq .Form.Interval.Value 21600 }}selected{{ end }}>6 hours
</option>
<option value='43200' {{ if eq .Form.Interval.Value 43200 }}selected{{ end }}>12 hours
</option>
<option value='86400' {{ if eq .Form.Interval.Value 86400 }}selected{{ end }}>24 hours
</option>
</select>
{{ if .Form.Interval.HasError }}<small class='error'>{{ .Form.Interval.ErrorMessage }}</small>{{
end }}
</div>
</div>
<div class='grid-x grid-margin-x{{ if .Form.Expire.HasError }} error{{ end }}'>
<!-- <div class='cell small-5 medium-6 large-2'>
<div class="switch">
<input class="switch-input" id="expire" type="checkbox" name="expire">
<label class="switch-paddle" for="expire">
<span class="show-for-sr">Expire?</span>
</label>
</div>
</div> -->
<div class='cell shrink'>
<div class="">
<input class="" id="expire" type="checkbox" name="expire">
<label class="" for="expire">Expire in</label>
</div>
</div>
<div class='cell auto'>
<div class="input-group">
<!-- <div class="input-group-label">
<input class="" id="expire" type="checkbox" name="expire">
<label class="show-for-sr" for="expire">Expire?</label>
</div> -->
<!-- <label class='input-group-label' for=expire>Expire in</label> -->
<input class="input-group-field" type=text name=expire_value id=expire_value
value='{{ .Form.Expire.Value }}'>
<select class='input-group-field' name=expire_unit id=expire_unit>
<option value='h' {{ if eq .Form.Expire.Unit "h" }}selected{{ end }}>hours</option>
<option value='d' {{ if eq .Form.Expire.Unit "d" }}selected{{ end }}>days</option>
<option value='w' {{ if eq .Form.Expire.Unit "w" }}selected{{ end }}>weeks</option>
<option value='m' {{ if eq .Form.Expire.Unit "m" }}selected{{ end }}>months
</option>
</select>
</div>
</div>
{{ if .Form.Expire.HasError }}<small class='error'>{{ .Form.Expire.ErrorMessage }}</small>{{ end
}}
</div>
<div class='grid-x grid-margin-x'>
<div class='cell small-12{{ if .Form.Description.HasError }} error{{ end }}'
id='descriptionContainer'>
<label for=description>Description <small>No HTML Allowed. <span
id='descriptionCharCount'>0</span> of 1000 Characters Used.</small></label>
<textarea name=description id=description rows=2
oninput='updateDescriptionCharCount()'>{{ .Form.Description.Value }}</textarea>
{{ if .Form.Description.HasError }}<small class='error'>{{ .Form.Description.ErrorMessage
}}</small>{{ end }}
</div>
</div>
<div class='grid-x grid-margin-x'>
<div class='cell small-12{{ if .Form.Password.HasError }} error{{ end }}'>
<label for=password>Password <small>for Editing and Deleting</small></label>
<input type=password name=password id=password oninput='passwordChanged()'>
{{ if .Form.Password.HasError }}<small class='error'>{{ .Form.Password.ErrorMessage }}</small>{{
end }}
</div>
</div>
<div class='grid-x grid-margin-x' id='password_verificationContainer'>
<div class='cell small-12{{ if .Form.PasswordVerification.HasError }} error{{ end }}'>
<label for=password_verification>Password verification</label>
<input type=password name=password_verification id=password_verification>
{{ if .Form.PasswordVerification.HasError }}<small class='error'>{{
.Form.PasswordVerification.ErrorMessage }}</small>{{ end }}
</div>
</div>
<div class='grid-x grid-margin-x'>
<div class='cell small-12'>
<input type=submit class='button' value='Feedize it!'>
</div>
</div>
</form>
</div>
</div>
{{ template "partials/footer" . }}
</body>
</html>