@itwin/core-frontend/lib/cjs/internal/GoogleMapsDecorator.js

iTwin.js frontend components

"use strict";
/*---------------------------------------------------------------------------------------------
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
* See LICENSE.md in the project root for license terms and full copyright notice.
*--------------------------------------------------------------------------------------------*/
Object.defineProperty(exports, "__esModule", { value: true });
exports.GoogleMapsDecorator = exports.LogoDecoration = void 0;
exports.getCopyrights = getCopyrights;
const core_geometry_1 = require("@itwin/core-geometry");
const IModelApp_1 = require("../IModelApp");
const Sprites_1 = require("../Sprites");
/** A simple decorator that shows the logo at a given screen position.
 * @internal
 */
class LogoDecoration {
    _sprite;
    /** The current position of the logo in view coordinates. */
    position = new core_geometry_1.Point3d();
    _offset;
    set offset(offset) {
        this._offset = offset;
    }
    /** The logo offset in view coordinates.*/
    get offset() {
        return this._offset;
    }
    /** Move the logo to the lower left corner of the screen. */
    moveToLowerLeftCorner(context) {
        if (!this._sprite || !this._sprite.isLoaded)
            return false;
        this.position.x = this._offset?.x ?? 0;
        this.position.y = context.viewport.parentDiv.clientHeight - this._sprite.size.y;
        if (this._offset?.y)
            this.position.y -= this._offset.y;
        return true;
    }
    /* TODO: Add other move methods as needed */
    /** Indicate if the logo is loaded and ready to be drawn. */
    get isLoaded() { return this._sprite?.isLoaded ?? false; }
    async activate(sprite) {
        this._sprite = sprite;
        return new Promise((resolve, _reject) => {
            sprite.loadPromise.then(() => {
                resolve(true);
            }).catch(() => {
                resolve(false);
            });
        });
    }
    /** Draw this sprite onto the supplied canvas.
     * @see [[CanvasDecoration.drawDecoration]]
     */
    drawDecoration(ctx) {
        if (this.isLoaded) {
            // Draw image with an origin at the top left corner
            ctx.drawImage(this._sprite.image, 0, 0);
        }
    }
    decorate(context) {
        context.addCanvasDecoration(this);
    }
}
exports.LogoDecoration = LogoDecoration;
/** A decorator that adds the Google Maps logo to the lower left corner of the screen.
 * @internal
 */
class GoogleMapsDecorator {
    logo = new LogoDecoration();
    _showCreditsOnScreen;
    /** Create a new GoogleMapsDecorator.
     * @param showCreditsOnScreen If true, the data attributions/copyrights from the Google Photorealistic 3D Tiles will be displayed on screen. The Google Maps logo will always be displayed.
     */
    constructor(showCreditsOnScreen) {
        this._showCreditsOnScreen = showCreditsOnScreen;
    }
    /** Activate the logo based on the given map type. */
    async activate(mapType) {
        // Pick the logo that is the most visible on the background map
        const imageName = mapType === "satellite" ?
            "GoogleMaps_Logo_WithDarkOutline" :
            "GoogleMaps_Logo_WithLightOutline";
        // We need to move the logo right after the 'i.js' button
        this.logo.offset = new core_geometry_1.Point3d(45, 10);
        return this.logo.activate(Sprites_1.IconSprites.getSpriteFromUrl(`${IModelApp_1.IModelApp.publicPath}images/${imageName}.svg`));
    }
    ;
    /** Decorate implementation */
    decorate = (context) => {
        if (!this.logo.isLoaded)
            return;
        this.logo.moveToLowerLeftCorner(context);
        this.logo.decorate(context);
        if (!this._showCreditsOnScreen)
            return;
        // Get data attribution (copyright) text
        const copyrightMap = getCopyrights(context.viewport);
        // Order by most occurances to least
        // See https://developers.google.com/maps/documentation/tile/create-renderer#display-attributions
        const sortedCopyrights = [...copyrightMap.entries()].sort((a, b) => b[1] - a[1]);
        const copyrightText = sortedCopyrights.map(([key]) => ` • ${key}`).join("");
        // Create and add element, offset to leave space for i.js and Google logos
        const elem = document.createElement("div");
        elem.innerHTML = copyrightText;
        elem.style.color = "white";
        elem.style.fontSize = "11px";
        elem.style.textWrap = "wrap";
        elem.style.position = "absolute";
        elem.style.bottom = "14px";
        elem.style.left = "155px";
        context.addHtmlDecoration(elem);
    };
}
exports.GoogleMapsDecorator = GoogleMapsDecorator;
/** Get copyrights from tiles currently in the viewport.
 * @internal
 */
function getCopyrights(vp) {
    const tiles = IModelApp_1.IModelApp.tileAdmin.getTilesForUser(vp)?.selected;
    const copyrightMap = new Map();
    if (tiles) {
        for (const tile of tiles) {
            if (tile.copyright) {
                for (const copyright of tile.copyright.split(";")) {
                    const currentCount = copyrightMap.get(copyright);
                    copyrightMap.set(copyright, currentCount ? currentCount + 1 : 1);
                }
            }
        }
    }
    return copyrightMap;
}
//# sourceMappingURL=GoogleMapsDecorator.js.map