diff --git a/projects/website-angular/src/app/app.routes.ts b/projects/website-angular/src/app/app.routes.ts index 517b140..83e28d8 100644 --- a/projects/website-angular/src/app/app.routes.ts +++ b/projects/website-angular/src/app/app.routes.ts @@ -1,59 +1,237 @@ import { Routes, UrlSegment } from '@angular/router'; export const routes: Routes = [ - //Home Page - { path: '', loadComponent: () => import('./home-page/home-page.component').then(m => m.HomePageComponent), pathMatch: 'full' }, - - /* Non - CMS Pages Below this Line */ - //News Pages - { path: 'about/news', loadComponent: () => import('./article/article-page/article-page.component').then(m => m.ArticlePageComponent), pathMatch: 'full' }, - { path: 'about/news/:slug', loadComponent: () => import('./article/article/article.component').then(m => m.ArticleComponent), pathMatch: 'full' }, - { path: 'about/logo', loadComponent: () => import('./about/logo-page/logo-page.component').then(m => m.LogoPageComponent), pathMatch: 'full' }, - { path: 'about/release-calendar', loadComponent: () => import('./about/release-calendar/release-calendar.component').then(m => m.ReleaseCalendarComponent), pathMatch: 'full' }, - { path: 'about/editorial-calendar', loadComponent: () => import('./about/editorial-calendar/editorial-calendar.component').then(m => m.EditorialCalendarComponent), pathMatch: 'full' }, - - //Community Pages - { path: 'community/partners', loadComponent: () => import('./community/partners/partners.component').then(m => m.PartnersComponent), pathMatch: 'full' }, - { path: 'community/resources', loadComponent: () => import('./community/resources/resources.component').then(m => m.ResourcesComponent), pathMatch: 'full' }, - { path: 'community/collaboration', loadComponent: () => import('./community/collaboration/collaboration.component').then(m => m.CollaborationComponent), pathMatch: 'full' }, - { path: 'community/icon-lib', loadComponent: () => import('./community/icon-lib/icon-lib.component').then(m => m.IconLibComponent), pathMatch: 'full' }, - { path: 'community/icon-lib/:id', loadComponent: () => import('./community/icon-lib/icon-lib.component').then(m => m.IconLibComponent), pathMatch: 'full' }, - { path: 'community/contributors', loadComponent: () => import('./content/contributors/contributors.component').then(m => m.ContributorsComponent), pathMatch: 'full' }, - - //Documentation Pages - { path: 'documentation/faq', loadComponent: () => import('./documentation/faq/faq.component').then(m => m.FaqComponent), pathMatch: 'full' }, - - //Download Page - { path: 'download-data', loadComponent: () => import('./download-data/download-data.component').then(m => m.DownloadDataComponent), pathMatch: 'full' }, - - //Reactome Research Spotlights - { path: 'content/reactome-research-spotlight', loadComponent: () => import('./article/article-page/article-page.component').then(m => m.ArticlePageComponent), pathMatch: 'full' }, - { path: 'content/reactome-research-spotlight/:slug', loadComponent: () => import('./article/article/article.component').then(m => m.ArticleComponent), pathMatch: 'full' }, - - //Content Pages (TOC, DOI, Schema) - { path: 'content/toc', loadComponent: () => import('./content/toc/toc.component').then(m => m.TocComponent), pathMatch: 'full' }, - { path: 'content/doi', loadComponent: () => import('./content/doi/doi.component').then(m => m.DoiComponent), pathMatch: 'full' }, - { path: 'content/schema', loadComponent: () => import('./content/schema/schema.component').then(m => m.SchemaComponent), pathMatch: 'full' }, - { path: 'content/schema/:className', loadComponent: () => import('./content/schema/schema.component').then(m => m.SchemaComponent), pathMatch: 'full' }, - - //Detail Pages - { path: 'content/detail/interactor/:acc', loadComponent: () => import('./content/detail/interactor-detail/interactor-detail.component').then(m => m.InteractorDetailComponent) }, - { path: 'content/detail/icon/:id', loadComponent: () => import('./content/detail/icon-detail/icon-detail.component').then(m => m.IconDetailComponent) }, - { path: 'content/detail/:id', loadComponent: () => import('./content/detail/detail.component').then(m => m.DetailComponent) }, - - //Search Pages - { path: 'content/query', loadComponent: () => import('./search/search.component').then(m => m.SearchComponent) }, - { path: 'tools/site-search', loadComponent: () => import('./site-search/site-search.component').then(m => m.SiteSearchComponent) }, - - //API Documentation (Swagger UI) - { path: 'ContentService', loadComponent: () => import('./swagger-page/swagger-page.component').then(m => m.SwaggerPageComponent), data: { serviceName: 'ContentService' } }, - { path: 'AnalysisService', loadComponent: () => import('./swagger-page/swagger-page.component').then(m => m.SwaggerPageComponent), data: { serviceName: 'AnalysisService' } }, - - //404 Page - { path: '404', loadComponent: () => import('./page-not-found/page-not-found.component').then(m => m.PageNotFoundComponent) }, //TODO: Remove? - /* Non - CMS Pages Above this Line */ - - //CMS Pages - { path: '**', loadComponent: () => import('./page/page.component').then(m => m.PageComponent) }, - + //Home Page + { + path: '', + loadComponent: () => + import('./home-page/home-page.component').then( + (m) => m.HomePageComponent + ), + pathMatch: 'full', + }, + + /* Non - CMS Pages Below this Line */ + //News Pages + { + path: 'about/news', + loadComponent: () => + import('./article/article-page/article-page.component').then( + (m) => m.ArticlePageComponent + ), + pathMatch: 'full', + }, + { + path: 'about/news/:slug', + loadComponent: () => + import('./article/article/article.component').then( + (m) => m.ArticleComponent + ), + pathMatch: 'full', + }, + { + path: 'about/logo', + loadComponent: () => + import('./about/logo-page/logo-page.component').then( + (m) => m.LogoPageComponent + ), + pathMatch: 'full', + }, + { + path: 'about/release-calendar', + loadComponent: () => + import('./about/release-calendar/release-calendar.component').then( + (m) => m.ReleaseCalendarComponent + ), + pathMatch: 'full', + }, + { + path: 'about/editorial-calendar', + loadComponent: () => + import('./about/editorial-calendar/editorial-calendar.component').then( + (m) => m.EditorialCalendarComponent + ), + pathMatch: 'full', + }, + + //Community Pages + { + path: 'community/partners', + loadComponent: () => + import('./community/partners/partners.component').then( + (m) => m.PartnersComponent + ), + pathMatch: 'full', + }, + { + path: 'community/resources', + loadComponent: () => + import('./community/resources/resources.component').then( + (m) => m.ResourcesComponent + ), + pathMatch: 'full', + }, + { + path: 'community/collaboration', + loadComponent: () => + import('./community/collaboration/collaboration.component').then( + (m) => m.CollaborationComponent + ), + pathMatch: 'full', + }, + { + path: 'community/icon-lib', + loadComponent: () => + import('./community/icon-lib/icon-lib.component').then( + (m) => m.IconLibComponent + ), + pathMatch: 'full', + }, + { + path: 'community/icon-lib/:id', + loadComponent: () => + import('./community/icon-lib/icon-lib.component').then( + (m) => m.IconLibComponent + ), + pathMatch: 'full', + }, + { + path: 'community/contributors', + loadComponent: () => + import('./content/contributors/contributors.component').then( + (m) => m.ContributorsComponent + ), + pathMatch: 'full', + }, + + //Documentation Pages + { + path: 'documentation/faq', + loadComponent: () => + import('./documentation/faq/faq.component').then((m) => m.FaqComponent), + pathMatch: 'full', + }, + + //Download Page + { + path: 'download-data', + loadComponent: () => + import('./download-data/download-data.component').then( + (m) => m.DownloadDataComponent + ), + pathMatch: 'full', + }, + + //Reactome Research Spotlights + { + path: 'content/reactome-research-spotlight', + loadComponent: () => + import('./article/article-page/article-page.component').then( + (m) => m.ArticlePageComponent + ), + pathMatch: 'full', + }, + { + path: 'content/reactome-research-spotlight/:slug', + loadComponent: () => + import('./article/article/article.component').then( + (m) => m.ArticleComponent + ), + pathMatch: 'full', + }, + + //Content Pages (TOC, DOI, Schema) + { + path: 'content/toc', + loadComponent: () => + import('./content/toc/toc.component').then((m) => m.TocComponent), + pathMatch: 'full', + }, + { + path: 'content/doi', + loadComponent: () => + import('./content/doi/doi.component').then((m) => m.DoiComponent), + pathMatch: 'full', + }, + { + path: 'content/schema', + loadComponent: () => + import('./content/schema/schema.component').then( + (m) => m.SchemaComponent + ), + pathMatch: 'full', + }, + { + path: 'content/schema/:className', + loadComponent: () => + import('./content/schema/schema.component').then( + (m) => m.SchemaComponent + ), + pathMatch: 'full', + }, + + //Detail Pages + { + path: 'content/detail/interactor/:acc', + loadComponent: () => + import( + './content/detail/interactor-detail/interactor-detail.component' + ).then((m) => m.InteractorDetailComponent), + }, + { + path: 'content/detail/icon/:id', + loadComponent: () => + import('./content/detail/icon-detail/icon-detail.component').then( + (m) => m.IconDetailComponent + ), + }, + { + path: 'content/detail/:id', + loadComponent: () => + import('./content/detail/detail.component').then( + (m) => m.DetailComponent + ), + }, + + //Search Pages + { + path: 'content/query', + loadComponent: () => + import('./search/search.component').then((m) => m.SearchComponent), + }, + + //API Documentation (Swagger UI) + { + path: 'ContentService', + loadComponent: () => + import('./swagger-page/swagger-page.component').then( + (m) => m.SwaggerPageComponent + ), + data: { serviceName: 'ContentService' }, + }, + { + path: 'AnalysisService', + loadComponent: () => + import('./swagger-page/swagger-page.component').then( + (m) => m.SwaggerPageComponent + ), + data: { serviceName: 'AnalysisService' }, + }, + + //404 Page + { + path: '404', + loadComponent: () => + import('./page-not-found/page-not-found.component').then( + (m) => m.PageNotFoundComponent + ), + }, //TODO: Remove? + /* Non - CMS Pages Above this Line */ + + //CMS Pages + { + path: '**', + loadComponent: () => + import('./page/page.component').then((m) => m.PageComponent), + }, ]; diff --git a/projects/website-angular/src/app/search/search.component.html b/projects/website-angular/src/app/search/search.component.html index c89f26f..98ac9aa 100644 --- a/projects/website-angular/src/app/search/search.component.html +++ b/projects/website-angular/src/app/search/search.component.html @@ -1,666 +1,882 @@
- @if (query && searchSubmitted) { - -
-
- - - -
+ @if (!query || !searchSubmitted) { +
+

Search Reactome

+

+ Enter a search term to find pathways, reactions, proteins, and more. +

+
+ } +
+ + + + +
- @if (currentMode === 'advanced') { - - } @else { - - } -
+ @if (currentMode !== 'site-search') { + +
+ + + +
- - @if (getActiveFilters(); as activeFilters) { - @if (activeFilters.length) { -
- @for (f of activeFilters; track f.category + f.value) { - - } -
- } + + @if (getActiveFilters(); as activeFilters) { @if (activeFilters.length) { +
+ @for (f of activeFilters; track f.category + f.value) { + } +
+ } } - - @if (results && !loading && currentMode !== "reference") { -
-

{{ results.numberOfMatches }} results found for "{{ query }}"

- @if (!hasNoResults) { - + + @if (results && !loading && currentMode !== "reference") { +
+

+ {{ results.numberOfMatches }} results found for "{{ query }}" +

+ @if (!hasNoResults) { + + } +
+ } + +
+ + +
+
+ +
+ +
+
+
+ +
+ +
+
+
+ +
+ +
+
+
+
+
+
- } @else { -

Please report to us and we will get back shortly.

- -

 

- - - +
+
-
- -
- -
+
+
+
+
+
+ +
+
+ +
+
+ + } +
+ } @if (!loading && !error && !hasNoResults && results) { @if + (results.results && results.results.length) { @if (grouped) { + + @for (group of results.results; track group.typeName) { + +
+ + @if (!collapsedGroups[group.typeName]) { @if (currentMode === + 'reference') { +
+ @if (group.typeName === 'Protein' && proteinLoading) { +
+ Loading all protein forms... +
+ } @for (entry of getGroupPageEntries(group); track entry.dbId) { +
+
+ +
+
+
+ @if (entry.deleted) { + delete + + @if (entry.replacementStIds?.length) { ⇒ + + {{ entry.replacementStIds[0] }} + + } } @else { + + + + }
-
- -
- - @if (mailAddress.value && !mailAddress.validity.valid) { - Please enter a valid email address - } -
+ @if (entry.deleted && entry.date) { +
+ Deleted on + {{ entry.date | date : "MMM d, y, h:mm:ss a" }}
-
- -
- -
+ } @if (entry.species?.length) { +
+ @for (sp of entry.species; track sp; let last = $last) { + {{ sp }} + }
-
- -
- -
+ } @if (entry.compartmentNames?.length) { +
+ Compartments: {{ entry.compartmentNames.join(", ") }}
-
- -
- -
+ } @if (entry.iconCuratorName) { +
+ Curator: + + {{ entry.iconCuratorName }} +
-
-
-
- -
-
+ } @if (entry.iconDesignerName) { +
+ Designer: + + {{ entry.iconDesignerName }} +
- -
-
-
-
+ } @if (entry.summation) { +

+ } @if (entry.referenceName || entry.databaseName) { +
+ Reference: + + ({{ entry.referenceIdentifier }})
- -
-
- + } @if (entry.type === 'Protein' && entry.referenceIdentifier + && getProteinFormCount(entry) > 1) { + + @if (isFormsExpanded(entry)) { +
+ @for (form of getProteinForms(entry); track form.dbId) { +
+ + {{ form.id || form.stId }} + @if (form.compartmentNames?.length) { + {{ + form.compartmentNames.join(", ") + }} + }
+ }
- + } } +
+ @if (entry.exactType == "Icon") { +
+ +
+ } +
}
- } - - @if (!loading && !error && !hasNoResults && results) { - @if (results.results && results.results.length) { - @if (grouped) { - - @for (group of results.results; track group.typeName) { - -
- - @if (!collapsedGroups[group.typeName]) { - @if (currentMode === 'reference') { -
- @if (group.typeName === 'Protein' && proteinLoading) { -
Loading all protein forms...
- } - @for (entry of getGroupPageEntries(group); track entry.dbId) { -
-
- -
-
-
- @if (entry.deleted) { - delete - - @if (entry.replacementStIds?.length) { - ⇒ - - {{ entry.replacementStIds[0] }} - - } - - } @else { - - - - } -
- @if (entry.deleted && entry.date) { -
- Deleted on - {{ entry.date | date:'MMM d, y, h:mm:ss a' }} -
- } - @if (entry.species?.length) { -
- @for (sp of entry.species; track sp; let last = $last) { - {{ sp }} - } -
- } - @if (entry.compartmentNames?.length) { -
- Compartments: {{ entry.compartmentNames.join(', ') }} -
- } - @if (entry.iconCuratorName) { -
Curator: - {{ entry.iconCuratorName }} -
- } - @if (entry.iconDesignerName) { -
Designer: - {{ entry.iconDesignerName }} -
- } - @if (entry.summation) { -

- } - @if (entry.referenceName || entry.databaseName) { -
- Reference: ({{ entry.referenceIdentifier }}) -
- } - @if (entry.type === 'Protein' && entry.referenceIdentifier && getProteinFormCount(entry) > 1) { - - @if (isFormsExpanded(entry)) { -
- @for (form of getProteinForms(entry); track form.dbId) { -
- - {{ form.id || form.stId }} - @if (form.compartmentNames?.length) { - {{ form.compartmentNames.join(', ') }} - } -
- } -
- } - } -
- @if (entry.exactType == "Icon") { -
- -
- } -
- } -
- @if (getGroupTotalPages(group) > 1 && !(group.typeName === 'Protein' && proteinLoading)) { - - } - } @else { -
- @for (entry of group.entries; track entry.dbId) { -
-
- -
-
-
- @if (entry.deleted) { - delete - - @if (entry.replacementStIds?.length) { - ⇒ - - {{ entry.replacementStIds[0] }} - - } - - } @else { - - - - } - -
- @if (entry.deleted && entry.date) { -
- Deleted on - {{ entry.date | date:'MMM d, y, h:mm:ss a' }} -
- } - @if (entry.species?.length) { -
- @for (sp of entry.species; track sp; let last = $last) { - {{ sp }} - } -
- } - @if (entry.compartmentNames?.length) { -
- Compartments: {{ entry.compartmentNames.join(', ') }} -
- } - @if (entry.iconCuratorName) { -
Curator: - {{ entry.iconCuratorName }} -
- } - @if (entry.iconDesignerName) { -
Designer: - {{ entry.iconDesignerName }} -
- } - @if (entry.summation) { -

- } - @if (entry.referenceName || entry.databaseName) { -
- Reference: ({{ entry.referenceIdentifier }}) -
- } -
- @if (entry.exactType == "Icon") { -
- -
- } -
- } -
- } - } -
- - } + @if (getGroupTotalPages(group) > 1 && !(group.typeName === 'Protein' + && proteinLoading)) { + + } } @else { +
+ @for (entry of group.entries; track entry.dbId) { +
+
+ +
+
+
+ @if (entry.deleted) { + delete + + @if (entry.replacementStIds?.length) { ⇒ + + {{ entry.replacementStIds[0] }} + + } } @else { + + + + } +
+ @if (entry.deleted && entry.date) { +
+ Deleted on + {{ entry.date | date : "MMM d, y, h:mm:ss a" }} +
+ } @if (entry.species?.length) { +
+ @for (sp of entry.species; track sp; let last = $last) { + {{ sp }} }
- + } @if (entry.compartmentNames?.length) { +
+ Compartments: {{ entry.compartmentNames.join(", ") }} +
+ } @if (entry.iconCuratorName) { +
+ Curator: + + {{ entry.iconCuratorName }} + +
+ } @if (entry.iconDesignerName) { +
+ Designer: + + {{ entry.iconDesignerName }} + +
+ } @if (entry.summation) { +

+ } @if (entry.referenceName || entry.databaseName) { +
+ Reference: + + ({{ entry.referenceIdentifier }}) +
+ } +
+ @if (entry.exactType == "Icon") { +
+ +
+ } +
} +
+ } } +
+ + } } @else { + + +
+ @for (entry of allEntries; track entry.dbId) { +
+
+ + +
+ @if (entry.species?.length) { +
+ @for (sp of entry.species; track sp; let last = $last) { + + } +
+ } @if (entry.compartmentNames?.length) { +
+ Compartments: {{ entry.compartmentNames.join(", ") }} +
+ } @if (entry.summation) { +

+ } @if (entry.referenceName) { +
+ Reference: + ({{ + entry.referenceIdentifier + }}) +
+ } @if (currentMode === 'reference' && entry.type === 'Protein' && + entry.referenceIdentifier && getProteinFormCount(entry) > 1) { + + @if (isFormsExpanded(entry)) { +
+ @for (form of getProteinForms(entry); track form.dbId) { +
+ + {{ form.id || form.stId }} + @if (form.compartmentNames?.length) { + {{ + form.compartmentNames.join(", ") + }} + } +
+ } +
+ } } +
} +
+ + } } - - @if (totalPages > 1) { - @if (currentMode === 'reference') { -
-
- } @else { -
-

Search Reactome

-

Enter a search term to find pathways, reactions, proteins, and more.

-
- - - -
- - @if (currentMode === 'advanced') { -
- -
- } @else { -
- -
- } + + } } }
+
+ } @else { + }
diff --git a/projects/website-angular/src/app/search/search.component.scss b/projects/website-angular/src/app/search/search.component.scss index dae843e..099a23d 100644 --- a/projects/website-angular/src/app/search/search.component.scss +++ b/projects/website-angular/src/app/search/search.component.scss @@ -1045,6 +1045,7 @@ $border-radius: 8px; .empty-state { text-align: center; padding: $spacing * 2 0; + padding-bottom: 4px; h1 { margin: 0 0 8px; diff --git a/projects/website-angular/src/app/search/search.component.ts b/projects/website-angular/src/app/search/search.component.ts index 40c2c0b..5108ba9 100644 --- a/projects/website-angular/src/app/search/search.component.ts +++ b/projects/website-angular/src/app/search/search.component.ts @@ -27,6 +27,7 @@ import { } from '../../services/search.service'; import { DatePipe } from '@angular/common'; import { MatIcon } from '@angular/material/icon'; +import { SiteSearchComponent } from '../site-search/site-search.component'; @Component({ selector: 'app-search', @@ -36,6 +37,7 @@ import { MatIcon } from '@angular/material/icon'; TileComponent, RouterLink, SearchBarComponent, + SiteSearchComponent, FormsModule, DatePipe, MatIcon, @@ -92,7 +94,7 @@ export class SearchComponent implements OnInit, OnDestroy, AfterViewInit { proteinTotalForms = 0; proteinLoading = false; - currentMode: 'simple' | 'advanced' | 'reference' = 'simple'; + currentMode: 'simple' | 'advanced' | 'reference' | 'site-search' = 'simple'; private paramsSub!: Subscription; @@ -126,11 +128,13 @@ export class SearchComponent implements OnInit, OnDestroy, AfterViewInit { this.currentMode = 'advanced'; } else if (params['reference'] === 'true') { this.currentMode = 'reference'; + } else if (params['site-search'] === 'true') { + this.currentMode = 'site-search'; } else { this.currentMode = 'simple'; } - if (this.query) { + if (this.query && this.currentMode !== 'site-search') { this.searchSubmitted = true; this.doSearch(); this.getSuggestions(this.query); diff --git a/projects/website-angular/src/app/site-search/site-search.component.html b/projects/website-angular/src/app/site-search/site-search.component.html index c87fdbb..795b5a5 100644 --- a/projects/website-angular/src/app/site-search/site-search.component.html +++ b/projects/website-angular/src/app/site-search/site-search.component.html @@ -1,15 +1,8 @@ - -
-

Site Search

-

- Search across all Reactome pages including news, documentation, community - pages, and more. -

- -
-
- search +
+
+
Site Search autofocus /> @if (query) { - - } -
-
- - @if (loading) { -
Loading search index...
- } @else { @if (categoryCounts.length > 0) { -
- - @for (cat of categoryCounts; track cat.category) { - + + } @else { + } -
- } @if (searched && results.length === 0) { -
-

- No results found for "{{ query }}". -

-

Try different keywords or check your spelling.

-
- } @else if (searched) { -
- {{ results.length }} result{{ results.length === 1 ? "" : "s" }} for - "{{ query }}" -
- } @for (group of groupedResults; track group.category) { -
-

{{ group.category }}

- @for (item of getVisibleItems(group); track item.id) { - -
{{ item.title }}
-
{{ item.url }}
-
{{ item.excerpt }}
- - } @if (group.items.length > previewLimit) { - - } -
- } } + + + +
+ + @if (loading) { +
Loading search index...
+ } @else { @if (categoryCounts.length > 0) { +
+ + @for (cat of categoryCounts; track cat.category) { + + } +
+ } @if (searched && results.length === 0) { +
+

+ No results found for "{{ query }}". +

+

Try different keywords or check your spelling.

+
+ } @else if (searched) { +
+ {{ results.length }} result{{ results.length === 1 ? "" : "s" }} for + "{{ query }}" +
+ } @for (group of groupedResults; track group.category) { +
+

{{ group.category }}

+ @for (item of getVisibleItems(group); track item.id) { + +
{{ item.title }}
+
{{ item.url }}
+
{{ item.excerpt }}
+ + } @if (group.items.length > previewLimit) { + + }
- + } } +
\ No newline at end of file diff --git a/projects/website-angular/src/app/site-search/site-search.component.scss b/projects/website-angular/src/app/site-search/site-search.component.scss index a50b468..85c07ec 100644 --- a/projects/website-angular/src/app/site-search/site-search.component.scss +++ b/projects/website-angular/src/app/site-search/site-search.component.scss @@ -2,9 +2,10 @@ $spacing: 24px; $border-radius: 8px; .site-search { - max-width: 800px; - margin: 0 auto; - padding: $spacing 0; + display: flex; + flex-direction: column; + height: 100%; + width: 100%; } h1 { @@ -16,6 +17,43 @@ h1 { margin: 0 0 $spacing; } +.search-top { + max-width: 700px; + margin: 0 auto $spacing; + align-self: center; + width: 100%; +} + +.search-bar-container { + display: flex; + align-items: stretch; + justify-content: center; + width: 100%; + margin-bottom: 8px; +} + +.search-input { + flex: 1; + padding: 4px 16px; + border: 2px solid var(--primary); + border-radius: 4px; + border-top-right-radius: 0; + border-bottom-right-radius: 0; + font-size: 20px; +} + +.search-button { + padding: 4px; + border: 2px solid var(--primary); + border-radius: 4px; + border-top-left-radius: 0; + border-bottom-left-radius: 0; + background-color: var(--primary); + color: var(--on-primary); + font-size: 20px; + cursor: pointer; +} + .search-bar { margin-bottom: $spacing; diff --git a/projects/website-angular/src/app/site-search/site-search.component.ts b/projects/website-angular/src/app/site-search/site-search.component.ts index d6d1fd4..16a9f4a 100644 --- a/projects/website-angular/src/app/site-search/site-search.component.ts +++ b/projects/website-angular/src/app/site-search/site-search.component.ts @@ -3,7 +3,6 @@ import { ActivatedRoute, Router, RouterLink } from '@angular/router'; import { HttpClient } from '@angular/common/http'; import { Subscription } from 'rxjs'; import MiniSearch from 'minisearch'; -import { PageLayoutComponent } from '../page-layout/page-layout.component'; import { SiteSearchIndexItem } from '../../types/site-search'; interface SearchResultItem extends SiteSearchIndexItem { @@ -18,7 +17,7 @@ interface GroupedResults { @Component({ selector: 'app-site-search', standalone: true, - imports: [PageLayoutComponent, RouterLink], + imports: [RouterLink], templateUrl: './site-search.component.html', styleUrl: './site-search.component.scss', }) diff --git a/projects/website-angular/src/config/nav-options.json b/projects/website-angular/src/config/nav-options.json index 0eba910..1c85832 100644 --- a/projects/website-angular/src/config/nav-options.json +++ b/projects/website-angular/src/config/nav-options.json @@ -98,162 +98,161 @@ "link": "/documentation", "icon": "school", "dropdown-links": { - "userguide": { - "label": "Userguide", - "link": "/documentation/userguide", + "userguide": { + "label": "Userguide", + "link": "/documentation/userguide", + "dropdown-links": { + "pathway-browser": { + "label": "Pathway Browser", + "link": "/documentation/userguide/pathway-browser" + }, + "how-do-i-search": { + "label": "How do I search?", + "link": "/documentation/userguide/searching" + }, + "details-panel": { + "label": "Details Panel", + "link": "/documentation/userguide/details-panel" + }, + "analysis-tools": { + "label": "Analysis Tools", + "link": "/documentation/userguide/analysis", "dropdown-links": { - "pathway-browser": { - "label": "Pathway Browser", - "link": "/documentation/userguide/pathway-browser" - }, - "how-do-i-search": { - "label": "How do I search?", - "link": "/documentation/userguide/searching" - }, - "details-panel": { - "label": "Details Panel", - "link": "/documentation/userguide/details-panel" - }, - "analysis-tools": { - "label": "Analysis Tools", - "link": "/documentation/userguide/analysis", - "dropdown-links": { - "analysis-gene-expression": { - "label": "Analysis Gene Expression", - "link": "/documentation/userguide/analysis/gsa" - } - } - }, - "diseases": { - "label": "Diseases", - "link": "/documentation/userguide/diseases" - }, - "cytomics": { - "label": "Cytomics", - "link": "/documentation/userguide/cytomics" - }, - "review-status": { - "label": "Review Status of Reactome Events", - "link": "/documentation/userguide/review-status" - }, - "reactome-fiviz": { - "label": "ReactomeFIViz", - "link": "/documentation/userguide/reactome-fiviz" + "analysis-gene-expression": { + "label": "Analysis Gene Expression", + "link": "/documentation/userguide/analysis/gsa" } - } - }, - "developers-zone": { - "label": "Developers Zone", - "link": "/documentation/dev", + }, + "diseases": { + "label": "Diseases", + "link": "/documentation/userguide/diseases" + }, + "cytomics": { + "label": "Cytomics", + "link": "/documentation/userguide/cytomics" + }, + "review-status": { + "label": "Review Status of Reactome Events", + "link": "/documentation/userguide/review-status" + }, + "reactome-fiviz": { + "label": "ReactomeFIViz", + "link": "/documentation/userguide/reactome-fiviz" + } + } + }, + "developers-zone": { + "label": "Developers Zone", + "link": "/documentation/dev", + "dropdown-links": { + "graph-database": { + "label": "Graph Database", + "link": "/documentation/dev/graph-database", "dropdown-links": { - "graph-database": { - "label": "Graph Database", - "link": "/documentation/dev/graph-database", - "dropdown-links": { - "extract-participating-molecules": { - "label": "Extract Participating Molecules", - "link": "/documentation/dev/graph-database/extract-participating-molecules" - }, - "neo4j-desktop": { - "label": "Neo4j Desktop", - "link": "/documentation/dev/graph-database/neo4j-desktop" - } - } - }, - "analysis-service": { - "label": "Analysis Service", - "link": "/documentation/dev/analysis" - }, - - "content-service": { - "label": "Content Service", - "link": "/documentation/dev/content-service", - "dropdown-links": { - "diagram-exporter": { - "label": "Diagram Exporter", - "link": "/documentation/dev/content-service/diagram-exporter" - } - } - }, - "pathways-overview": { - "label": "Pathways Overview", - "link": "/documentation/dev/pathways-overview", - "dropdown-links": { - "js": { - "label": "Pathway JS", - "link": "/documentation/dev/pathways-overview/js" - }, - "gwt": { - "label": "Pathway GWT", - "link": "/documentation/dev/pathways-overview/gwt" - } - } + "extract-participating-molecules": { + "label": "Extract Participating Molecules", + "link": "/documentation/dev/graph-database/extract-participating-molecules" }, - "diagram": { - "label": "Pathway Diagrams", - "link": "/documentation/dev/diagram", - "dropdown-links": { - "pathway-diagram-specs": { - "label": "Pathway Diagram Specs", - "link": "/documentation/dev/diagram/pathway-diagram-specs" - }, - "js": { - "label": "Diagram JS", - "link": "/documentation/dev/diagram/js" - }, - "gwt": { - "label": "Diagram GWT", - "link": "/documentation/dev/diagram/gwt" - } - } + "neo4j-desktop": { + "label": "Neo4j Desktop", + "link": "/documentation/dev/graph-database/neo4j-desktop" } } - }, - "icon-info": { - "label": "Icon Info", - "link": "/documentation/icon-info", + }, + "analysis-service": { + "label": "Analysis Service", + "link": "/documentation/dev/analysis" + }, + + "content-service": { + "label": "Content Service", + "link": "/documentation/dev/content-service", "dropdown-links": { - "ehld": { - "label": "EHLD Specs & Guidelines", - "link": "/documentation/icon-info/ehld-specs-guideline" + "diagram-exporter": { + "label": "Diagram Exporter", + "link": "/documentation/dev/content-service/diagram-exporter" + } + } + }, + "pathways-overview": { + "label": "Pathways Overview", + "link": "/documentation/dev/pathways-overview", + "dropdown-links": { + "js": { + "label": "Pathway JS", + "link": "/documentation/dev/pathways-overview/js" }, - "icons-guidelines": { - "label": "Icon Library Guidelines", - "link": "/documentation/icon-info/icons-guidelines" + "gwt": { + "label": "Pathway GWT", + "link": "/documentation/dev/pathways-overview/gwt" } } - }, - "data-model": { - "label": "Data Model", - "link": "/documentation/data-model" - }, - "curator-guide": { - "label": "Curator Guide", - "link": "/documentation/curator-guide" - }, - "computationally-inferred-events": { - "label": "Computationally Inferred Events", - "link": "/documentation/inferred-events" - }, - "faq": { - "label": "FAQ", - "link": "/documentation/faq" - }, - "linking-to-us": { - "label": "Linking to Us", - "link": "/documentation/linking-to-us", + }, + "diagram": { + "label": "Pathway Diagrams", + "link": "/documentation/dev/diagram", "dropdown-links": { - "identifiers": { - "label": "Identifiers", - "link": "/documentation/linking-to-us/identifiers" + "pathway-diagram-specs": { + "label": "Pathway Diagram Specs", + "link": "/documentation/dev/diagram/pathway-diagram-specs" + }, + "js": { + "label": "Diagram JS", + "link": "/documentation/dev/diagram/js" + }, + "gwt": { + "label": "Diagram GWT", + "link": "/documentation/dev/diagram/gwt" } } - }, - "citing-us": { - "label": "Citing Us", - "link": "/documentation/cite" + } + } + }, + "icon-info": { + "label": "Icon Info", + "link": "/documentation/icon-info", + "dropdown-links": { + "ehld": { + "label": "EHLD Specs & Guidelines", + "link": "/documentation/icon-info/ehld-specs-guideline" + }, + "icons-guidelines": { + "label": "Icon Library Guidelines", + "link": "/documentation/icon-info/icons-guidelines" + } } + }, + "data-model": { + "label": "Data Model", + "link": "/documentation/data-model" + }, + "curator-guide": { + "label": "Curator Guide", + "link": "/documentation/curator-guide" + }, + "computationally-inferred-events": { + "label": "Computationally Inferred Events", + "link": "/documentation/inferred-events" + }, + "faq": { + "label": "FAQ", + "link": "/documentation/faq" + }, + "linking-to-us": { + "label": "Linking to Us", + "link": "/documentation/linking-to-us", + "dropdown-links": { + "identifiers": { + "label": "Identifiers", + "link": "/documentation/linking-to-us/identifiers" + } + } + }, + "citing-us": { + "label": "Citing Us", + "link": "/documentation/cite" + } } }, "tools": { @@ -261,89 +260,85 @@ "link": "/tools", "icon": "perm_data_setting", "dropdown-links": { - "pathway-browser": { - "label": "Pathway Browser", - "link": "/PathwayBrowser" - }, - "analyse-gene-expression": { - "label": "Analyse gene expression", - "link": "/gsa/home" - }, - "species-comparison": { - "label": "Species Comparison", - "link": "/PathwayBrowser/#TOOL=AT" - }, - "tissue-distribution": { - "label": "Tissue Distribution", - "link": "/PathwayBrowser/#TOOL=AT" - }, - "analysis-service": { - "label": "Analysis Service", - "link": "/AnalysisService", - "external": true - }, - "content-service": { - "label": "Content Service", - "link": "/ContentService", - "external": true - }, - "reactome-fiviz": { - "label": "ReactomeFIViz", - "link": "/tools/reactome-fiviz" - }, - "search": { - "label": "Search", - "link": "/content/query" - }, - "site-search": { - "label": "Site Search", - "link": "/tools/site-search" - } + "pathway-browser": { + "label": "Pathway Browser", + "link": "/PathwayBrowser" + }, + "analyse-gene-expression": { + "label": "Analyse gene expression", + "link": "/gsa/home" + }, + "species-comparison": { + "label": "Species Comparison", + "link": "/PathwayBrowser/#TOOL=AT" + }, + "tissue-distribution": { + "label": "Tissue Distribution", + "link": "/PathwayBrowser/#TOOL=AT" + }, + "analysis-service": { + "label": "Analysis Service", + "link": "/AnalysisService", + "external": true + }, + "content-service": { + "label": "Content Service", + "link": "/ContentService", + "external": true + }, + "reactome-fiviz": { + "label": "ReactomeFIViz", + "link": "/tools/reactome-fiviz" + }, + "search": { + "label": "Search", + "link": "/content/query" + } } }, "community": { "label": "Community", "link": "/community", - "icon": "contacts", + "icon": "contacts", "dropdown-links": { - "contribute-pathway-knowledge": { - "label": "Contribute Pathway Knowledge", - "link": "/community/collaboration", - "dropdown-links": { - "faq-for-prospective-reviewers-and-authors": { - "label": "FAQ for Prospective Reviewers and Authors", - "link": "/community/collaboration/faq-for-prospective-reviewers-and-authors" - } - } - }, - "icon-library": { - "label": "Icon Library", - "link": "/community/icon-lib" - }, - "outreach": { - "label": "Outreach", - "link": "/community/outreach" - }, - "events": { - "label": "Events", - "link": "/community/events" - }, - "publications": { - "label": "Publications", - "link": "/community/publications" - }, - "partners": { - "label": "Partners", - "link": "/community/partners" - }, - "contributors": { - "label": "Contributors", - "link": "/community/contributors" - }, - "resources-guide": { - "label": "Resources Guide", - "link": "/community/resources" + "contribute-pathway-knowledge": { + "label": "Contribute Pathway Knowledge", + "link": "/community/collaboration", + "dropdown-links": { + "faq-for-prospective-reviewers-and-authors": { + "label": "FAQ for Prospective Reviewers and Authors", + "link": "/community/collaboration/faq-for-prospective-reviewers-and-authors" + } } + }, + "icon-library": { + "label": "Icon Library", + "link": "/community/icon-lib" + }, + "outreach": { + "label": "Outreach", + "link": "/community/outreach" + }, + "events": { + "label": "Events", + "link": "/community/events" + }, + "publications": { + "label": "Publications", + "link": "/community/publications" + }, + "partners": { + "label": "Partners", + "link": "/community/partners" + }, + "contributors": { + "label": "Contributors", + "link": "/community/contributors" + }, + "resources-guide": { + "label": "Resources Guide", + "link": "/community/resources" + } } }, "download": {