oppi.li
selfhostable, read-only reddit client
implement back button, restructure sort-opts
-1
src/index.js
-1
src/index.js
···
1
1
const express = require("express");
2
2
const rateLimit = require("express-rate-limit");
3
3
const path = require("node:path");
4
-
const geddit = require("./geddit.js");
5
4
const cookieParser = require("cookie-parser");
6
5
const app = express();
7
6
const hasher = new Bun.CryptoHasher("sha256", "secret-key");
+5
-4
src/mixins/post.pug
+5
-4
src/mixins/post.pug
···
1
1
include ../utils
2
2
include postUtils
3
-
mixin post(p)
3
+
mixin post(p, currentUrl)
4
+
- var from = encodeURIComponent(currentUrl)
4
5
article.post
5
-
div.post-container
6
+
div(id=`${p.id}`).post-container
6
7
div.post-text
7
8
div.title-container
8
-
a(href=`/comments/${p.id}`)
9
+
a(href=`/comments/${p.id}?from=${from}`)
9
10
!= p.title
10
11
span.domain (#{p.domain})
11
12
div.info-container
···
19
20
| ·
20
21
a(href=`/r/${p.subreddit}`) r/#{p.subreddit}
21
22
| ·
22
-
a(href=`/comments/${p.id}`) #{fmtnum (p.num_comments)} ↩
23
+
a(href=`/comments/${p.id}?from=${from}`) #{fmtnum (p.num_comments)} ↩
23
24
div.media-preview
24
25
if isPostGallery(p)
25
26
- var item = postGalleryItems(p)[0]
+28
-6
src/public/styles.css
+28
-6
src/public/styles.css
···
93
93
}
94
94
95
95
.sort-opts {
96
-
display: flex;
97
-
flex-direction: row;
98
-
flex-wrap: wrap;
99
-
justify-content: space-between;
96
+
display: grid;
97
+
margin: 10px;
100
98
}
101
99
102
-
.sort-opts a {
103
-
margin: 10px;
100
+
.sort-opts {
101
+
grid-template-columns: repeat(2, 1fr);
102
+
grid-template-rows: repeat(5, 1fr);
103
+
grid-auto-flow: column;
104
104
}
105
105
106
106
.footer {
···
234
234
form {
235
235
width: 40%;
236
236
}
237
+
.sort-opts {
238
+
grid-template-columns: repeat(9, 1fr);
239
+
grid-template-rows: repeat(1, 1fr);
240
+
grid-auto-flow: row;
241
+
}
237
242
}
238
243
239
244
@media (min-width: 1080px) {
···
260
265
form {
261
266
width: 20%;
262
267
}
268
+
.sort-opts {
269
+
grid-template-columns: repeat(9, 1fr);
270
+
grid-template-rows: repeat(1, 1fr);
271
+
grid-auto-flow: row;
272
+
}
263
273
}
264
274
265
275
@media (min-width: 2560px) {
266
276
.post, .comments-container, .hero, .header, .footer {
267
277
flex: 1 1 40%;
268
278
width: 40%;
279
+
}
280
+
.sort-opts {
281
+
grid-template-columns: repeat(9, 1fr);
282
+
grid-template-rows: repeat(1, 1fr);
283
+
grid-auto-flow: row;
269
284
}
270
285
}
271
286
···
583
598
.comment-info-container > p {
584
599
margin-top: 0px;
585
600
}
601
+
602
+
select {
603
+
-webkit-appearance: none;
604
+
-moz-appearance: none;
605
+
text-indent: 1px;
606
+
text-overflow: '';
607
+
}
+3
-1
src/routes/index.js
+3
-1
src/routes/index.js
···
6
6
const { db } = require("../db");
7
7
const { authenticateToken, authenticateAdmin } = require("../auth");
8
8
const { validateInviteToken } = require("../invite");
9
+
const url = require("url");
9
10
10
11
const router = express.Router();
11
12
const G = new geddit.Geddit();
···
54
55
isMulti,
55
56
user: req.user,
56
57
isSubbed,
58
+
currentUrl: req.url,
57
59
});
58
60
});
59
61
···
65
67
limit: 50,
66
68
};
67
69
response = await G.getSubmissionComments(id, params);
68
-
69
70
res.render("comments", {
70
71
data: unescape_submission(response),
71
72
user: req.user,
73
+
from: req.query.from,
72
74
});
73
75
});
74
76
+5
src/views/comments.pug
+5
src/views/comments.pug
+20
-11
src/views/index.pug
+20
-11
src/views/index.pug
···
35
35
details
36
36
summary.sorting sorting by #{query.sort + (query.t?' '+query.t:'')}
37
37
div.sort-opts
38
-
a(href=`/r/${subreddit}?sort=hot`) hot
39
-
a(href=`/r/${subreddit}?sort=new`) new
40
-
a(href=`/r/${subreddit}?sort=rising`) rising
41
-
a(href=`/r/${subreddit}?sort=top`) top
42
-
a(href=`/r/${subreddit}?sort=top&t=day`) top day
43
-
a(href=`/r/${subreddit}?sort=top&t=week`) top week
44
-
a(href=`/r/${subreddit}?sort=top&t=month`) top month
45
-
a(href=`/r/${subreddit}?sort=top&t=year`) top year
46
-
a(href=`/r/${subreddit}?sort=top&t=all`) top all
38
+
div
39
+
a(href=`/r/${subreddit}?sort=hot`) hot
40
+
div
41
+
a(href=`/r/${subreddit}?sort=new`) new
42
+
div
43
+
a(href=`/r/${subreddit}?sort=rising`) rising
44
+
div
45
+
a(href=`/r/${subreddit}?sort=top`) top
46
+
div
47
+
a(href=`/r/${subreddit}?sort=top&t=day`) top day
48
+
div
49
+
a(href=`/r/${subreddit}?sort=top&t=week`) top week
50
+
div
51
+
a(href=`/r/${subreddit}?sort=top&t=month`) top month
52
+
div
53
+
a(href=`/r/${subreddit}?sort=top&t=year`) top year
54
+
div
55
+
a(href=`/r/${subreddit}?sort=top&t=all`) top all
47
56
48
57
if posts
49
58
each child in posts.posts
50
-
+post(child.data)
51
-
59
+
+post(child.data, currentUrl)
60
+
52
61
if posts.after
53
62
div.footer
54
63
div.footer-item