Convert every page to new layout

This commit is contained in:
2019-09-17 23:38:40 +02:00
parent b1107236cd
commit 9f836801f2
28 changed files with 586 additions and 642 deletions

View File

@@ -44,7 +44,7 @@
</head>
<body>
{{template "menu" .}}
{{template "page_top" .}}
<br/>
<div class="file_manager">
<div class="nav_bar highlight_light">
@@ -73,7 +73,7 @@
</div>
</div>
{{template "page_bottom" .}}
{{template "analytics"}}
</body>
</html>

View File

@@ -1,77 +0,0 @@
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<title>List Browser ~ PixelDrain</title>
<meta charset="UTF-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" href="/res/style/home.css"/>
<link rel="stylesheet" href="/res/style/season.css"/>
<link rel="stylesheet" href="/res/style/history.css"/>
<link rel="stylesheet" href="/res/style/menu.css"/>
<link href='https://fonts.googleapis.com/css?family=Ubuntu' rel='stylesheet' type='text/css'/>
<link href="https://fonts.googleapis.com/css?family=Lato:100" rel="stylesheet" type="text/css"/>
<link rel="shortcut icon" href="/res/img/tray32.png"/>
<meta name="theme-color" content="#9FCF6C"/>
<link rel="icon" sizes="180x180" href="/res/img/pixeldrain.png"/>
<link rel="icon" sizes="256x256" href="/res/img/pixeldrain_big.png"/>
<style th:include="fragments :: background-pattern" th:inline="text"></style>
<meta name="description" content="PixelDrain is a free file sharing service, you
can upload any file and you will be given a shareable link right away.
PixelDrain also supports previews for images, videos, audio, PDFs and much more.
Uncensored, unmonitored and unmoderated."/>
</head>
<body>
<div id='body' class="body">
<div th:replace="fragments :: menu"></div>
<br/>
<div style="margin-left: 0; margin-right: 0; text-align: center; font-size: 22px;">
<a th:href="'/account/lists?pageid=' + ${pageid - 1}">Previous</a>
&nbsp;&nbsp;&#60;--&nbsp;&nbsp;<span th:text="${pageid}">0</span>&nbsp;&nbsp;--&#62;&nbsp;&nbsp;
<a th:href="'/account/lists?pageid=' + ${pageid + 1}">Nextious</a>
</div>
<div id="uploadedFiles" class="uploadedFiles">
<div class="uploadItem" th:each="list,interation : ${lists}" th:inline="text">
<a th:href="'/l/' + ${list.get('id')}" target="_blank">
<img th:src="${list.get('image')}" alt="" class="uploadItemImage"/>
</a>
<a th:href="'/l/' + ${list.get('id')}" target="_blank" class="uploadItemText">
[[${list.get('title')}]]
<br/>
[[${list.get('fileCount')}]] Items
<br/>
<span th:text="${list.get('date')}"></span>
</a>
</div>
</div>
<div style="margin-left: 0; margin-right: 0; text-align: center; font-size: 22px;">
<a th:href="'/account/lists?pageid=' + ${pageid - 1}">Previous</a>
&nbsp;&nbsp;&#60;--&nbsp;&nbsp;<span th:text="${pageid}">0</span>&nbsp;&nbsp;--&#62;&nbsp;&nbsp;
<a th:href="'/account/lists?pageid=' + ${pageid + 1}">Nextious</a>
</div>
</div>
<!-- Google Analytics Tracking Code -->
<script>
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-24463738-4', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>

View File

@@ -5,31 +5,33 @@
{{template "user_style" .}}
</head>
<body>
<div id='body' class="body">
{{template "menu" .}}
{{template "page_top" .}}
<h1>Please confirm that you want to log out of your pixeldrain account</h1>
<h1>Please confirm that you want to log out of your pixeldrain account</h1>
<form method="POST" action="/logout" class="highlight_light">
<div class="page_content">
<br/>
<form method="POST" action="/logout">
<input type="submit" value="I want to log out of pixeldrain on this computer" class="button_highlight"/>
</form>
<br/>
<h2>Why do I need to confirm my logout?</h2>
<p>
We need you to confirm your action so we can be sure that you
really requested a logout. If we didn't do this, anyone (or any
website) would be able to send you to this page and you would
automatically get logged out of pixeldrain, which would be very
annoying.
</p>
<p>
To prevent this from happening we're verifying that you actually
want to log out by making you click this button. Because this
logout button triggers a different request type than normal
page visit we can confirm that you really want to log out.
</p>
{{template "footer"}}
<div class="limit_width">
<br/>
<h2>Why do I need to confirm my logout?</h2>
<p>
We need you to confirm your action so we can be sure that you
really requested a logout. If we didn't do this, anyone (or any
website) would be able to send you to this page and you would
automatically get logged out of pixeldrain, which would be very
annoying.
</p>
<p>
To prevent this from happening we're verifying that you actually
want to log out by making you click this button. Because this
logout button triggers a different request type than normal
page visit we can confirm that you really want to log out.
</p>
</div>
</div>
{{template "page_bottom" .}}
{{template "analytics"}}
</body>
</html>

View File

@@ -8,55 +8,56 @@
<body>
{{template "page_top" .}}
<br/>
<div class="centered">
These files were uploaded while logged in to your pixeldrain account,
<a href="/history">click here</a> to view files uploaded anonymously
in this browser.
</div>
<br/>
<br/>
{{$limit := 200}}
{{$page := .URLQuery.Get "page" | pageNr}}
{{$files := .PixelAPI.UserFiles $page $limit}}
<div class="highlight_dark">
{{if ne $page 0}}
<a href="?page={{sub $page 4}}" class="button">🡄 4 Pages</a>
<a href="?page={{sub $page 2}}" class="button">⬅ 2 Pages</a>
<a href="?page={{sub $page 1}}" class="button button_highlight" style="margin-right: 2em;">← Last Page</a>
{{end}}
Page {{$page}}
{{if len $files.Files | eq $limit}}
<a href="?page={{add $page 1}}" class="button button_highlight" style="margin-left: 2em;">Next Page →</a>
<a href="?page={{add $page 2}}" class="button">2 Pages ⮕</a>
<a href="?page={{add $page 4}}" class="button">4 Pages 🡆</a>
{{end}}
</div>
<br/>
{{range $files.Files}}<!--
--><a class="file_button" href="/u/{{.ID}}" target="_blank">
<img src="{{$.APIEndpoint}}/file/{{.ID}}/thumbnail" alt="{{.Name}}" />
<span style="color: var(--highlight_color);">{{.Name}}</span>
<h1>My Files</h1>
<div class="page_content">
<p>
These files were uploaded while logged in to your pixeldrain account,
<a href="/history">click here</a> to view files uploaded anonymously
in this browser.
</p>
<br/>
{{.DateUpload.Format "2006-01-02 15:04:05"}}
</a><!--
-->{{end}}
<br/>
<div class="highlight_dark">
{{if ne $page 0}}
<a href="?page={{sub $page 4}}" class="button">🡄 4 Pages</a>
<a href="?page={{sub $page 2}}" class="button">⬅ 2 Pages</a>
<a href="?page={{sub $page 1}}" class="button button_highlight" style="margin-right: 2em;">← Last Page</a>
{{end}}
Page {{$page}}
{{if len $files.Files | eq $limit}}
<a href="?page={{add $page 1}}" class="button button_highlight" style="margin-left: 2em;">Next Page →</a>
<a href="?page={{add $page 2}}" class="button">2 Pages ⮕</a>
<a href="?page={{add $page 4}}" class="button">4 Pages 🡆</a>
{{end}}
{{$limit := 200}}
{{$page := .URLQuery.Get "page" | pageNr}}
{{$files := .PixelAPI.UserFiles $page $limit}}
<div class="highlight_dark">
{{if ne $page 0}}
<a href="?page={{sub $page 4}}" class="button">🡄 4 Pages</a>
<a href="?page={{sub $page 2}}" class="button">⬅ 2 Pages</a>
<a href="?page={{sub $page 1}}" class="button button_highlight" style="margin-right: 2em;">← Last Page</a>
{{end}}
Page {{$page}}
{{if len $files.Files | eq $limit}}
<a href="?page={{add $page 1}}" class="button button_highlight" style="margin-left: 2em;">Next Page</a>
<a href="?page={{add $page 2}}" class="button">2 Pages ⮕</a>
<a href="?page={{add $page 4}}" class="button">4 Pages 🡆</a>
{{end}}
</div>
<br/>
{{range $files.Files}}<!--
--><a class="file_button" href="/u/{{.ID}}" target="_blank">
<img src="{{$.APIEndpoint}}/file/{{.ID}}/thumbnail" alt="{{.Name}}" />
<span style="color: var(--highlight_color);">{{.Name}}</span>
<br/>
{{.DateUpload.Format "2006-01-02 15:04:05"}}
</a><!--
-->{{end}}
<br/>
<div class="highlight_dark">
{{if ne $page 0}}
<a href="?page={{sub $page 4}}" class="button">🡄 4 Pages</a>
<a href="?page={{sub $page 2}}" class="button">⬅ 2 Pages</a>
<a href="?page={{sub $page 1}}" class="button button_highlight" style="margin-right: 2em;">← Last Page</a>
{{end}}
Page {{$page}}
{{if len $files.Files | eq $limit}}
<a href="?page={{add $page 1}}" class="button button_highlight" style="margin-left: 2em;">Next Page →</a>
<a href="?page={{add $page 2}}" class="button">2 Pages ⮕</a>
<a href="?page={{add $page 4}}" class="button">4 Pages 🡆</a>
{{end}}
</div>
</div>
{{template "page_bottom" .}}

