diff --git a/common/constants.js b/common/constants.js
index 97fcd1559c745356cb46e0739791bb79e5c5dc5c..e68066f351ac4e6c0cac2d23e5901e9046a78fcc 100644
--- a/common/constants.js
+++ b/common/constants.js
@@ -6,6 +6,7 @@
OPEN: 'Open',
EXPAND: 'Expand',
COLLAPSE: 'Collapse',
+ OPEN_IN_NEW_WINDOW: 'Open in a new window',
// dataset specific
EXPLORE_DATASET_IN_KG: `Explore dataset in Knowledge Graph`,
diff --git a/common/helpOnePager.md b/common/helpOnePager.md
index e54eec02677fc4a15bc3d4dc043fb824c8d2d49e..a8551e0b2b22258b633459a5854774ac301f8ae0 100644
--- a/common/helpOnePager.md
+++ b/common/helpOnePager.md
@@ -6,7 +6,7 @@
| Translate / Pan | `[drag]` any of the slice views | `[drag]` any of the slice views |
| Oblique rotation | `<shift>` + `[drag]` any of the slice views | `[rotate]` any of the slice views |
| Zoom | `[mousewheel]` | `[pinch zoom]` |
-| Zoom | `[hover]` on any slice views, `[click]` magnifier | `[tap]` on magnifier |
+| Zoom | `[hover]` on any slice views > `[click]` magnifier | `[tap]` on magnifier |
| Next slice | `<ctrl>` + `[mousewheel]` | - |
| Next 10 slice | `<ctrl>` + `<shift>` + `[mousewheel]` | - |
| Toggle delineation | `[q]` | - |
diff --git a/src/atlasViewer/atlasViewer.constantService.service.ts b/src/atlasViewer/atlasViewer.constantService.service.ts
index b9484fd0f400b2d18208595d2ca25db0be74bcd3..b9059e25b441ca6d1057277fc45db9c8f7f6eac9 100644
--- a/src/atlasViewer/atlasViewer.constantService.service.ts
+++ b/src/atlasViewer/atlasViewer.constantService.service.ts
@@ -133,48 +133,6 @@ Interactive atlas viewer requires **webgl2.0**, and the \`EXT_color_buffer_float
*/
public showConfigTitle: string = 'Settings'
- private showHelpGeneralMobile = [
- ['hold 🌠+ ↕', 'change oblique slice mode'],
- ['hold 🌠+ ↔', 'oblique slice'],
- ]
- private showHelpGeneralDesktop = [
- ['num keys [0-9]', 'toggle layer visibility [0-9]'],
- ['h', 'show help'],
- ['?', 'show help'],
- ['o', 'toggle perspective/orthographic'],
- ]
-
- public showHelpGeneralMap = this.showHelpGeneralDesktop
-
- private showHelpSliceViewMobile = [
- ['drag', 'pan'],
- ]
- private showHelpSliceViewDesktop = [
- ['drag', 'pan'],
- ['shift + drag', 'oblique slice'],
- ]
-
- public showHelpSliceViewMap = this.showHelpSliceViewDesktop
-
- private showHelpPerspectiveMobile = [
- ['drag', 'change perspective view'],
- ]
-
- private showHelpPerspectiveDesktop = [
- ['drag', 'change perspective view'],
- ]
- public showHelpPerspectiveViewMap = this.showHelpPerspectiveDesktop
-
- public repoUrl = `https://github.com/HumanBrainProject/interactive-viewer`
- public supportEmailAddress = `support@ebrains.eu`
- public docUrl = `https://interactive-viewer.readthedocs.io/en/latest/`
-
- public showHelpSupportText: string = `Did you encounter an issue?
-Send us an email: <a target = "_blank" href = "mailto:${this.supportEmailAddress}">${this.supportEmailAddress}</a>
-
-Raise/track issues at github repo: <a target = "_blank" href = "${this.repoUrl}">${this.repoUrl}</a>
-`
-
public incorrectParcellationNameSearchParam(title) {
return `The selected parcellation - ${title} - is not available. The the first parcellation of the template is selected instead.`
}
@@ -202,22 +160,6 @@ Raise/track issues at github repo: <a target = "_blank" href = "${this.repoUrl}"
this.subscriptions.push(
this.darktheme$.subscribe(flag => this.darktheme = flag),
)
-
- this.subscriptions.push(
- this.pureConstantService.useTouchUI$.subscribe(bool => {
- if (bool) {
- this.showHelpSliceViewMap = this.showHelpSliceViewMobile
- this.showHelpGeneralMap = this.showHelpGeneralMobile
- this.showHelpPerspectiveViewMap = this.showHelpPerspectiveMobile
- this.dissmissUserLayerSnackbarMessage = this.dissmissUserLayerSnackbarMessageMobile
- } else {
- this.showHelpSliceViewMap = this.showHelpSliceViewDesktop
- this.showHelpGeneralMap = this.showHelpGeneralDesktop
- this.showHelpPerspectiveViewMap = this.showHelpPerspectiveDesktop
- this.dissmissUserLayerSnackbarMessage = this.dissmissUserLayerSnackbarMessageDesktop
- }
- }),
- ),
this.pureConstantService.getTemplateEndpoint$.subscribe(arr => {
this.totalTemplates = arr.length
})
@@ -238,9 +180,6 @@ Raise/track issues at github repo: <a target = "_blank" href = "${this.repoUrl}"
})
}
- private dissmissUserLayerSnackbarMessageDesktop = `You can dismiss extra layers with [ESC]`
- private dissmissUserLayerSnackbarMessageMobile = `You can dismiss extra layers in the 🌠menu`
- public dissmissUserLayerSnackbarMessage: string = this.dissmissUserLayerSnackbarMessageDesktop
}
export const UNSUPPORTED_PREVIEW = [{
diff --git a/src/ui/help/about/about.component.ts b/src/ui/help/about/about.component.ts
index f3e35041d0b2dc7a32a98b32438805e0d029d1ff..77dd5c431ba9ec42fc8911ead646806abeda0832 100644
--- a/src/ui/help/about/about.component.ts
+++ b/src/ui/help/about/about.component.ts
@@ -1,6 +1,5 @@
import { Component } from '@angular/core'
-import { DomSanitizer } from '@angular/platform-browser';
-import { AtlasViewerConstantsServices } from 'src/atlasViewer/atlasViewer.constantService.service';
+import { PureContantService } from 'src/util';
@Component({
selector: 'iav-about',
@@ -11,12 +10,6 @@ import { AtlasViewerConstantsServices } from 'src/atlasViewer/atlasViewer.consta
})
export class AboutCmp {
-
- public generalHelp = this.constantService.showHelpGeneralMap
- public sliceviewHelp = this.constantService.showHelpSliceViewMap
- public perspectiveviewHelp = this.constantService.showHelpPerspectiveViewMap
- public supportText = this.sanitizer.bypassSecurityTrustHtml(this.constantService.showHelpSupportText)
-
public contactEmailHref: string = `mailto:${this.constantService.supportEmailAddress}?Subject=[InteractiveAtlasViewer]%20Queries`
public supportEmailAddress: string = this.constantService.supportEmailAddress
@@ -24,8 +17,7 @@ export class AboutCmp {
public repoUrl = this.constantService.repoUrl
constructor(
- private constantService: AtlasViewerConstantsServices,
- private sanitizer: DomSanitizer,
+ private constantService: PureContantService,
) {
}
}
diff --git a/src/ui/help/helpOnePager/helpOnePager.component.ts b/src/ui/help/helpOnePager/helpOnePager.component.ts
index ff9fb678b1659bbdae249e3f1b61ee09bc330398..0e0cf92a6c9d4d936b9730947f95332916ca3f53 100644
--- a/src/ui/help/helpOnePager/helpOnePager.component.ts
+++ b/src/ui/help/helpOnePager/helpOnePager.component.ts
@@ -1,6 +1,7 @@
import { Component, Optional } from "@angular/core";
import QUICK_STARTER from '!!raw-loader!common/helpOnePager.md'
import { PureContantService } from "src/util";
+import { ARIA_LABELS } from 'common/constants'
@Component({
selector: 'help-one-pager',
@@ -11,13 +12,16 @@ import { PureContantService } from "src/util";
})
export class HelpOnePager{
+ public ARIA_LABELS = ARIA_LABELS
public QUICK_STARTER_MD = QUICK_STARTER
public extQuickStarter: string
+ public userDoc: string
constructor(
@Optional() pConstService: PureContantService
){
- if (pConstService?.backendUrl) {
- this.extQuickStarter = `quickstart.html`
+ this.extQuickStarter = `quickstart.html`
+ if (pConstService) {
+ this.userDoc = pConstService.docUrl
}
}
}
diff --git a/src/ui/help/helpOnePager/helpOnePager.template.html b/src/ui/help/helpOnePager/helpOnePager.template.html
index 3a0d4edf74d1d972d846ac8d8b409005ce0694f2..ebf014b77a1c45468f6e56966756a0f542563c37 100644
--- a/src/ui/help/helpOnePager/helpOnePager.template.html
+++ b/src/ui/help/helpOnePager/helpOnePager.template.html
@@ -1,23 +1,37 @@
-<markdown-dom mat-dialog-content [markdown]="QUICK_STARTER_MD">
-</markdown-dom>
+<div class="position-relative">
+ <markdown-dom mat-dialog-content [markdown]="QUICK_STARTER_MD">
+ </markdown-dom>
+
+ <a *ngIf="extQuickStarter"
+ [href]="extQuickStarter"
+ target="_blank"
+ class="position-absolute top-0 right-0"
+ [matTooltip]="ARIA_LABELS.OPEN_IN_NEW_WINDOW">
+ <button mat-icon-button
+ color="primary">
+ <i class = "m-1 fas fa-external-link-alt"></i>
+ </button>
+ </a>
+</div>
<div mat-dialog-actions align="center">
<button mat-button color="primary" mat-dialog-close quick-tour-opener>
- <span class="d-flex align-items-center">
+ <i class = "far fa-play-circle m-1"></i>
+ <span>
Take a tour
- <i class = "far fa-play-circle ml-1"></i>
</span>
</button>
- <a *ngIf="extQuickStarter"
- [href]="extQuickStarter"
+ <a *ngIf="userDoc"
+ [href]="userDoc"
target="_blank">
- <button mat-raised-button
+ <button mat-button
color="primary">
- <span iav-media-query #iavMediaQuery="iavMediaQuery">
- Open <ng-template [ngIf]="(iavMediaQuery.mediaBreakPoint$ | async) < 3">in new window</ng-template>
+ <i class="m1 fas fa-book-open"></i>
+ <span>
+ User documentation
</span>
- <i class = "fas fa-external-link-alt"></i>
+ <i class="m-1 fas fa-external-link-alt"></i>
</button>
</a>
diff --git a/src/util/pureConstant.service.ts b/src/util/pureConstant.service.ts
index 6bd40e68d982defb8905191cc554c84659028b96..b97c8e586b341a36eb2bcded6dd59fbb1ce3d82b 100644
--- a/src/util/pureConstant.service.ts
+++ b/src/util/pureConstant.service.ts
@@ -17,6 +17,16 @@ const getUniqueId = () => Math.round(Math.random() * 1e16).toString(16)
export class PureContantService implements OnDestroy{
+ public repoUrl = `https://github.com/HumanBrainProject/interactive-viewer`
+ public supportEmailAddress = `support@ebrains.eu`
+ public docUrl = `https://interactive-viewer.readthedocs.io/en/latest/`
+
+ public showHelpSupportText: string = `Did you encounter an issue?
+Send us an email: <a target = "_blank" href = "mailto:${this.supportEmailAddress}">${this.supportEmailAddress}</a>
+
+Raise/track issues at github repo: <a target = "_blank" href = "${this.repoUrl}">${this.repoUrl}</a>
+`
+
public useTouchUI$: Observable<boolean>
public fetchedAtlases$: Observable<any>
public darktheme$: Observable<boolean>