Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Hide image controls when tagging, and hide compass HUD by default #7028

Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
6c02782
make compass HUD configurable and hide image controls when tagging
scottbell Sep 1, 2023
257005f
lint fixes
scottbell Sep 1, 2023
c231d35
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 4, 2023
07219d7
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 4, 2023
6e8d853
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 6, 2023
50afa67
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 6, 2023
ceabf0a
address PR comments
scottbell Sep 6, 2023
e03424d
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 12, 2023
30c7163
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 13, 2023
44bc596
resolve conflicts
scottbell Sep 15, 2023
dd4efa3
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 18, 2023
4234c48
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 18, 2023
eee6f82
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 20, 2023
349bf4f
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 21, 2023
c10f586
resolve conflicts
scottbell Sep 21, 2023
5987561
change prop to inject
scottbell Sep 25, 2023
735263b
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
scottbell Sep 26, 2023
03970e0
Merge branch 'master' into 6994-imagery-annotations-do-not-show-local…
shefalijoshi Sep 27, 2023
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 9 additions & 1 deletion e2e/tests/functional/plugins/imagery/exampleImagery.e2e.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,10 @@ test.describe('Example Imagery Object', () => {
await mouseZoomOnImageAndAssert(page, -2);
});

test('Compass HUD should be hidden by default', async ({ page }) => {
await expect(page.locator('.c-hud')).toBeHidden();
});

test('Can adjust image brightness/contrast by dragging the sliders', async ({
page,
browserName
Expand Down Expand Up @@ -198,7 +202,7 @@ test.describe('Example Imagery Object', () => {
expect(afterDownPanBoundingBox.y).toBeLessThan(afterUpPanBoundingBox.y);
});

test('Can use alt+shift+drag to create a tag', async ({ page }) => {
test('Can use alt+shift+drag to create a tag and ensure toolbars disappear', async ({ page }) => {
const canvas = page.locator('canvas');
await canvas.hover({ trial: true });

Expand All @@ -211,7 +215,11 @@ test.describe('Example Imagery Object', () => {
// steps not working for me here
await page.mouse.move(canvasCenterX - 20, canvasCenterY - 20);
await page.mouse.move(canvasCenterX - 100, canvasCenterY - 100);
// toolbar should hide when we're creating annotations with a drag
await expect(page.locator('[role="toolbar"][aria-label="Image controls"]')).toBeHidden();
scottbell marked this conversation as resolved.
Show resolved Hide resolved
await page.mouse.up();
// toolbar should reappear when we're done creating annotations
await expect(page.locator('[role="toolbar"][aria-label="Image controls"]')).toBeVisible();
await Promise.all(tagHotkey.map((x) => page.keyboard.up(x)));

//Wait for canvas to stabilize.
Expand Down
1 change: 1 addition & 0 deletions src/plugins/imagery/ImageryView.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ export default class ImageryView {
domainObject: this.domainObject,
objectPath: alternateObjectPath || this.objectPath,
imageFreshnessOptions: this.options?.imageFreshness || DEFAULT_IMAGE_FRESHNESS_OPTIONS,
showCompassHUD: this.options?.showCompassHUD,
scottbell marked this conversation as resolved.
Show resolved Hide resolved
currentView: this
},
data() {
Expand Down
8 changes: 6 additions & 2 deletions src/plugins/imagery/components/AnnotationsCanvas.vue
Original file line number Diff line number Diff line change
Expand Up @@ -54,6 +54,7 @@
}
}
},
emits: ['annotation-marquee-started', 'annotations-changed', 'annotation-marquee-finished'],
scottbell marked this conversation as resolved.
Show resolved Hide resolved
data() {
return {
dragging: false,
Expand Down Expand Up @@ -121,7 +122,7 @@
methods: {
onAnnotationChange(annotations) {
this.selectedAnnotations = annotations;
this.$emit('annotationsChanged', annotations);
this.$emit('annotations-changed', annotations);

Check warning on line 125 in src/plugins/imagery/components/AnnotationsCanvas.vue

View check run for this annotation

Codecov / codecov/patch

src/plugins/imagery/components/AnnotationsCanvas.vue#L125

Added line #L125 was not covered by tests
},
updateSelection(selection) {
const selectionContext = selection?.[0]?.[0]?.context?.item;
Expand Down Expand Up @@ -292,6 +293,8 @@
createNewAnnotation() {
this.dragging = false;
this.selectedAnnotations = [];
this.selectedAnnotations = [];
this.$emit('annotation-marquee-finished');

Check warning on line 297 in src/plugins/imagery/components/AnnotationsCanvas.vue

View check run for this annotation

Codecov / codecov/patch

src/plugins/imagery/components/AnnotationsCanvas.vue#L296-L297

Added lines #L296 - L297 were not covered by tests

const rectangleFromCanvas = {
x: this.newAnnotationRectangle.x,
Expand All @@ -315,6 +318,7 @@
},
attemptToSelectExistingAnnotation(event) {
this.dragging = false;
this.$emit('annotation-marquee-finished');
// use flatbush to find annotations that are close to the click
const boundingRect = this.canvas.getBoundingClientRect();
const scaleX = this.canvas.width / boundingRect.width;
Expand Down Expand Up @@ -377,7 +381,7 @@
return selection;
},
startAnnotationDrag(event) {
this.$emit('annotationMarqueed');
this.$emit('annotation-marquee-started');
this.newAnnotationRectangle = {};
const boundingRect = this.canvas.getBoundingClientRect();
const scaleX = this.canvas.width / boundingRect.width;
Expand Down
2 changes: 2 additions & 0 deletions src/plugins/imagery/components/Compass/Compass.vue
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@
<template>
<div class="c-compass" :style="`width: 100%; height: 100%`">
<compass-hud
v-if="showCompassHUD"
:camera-angle-of-view="cameraAngleOfView"
:heading="heading"
:camera-azimuth="cameraAzimuth"
Expand Down Expand Up @@ -54,6 +55,7 @@ export default {
CompassHud,
CompassRose
},
inject: ['showCompassHUD'],
props: {
image: {
type: Object,
Expand Down
27 changes: 22 additions & 5 deletions src/plugins/imagery/components/ImageryView.vue
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,7 @@
@mousedown="handlePanZoomClick"
>
<ImageControls
v-show="!annotationsBeingMarqueed"
ref="imageControls"
:zoom-factor="zoomFactor"
:image-url="imageUrl"
Expand Down Expand Up @@ -92,8 +93,9 @@
v-if="shouldDisplayAnnotations"
:image="focusedImage"
:imagery-annotations="imageryAnnotations[focusedImage.time]"
@annotationMarqueed="handlePauseButton(true)"
@annotationsChanged="loadAnnotations"
@annotation-marquee-started="pauseAndHideImageControls"
@annotation-marquee-finished="revealImageControls"
@annotations-changed="loadAnnotations"
/>
</div>
</div>
Expand Down Expand Up @@ -246,7 +248,14 @@
AnnotationsCanvas
},
mixins: [imageryData],
inject: ['openmct', 'domainObject', 'objectPath', 'currentView', 'imageFreshnessOptions'],
inject: [
'openmct',
'domainObject',
'objectPath',
'currentView',
'imageFreshnessOptions',
'showCompassHUD'
scottbell marked this conversation as resolved.
Show resolved Hide resolved
],
props: {
focusedImageTimestamp: {
type: Number,
Expand Down Expand Up @@ -308,7 +317,8 @@
imagePanned: false,
forceShowThumbnails: false,
animateThumbScroll: false,
imageryAnnotations: {}
imageryAnnotations: {},

Check warning on line 320 in src/plugins/imagery/components/ImageryView.vue

View check run for this annotation

Codecov / codecov/patch

src/plugins/imagery/components/ImageryView.vue#L320

Added line #L320 was not covered by tests
annotationsBeingMarqueed: false
};
},
computed: {
Expand Down Expand Up @@ -752,6 +762,13 @@
transition: `${!this.pan && this.animateZoom ? 'transform 250ms ease-in' : 'initial'}`
};
},
pauseAndHideImageControls() {
this.annotationsBeingMarqueed = true;
this.handlePauseButton(true);
},
revealImageControls() {
this.annotationsBeingMarqueed = false;
},
setTimeContext() {
this.stopFollowingTimeContext();
this.timeContext = this.openmct.time.getContextForView(this.objectPath);
Expand Down Expand Up @@ -1188,7 +1205,7 @@
this.zoomFactor = newScaleFactor;
},
handlePanZoomClick(e) {
this.$refs.imageControls.handlePanZoomClick(e);
this.$refs.imageControls?.handlePanZoomClick(e);
},
arrowDownHandler(event) {
let key = event.keyCode;
Expand Down
Loading