View File

@@ -9,12 +9,9 @@
<body>
{{template "page_top" .}}
<div class="checkers inset highlight_dark">
<h1>Welcome home, {{.Username}}!</h1>
</div>
<div class="centered">
<h1>Welcome home, {{.Username}}!</h1>
<div class="page_content"><div class="limit_width">
<h2>Actions</h2>
<ul>
<li><a href="/user/change_password" class="button">Change my password</a></li>
@@ -50,7 +47,8 @@
<br/>
<a href="/user/lists" class="button">...All my lists</a>
</div>
</div>
<br/><br/>
</div></div>
{{template "page_bottom" .}}

View File

@@ -7,50 +7,53 @@
</head>
<body>
{{template "menu" .}}
{{$limit := 200}}
{{$page := .URLQuery.Get "page" | pageNr}}
{{$lists := .PixelAPI.UserLists $page $limit}}
<div class="highlight_dark">
{{if ne $page 0}}
<a href="?page={{sub $page 4}}" class="button">🡄 4 Pages</a>
<a href="?page={{sub $page 2}}" class="button">⬅ 2 Pages</a>
<a href="?page={{sub $page 1}}" class="button button_highlight" style="margin-right: 2em;">← Last Page</a>
{{end}}
Page {{$page}}
{{if len $lists.Lists | eq $limit}}
<a href="?page={{add $page 1}}" class="button button_highlight" style="margin-left: 2em;">Next Page →</a>
<a href="?page={{add $page 2}}" class="button">2 Pages ⮕</a>
<a href="?page={{add $page 4}}" class="button">4 Pages 🡆</a>
{{end}}
{{template "page_top" .}}
<h1>My Lists</h1>
<div class="page_content">
{{$limit := 200}}
{{$page := .URLQuery.Get "page" | pageNr}}
{{$lists := .PixelAPI.UserLists $page $limit}}
<div class="highlight_dark">
{{if ne $page 0}}
<a href="?page={{sub $page 4}}" class="button">🡄 4 Pages</a>
<a href="?page={{sub $page 2}}" class="button">⬅ 2 Pages</a>
<a href="?page={{sub $page 1}}" class="button button_highlight" style="margin-right: 2em;">← Last Page</a>
{{end}}
Page {{$page}}
{{if len $lists.Lists | eq $limit}}
<a href="?page={{add $page 1}}" class="button button_highlight" style="margin-left: 2em;">Next Page</a>
<a href="?page={{add $page 2}}" class="button">2 Pages ⮕</a>
<a href="?page={{add $page 4}}" class="button">4 Pages 🡆</a>
{{end}}
</div>
<br/>
{{range $lists.Lists}}<!--
--><a class="file_button" href="/l/{{.ID}}" target="_blank">
<img src="{{$.APIEndpoint}}/list/{{.ID}}/thumbnail" alt="{{.Title}}" />
<span style="color: var(--highlight_color);">{{.Title}}</span>
({{.FileCount}} Files)
<br/>
{{.DateCreated.Format "2006-01-02 15:04:05"}}
</a><!--
-->{{end}}
<br/>
<div class="highlight_dark">
{{if ne $page 0}}
<a href="?page={{sub $page 4}}" class="button">🡄 4 Pages</a>
<a href="?page={{sub $page 2}}" class="button">⬅ 2 Pages</a>
<a href="?page={{sub $page 1}}" class="button button_highlight" style="margin-right: 2em;">← Last Page</a>
{{end}}
Page {{$page}}
{{if len $lists.Lists | eq $limit}}
<a href="?page={{add $page 1}}" class="button button_highlight" style="margin-left: 2em;">Next Page →</a>
<a href="?page={{add $page 2}}" class="button">2 Pages ⮕</a>
<a href="?page={{add $page 4}}" class="button">4 Pages 🡆</a>
{{end}}
</div>
</div>
<br/>
{{range $lists.Lists}}<!--
--><a class="file_button" href="/l/{{.ID}}" target="_blank">
<img src="{{$.APIEndpoint}}/list/{{.ID}}/thumbnail" alt="{{.Title}}" />
<span style="color: var(--highlight_color);">{{.Title}}</span>
({{.FileCount}} Files)
<br/>
{{.DateCreated.Format "2006-01-02 15:04:05"}}
</a><!--
-->{{end}}
<br/>
<div class="highlight_dark">
{{if ne $page 0}}
<a href="?page={{sub $page 4}}" class="button">🡄 4 Pages</a>
<a href="?page={{sub $page 2}}" class="button">⬅ 2 Pages</a>
<a href="?page={{sub $page 1}}" class="button button_highlight" style="margin-right: 2em;">← Last Page</a>
{{end}}
Page {{$page}}
{{if len $lists.Lists | eq $limit}}
<a href="?page={{add $page 1}}" class="button button_highlight" style="margin-left: 2em;">Next Page →</a>
<a href="?page={{add $page 2}}" class="button">2 Pages ⮕</a>
<a href="?page={{add $page 4}}" class="button">4 Pages 🡆</a>
{{end}}
</div>
{{template "page_bottom" .}}
{{template "analytics"}}
</body>
</html>

View File

@@ -7,16 +7,17 @@
</head>
<body>
<div id='body' class="body">
{{template "menu" .}}
<h1>User configuration</h1>
{{template "page_top" .}}
<h1>User configuration</h1>
<div class="page_content"><div class="limit_width">
<p>What would you like to do?</p>
<ul>
<li><a href="/user/change_password">Change my password</a></li>
</ul>
{{template "footer"}}
</div>
</div></div>
{{template "page_bottom" .}}
{{template "analytics"}}
</body>
</html>