Add users search page
This commit is contained in:
parent
8079d44781
commit
ae749a19d2
@ -17,6 +17,8 @@ type SearchPageData struct {
|
||||
SearchText string
|
||||
SortOrder persistence.SortOrder
|
||||
SortOrderOptions []string
|
||||
IsUsersSearch bool
|
||||
UsersList []scraper.User
|
||||
// TODO: fill out the search text in the search bar as well (needs modifying the base template)
|
||||
}
|
||||
|
||||
@ -44,6 +46,14 @@ func (t SearchPageData) FocusedTweetID() scraper.TweetID {
|
||||
return scraper.TweetID(0)
|
||||
}
|
||||
|
||||
func (app *Application) SearchUsers(w http.ResponseWriter, r *http.Request) {
|
||||
ret := NewSearchPageData()
|
||||
ret.IsUsersSearch = true
|
||||
ret.SearchText = strings.Trim(r.URL.Path, "/")
|
||||
ret.UsersList = app.Profile.SearchUsers(ret.SearchText)
|
||||
app.buffered_render_tweet_page(w, "tpl/search.tpl", ret)
|
||||
}
|
||||
|
||||
func (app *Application) Search(w http.ResponseWriter, r *http.Request) {
|
||||
app.traceLog.Printf("'Search' handler (path: %q)", r.URL.Path)
|
||||
|
||||
@ -60,6 +70,12 @@ func (app *Application) Search(w http.ResponseWriter, r *http.Request) {
|
||||
return
|
||||
}
|
||||
|
||||
// Handle users search
|
||||
if r.URL.Query().Get("type") == "users" {
|
||||
app.SearchUsers(w, r)
|
||||
return
|
||||
}
|
||||
|
||||
// Handle "@username"
|
||||
if search_text[0] == '@' {
|
||||
http.Redirect(w, r, fmt.Sprintf("/%s", search_text[1:]), 302)
|
||||
|
||||
@ -222,7 +222,10 @@ h3 {
|
||||
.user-feed-header .profile-image {
|
||||
width: 8em;
|
||||
}
|
||||
.user-feed-header a.user-feed-tab {
|
||||
.tabs-container {
|
||||
outline: 1px solid var(--color-outline-gray);
|
||||
}
|
||||
.tabs-container a.tab {
|
||||
flex-grow: 1;
|
||||
text-align: center;
|
||||
font-size: 1.1em;
|
||||
@ -230,11 +233,11 @@ h3 {
|
||||
color: var(--color-twitter-text-gray);
|
||||
padding: 0.8em;
|
||||
}
|
||||
.user-feed-header a.user-feed-tab.active-tab {
|
||||
.tabs-container a.tab.active-tab {
|
||||
color: var(--color-twitter-blue);
|
||||
border-bottom: 0.2em solid var(--color-twitter-blue);
|
||||
}
|
||||
.user-feed-header a.user-feed-tab:hover {
|
||||
.tabs-container a.tab:hover {
|
||||
color: var(--color-twitter-blue);
|
||||
}
|
||||
|
||||
@ -348,7 +351,6 @@ ul.quick-links {
|
||||
}
|
||||
.user-feed-header-info-container {
|
||||
padding: 2em;
|
||||
margin-bottom: 0.1em;
|
||||
border-bottom: 1px solid var(--color-outline-gray);
|
||||
}
|
||||
.timeline .tweet, .quoted-tweet .tweet {
|
||||
@ -600,9 +602,30 @@ ul.dropdown-items {
|
||||
.users-list-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1em;
|
||||
padding: 1em;
|
||||
}
|
||||
.users-list-container .author-info .profile-image {
|
||||
width: 4em;
|
||||
}
|
||||
.users-list-container .user {
|
||||
border-color: var(--color-twitter-off-white-dark);
|
||||
border-bottom-style: solid;
|
||||
border-width: 1px;
|
||||
padding: 1em;
|
||||
}
|
||||
.users-list-container .user p.bio {
|
||||
margin: 0 5.3em;
|
||||
font-size: 0.9em;
|
||||
color: var(--color-twitter-text-gray);
|
||||
}
|
||||
.sort-order-container {
|
||||
padding: 1em 1em 1em 3em;
|
||||
margin-bottom: -0.5em;
|
||||
border-bottom: 1px solid var(--color-outline-gray);
|
||||
}
|
||||
.sort-order-container select {
|
||||
text-transform: capitalize;
|
||||
margin: 0 1em;
|
||||
}
|
||||
.sort-order-container .sort-order-label {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
10
internal/webserver/tpl/includes/list.tpl
Normal file
10
internal/webserver/tpl/includes/list.tpl
Normal file
@ -0,0 +1,10 @@
|
||||
{{define "list"}}
|
||||
<div class="users-list-container">
|
||||
{{range .}}
|
||||
<div class="user">
|
||||
{{template "author-info" .}}
|
||||
<p class="bio">{{.Bio}}</p>
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
{{end}}
|
||||
@ -1,9 +1,5 @@
|
||||
{{define "title"}}Followed Users{{end}}
|
||||
|
||||
{{define "main"}}
|
||||
<div class="users-list-container">
|
||||
{{range .}}
|
||||
{{template "author-info" .}}
|
||||
{{end}}
|
||||
</div>
|
||||
{{template "list" .}}
|
||||
{{end}}
|
||||
|
||||
@ -2,18 +2,42 @@
|
||||
|
||||
{{define "main"}}
|
||||
<div class="search-header">
|
||||
<h2>Search results: {{.SearchText}}</h2>
|
||||
<select name="sort-order" style="text-transform: capitalize;" hx-get="#" hx-target="body" hx-push-url="true">
|
||||
{{range .SortOrderOptions}}
|
||||
<option
|
||||
value="{{.}}"
|
||||
{{if (eq ($.SortOrder.String) .)}} selected {{end}}
|
||||
style="text-transform: capitalize;"
|
||||
>{{.}}</option>
|
||||
{{end}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="timeline">
|
||||
{{template "timeline" .}}
|
||||
<h2 style="text-align: center">Search results: {{.SearchText}}</h2>
|
||||
|
||||
<div class="row tabs-container">
|
||||
<a
|
||||
class="tab unstyled-link {{if (not .IsUsersSearch)}}active-tab{{end}}"
|
||||
href="?type=tweets"
|
||||
>
|
||||
<span class="tab-inner">Tweets</span>
|
||||
</a>
|
||||
<a
|
||||
class="tab unstyled-link {{if .IsUsersSearch}}active-tab{{end}}"
|
||||
href="?type=users"
|
||||
>
|
||||
<span class="tab-inner">Users</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{{if .IsUsersSearch}}
|
||||
{{template "list" .UsersList}}
|
||||
{{else}}
|
||||
<div class="sort-order-container">
|
||||
<span class="sort-order-label">order:</span>
|
||||
<select name="sort-order" hx-get="#" hx-target="body" hx-push-url="true">
|
||||
{{range .SortOrderOptions}}
|
||||
<option
|
||||
value="{{.}}"
|
||||
style="text-transform: capitalize;"
|
||||
{{if (eq ($.SortOrder.String) .)}}
|
||||
selected
|
||||
{{end}}
|
||||
>{{.}}</option>
|
||||
{{end}}
|
||||
</select>
|
||||
</div>
|
||||
<div class="timeline">
|
||||
{{template "timeline" .}}
|
||||
</div>
|
||||
{{end}}
|
||||
{{end}}
|
||||
|
||||
@ -58,18 +58,18 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row user-feed-tabs-container">
|
||||
<a class="user-feed-tab unstyled-link {{if (eq .FeedType "")}}active-tab{{end}}" href="/{{$user.Handle}}">
|
||||
<span class="user-feed-tab-inner">Tweets and replies</span>
|
||||
<div class="row tabs-container">
|
||||
<a class="tab unstyled-link {{if (eq .FeedType "")}}active-tab{{end}}" href="/{{$user.Handle}}">
|
||||
<span class="tab-inner">Tweets and replies</span>
|
||||
</a>
|
||||
<a class="user-feed-tab unstyled-link {{if (eq .FeedType "without_replies")}}active-tab{{end}}" href="/{{$user.Handle}}/without_replies">
|
||||
<span class="user-feed-tab-inner">Tweets</span>
|
||||
<a class="tab unstyled-link {{if (eq .FeedType "without_replies")}}active-tab{{end}}" href="/{{$user.Handle}}/without_replies">
|
||||
<span class="tab-inner">Tweets</span>
|
||||
</a>
|
||||
<a class="user-feed-tab unstyled-link {{if (eq .FeedType "media")}}active-tab{{end}}" href="/{{$user.Handle}}/media">
|
||||
<span class="user-feed-tab-inner">Media</span>
|
||||
<a class="tab unstyled-link {{if (eq .FeedType "media")}}active-tab{{end}}" href="/{{$user.Handle}}/media">
|
||||
<span class="tab-inner">Media</span>
|
||||
</a>
|
||||
<a class="user-feed-tab unstyled-link {{if (eq .FeedType "likes")}}active-tab{{end}}" href="/{{$user.Handle}}/likes">
|
||||
<span class="user-feed-tab-inner">Likes</span>
|
||||
<a class="tab unstyled-link {{if (eq .FeedType "likes")}}active-tab{{end}}" href="/{{$user.Handle}}/likes">
|
||||
<span class="tab-inner">Likes</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user