bruce-cesium 4.2.9 → 4.3.1

package/dist/bruce-cesium.es5.js

@@ -1,6 +1,6 @@
-import { BruceEvent, Cartes, Carto, Entity as Entity$1, Geometry, Tileset, MathUtils, LRUCache, ProjectViewTile, DelayQueue, ZoomControl, Style, EntityTag, Calculator, EntityLod, EntityType, ClientFile, ObjectUtils, Bounds, Api, EntityRelationType, ENVIRONMENT, EntityHistoricData, EntityCoords, EntitySource, MenuItem, EntityRelation, ProgramKey, ProjectView, ProjectViewBookmark, Camera, ProjectViewLegacyTile, EntityAttribute, EntityAttachment, EntityAttachmentType, AbstractApi } from 'bruce-models';
+import { BruceEvent, Cartes, Carto, Entity as Entity$1, Geometry, Tileset, MathUtils, LRUCache, ProjectViewTile, DelayQueue, ZoomControl, Style, EntityTag, Calculator, EntityLod, EntityType, ClientFile, ObjectUtils, Bounds, Api, EntityRelationType, ENVIRONMENT, EntityHistoricData, EntityCoords, EntitySource, MenuItem, EntityRelation, ProgramKey, ProjectView, ProjectViewBookmark, Camera, ProjectViewLegacyTile, EntityAttribute, EntityAttachment, EntityAttachmentType, AbstractApi, Session } from 'bruce-models';
 import * as Cesium from 'cesium';
-import { Cartographic, Cartesian2, Math as Math$1, Cartesian3, CallbackProperty, Color, HeightReference, Rectangle, JulianDate, SceneMode, DistanceDisplayCondition, NearFarScalar, Model, ColorMaterialProperty, Entity, HorizontalOrigin, VerticalOrigin, ConstantProperty, ConstantPositionProperty, ClassificationType, ArcType, CornerType, ShadowMode, PolygonHierarchy, PolylineGraphics, ColorBlendMode, HeadingPitchRoll, Transforms, GeoJsonDataSource, Primitive, Cesium3DTileFeature, Cesium3DTileColorBlendMode, HeadingPitchRange, Ion, Cesium3DTileStyle, KmlDataSource, SceneTransforms, OrthographicFrustum, EasingFunction, EllipsoidTerrainProvider, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, UrlTemplateImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, TileMapServiceImageryProvider, IonImageryProvider, CesiumTerrainProvider, CesiumInspector, defined, ClockRange, EllipsoidGeodesic, sampleTerrainMostDetailed, Cesium3DTileset, PolygonPipeline, BoundingSphere, Matrix3, Matrix4, GeometryInstance, ModelGraphics, PolygonGraphics, CorridorGraphics, PointGraphics, BillboardGraphics, EllipseGraphics, ScreenSpaceEventHandler, ScreenSpaceEventType, IonResource, CzmlDataSource, Quaternion, Intersect } from 'cesium';
+import { Cartographic, Cartesian2, Math as Math$1, Cartesian3, CallbackProperty, Color, HeightReference, Rectangle, JulianDate, DistanceDisplayCondition, NearFarScalar, Model, ColorMaterialProperty, Entity, HorizontalOrigin, VerticalOrigin, ConstantProperty, ConstantPositionProperty, ClassificationType, ArcType, CornerType, ShadowMode, PolygonHierarchy, PolylineGraphics, ColorBlendMode, HeadingPitchRoll, Transforms, Primitive, Cesium3DTileFeature, SceneMode, GeoJsonDataSource, Cesium3DTileColorBlendMode, HeadingPitchRange, Ion, Cesium3DTileStyle, KmlDataSource, SceneTransforms, OrthographicFrustum, EasingFunction, EllipsoidTerrainProvider, BingMapsImageryProvider, BingMapsStyle, MapboxImageryProvider, MapboxStyleImageryProvider, ArcGisMapServerImageryProvider, OpenStreetMapImageryProvider, UrlTemplateImageryProvider, GridImageryProvider, GeographicTilingScheme, ImageryLayer, TileMapServiceImageryProvider, IonImageryProvider, CesiumTerrainProvider, Cesium3DTileset, Matrix4, Matrix3, IonResource, CesiumInspector, defined, ClockRange, EllipsoidGeodesic, sampleTerrainMostDetailed, PolygonPipeline, BoundingSphere, GeometryInstance, ModelGraphics, PolygonGraphics, CorridorGraphics, PointGraphics, BillboardGraphics, EllipseGraphics, ScreenSpaceEventHandler, ScreenSpaceEventType, CzmlDataSource, Quaternion, Intersect } from 'cesium';
 
 /*! *****************************************************************************
 Copyright (c) Microsoft Corporation. All rights reserved.
@@ -23238,6 +23238,10 @@ var WidgetLeftPanel = /** @class */ (function (_super) {
     };
     WidgetLeftPanel.prototype.Dispose = function () {
         _super.prototype.Dispose.call(this);
+        if (this.envSubRemoval) {
+            this.envSubRemoval();
+            this.envSubRemoval = null;
+        }
         if (this._enabledTabContent) {
             this._enabledTabContent.Dispose();
             this._enabledTabContent = null;
@@ -23250,7 +23254,7 @@ var WidgetLeftPanel = /** @class */ (function (_super) {
         }
         var style = document.createElement("style");
         style.id = this.STYLESHEET_ID;
-        style.innerHTML = "\n            .NextspaceLeftPanel {\n                align-items: center;\n                background-color: #21272a;\n                cursor: default;\n                display: flex;\n                flex-direction: column;\n                flex-shrink: 0;\n                height: 100%;\n                padding-top: 15px;\n                position: absolute;\n                width: 50px;\n                z-index: 1;\n                top: 0;\n                left: 0;\n                box-sizing: border-box;\n            }\n\n            .NextspaceLeftPanel * {\n                box-sizing: border-box;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelBreaker {\n                background-color: hsla(0,0%,50%,.231);\n                flex-shrink: 0;\n                height: 2px;\n                margin-bottom: 15px;\n                width: calc(100% - 8px);\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelBottomBreaker {\n                margin-top: auto;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton {\n                border-radius: 3px;\n                color: #fff;\n                cursor: pointer;\n                font-size: 18px;\n                height: 32px;\n                overflow: hidden;\n                width: 32px;\n                margin-bottom: 15px;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton:first-of-type {\n                margin-bottom: 8px;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton >.NextspaceLeftPanelButtonIcon {\n                align-items: center;\n                display: flex;\n                justify-content: center;\n                position: relative;\n                transition: .3s ease;\n                height: 100%;\n                width: 100%;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton >.NextspaceLeftPanelButtonIcon:hover {\n                transform: scale(1.2);\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton >.NextspaceLeftPanelButtonIcon >svg {\n                cursor: pointer;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton[is-enabled=\"true\"] >.NextspaceLeftPanelButtonIcon {\n                background-color: #fff;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton[is-enabled=\"true\"] >.NextspaceLeftPanelButtonIcon >svg {\n                filter: invert(1);\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelTabContent {\n                display: none;\n                width: 300px;\n                height: 100%;\n                position: absolute;\n                top: 0;\n                left: 50px;\n                background-color: #21272a;\n                padding: 40px 30px 30px;\n                flex-direction: column;\n                flex-grow: 1;\n                flex-shrink: 1;\n                overflow: hidden;\n            }\n\n            .NextspaceLeftPanel .NextspaceLeftPanelTabContentCloseButton {\n                color: #fff;\n                cursor: pointer;\n                opacity: .7;\n                position: absolute;\n                right: 22px;\n                top: 14px;\n                transition: transform .3s ease;\n                z-index: 1;\n            }\n\n            .NextspaceLeftPanel .NextspaceLeftPanelTabContentCloseButton:hover {\n                transform: scale(1.2);\n            }\n        ";
+        style.innerHTML = "\n            .NextspaceLeftPanel {\n                align-items: center;\n                background-color: #21272a;\n                cursor: default;\n                display: flex;\n                flex-direction: column;\n                flex-shrink: 0;\n                height: 100%;\n                padding-top: 15px;\n                position: absolute;\n                width: 50px;\n                z-index: 1;\n                top: 0;\n                left: 0;\n                box-sizing: border-box;\n            }\n\n            .NextspaceLeftPanel * {\n                box-sizing: border-box;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelBreaker {\n                background-color: hsla(0,0%,50%,.231);\n                flex-shrink: 0;\n                height: 2px;\n                margin-bottom: 15px;\n                width: calc(100% - 8px);\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelBottomBreaker {\n                margin-top: auto;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton {\n                border-radius: 3px;\n                color: #fff;\n                cursor: pointer;\n                font-size: 18px;\n                height: 32px;\n                overflow: hidden;\n                width: 32px;\n                margin-bottom: 15px;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton:first-of-type {\n                margin-bottom: 8px;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton >.NextspaceLeftPanelButtonIcon {\n                align-items: center;\n                display: flex;\n                justify-content: center;\n                position: relative;\n                transition: .3s ease;\n                height: 100%;\n                width: 100%;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton >.NextspaceLeftPanelButtonIcon:hover {\n                transform: scale(1.2);\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton[no-content=\"true\"] {\n                cursor: default;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton[no-content=\"true\"] >.NextspaceLeftPanelButtonIcon:hover {\n                transform: none;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton >.NextspaceLeftPanelButtonIcon >svg {\n                cursor: pointer;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton[is-enabled=\"true\"] >.NextspaceLeftPanelButtonIcon {\n                background-color: #fff;\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton[is-enabled=\"true\"] >.NextspaceLeftPanelButtonIcon >svg {\n                filter: invert(1);\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelButton[is-disabled=\"true\"] {\n                opacity: .5;\n                pointer-events: none\n            }\n\n            .NextspaceLeftPanel >.NextspaceLeftPanelTabContent {\n                display: none;\n                width: 300px;\n                height: 100%;\n                position: absolute;\n                top: 0;\n                left: 50px;\n                background-color: #21272a;\n                padding: 40px 30px 30px;\n                flex-direction: column;\n                flex-grow: 1;\n                flex-shrink: 1;\n                overflow: hidden;\n            }\n\n            .NextspaceLeftPanel .NextspaceLeftPanelTabContentCloseButton {\n                color: #fff;\n                cursor: pointer;\n                opacity: .7;\n                position: absolute;\n                right: 22px;\n                top: 14px;\n                transition: transform .3s ease;\n                z-index: 1;\n            }\n\n            .NextspaceLeftPanel .NextspaceLeftPanelTabContentCloseButton:hover {\n                transform: scale(1.2);\n            }\n        ";
         document.head.appendChild(style);
     };
     WidgetLeftPanel.prototype._generateElement = function () {
@@ -23267,7 +23271,7 @@ var WidgetLeftPanel = /** @class */ (function (_super) {
         var bottomBreaker = document.createElement("div");
         bottomBreaker.className = "NextspaceLeftPanelBottomBreaker";
         this._element.appendChild(bottomBreaker);
-        this._addPlaceholderTab("Profile", "\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M12 12C14.21 12 16 10.21 16 8C16 5.79 14.21 4 12 4C9.79 4 8 5.79 8 8C8 10.21 9.79 12 12 12ZM12 14C9.33 14 4 15.34 4 18V19C4 19.55 4.45 20 5 20H19C19.55 20 20 19.55 20 19V18C20 15.34 14.67 14 12 14Z\" fill=\"white\"/>\n            </svg>\n        ");
+        this._addUserProfileTab();
         var panelContent = document.createElement("div");
         panelContent.className = "NextspaceLeftPanelTabContent";
         var panelContentCloseButton = document.createElement("div");
@@ -23289,9 +23293,12 @@ var WidgetLeftPanel = /** @class */ (function (_super) {
      */
     WidgetLeftPanel.prototype.AddPanelTab = function (params) {
         this.customTabs.set(params.tab, params.content);
-        this._addPanelTab(params.tab, params.title, params.svgStr);
+        // We insert before the bottom breaker.
+        var bottomBreaker = this._element.querySelector(".NextspaceLeftPanelBottomBreaker");
+        var afterElement = bottomBreaker ? bottomBreaker.previousElementSibling : null;
+        this._addPanelTab(params.tab, params.title, params.svgStr, afterElement);
     };
-    WidgetLeftPanel.prototype._addPanelTab = function (tab, title, svgStr) {
+    WidgetLeftPanel.prototype._addPanelTab = function (tab, title, svgStr, afterElement) {
         var _this = this;
         var tabButton = document.createElement("div");
         tabButton.setAttribute("widget-left-panel-tab", tab);
@@ -23316,7 +23323,17 @@ var WidgetLeftPanel = /** @class */ (function (_super) {
             _this._updatePanelContent();
             _this._updatePanelStyles();
         };
-        this._element.appendChild(tabButton);
+        if (afterElement && afterElement.parentElement) {
+            if (afterElement.nextSibling) {
+                afterElement.parentElement.insertBefore(tabButton, afterElement.nextSibling);
+            }
+            else {
+                afterElement.parentElement.appendChild(tabButton);
+            }
+        }
+        else {
+            this._element.appendChild(tabButton);
+        }
     };
     WidgetLeftPanel.prototype._addPlaceholderTab = function (title, svgStr) {
         var tabButton = document.createElement("div");
@@ -23330,6 +23347,83 @@ var WidgetLeftPanel = /** @class */ (function (_super) {
         tabButton.appendChild(buttonBookmarksIcon);
         this._element.appendChild(tabButton);
     };
+    /**
+     * User profile handled separately.
+     * This is because for a while it will be just an indicator of logged in user session.
+     * It won't have a tab content.
+     */
+    WidgetLeftPanel.prototype._addUserProfileTab = function () {
+        var tabButton = document.createElement("div");
+        tabButton.className = "NextspaceLeftPanelButton";
+        tabButton.setAttribute("title", "Not logged in");
+        tabButton.setAttribute("no-content", "true");
+        var buttonBookmarksIcon = document.createElement("div");
+        buttonBookmarksIcon.className = "NextspaceLeftPanelButtonIcon";
+        var LOGGED_OUT_ICON = "\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n                <path d=\"M12 12C14.21 12 16 10.21 16 8C16 5.79 14.21 4 12 4C9.79 4 8 5.79 8 8C8 10.21 9.79 12 12 12ZM12 14C9.33 14 4 15.34 4 18V19C4 19.55 4.45 20 5 20H19C19.55 20 20 19.55 20 19V18C20 15.34 14.67 14 12 14Z\" fill=\"white\"/>\n            </svg>\n        ";
+        buttonBookmarksIcon.innerHTML = LOGGED_OUT_ICON;
+        tabButton.appendChild(buttonBookmarksIcon);
+        this._element.appendChild(tabButton);
+        function getInitials(name) {
+            var nameSplit = name.split(" ");
+            if (nameSplit.length > 1) {
+                return nameSplit[0][0] + nameSplit[1][0];
+            }
+            else {
+                return nameSplit[0][0];
+            }
+        }
+        function GetColorForString(str) {
+            var stringUniqueHash = [].concat(str).reduce(function (acc, char) { return char.charCodeAt(0) + ((acc << 5) - acc); }, 0);
+            return "hsl(".concat(stringUniqueHash % 360, ", 95%, 35%)");
+        }
+        /**
+         * Updates the tab button based on the current user session.
+         */
+        function updateProfile() {
+            var _a;
+            return __awaiter(this, void 0, void 0, function () {
+                var session, isLoggedIn, userName, initials, e_2;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            _b.trys.push([0, 2, , 3]);
+                            return [4 /*yield*/, Session.Get({
+                                    sessionId: ENVIRONMENT.PARAMS.sessionId ? ENVIRONMENT.PARAMS.sessionId : "anonymous",
+                                })];
+                        case 1:
+                            session = (_b.sent()).session;
+                            isLoggedIn = session.ID != "anonymous" && ((_a = session.User) === null || _a === void 0 ? void 0 : _a.ID) != "anonymous";
+                            userName = session.User.FullName ? session.User.FullName : session.User.ID;
+                            tabButton.setAttribute("title", isLoggedIn ? userName : "Not logged in");
+                            // Draw a circle with the user's initials.
+                            if (isLoggedIn) {
+                                initials = getInitials(userName);
+                                buttonBookmarksIcon.innerHTML = "\n                        <div \n                            style=\"\n                                background-color: ".concat(GetColorForString(userName), "; \n                                color: white;\n                                border-radius: 50%;\n                                display: flex; \n                                align-items: center; \n                                justify-content: center; \n                                font-size: 12px;\n                                font-family: Arial;\n                                height: 100%; \n                                width: 100%;\">\n                            ").concat(initials, "\n                        </div>\n                    ");
+                            }
+                            else {
+                                buttonBookmarksIcon.innerHTML = LOGGED_OUT_ICON;
+                            }
+                            return [3 /*break*/, 3];
+                        case 2:
+                            e_2 = _b.sent();
+                            console.error(e_2);
+                            tabButton.setAttribute("title", "Not logged in");
+                            buttonBookmarksIcon.innerHTML = LOGGED_OUT_ICON;
+                            return [3 /*break*/, 3];
+                        case 3: return [2 /*return*/];
+                    }
+                });
+            });
+        }
+        if (this.envSubRemoval) {
+            this.envSubRemoval();
+            this.envSubRemoval = null;
+        }
+        this.envSubRemoval = ENVIRONMENT.OnParamsChange.Subscribe(function () {
+            updateProfile();
+        });
+        updateProfile();
+    };
     /**
      * Updates the panel styles based on the current state.
      * Eg: if a tab is enabled, the button should be highlighted.
@@ -23338,8 +23432,14 @@ var WidgetLeftPanel = /** @class */ (function (_super) {
         var _this = this;
         var buttons = this._element.querySelectorAll(".NextspaceLeftPanelButton");
         buttons.forEach(function (button) {
-            var isEnabled = button.getAttribute("widget-left-panel-tab") === _this._enabledPanelTab;
+            var buttonTab = button.getAttribute("widget-left-panel-tab");
+            var isEnabled = buttonTab === _this._enabledPanelTab;
             button.setAttribute("is-enabled", isEnabled ? "true" : "false");
+            // Disable for specific tabs.
+            // Eg: bookmarks require a viewId.
+            if (buttonTab === "bookmarks") {
+                button.setAttribute("is-disabled", !_this._viewId ? "true" : "false");
+            }
         });
         // Make the tab content visible/invisible based on the current state.
         var contentDisplayState = this._enabledPanelTab ? "flex" : "none";
@@ -23366,10 +23466,15 @@ var WidgetLeftPanel = /** @class */ (function (_super) {
                     });
                     break;
                 default:
-                    tabContent = new (this.customTabs.get(this._enabledPanelTab)({
+                    if (this.customTabs.has(this._enabledPanelTab) === false) {
+                        console.error("Tab ".concat(this._enabledPanelTab, " not found."));
+                        return;
+                    }
+                    var clazz = this.customTabs.get(this._enabledPanelTab);
+                    tabContent = new clazz({
                         widget: this,
                         container: container
-                    }));
+                    });
                     break;
             }
             this._enabledTabContent = tabContent;
@@ -26336,7 +26441,7 @@ var ViewerUtils;
     ViewerUtils.AssertIonToken = AssertIonToken;
 })(ViewerUtils || (ViewerUtils = {}));
 
-var VERSION = "4.2.9";
+var VERSION = "4.3.1";
 
 export { VERSION, CesiumViewMonitor, ViewerUtils, MenuItemManager, EntityRenderEngine, MenuItemCreator, VisualsRegister, RenderManager, EntitiesIdsRenderManager, EntitiesLoadedRenderManager, EntitiesRenderManager, EntityRenderManager, TilesetCadRenderManager, TilesetArbRenderManager, TilesetEntitiesRenderManager, TilesetOsmRenderManager, TilesetPointcloudRenderManager, TilesetGooglePhotosRenderManager, DataSourceStaticKmlManager, GoogleSearchRenderManager, RelationsRenderManager, SharedGetters, CesiumParabola, EntityLabel, ViewRenderEngine, TileRenderEngine, TilesetRenderEngine, CESIUM_INSPECTOR_KEY, CESIUM_TIMELINE_KEY, ViewUtils, DrawingUtils, MeasureUtils, EntityUtils, CesiumEntityStyler, CesiumAnimatedProperty, CesiumAnimatedInOut, Draw3dPolygon, Draw3dPolyline, MeasureCreator, Widget, VIEWER_BOOKMARKS_WIDGET_KEY, WidgetBookmarks, WidgetBranding, WidgetCursorBar, WidgetEmbeddedInfoView, WidgetInfoView, WidgetNavCompass$$1 as WidgetNavCompass, WidgetSearchBar, VIEWER_LEFT_PANEL_WIDGET_KEY, VIEWER_LEFT_PANEL_CSS_VAR_LEFT, WidgetLeftPanel, WidgetLeftPanelTab, WidgetLeftPanelTabBookmarks };
 //# sourceMappingURL=bruce-cesium.es5.js.map