Webviews for status threads

This commit is contained in:
f0x 2021-09-10 22:00:57 +02:00
commit d553b445f5
6 changed files with 241 additions and 13 deletions

View file

@ -1,19 +1,25 @@
<!DOCTYPE html>
<!-- header.tmpl -->
<!-- Header tmpl -->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="og:title" content="{{.instance.Title}}">
<meta name="og:description" content="{{.instance.Description}}">
<meta name="og:title" content="GoToSocial Testing Instance">
<meta name="og:description" content="">
<link rel="stylesheet" href="/assets/bundle.css">
<link rel="shortcut icon" href="/assets/sloth.png" type="image/png">
<link rel="stylesheet" href="/assets/Fork-Awesome/css/fork-awesome.min.css">
<link rel="shortcut icon" href="/assets/logo.png" type="image/png">
<title>{{.instance.Title}} - GoToSocial</title>
</head>
<body>
<header>
<h1>
{{.instance.Title}}
</h1>
<img src="/assets/logo.png" alt="Instance Logo"/>
<div>
<h1>
{{.instance.Title}}
</h1>
</div>
<div></div>
</header>

100
web/template/status.tmpl Normal file
View file

@ -0,0 +1,100 @@
{{ template "header.tmpl" .}}
<main>
<div class="thread">
{{range .context.Ancestors}}
<div class="toot">
<a href="{{.Account.URL}}" class="avatar"><img src="{{.Account.Avatar}}"></a>
<a href="{{.Account.URL}}" class="displayname">{{.Account.DisplayName}}</a>
<a href="{{.Account.URL}}" class="username">@{{.Account.Username}}</a>
<div class="text">
{{.Content |noescape}}
</div>
{{with .MediaAttachments}}
<div class="media {{(len .) | oddOrEven }} {{if eq (len .) 1}}single{{end}}">
{{range .}}
<a href="{{.URL}}" target="_blank" title="{{.Description}}">
{{if not .Description}}
<div class="no-image-desc" aria-hidden="true" >(!)<span>Missing image description</span></div>
{{end}}
<img src="{{.PreviewURL}}" alt="{{.Description}}"/>
</a>
{{end}}
</div>
{{end}}
<div class="info">
<div id="date">{{.CreatedAt | timestamp}}</div>
<div class="stats">
<div id="visibility">{{.Visibility | visibilityIcon}}</div>
<div id="replies"><i aria-label="Replies" class="fa fa-reply-all"></i> {{.RepliesCount}}</div>
<div id="boosts"><i aria-label="Boosts" class="fa fa-retweet"></i> {{.ReblogsCount}}</div>
<div id="favorites"><i aria-label="Favorites" class="fa fa-star"></i> {{.FavouritesCount}}</div>
</div>
</div>
<a href="{{.URL}}" class="toot-link">View toot</a>
</div>
{{end}}
<div class="toot expanded">
<a href="{{.status.Account.URL}}" class="avatar"><img src="{{.status.Account.Avatar}}"></a>
<a href="{{.status.Account.URL}}" class="displayname">{{.status.Account.DisplayName}}</a>
<a href="{{.status.Account.URL}}" class="username">@{{.status.Account.Username}}</a>
<div class="text">
{{.status.Content |noescape}}
</div>
{{with .status.MediaAttachments}}
<div class="media {{(len .) | oddOrEven }} {{if eq (len .) 1}}single{{end}}">
{{range .}}
<a href="{{.URL}}" target="_blank" title="{{.Description}}">
{{if not .Description}}
<div class="no-image-desc" aria-hidden="true" >(!)<span>Missing image description</span></div>
{{end}}
<img src="{{.PreviewURL}}" alt="{{.Description}}"/>
</a>
{{end}}
</div>
{{end}}
<div class="info">
<div id="date">{{.status.CreatedAt | timestamp}}</div>
<div class="stats">
<div id="visibility">{{.status.Visibility | visibilityIcon}}</div>
<div id="replies"><i aria-label="Replies" class="fa fa-reply-all"></i> {{.status.RepliesCount}}</div>
<div id="boosts"><i aria-label="Boosts" class="fa fa-retweet"></i> {{.status.ReblogsCount}}</div>
<div id="favorites"><i aria-label="Favorites" class="fa fa-star"></i> {{.status.FavouritesCount}}</div>
</div>
</div>
<a href="{{.status.URL}}" class="toot-link">View toot</a>
</div>
{{range .context.Descendants}}
<div class="toot">
<a href="{{.Account.URL}}" class="avatar"><img src="{{.Account.Avatar}}"></a>
<a href="{{.Account.URL}}" class="displayname">{{.Account.DisplayName}}</a>
<a href="{{.Account.URL}}" class="username">@{{.Account.Username}}</a>
<div class="text">
{{.Content |noescape}}
</div>
{{with .MediaAttachments}}
<div class="media {{(len .) | oddOrEven }} {{if eq (len .) 1}}single{{end}}">
{{range .}}
<a href="{{.URL}}" target="_blank" title="{{.Description}}">
{{if not .Description}}
<div class="no-image-desc" aria-hidden="true" >(!)<span>Missing image description</span></div>
{{end}}
<img src="{{.PreviewURL}}" alt="{{.Description}}"/>
</a>
{{end}}
</div>
{{end}}
<div class="info">
<div id="date">{{.CreatedAt | timestamp}}</div>
<div class="stats">
<div id="visibility">{{.Visibility | visibilityIcon}}</div>
<div id="replies"><i aria-label="Replies" class="fa fa-reply-all"></i> {{.RepliesCount}}</div>
<div id="boosts"><i aria-label="Boosts" class="fa fa-retweet"></i> {{.ReblogsCount}}</div>
<div id="favorites"><i aria-label="Favorites" class="fa fa-star"></i> {{.FavouritesCount}}</div>
</div>
</div>
<a href="{{.URL}}" class="toot-link">View toot</a>
</div>
{{end}}
</div>
</main>
{{ template "footer.tmpl" .}}