@sapui5/sap.ui.vbm 1.136.1 → 1.139.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sapui5/sap.ui.vbm",
3
- "version": "1.136.1",
3
+ "version": "1.139.0",
4
4
  "description": "SAPUI5 Library sap.ui.vbm",
5
5
  "homepage": "https://sap.github.io/ui5-tooling/pages/SAPUI5/",
6
6
  "author": "SAP SE (https://www.sap.com)",
@@ -3,7 +3,7 @@
3
3
  <name>sap.ui.vbm</name>
4
4
  <vendor>SAP SE</vendor>
5
5
  <copyright>SAP UI development toolkit for HTML5 (SAPUI5) (c) Copyright 2009-2012 SAP AG. All rights reserved</copyright>
6
- <version>1.136.1</version>
6
+ <version>1.139.0</version>
7
7
 
8
8
  <documentation>SAP UI library: sap.ui.vbm</documentation>
9
9
 
@@ -24,7 +24,7 @@ sap.ui.define([
24
24
  * @param {string} [sId] id for the new control, generated automatically if no id is given
25
25
  * @param {object} [mSettings] initial settings for the new object
26
26
  * @author SAP SE
27
- * @version 1.136.1
27
+ * @version 1.139.0
28
28
  * @extends sap.ui.core.Element
29
29
  * @constructor
30
30
  * @public
@@ -47,7 +47,7 @@ sap.ui.define([
47
47
  * @param {string} [sId] id for the new control, generated automatically if no id is given
48
48
  * @param {object} [mSettings] initial settings for the new object
49
49
  * @author SAP SE
50
- * @version 1.136.1
50
+ * @version 1.139.0
51
51
  * @extends sap.ui.core.Element
52
52
  * @constructor
53
53
  * @public
@@ -299,7 +299,7 @@ sap.ui.define([
299
299
  // segmentedButton for for multiple content entries
300
300
  this._oContentSegmentedButton = new SegmentedButton({
301
301
  layoutData: oLayoutData.clone(),
302
- select: this._onContentButtonSelect.bind(this)
302
+ selectionChange: this._onContentButtonSelect.bind(this)
303
303
  });
304
304
 
305
305
  // Left side...
@@ -628,12 +628,12 @@ sap.ui.define([
628
628
  ContainerBase.prototype._contentChange = function() {
629
629
  var aContent = this.getContent();
630
630
  // remove and destroy all buttons for old content
631
- this._oContentSegmentedButton.removeAllButtons();
631
+ this._oContentSegmentedButton.removeAllItems();
632
632
  this._destroyButtons(this._aContentIcons);
633
633
 
634
634
  this._aContentIcons = [];
635
635
  if (aContent.length === 0) {
636
- this._oContentSegmentedButton.removeAllButtons();
636
+ this._oContentSegmentedButton.removeAllItems();
637
637
  this._setDefaultOnSegmentedButton();
638
638
  this.switchContent(null);
639
639
  }
@@ -660,7 +660,7 @@ sap.ui.define([
660
660
  };
661
661
 
662
662
  ContainerBase.prototype._onContentButtonSelect = function(oEvent) {
663
- var sContentId = oEvent.getParameter("key");
663
+ var sContentId = oEvent.getParameter("item").getKey();
664
664
  this._switchContent(sContentId);
665
665
  };
666
666
 
@@ -86,7 +86,7 @@ sap.ui.define([
86
86
  * List Panel aggregation
87
87
  */
88
88
  "listPanelStack": {
89
- type: "sap.ui.vk.ListPanelStack",
89
+ type: "sap.ui.vbm.ListPanelStack",
90
90
  multiple: false
91
91
  },
92
92
  /**
@@ -267,7 +267,8 @@ sap.ui.define([
267
267
  this._box = new sap.m.HBox().addStyleClass("mapContainerHboxPopover");
268
268
 
269
269
  this._popover = new sap.m.Popover({
270
- enableScrolling: false,
270
+ horizontalScrolling: false,
271
+ verticalScrolling: false,
271
272
  placement: sap.m.PlacementType.Horizontal,
272
273
  content: this._box,
273
274
  showHeader: false
@@ -23,7 +23,7 @@ sap.ui.define([
23
23
  *
24
24
  * @public
25
25
  * @author SAP SE
26
- * @version 1.136.1
26
+ * @version 1.139.0
27
27
  * @extends sap.ui.core.Control
28
28
  * @alias sap.ui.vbm.Viewport
29
29
  */
@@ -22,7 +22,7 @@ sap.ui.define([
22
22
  *
23
23
  * @private
24
24
  * @author SAP SE
25
- * @version 1.136.1
25
+ * @version 1.139.0
26
26
  * @alias sap.ui.vbm.adapter3d.ColladaBounds
27
27
  */
28
28
  var ColladaBounds = BaseObject.extend("sap.ui.vbm.adapter3d.ColladaBounds", /** @lends sap.ui.vbm.adapter3d.ColladaBounds.prototype */ {
@@ -83,7 +83,7 @@ sap.ui.define([
83
83
  *
84
84
  * @private
85
85
  * @author SAP SE
86
- * @version 1.136.1
86
+ * @version 1.139.0
87
87
  * @alias sap.ui.vbm.adapter3d.DragDropHandler
88
88
  */
89
89
  var DragDropHandler = BaseObject.extend("sap.ui.vbm.adapter3d.DragDropHandler", /** @lends sap.ui.vbm.adapter3d.DragDropHandler.prototype */ {
@@ -29,7 +29,7 @@ sap.ui.define([
29
29
  *
30
30
  * @private
31
31
  * @author SAP SE
32
- * @version 1.136.1
32
+ * @version 1.139.0
33
33
  * @alias sap.ui.vbm.adapter3d.ModelHandler
34
34
  */
35
35
  var ModelHandler = BaseObject.extend("sap.ui.vbm.adapter3d.ModelHandler", /** @lends sap.ui.vbm.adapter3d.ModelHandler.prototype */ {
@@ -377,7 +377,7 @@ sap.ui.define([
377
377
  *
378
378
  * @private
379
379
  * @author SAP SE
380
- * @version 1.136.1
380
+ * @version 1.139.0
381
381
  * @alias sap.ui.vbm.adapter3d.ObjectFactory
382
382
  */
383
383
  var ObjectFactory = BaseObject.extend("sap.ui.vbm.adapter3d.ObjectFactory", /** @lends sap.ui.vbm.adapter3d.ObjectFactory.prototype */ {});
@@ -32,7 +32,7 @@ sap.ui.define([
32
32
  *
33
33
  * @private
34
34
  * @author SAP SE
35
- * @version 1.136.1
35
+ * @version 1.139.0
36
36
  * @alias sap.ui.vbm.adapter3d.PolygonHandler
37
37
  */
38
38
  var PolygonHandler = BaseObject.extend("sap.ui.vbm.adapter3d.PolygonHandler", /** @lends sap.ui.vbm.adapter3d.PolygonHandler.prototype */ {
@@ -39,7 +39,7 @@ sap.ui.define([
39
39
  *
40
40
  * @private
41
41
  * @author SAP SE
42
- * @version 1.136.1
42
+ * @version 1.139.0
43
43
  * @alias sap.ui.vbm.adapter3d.RectangleTracker
44
44
  */
45
45
  var RectangleTracker = BaseObject.extend("sap.ui.vbm.adapter3d.RectangleTracker", /** @lends sap.ui.vbm.adapter3d.RectangleTracker.prototype */ {
@@ -114,7 +114,7 @@ sap.ui.define([
114
114
  var ref = this._viewport.getDomRef();
115
115
  if (ref) {
116
116
  this._dom = ref;
117
- this._addListener(ref, "pointerup", this._onPointerCancel);
117
+ this._addListener(ref, "pointerup", this._onPointerUp);
118
118
  this._addListener(ref, "pointerdown", this._onPointerDown);
119
119
  this._addListener(ref, "pointermove", this._onPointerMove);
120
120
  this._addListener(ref, "pointerleave", this._onPointerCancel);
@@ -228,15 +228,20 @@ sap.ui.define([
228
228
 
229
229
  RectangleTracker.prototype._onPointerMove = function (event) {
230
230
  event.preventDefault();
231
-
232
- if (!this._mouseDown) {
233
- this._updatePointer(event, _pointer);
234
- this._handleHover(_pointer);
235
- }
236
-
231
+ //this._updateController(false);
237
232
  if (this._mouseDown) {
238
- this._updateController(false);
233
+ this._cameraControls.enableRotate = false;
239
234
  this.onSelectMove(event);
235
+ this._updatePointer(event, _pointer);
236
+ this._handleHover(_pointer);
237
+ }
238
+ // else if (!this._mouseDown) {
239
+ // this._cameraControls.enableRotate = false;
240
+ // }
241
+ }
242
+ RectangleTracker.prototype._onPointerUp = function (event) {
243
+ this._updateController(true);
244
+ if (!this._mouseDown) {
240
245
  var that = this;
241
246
  event.cursor = event.cursor || this._getXY(event);
242
247
  var rect = this._viewport.getDomRef().getBoundingClientRect();
@@ -311,7 +316,7 @@ sap.ui.define([
311
316
  E: [obj]
312
317
  }]);
313
318
  }
314
-
319
+
315
320
  }
316
321
  });
317
322
 
@@ -324,7 +329,10 @@ sap.ui.define([
324
329
  });
325
330
  }
326
331
  }
327
-
332
+ this._mouseDown = false;
333
+ this._dom.style.cursor = this._hovered ? "pointer" : "auto";
334
+ this._updateController(true);
335
+ this.onSelectOver();
328
336
  };
329
337
 
330
338
  RectangleTracker.prototype._constructPayload = function (dataMap) {
@@ -488,7 +496,7 @@ sap.ui.define([
488
496
 
489
497
  RectangleTracker.prototype.searchChildInFrustum = function (frustum, object) {
490
498
  var count = 0;
491
- if (object._sapInstance != undefined && !object.geomtry) {
499
+ if (object._sapInstance != undefined && ((object._sapInstance["VB:c"] == 'true' ) || !(object._sapInstance["VB:c"]) )) {
492
500
  var box1 = new THREE.BoxHelper(object, 0x000000);
493
501
  var vertices = box1.geometry.attributes.position.array;
494
502
  for (var i = 0, l = vertices.length; i < l; i += 3) {
@@ -47,7 +47,7 @@ sap.ui.define([
47
47
  *
48
48
  * @private
49
49
  * @author SAP SE
50
- * @version 1.136.1
50
+ * @version 1.139.0
51
51
  * @alias sap.ui.vbm.adapter3d.SceneBuilder
52
52
  */
53
53
  var SceneBuilder = BaseObject.extend("sap.ui.vbm.adapter3d.SceneBuilder", /** @lends sap.ui.vbm.adapter3d.SceneBuilder.prototype */ {
@@ -56,7 +56,7 @@ sap.ui.define([
56
56
  *
57
57
  * @private
58
58
  * @author SAP SE
59
- * @version 1.136.1
59
+ * @version 1.139.0
60
60
  * @alias sap.ui.vbm.adapter3d.VBIJSONParser
61
61
  */
62
62
  var VBIJSONParser = BaseObject.extend("sap.ui.vbm.adapter3d.VBIJSONParser", /** @lends sap.ui.vbm.adapter3d.VBIJSONParser.prototype */ {
@@ -20,7 +20,7 @@ sap.ui.define([
20
20
  * @namespace
21
21
  * @alias sap.ui.vbm
22
22
  * @author SAP SE
23
- * @version 1.136.1
23
+ * @version 1.139.0
24
24
  * @public
25
25
  */
26
26
 
@@ -46,7 +46,7 @@ sap.ui.define([
46
46
  "sap.ui.vbm.ClusterBase", "sap.ui.vbm.ClusterTree", "sap.ui.vbm.ClusterGrid", "sap.ui.vbm.ClusterDistance", "sap.ui.vbm.Heatmap",
47
47
  "sap.ui.vbm.HeatPoint", "sap.ui.vbm.ClusterContainer", "sap.ui.vbm.Adapter", "sap.ui.vbm.Adapter3D"
48
48
  ],
49
- version: "1.136.1"
49
+ version: "1.139.0"
50
50
  });
51
51
 
52
52
  sap.ui.loader.config({
@@ -38,6 +38,8 @@ sap.ui.define([
38
38
  let spotid = 0;
39
39
  let fixedBounds;
40
40
  var containerID;
41
+ let previousCenter = null;
42
+ let previousZoom = null;
41
43
 
42
44
 
43
45
 
@@ -57,6 +59,12 @@ sap.ui.define([
57
59
  }
58
60
 
59
61
  VBI.MapRenderer.renderMap = () => {
62
+
63
+ if (this.map) {
64
+ previousCenter = this.map.getCenter();
65
+ previousZoom = this.map.getZoom();
66
+ this.map.remove();
67
+ }
60
68
 
61
69
  let geoJSON = VBI.VBITransformer.getTransformedJSON();
62
70
 
@@ -68,10 +76,23 @@ sap.ui.define([
68
76
  document.head.appendChild(styleSheet);
69
77
 
70
78
  const map = VectorUtils.createMap(geoJSON, map_container);
79
+
80
+ if (previousCenter && previousZoom !== null) {
81
+ map.jumpTo({
82
+ center: [previousCenter.lng, previousCenter.lat],
83
+ zoom: previousZoom
84
+
85
+ });
86
+ }
87
+
71
88
  const canvas = map.getCanvasContainer();
72
89
  const rectangularSelection = new RectangularSelection(map);
73
90
  const lassoSelection = new LassoSelection(map);
74
91
  const mapCanvas = map.getCanvas();
92
+ const popupLink = new maplibregl.Popup({
93
+ closeButton: false,
94
+ closeOnClick: false
95
+ });
75
96
  mapCanvas.id = VectorUtils._setcanvasid();
76
97
  // Set `true` to dispatch the event before other functions
77
98
  // call it. This is necessary for disabling the default map
@@ -129,7 +150,11 @@ sap.ui.define([
129
150
  // Create a popup, but don't add it to the map yet.
130
151
  const popup = new maplibregl.Popup({
131
152
  closeButton: false,
132
- closeOnClick: false
153
+ closeOnClick: false,
154
+ offset: {
155
+ 'top': [0, 0],
156
+ 'bottom': [0, -25]
157
+ }
133
158
  });
134
159
  // add markers to map only for Points
135
160
  const pointFeatures = [];
@@ -139,8 +164,9 @@ sap.ui.define([
139
164
  // create a DOM element for the marker (parent div)
140
165
  const el = VectorUtils.createSpotElement(marker);
141
166
  if (marker.properties.Icon) {
167
+ const iconColor = marker.properties.contentColor? marker.properties.contentColor : "#000000";
142
168
  // Create child element for the SAP icon (icon overlay)
143
- const child_el = VectorUtils.createIconElement(marker.properties.Icon);
169
+ const child_el = VectorUtils.createIconElement(marker.properties.Icon, iconColor);
144
170
  child_el.id = '__mapspot' + spotid++;
145
171
  // Append the icon inside the marker
146
172
  el.appendChild(child_el);
@@ -148,8 +174,8 @@ sap.ui.define([
148
174
  // add marker to map
149
175
  let spot = new maplibregl.Marker({
150
176
  element: el,
151
- draggable: true
152
- // offset: [0, -25]
177
+ draggable: true,
178
+ offset: [0, -20]
153
179
  }).setLngLat(marker.geometry.coordinates)
154
180
  .on('dragend', onDragEnd)
155
181
  .addTo(map);
@@ -370,8 +396,69 @@ sap.ui.define([
370
396
  if (that.Apressed || that.Rpressed) {
371
397
  el.style.cursor = 'crosshair';
372
398
  } else {
373
- var tooltip = marker.properties.ToolTip.replace(/\n/g, '<br>');
374
- popup.setLngLat(marker.geometry.coordinates).setHTML(tooltip).addTo(map);
399
+ function renderTooltip(marker, popup, map) {
400
+ if (!document.getElementById('custom-maplibre-tooltip-style')) {
401
+ const style = document.createElement('style');
402
+ style.id = 'custom-maplibre-tooltip-style';
403
+ style.innerHTML = `
404
+ .maplibregl-popup {
405
+ background: transparent !important;
406
+ box-shadow: none !important;
407
+ padding: 0 !important;
408
+ width: auto;
409
+ }
410
+ .maplibregl-popup-content {
411
+ background: transparent !important;
412
+ padding: 0 !important;
413
+ box-shadow: none !important;
414
+ border-radius: 0 !important;
415
+ width: auto;
416
+ }
417
+ `;
418
+ document.head.appendChild(style);
419
+ }
420
+
421
+ const isDarkTheme = window.matchMedia &&
422
+ window.matchMedia('(prefers-color-scheme: dark)').matches;
423
+
424
+ const outerBorderColor = 'none';
425
+ const innerBgColor = isDarkTheme ? '#545555' : '#f0f0f0';
426
+ const textColor = isDarkTheme ? 'white' : 'f0f0f0';
427
+
428
+ const tooltipContent = marker.properties.ToolTip.replace(/\n/g, '<br>');
429
+
430
+ const tooltip = `
431
+
432
+ <div style="
433
+ background-color: ${innerBgColor};
434
+ color: ${textColor};
435
+ padding: 8px;
436
+ border-radius: 6px;
437
+ max-height: 180px;
438
+ display: inline-block;
439
+ font-family: Arial;
440
+ font-size: 0.875rem;
441
+ width: auto;
442
+ white-space: nowrap;
443
+ border: 2px solid ${outerBorderColor};
444
+ ">
445
+ ${tooltipContent}
446
+ </div>`;
447
+
448
+ popup.setLngLat(marker.geometry.coordinates)
449
+ .setHTML(tooltip)
450
+ .addTo(map);
451
+ }
452
+
453
+ // 2. Initial render
454
+ renderTooltip(marker, popup, map);
455
+
456
+ // 3. Re-render tooltip on system theme change
457
+ window.matchMedia('(prefers-color-scheme: dark)')
458
+ .addEventListener('change', () => {
459
+ popup.remove();
460
+ renderTooltip(marker, popup, map);
461
+ });
375
462
  }
376
463
  }
377
464
 
@@ -566,10 +653,59 @@ sap.ui.define([
566
653
 
567
654
  });
568
655
  // Change mouse cursor when hovering over the line
569
- map.on('mouseenter', 'geojson-source-route', function () {
656
+ map.on('mouseenter', 'geojson-source-route', function (event) {
570
657
  if (!that.Apressed && !that.Rpressed) {
571
658
  map.getCanvas().style.cursor = 'pointer';
572
659
  }
660
+ if (!document.getElementById('custom-maplibre-tooltip-style')) {
661
+ const style = document.createElement('style');
662
+ style.id = 'custom-maplibre-tooltip-style';
663
+ style.innerHTML = `
664
+ .maplibregl-popup {
665
+ background: transparent !important;
666
+ box-shadow: none !important;
667
+ padding: 0 !important;
668
+ width: auto;
669
+ }
670
+ .maplibregl-popup-content {
671
+ background: transparent !important;
672
+ padding: 0 !important;
673
+ box-shadow: none !important;
674
+ border-radius: 0 !important;
675
+ width: auto;
676
+ } `;
677
+ document.head.appendChild(style);
678
+ }
679
+
680
+ const isDarkTheme = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
681
+
682
+ const outerBorderColor = 'none';
683
+ const innerBgColor = isDarkTheme ? '#545555' : '#f0f0f0';
684
+ const textColor = isDarkTheme ? 'white' : 'f0f0f0';
685
+
686
+ const coordinates = event.lngLat;
687
+ const description = event.features[0].properties.ToolTip || "";
688
+
689
+ const tooltipContent = description.replace(/\n/g, '<br>');
690
+
691
+ const tooltip = ` <div style="
692
+ background-color: ${innerBgColor};
693
+ color: ${textColor};
694
+ padding: 8px;
695
+ border-radius: 6px;
696
+ max-height: 180px;
697
+ display: inline-block;
698
+ font-family: Arial;
699
+ font-size: 0.875rem;
700
+ width: auto;
701
+ white-space: nowrap;
702
+ border: 2px solid ${outerBorderColor};
703
+ ">
704
+ ${tooltipContent}
705
+ </div> `;
706
+
707
+ popupLink.setLngLat(coordinates).setHTML(tooltip).addTo(map);
708
+
573
709
  });
574
710
 
575
711
  // Revert mouse cursor back when not hovering
@@ -577,6 +713,7 @@ sap.ui.define([
577
713
  if (!that.Apressed && !that.Rpressed) {
578
714
  map.getCanvas().style.cursor = '';
579
715
  }
716
+ popupLink.remove();
580
717
  });
581
718
  map.on('click', 'geojson-source-route', function (e) {
582
719
  //Trigger payload
@@ -12,7 +12,7 @@ sap.ui.define([
12
12
  *
13
13
  * @private
14
14
  * @author SAP SE
15
- * @version 1.136.1
15
+ * @version 1.139.0
16
16
  * @alias sap.ui.vbm.vector.PayloadGenerator
17
17
  */
18
18
  var adapter = {};
@@ -12,7 +12,7 @@ sap.ui.define([
12
12
  *
13
13
  * @private
14
14
  * @author SAP SE
15
- * @version 1.136.1
15
+ * @version 1.139.0
16
16
  * @alias sap.ui.vbm.vector.RectangularSelection
17
17
  */
18
18
 
@@ -362,8 +362,13 @@ sap.ui.define([
362
362
  // "id" : currRoute['VB:ix'],
363
363
  "id": route_id++,
364
364
  };
365
-
366
- featureCollection.push(route_data);
365
+ let indexNum = featureCollection.findIndex(item => item.properties.Key === route_data.properties.Key)
366
+ if (indexNum !== -1) {
367
+ featureCollection[indexNum] = route_data
368
+ }
369
+ else {
370
+ featureCollection.push(route_data);
371
+ }
367
372
  }
368
373
  }
369
374
  } else {
@@ -416,7 +421,13 @@ sap.ui.define([
416
421
  // "id" : currRoute['VB:ix'],
417
422
  "id": route_id++,
418
423
  };
419
- featureCollection.push(route_data);
424
+ let indexNum = featureCollection.findIndex(item => item.properties.Key === route_data.properties.Key)
425
+ if (indexNum !== -1) {
426
+ featureCollection[indexNum] = route_data
427
+ }
428
+ else {
429
+ featureCollection.push(route_data);
430
+ }
420
431
  }
421
432
  }
422
433
  }
@@ -50,7 +50,7 @@ sap.ui.define([
50
50
  var validDrop = drag.some(item => drop.includes(item));
51
51
  return validDrop;
52
52
  };
53
- VectorUtils.createIconElement = (Icon) => {
53
+ VectorUtils.createIconElement = (Icon, iconColor) => {
54
54
  const child_el = document.createElement('div');
55
55
  child_el.className = 'marker';
56
56
  child_el.style.position = 'absolute'; // Position it absolutely inside the parent
@@ -59,6 +59,7 @@ sap.ui.define([
59
59
  child_el.style.transform = 'translate(-50%, -50%)'; // Center the icon
60
60
  child_el.style.fontFamily = 'SAP-icons';
61
61
  child_el.style.fontSize = '20px'; // Adjust size as needed
62
+ child_el.style.color = iconColor;
62
63
  var iconInfo = sap.ui.core.IconPool.getIconInfo(Icon);
63
64
  child_el.innerHTML = iconInfo.content;
64
65
  return child_el;