add a slightly more intuitive ui

This commit is contained in:
sentriz
2020-03-11 18:32:58 +00:00
parent e27aa91c50
commit 72afab3e44
4 changed files with 44 additions and 39 deletions

View File

@@ -9,7 +9,9 @@
<body> <body>
<div id="content"> <div id="content">
<div id="header"> <div id="header">
<img src="{{ path "/admin/static/gonic.png" }}"> <a href="{{ path "/admin/home" }}">
<img src="{{ path "/admin/static/gonic.png" }}">
</a>
</div> </div>
{{ range $flash := .Flashes }} {{ range $flash := .Flashes }}
<div class="padded flash-{{ $flash.Type }}"> <div class="padded flash-{{ $flash.Type }}">

View File

@@ -22,11 +22,13 @@
<i class="mdi mdi-lastfm"></i> last.fm <i class="mdi mdi-lastfm"></i> last.fm
</div> </div>
<div class="text-right"> <div class="text-right">
<p class="light">have gonic scrobble to <a href="https://www.last.fm/">last.fm</a> on your behalf</p>
{{ if .User.IsAdmin }} {{ if .User.IsAdmin }}
<p class="light">you can get an api key <a href="https://www.last.fm/api/account/create" target="_blank">here</a></p> <br/>
<a href="{{ path "/admin/update_lastfm_api_key" }}">update api key</a><br/> <a href="{{ path "/admin/update_lastfm_api_key" }}">update api key&#8230;</a><br/>
{{ end }} {{ end }}
{{ if .CurrentLastFMAPIKey }} {{ if .CurrentLastFMAPIKey }}
<br/>
<span class="light">current status</span> <span class="light">current status</span>
{{ if .User.LastFMSession }} {{ if .User.LastFMSession }}
linked linked
@@ -34,12 +36,14 @@
<a href="{{ path "/admin/unlink_lastfm_do" }}">unlink</a><br/> <a href="{{ path "/admin/unlink_lastfm_do" }}">unlink</a><br/>
{{ else }} {{ else }}
<span class="angry">unlinked</span> <span class="angry">unlinked</span>
{{ $cbPath := path "/admin/link_lastfm_do" }} {{ $cbPath := path "/admin/link_lastfm_do" }}
{{ $cbURL := printf "%s%s" .RequestRoot $cbPath }} {{ $cbURL := printf "%s%s" .RequestRoot $cbPath }}
<a href="https://www.last.fm/api/auth/?api_key={{ .CurrentLastFMAPIKey }}&cb={{ $cbURL }}">link</a><br/> <a href="https://www.last.fm/api/auth/?api_key={{ .CurrentLastFMAPIKey }}&cb={{ $cbURL }}">link</a><br/>
{{ end }} {{ end }}
{{ else if not .User.IsAdmin }} {{ else if not .User.IsAdmin }}
<span class="light">api key not set. please ask your admin to set it</span> <br/>
<p class="light">api key not set</p>
<p class="light">please ask your admin to set it</p>
{{ end }} {{ end }}
</div> </div>
</div> </div>
@@ -54,16 +58,17 @@
<i>{{ $user.Name }}</i> <i>{{ $user.Name }}</i>
<span class="light no-small">{{ $user.CreatedAt | date }}</span> <span class="light no-small">{{ $user.CreatedAt | date }}</span>
<span class="light">&#124;</span> <span class="light">&#124;</span>
<a href="{{ printf "/admin/change_password?user=%s" $user.Name | path }}">change password</a> <a href="{{ printf "/admin/change_password?user=%s" $user.Name | path }}">change password&#8230;</a>
<span class="light">&#124;</span> <span class="light">&#124;</span>
{{ if $user.IsAdmin }} {{ if $user.IsAdmin }}
<span class="light">delete</span> <span class="light">delete&#8230;</span>
{{ else }} {{ else }}
<a href="{{ printf "/admin/delete_user?user=%s" $user.Name | path }}">delete</a> <a href="{{ printf "/admin/delete_user?user=%s" $user.Name | path }}">delete&#8230;</a>
{{ end }} {{ end }}
<br/> <br/>
{{ end }} {{ end }}
<a href="{{ path "/admin/create_user" }}" class="button">create new</a> <br/>
<a href="{{ path "/admin/create_user" }}" class="button">create new&#8230;</a>
</div> </div>
{{ else }} {{ else }}
{{/* user panel to manage themselves */}} {{/* user panel to manage themselves */}}
@@ -71,7 +76,7 @@
<i class="mdi mdi-account"></i> your account <i class="mdi mdi-account"></i> your account
</div> </div>
<div class="text-right"> <div class="text-right">
<a href="{{ path "/admin/change_own_password" }}" class="button">change password</a> <a href="{{ path "/admin/change_own_password" }}" class="button">change password&#8230;</a>
</div> </div>
{{ end }} {{ end }}
</div> </div>
@@ -117,16 +122,17 @@
</tr> </tr>
{{ end }} {{ end }}
</table> </table>
<br/>
<form <form
id="playlist-upload-form" id="playlist-upload-form"
enctype="multipart/form-data" enctype="multipart/form-data"
action="{{ path "/admin/upload_playlist_do" }}" action="{{ path "/admin/upload_playlist_do" }}"
method="post" method="post"
> >
<label for="playlist-upload-input"> <div style="position: relative;">
<a>upload m3u8 files</a> <input id="playlist-upload-input" style="position: absolute; opacity: 0;" name="playlist-files" type="file" multiple />
</label> <input type="button" value="upload m3u8">
<input id="playlist-upload-input" name="playlist-files" type="file" multiple /> </div>
</form> </form>
<script> <script>
document.getElementById("playlist-upload-input").onchange = (e) => { document.getElementById("playlist-upload-input").onchange = (e) => {

View File

@@ -4,8 +4,10 @@
<i class="mdi mdi-key-change"></i> updating last.fm keys <i class="mdi mdi-key-change"></i> updating last.fm keys
</div> </div>
<div class="text-right"> <div class="text-right">
<span class="light">current key</span> <i>{{ default "not set" .CurrentLastFMAPIKey }}</i><br/> <p class="light">(you can get an api key <a href="https://www.last.fm/api/account/create" target="_blank">here</a>)</p>
<span class="light">current secret</span> <i>{{ default "not set" .CurrentLastFMAPISecret }}</i> <br/>
<p><span class="light">current key</span> <i>{{ default "not set" .CurrentLastFMAPIKey }}</i></p>
<p><span class="light">current secret</span> <i>{{ default "not set" .CurrentLastFMAPISecret }}</i></p>
</div> </div>
<form action="{{ path "/admin/update_lastfm_api_key_do" }}" method="post"> <form action="{{ path "/admin/update_lastfm_api_key_do" }}" method="post">
<input type="text" id="api_key" name="api_key" placeholder="new key"> <input type="text" id="api_key" name="api_key" placeholder="new key">

View File

@@ -35,28 +35,19 @@ table td:not(:last-child)::after {
} }
} }
form input[type="file"] { input,
display: none; select,
} textarea {
border-radius: 0;
form input[type],
form select,
form textarea {
margin-bottom: 0;
}
form input {
padding: 3px;
border: 1px solid #ccc; border: 1px solid #ccc;
box-sizing: border-box; box-sizing: border-box;
margin: 1px 0;
padding: 0;
height: 20px;
} }
form input[type="password"], input[type="submit"],
form input[type="text"] { input[type="button"] {
margin-bottom: 0.25rem;
}
form input[type="submit"] {
width: 8rem; width: 8rem;
background-color: white; background-color: white;
cursor: pointer; cursor: pointer;
@@ -162,3 +153,7 @@ a:hover {
.light { .light {
color: #00000082; color: #00000082;
} }
.emp {
font-style: italic;
}