fedi/mlmym
1
0
Fork 0
mirror of https://github.com/rystaf/mlmym.git synced 2024-11-25 22:53:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

view images toggle

Browse source
This commit is contained in:
Ryan Stafford 2023-07-07 14:51:11 -04:00
parent 0a4888906a
commit d907420e58
5 changed files with 58 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
public/style.css
View file

@ -58,7 +58,7 @@ summary {
font-size: 14px; font-size: 14px;
margin-top: 17px; margin-top: 17px;
text-align: right; text-align: right;
min-width: 32px; min-width: 21px;
} }
.dark .post .rank { .dark .post .rank {
color: #646464; color: #646464;
@ -499,9 +499,12 @@ form.nsfw div {
font-size: 14px; font-size: 14px;
overflow: auto; overflow: auto;
} }
.expand .md img { .expando .md img {
max-width: 100%; max-width: 100%;
} }
.expando.open.showimage .md {
display: none;
}
.dark .expando .md { .dark .expando .md {
background-color: #262626; background-color: #262626;
color: #ddd; color: #ddd;
@ -804,7 +807,6 @@ nav .tabs {
} }
nav ul { nav ul {
white-space: nowrap;
list-style: none; list-style: none;
margin: 5px 2.5px 0px 2.5px; margin: 5px 2.5px 0px 2.5px;
padding: 0; padding: 0;
@ -813,9 +815,11 @@ nav ul {
} }
nav li { nav li {
white-space: nowrap;
margin: 0px 1px; margin: 0px 1px;
padding: 0px; padding: 0px;
display: inline; display: inline-block;
margin-top: 5px;
font-size: 12px; font-size: 12px;
font-weight: 700; font-weight: 700;
} }
@ -836,11 +840,13 @@ nav ul a {
} }
nav .selected a { nav .selected a {
color: orangered;
background-color: white; background-color: white;
border: 1px solid #00a846; border: 1px solid #00a846;
border-bottom: 1px solid white; border-bottom: 1px solid white;
} }
.dark nav .selected a { .dark nav .selected a {
color: #d25a32;
border-bottom: 1px solid #262626; border-bottom: 1px solid #262626;
} }

39
public/utils.js
View file

@ -103,6 +103,11 @@ function loadMore(e) {
request(window.location.origin+window.location.pathname+"?"+urlParams.toString(), "", function(res){ request(window.location.origin+window.location.pathname+"?"+urlParams.toString(), "", function(res){
if (res.trim()) { if (res.trim()) {
e.target.outerHTML = res + '<input id="loadmore" type="submit" data-page="'+(parseInt(page)+1)+'" value="load more" onclick="loadMore(event)">' e.target.outerHTML = res + '<input id="loadmore" type="submit" data-page="'+(parseInt(page)+1)+'" value="load more" onclick="loadMore(event)">'
if (showimages = document.getElementById("showimages")) {
if (showimages.className == "selected") {
toggle_images(true)
}
}
} }
else { else {
e.target.outerHTML = '<input id="end" type="submit" value="" disabled>' e.target.outerHTML = '<input id="end" type="submit" value="" disabled>'
@ -160,6 +165,40 @@ function youtube_iframe(id) {
return '<iframe width="560" height="315" src="https://www.youtube.com/embed/'+id+'" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>' return '<iframe width="560" height="315" src="https://www.youtube.com/embed/'+id+'" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>'
} }
function show_images(e) {
e = e || window.event;
e.preventDefault()
var targ = e.currentTarget || e.srcElement || e;
console.log(targ)
var parent = targ.parentNode
if (parent.className == "") {
parent.className = "selected"
toggle_images(true)
} else {
parent.className = ""
toggle_images(false)
}
return false
}
function toggle_images(open) {
var posts = document.getElementsByClassName("post")
for (var i = 0; i < posts.length; i++) {
var btn = posts[i].getElementsByClassName("expando-button")[0]
if (btn.className.indexOf("hidden") != -1) { continue }
var img = posts[i].getElementsByClassName("image")
if (!img.length) { continue }
var bdy = posts[i].getElementsByClassName("expando")[0]
if (open) {
bdy.className = 'expando open showimage';
btn.className = "expando-button open"
} else {
bdy.className = 'expando';
btn.className = "expando-button"
}
}
}
var posts = document.getElementsByClassName("post") var posts = document.getElementsByClassName("post")
for (var i = 0; i < posts.length; i++) { for (var i = 0; i < posts.length; i++) {
var url = posts[i].getElementsByClassName("url")[0].href var url = posts[i].getElementsByClassName("url")[0].href

5
templates/frontpage.html
View file

@ -2,7 +2,7 @@
<head> <head>
<title>{{ if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title> <title>{{ if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title>
<link rel="shortcut icon" href="/{{.Host}}/icon.jpg"> <link rel="shortcut icon" href="/{{.Host}}/icon.jpg">
<link rel="stylesheet" href="/_/static/style.css?v=12"> <link rel="stylesheet" href="/_/static/style.css?v=13">
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
</head> </head>
<body {{ if .Dark }}class="dark"{{end}}> <body {{ if .Dark }}class="dark"{{end}}>
@ -11,6 +11,7 @@
.expando-button, .expando-button,
.minimize, .minimize,
#loadmore, #loadmore,
#showimages,
.hidechildren { .hidechildren {
display: none; display: none;
} }
@ -55,6 +56,6 @@
{{ template "sidebar.html" . }} {{ template "sidebar.html" . }}
</main> </main>
{{ end }} {{ end }}
<script src="/_/static/utils.js?v=6"></script> <script src="/_/static/utils.js?v=7"></script>
</body> </body>
</html> </html>

5
templates/main.html
View file

@ -3,7 +3,7 @@
<title>{{if and .Posts .PostID }}{{ (index .Posts 0).Post.Name}} : {{.CommunityName}}{{else if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title> <title>{{if and .Posts .PostID }}{{ (index .Posts 0).Post.Name}} : {{.CommunityName}}{{else if and .Community (ne .Community.CommunityView.Community.Title "")}}{{.Community.CommunityView.Community.Title}}{{else if ne .CommunityName ""}}/c/{{.CommunityName}}{{ else if .User}}overview for {{.User.PersonView.Person.Name}}{{else}}{{ host .Host }}{{end}}</title>
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="shortcut icon" href="/{{.Host}}/icon.jpg"> <link rel="shortcut icon" href="/{{.Host}}/icon.jpg">
<link rel="stylesheet" href="/_/static/style.css?v=12"> <link rel="stylesheet" href="/_/static/style.css?v=13">
</head> </head>
<body{{ if .Dark }} class="dark"{{end}}> <body{{ if .Dark }} class="dark"{{end}}>
<noscript> <noscript>
@ -11,6 +11,7 @@
.expando-button, .expando-button,
.minimize, .minimize,
#loadmore, #loadmore,
#showimages,
.hidechildren { .hidechildren {
display: none !important; display: none !important;
} }
@ -127,7 +128,7 @@
<input id="loadmore" type="submit" value="load more" onclick="loadMore(event)" data-page="2"> <input id="loadmore" type="submit" value="load more" onclick="loadMore(event)" data-page="2">
{{ end }} {{ end }}
<script src="/_/static/utils.js?v=6"></script> <script src="/_/static/utils.js?v=7"></script>
{{ template "sidebar.html" . }} {{ template "sidebar.html" . }}
</main> </main>
{{ end }} {{ end }}

3
templates/nav.html
View file

@ -64,6 +64,9 @@
<li{{ if eq .Sort "MostComments" }} class="selected"{{end}}><a href="{{ .SortBy "MostComments" }}">most comments</a></li> <li{{ if eq .Sort "MostComments" }} class="selected"{{end}}><a href="{{ .SortBy "MostComments" }}">most comments</a></li>
<li{{ if eq .Sort "NewComments" }} class="selected"{{end}}><a href="{{ .SortBy "NewComments" }}">new comments</a></li> <li{{ if eq .Sort "NewComments" }} class="selected"{{end}}><a href="{{ .SortBy "NewComments" }}">new comments</a></li>
<li{{ if contains .Sort "Top" }} class="selected"{{end}}><a href="{{ .SortBy "TopDay" }}">top</a></li> <li{{ if contains .Sort "Top" }} class="selected"{{end}}><a href="{{ .SortBy "TopDay" }}">top</a></li>
{{ if .Posts }}
<li id="showimages"><a href="" onclick="show_images(event)">show images</a></li>
{{ end }}
{{ end }} {{ end }}
</ul> </ul>
{{ end }} {{ end }}