diff --git a/projects/hslayers/common/layman/layman.service.ts b/projects/hslayers/common/layman/layman.service.ts index 2512023cd6..ab3175e597 100644 --- a/projects/hslayers/common/layman/layman.service.ts +++ b/projects/hslayers/common/layman/layman.service.ts @@ -1,13 +1,14 @@ import {HttpClient, HttpHeaders} from '@angular/common/http'; import {Injectable} from '@angular/core'; -import {BehaviorSubject, Subject, lastValueFrom} from 'rxjs'; +import {BehaviorSubject, Subject, lastValueFrom, map} from 'rxjs'; import {CurrentUserResponse} from './types/current-user-response.type'; import {HsEndpoint} from 'hslayers-ng/types'; import {HsLanguageService} from 'hslayers-ng/services/language'; import {HsLogService} from 'hslayers-ng/services/log'; import {HsToastService} from 'hslayers-ng/common/toast'; +import {parseBase64Style} from './parse-base64-style'; @Injectable({ providedIn: 'root', @@ -131,11 +132,13 @@ export class HsCommonLaymanService { async getStyleFromUrl(styleUrl: string): Promise { try { return await lastValueFrom( - this.$http.get(styleUrl, { - headers: new HttpHeaders().set('Content-Type', 'text'), - responseType: 'text', - withCredentials: true, - }), + this.$http + .get(styleUrl, { + headers: new HttpHeaders().set('Content-Type', 'text'), + responseType: 'text', + withCredentials: true, + }) + .pipe(map((response) => parseBase64Style(response))), ); } catch (ex) { this.hsLog.error(ex); diff --git a/projects/hslayers/common/layman/parse-base64-style.ts b/projects/hslayers/common/layman/parse-base64-style.ts new file mode 100644 index 0000000000..9219767f82 --- /dev/null +++ b/projects/hslayers/common/layman/parse-base64-style.ts @@ -0,0 +1,15 @@ +/** + * Parse QML string style and make base64 symbols usable in browser by + * + * Look for prop elements with source attribute + * and prepend its content to v while switching : with , + */ +export function parseBase64Style(styleString: string) { + const regex = /]*source="(data:[^"]*)"[^>]*v="base64:([^"]*)")/g; + + return styleString.startsWith(' { + return match.replace(`v="base64:${p3}"`, `v="${p2}base64,${p3}"`); + }) + : styleString; +} diff --git a/projects/hslayers/common/layman/public-api.ts b/projects/hslayers/common/layman/public-api.ts index b986b3905e..c920ab8cf7 100644 --- a/projects/hslayers/common/layman/public-api.ts +++ b/projects/hslayers/common/layman/public-api.ts @@ -10,3 +10,4 @@ export * from './types/delete-layer-response.type'; export * from './types/layman-user.type'; export * from './layman-utils'; export * from './transliteration-map'; +export * from './parse-base64-style'; diff --git a/projects/hslayers/services/styler/styler.service.ts b/projects/hslayers/services/styler/styler.service.ts index db3bf6ce44..ebce9572b9 100644 --- a/projects/hslayers/services/styler/styler.service.ts +++ b/projects/hslayers/services/styler/styler.service.ts @@ -22,7 +22,10 @@ import {Layer, Vector as VectorLayer} from 'ol/layer'; import {OlStyleParser as OpenLayersParser} from 'geostyler-openlayers-parser'; import {StyleFunction, StyleLike, createDefaultStyle} from 'ol/style/Style'; -import {HsCommonLaymanService} from 'hslayers-ng/common/layman'; +import { + HsCommonLaymanService, + parseBase64Style, +} from 'hslayers-ng/common/layman'; import {HsConfig} from 'hslayers-ng/config'; import {HsConfirmDialogComponent} from 'hslayers-ng/common/confirm'; import {HsDialogContainerService} from 'hslayers-ng/common/dialogs'; @@ -797,17 +800,7 @@ export class HsStylerService { const qmlParser = new QGISStyleParser(); await qmlParser.readStyle(styleString); - /** - * Parse QML string: - * Look for prop elements with source attribute - * and prepend its content to v while switching : with , - */ - const regex = - /]*source="(data:[^"]*)"[^>]*v="base64:([^"]*)")/g; - - this.qml = styleString.replace(regex, (match, p1, p2, p3) => { - return match.replace(`v="base64:${p3}"`, `v="${p2}base64,${p3}"`); - }); + this.qml = parseBase64Style(styleString); } this.resolveSldChange(); this.fill(this.layer, styleFmt);