mirror of
https://github.com/rystaf/mlmym.git
synced 2024-11-09 08:32:21 +00:00
sidebar toggle. fixes #86
This commit is contained in:
parent
d9faec35f9
commit
aa16e13831
|
@ -15,3 +15,12 @@ div.pager {
|
||||||
.savecomment input[type=file] {
|
.savecomment input[type=file] {
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
|
#sidetoggle button {
|
||||||
|
visibility: unset !important;
|
||||||
|
}
|
||||||
|
#sidetoggle button::before {
|
||||||
|
content: "" !important;
|
||||||
|
}
|
||||||
|
#sidetoggle {
|
||||||
|
bottom: 4px;
|
||||||
|
}
|
||||||
|
|
|
@ -509,6 +509,9 @@ form.blockpost {
|
||||||
.hidechildren span {
|
.hidechildren span {
|
||||||
pointer-events: none;
|
pointer-events: none;
|
||||||
}
|
}
|
||||||
|
.hide {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
.expando {
|
.expando {
|
||||||
display: none;
|
display: none;
|
||||||
max-width: 900px;
|
max-width: 900px;
|
||||||
|
@ -607,8 +610,36 @@ form.blockpost {
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
|
|
||||||
#sideToggle {
|
#sidetoggle button::before {
|
||||||
text-align: right;
|
content: '[+]';
|
||||||
|
visibility: visible;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
top: 12px;
|
||||||
|
}
|
||||||
|
#sidetoggle.o button::before {
|
||||||
|
content: '[-]';
|
||||||
|
visibility: visible;
|
||||||
|
cursor: pointer;
|
||||||
|
position: relative;
|
||||||
|
top: 12px;
|
||||||
|
}
|
||||||
|
#sidetoggle button {
|
||||||
|
visibility: hidden;
|
||||||
|
width: 10px;
|
||||||
|
margin-right: 16px;
|
||||||
|
background: unset;
|
||||||
|
border: unset;
|
||||||
|
}
|
||||||
|
#sidetoggle {
|
||||||
|
position: absolute;
|
||||||
|
cursor: pointer;
|
||||||
|
right: 0;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: end;
|
||||||
|
height: 20px;
|
||||||
|
font-size: 12px;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
.side {
|
.side {
|
||||||
display: none;
|
display: none;
|
||||||
|
@ -625,7 +656,22 @@ main {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin: 0px 10px;
|
margin: 0px 10px;
|
||||||
}
|
}
|
||||||
|
.wide .side {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
@media (min-width: 900px) {
|
@media (min-width: 900px) {
|
||||||
|
.wide {
|
||||||
|
padding-right: 15px;
|
||||||
|
}
|
||||||
|
.wide .side {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
#sidetoggle button::before {
|
||||||
|
content: '[-]';
|
||||||
|
}
|
||||||
|
#sidetoggle.o button::before {
|
||||||
|
content: '[+]';
|
||||||
|
}
|
||||||
.expando {
|
.expando {
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
@ -810,7 +856,7 @@ nav .host {
|
||||||
}
|
}
|
||||||
|
|
||||||
nav div.spacer {
|
nav div.spacer {
|
||||||
height: 32px;
|
height: 34px;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
nav span.spacer {
|
nav span.spacer {
|
||||||
|
|
|
@ -513,6 +513,38 @@ function setup() {
|
||||||
links[i].addEventListener("click", xhrLink)
|
links[i].addEventListener("click", xhrLink)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
var st = document.getElementById("sidetoggle")
|
||||||
|
if (st) {
|
||||||
|
st.addEventListener("click", sideToggle)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function sideToggle(e) {
|
||||||
|
e.preventDefault();
|
||||||
|
var side = document.getElementsByClassName("side")[0]
|
||||||
|
var main = document.getElementsByTagName("main")[0]
|
||||||
|
if (!side) return;
|
||||||
|
var form = e.target
|
||||||
|
if (form.tagName != "FORM") {
|
||||||
|
form = uptil(e.target, function(el){ return el.tagName == "FORM" })
|
||||||
|
}
|
||||||
|
var data = new FormData(form)
|
||||||
|
data.append("xhr", "1")
|
||||||
|
request(form.target, data)
|
||||||
|
console.log(e)
|
||||||
|
if (side.className == "side") {
|
||||||
|
side.className = "side hide"
|
||||||
|
form.classList.add("o")
|
||||||
|
if (main) {
|
||||||
|
main.className = "wide"
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
side.className = "side"
|
||||||
|
form.classList.remove("o")
|
||||||
|
if (main) {
|
||||||
|
main.className = ""
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
function xhrLink(e) {
|
function xhrLink(e) {
|
||||||
e = e || window.event;
|
e = e || window.event;
|
||||||
|
|
14
routes.go
14
routes.go
|
@ -323,6 +323,9 @@ func Initialize(Host string, r *http.Request) (State, error) {
|
||||||
state.Listing = getCookie(r, "DefaultListingType")
|
state.Listing = getCookie(r, "DefaultListingType")
|
||||||
state.Sort = getCookie(r, "DefaultSortType")
|
state.Sort = getCookie(r, "DefaultSortType")
|
||||||
state.CommentSort = getCookie(r, "DefaultCommentSortType")
|
state.CommentSort = getCookie(r, "DefaultCommentSortType")
|
||||||
|
if hideSidebar := getCookie(r, "HideSidebar"); hideSidebar == "1" {
|
||||||
|
state.HideSidebar = true
|
||||||
|
}
|
||||||
if dark := getCookie(r, "Dark"); dark != "" {
|
if dark := getCookie(r, "Dark"); dark != "" {
|
||||||
state.Dark = new(bool)
|
state.Dark = new(bool)
|
||||||
*state.Dark = dark != "0"
|
*state.Dark = dark != "0"
|
||||||
|
@ -492,7 +495,7 @@ func GetIcon(w http.ResponseWriter, r *http.Request, ps httprouter.Params) {
|
||||||
}
|
}
|
||||||
u := resp.SiteView.Site.Icon.String()
|
u := resp.SiteView.Site.Icon.String()
|
||||||
if pictrs.MatchString(u) {
|
if pictrs.MatchString(u) {
|
||||||
u += "?format=jpg&thumbnail=60"
|
u += "?format=png&thumbnail=60"
|
||||||
}
|
}
|
||||||
iresp, err := state.HTTPClient.Get(u)
|
iresp, err := state.HTTPClient.Get(u)
|
||||||
if err != nil {
|
if err != nil {
|
||||||
|
@ -1073,6 +1076,15 @@ func UserOp(w http.ResponseWriter, r *http.Request, ps httprouter.Params) {
|
||||||
w.Write([]byte{})
|
w.Write([]byte{})
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
case "sidetoggle":
|
||||||
|
if state.HideSidebar {
|
||||||
|
deleteCookie(w, state.Host, "HideSidebar")
|
||||||
|
} else {
|
||||||
|
setCookie(w, state.Host, "HideSidebar", "1")
|
||||||
|
}
|
||||||
|
if r.FormValue("xhr") != "" {
|
||||||
|
return
|
||||||
|
}
|
||||||
case "logout":
|
case "logout":
|
||||||
deleteCookie(w, state.Host, "jwt")
|
deleteCookie(w, state.Host, "jwt")
|
||||||
deleteCookie(w, state.Host, "user")
|
deleteCookie(w, state.Host, "user")
|
||||||
|
|
1
state.go
1
state.go
|
@ -106,6 +106,7 @@ type State struct {
|
||||||
ShowNSFW bool
|
ShowNSFW bool
|
||||||
HideInstanceNames bool
|
HideInstanceNames bool
|
||||||
HideThumbnails bool
|
HideThumbnails bool
|
||||||
|
HideSidebar bool
|
||||||
LinksInNewWindow bool
|
LinksInNewWindow bool
|
||||||
SubmitURL string
|
SubmitURL string
|
||||||
SubmitTitle string
|
SubmitTitle string
|
||||||
|
|
|
@ -16,7 +16,8 @@
|
||||||
{{- if and (not .ShowNSFW) .Community .Community.CommunityView.Community.NSFW }}
|
{{- if and (not .ShowNSFW) .Community .Community.CommunityView.Community.NSFW }}
|
||||||
{{ template "nsfw.html" }}
|
{{ template "nsfw.html" }}
|
||||||
{{- else }}
|
{{- else }}
|
||||||
<main>
|
<main{{ if .HideSidebar }} class="wide"{{ end }}>
|
||||||
|
{{ template "sidebar.html" . }}
|
||||||
{{- if and (not .Community) .Tagline }}
|
{{- if and (not .Community) .Tagline }}
|
||||||
<h3>
|
<h3>
|
||||||
{{ markdown .Host .Tagline }}
|
{{ markdown .Host .Tagline }}
|
||||||
|
@ -46,7 +47,6 @@
|
||||||
<input id="loadmore" type="submit" value="load more" data-page="2">
|
<input id="loadmore" type="submit" value="load more" data-page="2">
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
{{ template "sidebar.html" . }}
|
|
||||||
</main>
|
</main>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
<script src="/_/static/utils.js?v={{ .Version }}"></script>
|
<script src="/_/static/utils.js?v={{ .Version }}"></script>
|
||||||
|
|
|
@ -16,7 +16,8 @@
|
||||||
{{- if and (not .ShowNSFW) .Community .Community.CommunityView.Community.NSFW }}
|
{{- if and (not .ShowNSFW) .Community .Community.CommunityView.Community.NSFW }}
|
||||||
{{ template "nsfw.html" }}
|
{{ template "nsfw.html" }}
|
||||||
{{- else }}
|
{{- else }}
|
||||||
<main>
|
<main{{ if .HideSidebar }} class="wide"{{ end }}>
|
||||||
|
{{- template "sidebar.html" . }}
|
||||||
{{- if or (.Query) (.SearchType) (and (not .PostID) (not .User) (not .Activities) (eq .Op ""))}}
|
{{- if or (.Query) (.SearchType) (and (not .PostID) (not .User) (not .Activities) (eq .Op ""))}}
|
||||||
{{ template "menu.html" . }}
|
{{ template "menu.html" . }}
|
||||||
{{- end}}
|
{{- end}}
|
||||||
|
@ -137,7 +138,6 @@
|
||||||
{{- if .Watch }}
|
{{- if .Watch }}
|
||||||
<script src="/_/static/ws.js"></script>
|
<script src="/_/static/ws.js"></script>
|
||||||
{{- end }}
|
{{- end }}
|
||||||
{{- template "sidebar.html" . }}
|
|
||||||
</main>
|
</main>
|
||||||
{{- end }}
|
{{- end }}
|
||||||
</body>
|
</body>
|
||||||
|
|
|
@ -87,6 +87,10 @@
|
||||||
{{- if and .PostID }}{{ $post := (index .Posts 0) }}{{ if $post.CrossPosts }}
|
{{- if and .PostID }}{{ $post := (index .Posts 0) }}{{ if $post.CrossPosts }}
|
||||||
<li><a href="/{{.Host}}/search?q={{ $post.Post.URL.String }}&searchtype=Url{{ if not $post.Post.Local }}&listingType=All{{end}}">other discussions ({{ $post.CrossPosts }})</a></li>
|
<li><a href="/{{.Host}}/search?q={{ $post.Post.URL.String }}&searchtype=Url{{ if not $post.Post.Local }}&listingType=All{{end}}">other discussions ({{ $post.CrossPosts }})</a></li>
|
||||||
{{- end }}{{ end }}
|
{{- end }}{{ end }}
|
||||||
|
<form id="sidetoggle" class="link-btn{{ if .HideSidebar }} o{{end}}" method="POST">
|
||||||
|
<input type="hidden" name="op" value="sidetoggle">
|
||||||
|
<button>{{ if .HideSidebar }}[+]{{ else }}[-]{{ end }}</button>
|
||||||
|
</form>
|
||||||
</ul>
|
</ul>
|
||||||
{{- end }}
|
{{- end }}
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{{- $host := .Host }}
|
{{- $host := .Host }}
|
||||||
<div class="{{ if .User }}user {{end}}side">
|
<div class="{{ if .User }}user {{end}}side{{ if .HideSidebar }} hide{{ end }}">
|
||||||
<form method="GET" action="/{{.Host}}/search">
|
<form method="GET" action="/{{.Host}}/search">
|
||||||
<input type="text" placeholder="search" name="q" value="">
|
<input type="text" placeholder="search" name="q" value="">
|
||||||
{{- if eq .Listing "Local" }}
|
{{- if eq .Listing "Local" }}
|
||||||
|
|
Loading…
Reference in a new issue