From 21d34916b6884902a9b7853973bd39b75ef5d36c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lukas=20Mau=C3=9F?= <lukas.mauss@mni.thm.de>
Date: Wed, 26 Feb 2020 19:24:11 +0100
Subject: [PATCH] Switch to 'angularx-qrcode'-lib for qr-codes
---
package-lock.json | 195 ++++++++++++++++--
package.json | 1 +
.../qr-code-dialog.component.html | 14 +-
.../qr-code-dialog.component.scss | 51 +----
.../qr-code-dialog.component.ts | 63 +-----
.../shared/header/header.component.ts | 8 +-
src/app/components/shared/shared.module.ts | 4 +-
7 files changed, 212 insertions(+), 124 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index 070ab0c6a..281cb5e0d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -2524,6 +2524,16 @@
"resolved": "https://registry.npmjs.org/angular2-uuid/-/angular2-uuid-1.1.1.tgz",
"integrity": "sha1-cvA81TK39AAy6x7PufhFc4S+lW4="
},
+ "angularx-qrcode": {
+ "version": "2.1.0",
+ "resolved": "https://registry.npmjs.org/angularx-qrcode/-/angularx-qrcode-2.1.0.tgz",
+ "integrity": "sha512-4mtlPJmemQINEz8OH6cYOllLJ77kFamk38G1L8OLF4X/nrxWaFIxMiKcPHf/HVeqATSAPismgqPu9aM5RhF/ig==",
+ "requires": {
+ "@angular/common": ">= 5.0.0 < 9.1.0",
+ "qrcode": "1.4.2",
+ "tslib": "^1.9.0"
+ }
+ },
"ansi-colors": {
"version": "3.2.4",
"resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.4.tgz",
@@ -3595,8 +3605,7 @@
"camelcase": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/camelcase/-/camelcase-5.3.1.tgz",
- "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==",
- "dev": true
+ "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg=="
},
"caniuse-api": {
"version": "3.0.0",
@@ -3957,7 +3966,6 @@
"version": "1.9.3",
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
"integrity": "sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==",
- "dev": true,
"requires": {
"color-name": "1.1.3"
}
@@ -4738,8 +4746,7 @@
"decamelize": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/decamelize/-/decamelize-1.2.0.tgz",
- "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=",
- "dev": true
+ "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA="
},
"decode-uri-component": {
"version": "0.2.0",
@@ -5031,6 +5038,11 @@
"randombytes": "^2.0.0"
}
},
+ "dijkstrajs": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/dijkstrajs/-/dijkstrajs-1.0.1.tgz",
+ "integrity": "sha1-082BIh4+pAdCz83lVtTpnpjdxxs="
+ },
"dir-glob": {
"version": "2.2.2",
"resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-2.2.2.tgz",
@@ -10434,8 +10446,7 @@
"path-exists": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-3.0.0.tgz",
- "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=",
- "dev": true
+ "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU="
},
"path-is-absolute": {
"version": "1.0.1",
@@ -10603,6 +10614,11 @@
}
}
},
+ "pngjs": {
+ "version": "3.4.0",
+ "resolved": "https://registry.npmjs.org/pngjs/-/pngjs-3.4.0.tgz",
+ "integrity": "sha512-NCrCHhWmnQklfH4MtJMRjZ2a8c80qXeMlQMv2uVp9ISJMTt562SbGd6n2oq0PaPgKm7Z6pL9E2UlLIhC+SHL3w=="
+ },
"portfinder": {
"version": "1.0.25",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.25.tgz",
@@ -11564,6 +11580,159 @@
"integrity": "sha1-xF6cYYAL0IfviNfiVkI73Unl0HE=",
"dev": true
},
+ "qrcode": {
+ "version": "1.4.2",
+ "resolved": "https://registry.npmjs.org/qrcode/-/qrcode-1.4.2.tgz",
+ "integrity": "sha512-eR6RgxFYPDFH+zFLTJKtoNP/RlsHANQb52AUmQ2bGDPMuUw7jJb0F+DNEgx7qQGIElrbFxWYMc0/B91zLZPF9Q==",
+ "requires": {
+ "dijkstrajs": "^1.0.1",
+ "isarray": "^2.0.1",
+ "pngjs": "^3.3.0",
+ "yargs": "^13.2.4"
+ },
+ "dependencies": {
+ "ansi-regex": {
+ "version": "4.1.0",
+ "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-4.1.0.tgz",
+ "integrity": "sha512-1apePfXM1UOSqw0o9IiFAovVz9M5S1Dg+4TrDwfMewQ6p/rmMueb7tWZjQ1rx4Loy1ArBggoqGpfqqdI4rondg=="
+ },
+ "ansi-styles": {
+ "version": "3.2.1",
+ "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
+ "integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
+ "requires": {
+ "color-convert": "^1.9.0"
+ }
+ },
+ "cliui": {
+ "version": "5.0.0",
+ "resolved": "https://registry.npmjs.org/cliui/-/cliui-5.0.0.tgz",
+ "integrity": "sha512-PYeGSEmmHM6zvoef2w8TPzlrnNpXIjTipYK780YswmIP9vjxmd6Y2a3CB2Ks6/AU8NHjZugXvo8w3oWM2qnwXA==",
+ "requires": {
+ "string-width": "^3.1.0",
+ "strip-ansi": "^5.2.0",
+ "wrap-ansi": "^5.1.0"
+ }
+ },
+ "emoji-regex": {
+ "version": "7.0.3",
+ "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-7.0.3.tgz",
+ "integrity": "sha512-CwBLREIQ7LvYFB0WyRvwhq5N5qPhc6PMjD6bYggFlI5YyDgl+0vxq5VHbMOFqLg7hfWzmu8T5Z1QofhmTIhItA=="
+ },
+ "find-up": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/find-up/-/find-up-3.0.0.tgz",
+ "integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
+ "requires": {
+ "locate-path": "^3.0.0"
+ }
+ },
+ "get-caller-file": {
+ "version": "2.0.5",
+ "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+ "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg=="
+ },
+ "is-fullwidth-code-point": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-2.0.0.tgz",
+ "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8="
+ },
+ "isarray": {
+ "version": "2.0.5",
+ "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz",
+ "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw=="
+ },
+ "locate-path": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-3.0.0.tgz",
+ "integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
+ "requires": {
+ "p-locate": "^3.0.0",
+ "path-exists": "^3.0.0"
+ }
+ },
+ "p-limit": {
+ "version": "2.2.2",
+ "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.2.2.tgz",
+ "integrity": "sha512-WGR+xHecKTr7EbUEhyLSh5Dube9JtdiG78ufaeLxTgpudf/20KqyMioIUZJAezlTIi6evxuoUs9YXc11cU+yzQ==",
+ "requires": {
+ "p-try": "^2.0.0"
+ }
+ },
+ "p-locate": {
+ "version": "3.0.0",
+ "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-3.0.0.tgz",
+ "integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
+ "requires": {
+ "p-limit": "^2.0.0"
+ }
+ },
+ "p-try": {
+ "version": "2.2.0",
+ "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz",
+ "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ=="
+ },
+ "require-main-filename": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/require-main-filename/-/require-main-filename-2.0.0.tgz",
+ "integrity": "sha512-NKN5kMDylKuldxYLSUfrbo5Tuzh4hd+2E8NPPX02mZtn1VuREQToYe/ZdlJy+J3uCpfaiGF05e7B8W0iXbQHmg=="
+ },
+ "string-width": {
+ "version": "3.1.0",
+ "resolved": "https://registry.npmjs.org/string-width/-/string-width-3.1.0.tgz",
+ "integrity": "sha512-vafcv6KjVZKSgz06oM/H6GDBrAtz8vdhQakGjFIvNrHA6y3HCF1CInLy+QLq8dTJPQ1b+KDUqDFctkdRW44e1w==",
+ "requires": {
+ "emoji-regex": "^7.0.1",
+ "is-fullwidth-code-point": "^2.0.0",
+ "strip-ansi": "^5.1.0"
+ }
+ },
+ "strip-ansi": {
+ "version": "5.2.0",
+ "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-5.2.0.tgz",
+ "integrity": "sha512-DuRs1gKbBqsMKIZlrffwlug8MHkcnpjs5VPmL1PAh+mA30U0DTotfDZ0d2UUsXpPmPmMMJ6W773MaA3J+lbiWA==",
+ "requires": {
+ "ansi-regex": "^4.1.0"
+ }
+ },
+ "wrap-ansi": {
+ "version": "5.1.0",
+ "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-5.1.0.tgz",
+ "integrity": "sha512-QC1/iN/2/RPVJ5jYK8BGttj5z83LmSKmvbvrXPNCLZSEb32KKVDJDl/MOt2N01qU2H/FkzEa9PKto1BqDjtd7Q==",
+ "requires": {
+ "ansi-styles": "^3.2.0",
+ "string-width": "^3.0.0",
+ "strip-ansi": "^5.0.0"
+ }
+ },
+ "yargs": {
+ "version": "13.3.0",
+ "resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.0.tgz",
+ "integrity": "sha512-2eehun/8ALW8TLoIl7MVaRUrg+yCnenu8B4kBlRxj3GJGDKU1Og7sMXPNm1BYyM1DOJmTZ4YeN/Nwxv+8XJsUA==",
+ "requires": {
+ "cliui": "^5.0.0",
+ "find-up": "^3.0.0",
+ "get-caller-file": "^2.0.1",
+ "require-directory": "^2.1.1",
+ "require-main-filename": "^2.0.0",
+ "set-blocking": "^2.0.0",
+ "string-width": "^3.0.0",
+ "which-module": "^2.0.0",
+ "y18n": "^4.0.0",
+ "yargs-parser": "^13.1.1"
+ }
+ },
+ "yargs-parser": {
+ "version": "13.1.1",
+ "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-13.1.1.tgz",
+ "integrity": "sha512-oVAVsHz6uFrg3XQheFII8ESO2ssAf9luWuAd6Wexsu4F3OtIW0o8IribPXYrD4WC24LWtPrJlGy87y5udK+dxQ==",
+ "requires": {
+ "camelcase": "^5.0.0",
+ "decamelize": "^1.2.0"
+ }
+ }
+ }
+ },
"qs": {
"version": "6.5.2",
"resolved": "https://registry.npmjs.org/qs/-/qs-6.5.2.tgz",
@@ -11966,8 +12135,7 @@
"require-directory": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
- "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I=",
- "dev": true
+ "integrity": "sha1-jGStX9MNqxyXbiNE/+f3kqam30I="
},
"require-main-filename": {
"version": "1.0.1",
@@ -12394,8 +12562,7 @@
"set-blocking": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
- "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
- "dev": true
+ "integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc="
},
"set-value": {
"version": "2.0.1",
@@ -14850,8 +15017,7 @@
"which-module": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/which-module/-/which-module-2.0.0.tgz",
- "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho=",
- "dev": true
+ "integrity": "sha1-2e8H3Od7mQK4o6j6SzHD4/fm6Ho="
},
"with-callback": {
"version": "1.0.2",
@@ -14951,8 +15117,7 @@
"y18n": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/y18n/-/y18n-4.0.0.tgz",
- "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w==",
- "dev": true
+ "integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w=="
},
"yallist": {
"version": "2.1.2",
diff --git a/package.json b/package.json
index 10e58fda9..1803e9968 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
"@ngx-translate/core": "^10.0.2",
"@ngx-translate/http-loader": "^4.0.0",
"@stomp/ng2-stompjs": "^7.2.0",
+ "angularx-qrcode": "^2.1.0",
"chart.js": "^2.7.3",
"core-js": "^2.5.7",
"is-docker": "^1.1.0",
diff --git a/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.html b/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.html
index 30efef0b7..9acd0f06e 100644
--- a/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.html
+++ b/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.html
@@ -1,14 +1,12 @@
<ars-screen>
- <div class="qr_content" #imageWrapper>
- <ngx-qrcode></ngx-qrcode>
- </div>
- <div class="qr_header">
- <button mat-icon-button (click)="close();">
+ <div fxLayout="column" fxLayoutAlign="center center" class="qr-container">
+ <button class="exitButton" mat-raised-button (click)="onCloseClick()">
<mat-icon>close</mat-icon>
</button>
- <div class="qr_text" #text>
- <h2>{{url}}
- <br>{{'qr-dialog.session' | translate}}: {{qrCode.substring(36, 40)}} {{qrCode.substring(40, 44)}}</h2>
+ <div>
+ <h2>frag.jetzt</h2>
+ <h2>{{'qr-dialog.session' | translate}}: {{key.slice(0, 4)}} {{key.slice(4, 8)}}</h2>
</div>
+ <qrcode [qrdata]="data" [width]="qrWidth" [errorCorrectionLevel]="'M'"></qrcode>
</div>
</ars-screen>
diff --git a/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.scss b/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.scss
index 96c9f68a9..9c210d2aa 100644
--- a/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.scss
+++ b/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.scss
@@ -1,47 +1,16 @@
-
-.qr_header {
- width: 100%;
- height: 64px;
- position: absolute;
- left: 0px;
- top: 0px;
- background-color: #FFFFFF;
-}
-
-.qr_text > h2{
- color:black!important;
+::ng-deep .mat-dialog-container {
+ background-color: var(--surface);
}
-.qr_header > button {
- margin-right: 16px;
- margin-top: 12px;
- position: fixed; /* or position: absolute; */
- top: 0;
- right: 0;
- color: #000000;
+.qr-container {
+ height: 100%;
}
-.qr_content {
- background-repeat: no-repeat;
- background-position: center;
- background-size: contain;
- width: 100%;
- height: calc(100% - 64px);
+.exitButton {
+ background-color: var(--secondary);
+ color: var(--on-secondary);
position: absolute;
- left: 0px;
- top: 64px;
- image-rendering: pixelated;
- background-color: #FFFFFF;
-}
-
-.qr_content img {
- display: none;
-}
-
-.qr_text{
- float:left;
- position:fixed;
- left:50%;
- top:0px;
- transform:translate(-50%);
+ top: 2em;
+ right: 2em;
+ max-height: 100px;
}
diff --git a/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.ts b/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.ts
index 9573ead46..7d462a2ba 100644
--- a/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.ts
+++ b/src/app/components/shared/_dialogs/qr-code-dialog/qr-code-dialog.component.ts
@@ -1,16 +1,5 @@
-import {
- AfterViewInit,
- Component,
- ElementRef,
- OnInit,
- QueryList,
- Renderer2,
- ViewChild,
- ViewChildren,
- ViewEncapsulation
-} from '@angular/core';
+import { AfterViewInit, Component, OnInit, ViewEncapsulation } from '@angular/core';
import { MatDialog, MatDialogRef } from '@angular/material/dialog';
-import { DialogConfirmActionButtonType } from '../../dialog/dialog-action-buttons/dialog-action-buttons.component';
@Component({
selector: 'app-qr-code-dialog',
@@ -20,20 +9,13 @@ import { DialogConfirmActionButtonType } from '../../dialog/dialog-action-button
})
export class QrCodeDialogComponent implements OnInit, AfterViewInit {
- @ViewChild('imageWrapper') imgWrp: ElementRef;
- @ViewChild('text') text: ElementRef;
-
- url: string = window.location.hostname;
- private img: HTMLImageElement;
- qrCode = '';
-
- confirmButtonType: DialogConfirmActionButtonType = DialogConfirmActionButtonType.Primary;
+ data: string;
+ qrWidth: number;
+ key: string;
constructor(
private dialog: MatDialog,
private dialogRef: MatDialogRef<QrCodeDialogComponent>,
- private ref: ElementRef,
- private render: Renderer2
) {
}
@@ -41,40 +23,11 @@ export class QrCodeDialogComponent implements OnInit, AfterViewInit {
}
ngAfterViewInit() {
- window.addEventListener('resize', e => {
- this.onresize();
- });
- this.onresize();
- }
-
- private onresize() {
- const width = this.imgWrp.nativeElement.offsetWidth;
- const height = this.imgWrp.nativeElement.offsetHeight;
- if (width > height) {this.setPosition(height); } else { this.setPosition(width); }
- }
-
- private setPosition(offset: number) {
- this.render.setStyle(
- this.text.nativeElement,
- 'margin-left',
- (-offset / 2) + (this.text.nativeElement.offsetWidth / 2) + (offset / 10) + 'px'
- );
- }
-
- public setQRCode(url: string) {
- this.qrCode = url;
- // this.code.value = url;
- // this.code.createQRCode();
- // this.code.toDataURL().then((a) => {
- // this.createImage(a.toString());
- // });
- }
-
- private createImage(base: string) {
- this.render.setStyle(this.imgWrp.nativeElement, 'background-image', 'url(' + base + ')');
+ const minSize = Math.min(document.body.clientWidth, document.body.clientHeight);
+ this.qrWidth = minSize - (minSize / 5);
}
- public close() {
- this.dialog.closeAll();
+ onCloseClick(): void {
+ this.dialogRef.close();
}
}
diff --git a/src/app/components/shared/header/header.component.ts b/src/app/components/shared/header/header.component.ts
index b716cc30f..555477fe5 100644
--- a/src/app/components/shared/header/header.component.ts
+++ b/src/app/components/shared/header/header.component.ts
@@ -222,7 +222,7 @@ export class HeaderComponent implements OnInit {
/*QR*/
- public getQRCode(): string {
+ public getURL(): string {
return `${window.location.protocol}//${window.location.hostname}/participant/room/${this.shortId}`;
}
@@ -231,11 +231,11 @@ export class HeaderComponent implements OnInit {
const dialogRef = this.dialog.open(QrCodeDialogComponent, {
panelClass: 'screenDialog'
});
- const qrDialog: QrCodeDialogComponent = dialogRef.componentInstance;
- // qrDialog.setQRCode(this.getQRCode());
+ const url = this.getURL();
+ dialogRef.componentInstance.data = url;
+ dialogRef.componentInstance.key = url.slice(-8);
dialogRef.afterClosed().subscribe(res => {
Rescale.exitFullscreen();
});
}
-
}
diff --git a/src/app/components/shared/shared.module.ts b/src/app/components/shared/shared.module.ts
index 3645c47fc..c5e4d0cbc 100644
--- a/src/app/components/shared/shared.module.ts
+++ b/src/app/components/shared/shared.module.ts
@@ -25,6 +25,7 @@ import { RemoveFromHistoryComponent } from './_dialogs/remove-from-history/remov
import { CommentAnswerComponent } from './comment-answer/comment-answer.component';
import { MarkdownModule } from 'ngx-markdown';
import { MatRippleModule } from '@angular/material/core';
+import { QRCodeModule } from 'angularx-qrcode';
@NgModule({
imports: [
@@ -33,7 +34,8 @@ import { MatRippleModule } from '@angular/material/core';
SharedRoutingModule,
MatRippleModule,
ArsModule,
- MarkdownModule
+ MarkdownModule,
+ QRCodeModule
],
declarations: [
RoomJoinComponent,
--
GitLab