Make the search helper change based on the server config
This commit is contained in:
parent
52cc0d5485
commit
9677fca772
|
@ -47,6 +47,12 @@ export class ServerService {
|
||||||
css: ''
|
css: ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
search: {
|
||||||
|
remoteUri: {
|
||||||
|
users: true,
|
||||||
|
anonymous: false
|
||||||
|
}
|
||||||
|
},
|
||||||
plugin: {
|
plugin: {
|
||||||
registered: []
|
registered: []
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
<my-search-typeahead class="w-100 d-flex justify-content-end">
|
<my-search-typeahead class="w-100 d-flex justify-content-end">
|
||||||
<input
|
<input
|
||||||
type="text" id="search-video" name="search-video" [attr.aria-label]="ariaLabelTextForSearch"
|
type="text" id="search-video" name="search-video" [attr.aria-label]="ariaLabelTextForSearch"
|
||||||
i18n-placeholder placeholder="Search videos, channels… known by this instance" [(ngModel)]="searchValue"
|
i18n-placeholder placeholder="Search videos, channels…" [(ngModel)]="searchValue"
|
||||||
>
|
>
|
||||||
<span class="icon icon-search"></span>
|
<span class="icon icon-search"></span>
|
||||||
</my-search-typeahead>
|
</my-search-typeahead>
|
||||||
|
|
|
@ -1,4 +1,7 @@
|
||||||
@import '_mixins';
|
@import '_mixins';
|
||||||
|
@import '_variables';
|
||||||
|
@import '_bootstrap-variables';
|
||||||
|
@import '~bootstrap/scss/mixins/_breakpoints';
|
||||||
|
|
||||||
.jump-to-suggestions {
|
.jump-to-suggestions {
|
||||||
top: 100%;
|
top: 100%;
|
||||||
|
@ -46,11 +49,11 @@ my-suggestions ::ng-deep ul {
|
||||||
transition: box-shadow .3s ease, width .2s ease;
|
transition: box-shadow .3s ease, width .2s ease;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-width: 500px) {
|
@media screen and (min-width: $mobile-view) {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 800px) {
|
@media screen and (max-width: $small-view) {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
|
|
||||||
::ng-deep input {
|
::ng-deep input {
|
||||||
|
@ -71,7 +74,7 @@ my-suggestions ::ng-deep ul {
|
||||||
&:focus,
|
&:focus,
|
||||||
::ng-deep &:focus-within {
|
::ng-deep &:focus-within {
|
||||||
& > div:last-child {
|
& > div:last-child {
|
||||||
@media screen and (min-width: 500px) {
|
@media screen and (min-width: $mobile-view) {
|
||||||
display: initial !important;
|
display: initial !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -87,7 +90,7 @@ my-suggestions ::ng-deep ul {
|
||||||
border-end-start-radius: 0;
|
border-end-start-radius: 0;
|
||||||
border-end-end-radius: 0;
|
border-end-end-radius: 0;
|
||||||
|
|
||||||
@media screen and (min-width: 900px) {
|
@include media-breakpoint-up(lg) {
|
||||||
width: 500px;
|
width: 500px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,14 +8,15 @@ import {
|
||||||
QueryList
|
QueryList
|
||||||
} from '@angular/core'
|
} from '@angular/core'
|
||||||
import { Router, NavigationEnd, Params, ActivatedRoute } from '@angular/router'
|
import { Router, NavigationEnd, Params, ActivatedRoute } from '@angular/router'
|
||||||
import { AuthService } from '@app/core'
|
import { AuthService, ServerService } from '@app/core'
|
||||||
import { I18n } from '@ngx-translate/i18n-polyfill'
|
import { I18n } from '@ngx-translate/i18n-polyfill'
|
||||||
import { filter, first, tap, map } from 'rxjs/operators'
|
import { filter, first, tap, map } from 'rxjs/operators'
|
||||||
import { ListKeyManager } from '@angular/cdk/a11y'
|
import { ListKeyManager } from '@angular/cdk/a11y'
|
||||||
import { UP_ARROW, DOWN_ARROW, ENTER, TAB } from '@angular/cdk/keycodes'
|
import { UP_ARROW, DOWN_ARROW, ENTER } from '@angular/cdk/keycodes'
|
||||||
import { SuggestionComponent, Result } from './suggestion.component'
|
import { SuggestionComponent, Result } from './suggestion.component'
|
||||||
import { of } from 'rxjs'
|
import { of } from 'rxjs'
|
||||||
import { getParameterByName } from '@app/shared/misc/utils'
|
import { getParameterByName } from '@app/shared/misc/utils'
|
||||||
|
import { ServerConfig } from '@shared/models'
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'my-search-typeahead',
|
selector: 'my-search-typeahead',
|
||||||
|
@ -30,7 +31,7 @@ export class SearchTypeaheadComponent implements OnInit, OnDestroy, AfterViewIni
|
||||||
newSearch = true
|
newSearch = true
|
||||||
|
|
||||||
searchInput: HTMLInputElement
|
searchInput: HTMLInputElement
|
||||||
URIPolicy: 'only-followed' | 'any' = 'any'
|
serverConfig: ServerConfig
|
||||||
|
|
||||||
URIPolicyText: string
|
URIPolicyText: string
|
||||||
inAllText: string
|
inAllText: string
|
||||||
|
@ -44,6 +45,7 @@ export class SearchTypeaheadComponent implements OnInit, OnDestroy, AfterViewIni
|
||||||
private authService: AuthService,
|
private authService: AuthService,
|
||||||
private router: Router,
|
private router: Router,
|
||||||
private route: ActivatedRoute,
|
private route: ActivatedRoute,
|
||||||
|
private serverService: ServerService,
|
||||||
private i18n: I18n
|
private i18n: I18n
|
||||||
) {
|
) {
|
||||||
this.URIPolicyText = this.i18n('Determines whether you can resolve any distant content, or if your instance only allows doing so for instances it follows.')
|
this.URIPolicyText = this.i18n('Determines whether you can resolve any distant content, or if your instance only allows doing so for instances it follows.')
|
||||||
|
@ -66,6 +68,9 @@ export class SearchTypeaheadComponent implements OnInit, OnDestroy, AfterViewIni
|
||||||
map(() => getParameterByName('search', window.location.href))
|
map(() => getParameterByName('search', window.location.href))
|
||||||
)
|
)
|
||||||
.subscribe(searchQuery => this.searchInput.value = searchQuery || '')
|
.subscribe(searchQuery => this.searchInput.value = searchQuery || '')
|
||||||
|
|
||||||
|
this.serverService.getConfig()
|
||||||
|
.subscribe(config => this.serverConfig = config)
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnDestroy () {
|
ngOnDestroy () {
|
||||||
|
@ -90,6 +95,16 @@ export class SearchTypeaheadComponent implements OnInit, OnDestroy, AfterViewIni
|
||||||
return this.hasSearch && this.newSearch && this.activeResult && this.activeResult.type === 'search-global' || false
|
return this.hasSearch && this.newSearch && this.activeResult && this.activeResult.type === 'search-global' || false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
get URIPolicy (): 'only-followed' | 'any' {
|
||||||
|
return (
|
||||||
|
this.authService.isLoggedIn()
|
||||||
|
? this.serverConfig.search.remoteUri.users
|
||||||
|
: this.serverConfig.search.remoteUri.anonymous
|
||||||
|
)
|
||||||
|
? 'any'
|
||||||
|
: 'only-followed'
|
||||||
|
}
|
||||||
|
|
||||||
computeResults () {
|
computeResults () {
|
||||||
this.newSearch = true
|
this.newSearch = true
|
||||||
let results: Result[] = []
|
let results: Result[] = []
|
||||||
|
@ -151,10 +166,6 @@ export class SearchTypeaheadComponent implements OnInit, OnDestroy, AfterViewIni
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
isUserLoggedIn () {
|
|
||||||
return this.authService.isLoggedIn()
|
|
||||||
}
|
|
||||||
|
|
||||||
handleKeyUp (event: KeyboardEvent, indexSelected?: number) {
|
handleKeyUp (event: KeyboardEvent, indexSelected?: number) {
|
||||||
event.stopImmediatePropagation()
|
event.stopImmediatePropagation()
|
||||||
if (this.keyboardEventsManager) {
|
if (this.keyboardEventsManager) {
|
||||||
|
|
|
@ -91,5 +91,16 @@
|
||||||
<my-feature-boolean [value]="serverConfig.tracker.enabled"></my-feature-boolean>
|
<my-feature-boolean [value]="serverConfig.tracker.enabled"></my-feature-boolean>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<td i18n class="label" colspan="2">Search</td>
|
||||||
|
</tr>
|
||||||
|
|
||||||
|
<tr>
|
||||||
|
<td i18n class="sub-label">Users can resolve distant content</td>
|
||||||
|
<td>
|
||||||
|
<my-feature-boolean [value]="serverConfig.search.remoteUri.users"></my-feature-boolean>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -73,6 +73,12 @@ async function getConfig (req: express.Request, res: express.Response) {
|
||||||
css: CONFIG.INSTANCE.CUSTOMIZATIONS.CSS
|
css: CONFIG.INSTANCE.CUSTOMIZATIONS.CSS
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
search: {
|
||||||
|
remoteUri: {
|
||||||
|
users: CONFIG.SEARCH.REMOTE_URI.USERS,
|
||||||
|
anonymous: CONFIG.SEARCH.REMOTE_URI.ANONYMOUS
|
||||||
|
}
|
||||||
|
},
|
||||||
plugin: {
|
plugin: {
|
||||||
registered: getRegisteredPlugins()
|
registered: getRegisteredPlugins()
|
||||||
},
|
},
|
||||||
|
|
|
@ -235,6 +235,12 @@ async function generateNodeinfo (req: express.Request, res: express.Response) {
|
||||||
nodeName: CONFIG.INSTANCE.NAME,
|
nodeName: CONFIG.INSTANCE.NAME,
|
||||||
nodeDescription: CONFIG.INSTANCE.SHORT_DESCRIPTION,
|
nodeDescription: CONFIG.INSTANCE.SHORT_DESCRIPTION,
|
||||||
nodeConfig: {
|
nodeConfig: {
|
||||||
|
search: {
|
||||||
|
remoteUri: {
|
||||||
|
users: CONFIG.SEARCH.REMOTE_URI.USERS,
|
||||||
|
anonymous: CONFIG.SEARCH.REMOTE_URI.ANONYMOUS
|
||||||
|
}
|
||||||
|
},
|
||||||
plugin: {
|
plugin: {
|
||||||
registered: getRegisteredPlugins()
|
registered: getRegisteredPlugins()
|
||||||
},
|
},
|
||||||
|
|
|
@ -28,6 +28,13 @@ export interface ServerConfig {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
search: {
|
||||||
|
remoteUri: {
|
||||||
|
users: boolean
|
||||||
|
anonymous: boolean
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
plugin: {
|
plugin: {
|
||||||
registered: ServerConfigPlugin[]
|
registered: ServerConfigPlugin[]
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue