From 68f3be931f683f7d77161b4b78d0f98fc8fd2b92 Mon Sep 17 00:00:00 2001
From: jojohoch <joachim.hoch@iqb.hu-berlin.de>
Date: Mon, 28 Nov 2022 09:22:17 +0100
Subject: [PATCH] Prevent scrollbars from displaying for Geogebra elements with
fixed size
---
.../common/components/geometry/geometry.component.ts | 12 ++++++++----
projects/common/models/elements/geometry/geometry.ts | 2 +-
2 files changed, 9 insertions(+), 5 deletions(-)
diff --git a/projects/common/components/geometry/geometry.component.ts b/projects/common/components/geometry/geometry.component.ts
index 3288f376e..75bb4a455 100644
--- a/projects/common/components/geometry/geometry.component.ts
+++ b/projects/common/components/geometry/geometry.component.ts
@@ -13,7 +13,10 @@ declare const GGBApplet: any;
@Component({
selector: 'aspect-geometry',
template: `
- <div class="geogebra-container">
+ <div class="geogebra-container"
+ [style.height.px]="elementModel.height"
+ [style.width.px]="elementModel.width"
+ [class.center]="this.elementModel.position.fixedSize && this.elementModel.position.dynamicPositioning">
<div [id]="elementModel.id" class="geogebra-applet"></div>
<button *ngIf="this.elementModel.showResetIcon"
mat-icon-button
@@ -27,8 +30,8 @@ declare const GGBApplet: any;
`,
styles: [
':host {display: block; width: 100%; height: 100%;}',
- '.geogebra-applet {margin: auto;}',
'.geogebra-container {position: relative;}',
+ '.center {margin: auto;}',
'.reset-button {position: absolute; right: 0; z-index: 100; margin: 5px;}',
'.reset-icon {font-size: 30px !important;}'
]
@@ -86,8 +89,9 @@ export class GeometryComponent extends ElementComponent implements AfterViewInit
}
const params: any = {
id: this.elementModel.id,
- width: this.elementModel.width,
- height: this.elementModel.height,
+ width: this.elementModel.width - 4, // must be smaller than the container, otherwise scroll bars will be displayed
+ height: this.elementModel.height - 4,
+ scale: 1,
showToolBar: this.elementModel.showToolbar,
enableShiftDragZoom: this.elementModel.enableShiftDragZoom,
showZoomButtons: this.elementModel.showZoomButtons,
diff --git a/projects/common/models/elements/geometry/geometry.ts b/projects/common/models/elements/geometry/geometry.ts
index 2f9786e76..0f8c0f287 100644
--- a/projects/common/models/elements/geometry/geometry.ts
+++ b/projects/common/models/elements/geometry/geometry.ts
@@ -31,7 +31,7 @@ export class GeometryElement extends UIElement implements PositionedUIElement {
this.showFullscreenButton = element.showFullscreenButton !== undefined ? element.showFullscreenButton : true;
this.customToolBar = element.customToolBar !== undefined ? element.customToolBar : '';
- this.position = UIElement.initPositionProps({ ...element.position, fixedSize: true }); // yes, always stay fixed
+ this.position = UIElement.initPositionProps({ ...element.position });
}
getElementComponent(): Type<ElementComponent> {
--
GitLab