@panoramax/web-viewer 3.2.3-develop-64f445f0 → 3.2.3-develop-dfee2adc

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.
Files changed (15) hide show
  1. package/build/editor.html +6 -6
  2. package/build/index.js +83 -83
  3. package/build/index.js.map +1 -1
  4. package/build/viewer.html +7 -7
  5. package/package.json +2 -1
  6. package/public/editor.html +6 -6
  7. package/public/viewer.html +7 -7
  8. package/src/components/core/Basic.js +30 -5
  9. package/src/components/core/CoverageMap.js +1 -1
  10. package/src/components/core/Editor.js +1 -1
  11. package/src/components/core/PhotoViewer.js +2 -2
  12. package/src/components/core/Viewer.js +1 -1
  13. package/tests/components/core/Basic.test.js +1 -1
  14. package/tests/components/core/BasicMock.js +3 -0
  15. package/tests/components/core/Viewer.test.js +3 -0
package/build/viewer.html CHANGED
@@ -1,12 +1,12 @@
1
1
  <!doctype html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no"><title>Panoramax Web Viewer</title><style>#viewer{position:relative;width:95%;margin:2.5%;height:400px}#viewer.fullpage{position:fixed;top:0;bottom:0;left:0;right:0;height:unset;width:unset;margin:0}</style><script defer="defer" src="index.js"></script><link href="index.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><pnx-viewer id="viewer" class="fullpage" map='{
2
- "raster": {
3
- "type": "raster",
4
- "tiles": [
2
+ raster: {
3
+ type: "raster",
4
+ tiles: [
5
5
  "https://data.geopf.fr/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=ORTHOIMAGERY.ORTHOPHOTOS&STYLE=normal&FORMAT=image/jpeg&TILEMATRIXSET=PM_0_21&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}"
6
6
  ],
7
- "minzoom": 0,
8
- "maxzoom": 21,
9
- "attribution": "&copy; IGN",
10
- "tileSize": 256
7
+ minzoom: 0,
8
+ maxzoom: 21,
9
+ attribution: "&copy; IGN",
10
+ tileSize: 256
11
11
  }
12
12
  }'/><script>var servers={meta:"https://api.panoramax.xyz/api",ign:"https://panoramax.ign.fr/api",osm:"https://panoramax.openstreetmap.fr/api",local:"http://localhost:5000/api",dev:"https://panoramax.codeureusesenliberte.fr/api"},urlParams=new URLSearchParams(window.location.search),server=servers[urlParams.get("server")||"meta"];window.onload=()=>{document.getElementById("viewer").setAttribute("endpoint",server)}</script></body></html>
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@panoramax/web-viewer",
3
- "version": "3.2.3-develop-64f445f0",
3
+ "version": "3.2.3-develop-dfee2adc",
4
4
  "description": "Panoramax web viewer for geolocated pictures",
5
5
  "main": "build/index.js",
6
6
  "author": "Panoramax team",
@@ -98,6 +98,7 @@
98
98
  "@photo-sphere-viewer/gallery-plugin": "5.12.1",
99
99
  "@photo-sphere-viewer/markers-plugin": "5.12.1",
100
100
  "@photo-sphere-viewer/virtual-tour-plugin": "5.12.1",
101
+ "json5": "^2.2.3",
101
102
  "lit": "^3.2.1",
102
103
  "maplibre-gl": "^5.2.0",
103
104
  "pmtiles": "^4.3.0",
package/public/editor.html CHANGED
@@ -33,14 +33,14 @@
33
33
  picture="329af5c6-4761-4a6d-9c1e-674fd6daa8b6"
34
34
  background="aerial"
35
35
  raster='{
36
- "type": "raster",
37
- "tiles": [
36
+ type: "raster",
37
+ tiles: [
38
38
  "https://data.geopf.fr/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=ORTHOIMAGERY.ORTHOPHOTOS&STYLE=normal&FORMAT=image/jpeg&TILEMATRIXSET=PM_0_21&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}"
39
39
  ],
40
- "minzoom": 0,
41
- "maxzoom": 21,
42
- "attribution": "&copy; IGN",
43
- "tileSize": 256
40
+ minzoom: 0,
41
+ maxzoom: 21,
42
+ attribution: "&copy; IGN",
43
+ tileSize: 256
44
44
  }'
45
45
  ></pnx-editor>
46
46
 
package/public/viewer.html CHANGED
@@ -32,15 +32,15 @@
32
32
  id="viewer"
33
33
  class="fullpage"
34
34
  map='{
35
- "raster": {
36
- "type": "raster",
37
- "tiles": [
35
+ raster: {
36
+ type: "raster",
37
+ tiles: [
38
38
  "https://data.geopf.fr/wmts?SERVICE=WMTS&REQUEST=GetTile&VERSION=1.0.0&LAYER=ORTHOIMAGERY.ORTHOPHOTOS&STYLE=normal&FORMAT=image/jpeg&TILEMATRIXSET=PM_0_21&TILEMATRIX={z}&TILEROW={y}&TILECOL={x}"
39
39
  ],
40
- "minzoom": 0,
41
- "maxzoom": 21,
42
- "attribution": "&copy; IGN",
43
- "tileSize": 256
40
+ minzoom: 0,
41
+ maxzoom: 21,
42
+ attribution: "&copy; IGN",
43
+ tileSize: 256
44
44
  }
45
45
  }'
46
46
  />
package/src/components/core/Basic.js CHANGED
@@ -4,6 +4,7 @@ import { getTranslations } from "../../utils/i18n";
4
4
  import { DEFAULT_TILES } from "../../utils/map";
5
5
  import { createWebComp } from "../../utils/widgets";
6
6
  import { isInIframe, isInternetFast } from "../../utils/utils";
7
+ import JSON5 from "json5";
7
8
  import PACKAGE_JSON from "../../../package.json";
8
9
  import "@fontsource/atkinson-hyperlegible-next";
9
10
  import "./Basic.css";
@@ -44,7 +45,7 @@ export default class Basic extends LitElement {
44
45
  static properties = {
45
46
  picture: {type: String, reflect: true},
46
47
  sequence: {type: String, reflect: true},
47
- fetchOptions: {type: Object, attribute: false},
48
+ fetchOptions: {converter: Basic.GetJSONConverter()},
48
49
  users: {type: Array, reflect: true},
49
50
  mapstyle: {type: String},
50
51
  lang: {type: String},
@@ -58,7 +59,7 @@ export default class Basic extends LitElement {
58
59
  this.users = ["geovisio"];
59
60
  this.mapstyle = this.getAttribute("mapstyle") || DEFAULT_TILES;
60
61
  this.lang = this.getAttribute("lang") || null;
61
- this.endpoint = this.getAttribute("endpoint") || null; // No default
62
+ this.endpoint = null; // No default
62
63
  this.picture = null;
63
64
  this.sequence = null;
64
65
 
@@ -82,7 +83,6 @@ export default class Basic extends LitElement {
82
83
 
83
84
  connectedCallback() {
84
85
  super.connectedCallback();
85
- if(this.endpoint) { this._setupAPI(); }
86
86
  }
87
87
 
88
88
  /**
@@ -98,6 +98,9 @@ export default class Basic extends LitElement {
98
98
  return;
99
99
  }
100
100
 
101
+ this._loadsAPI = this.endpoint;
102
+ let myLoadAPI = this.endpoint;
103
+
101
104
  // Check if mapstyle is not a unparsed JSON
102
105
  try {
103
106
  this.mapstyle = JSON.parse(this.mapstyle);
@@ -112,6 +115,8 @@ export default class Basic extends LitElement {
112
115
  });
113
116
  this.api.onceReady()
114
117
  .then(() => {
118
+ if(myLoadAPI != this._loadsAPI || !this.api) { return; }
119
+
115
120
  let unavailable = this.api.getUnavailableFeatures();
116
121
  let available = this.api.getAvailableFeatures();
117
122
  available = unavailable.length === 0 ? "✅ All features available" : "✅ Available features: "+available.join(", ");
@@ -122,9 +127,11 @@ export default class Basic extends LitElement {
122
127
  ${unavailable}
123
128
  `.trim());
124
129
  })
125
- .catch(e => this.loader.dismiss(e, this._t.pnx.error_api));
130
+ .catch(e => this.loader.dismiss(e, this._t.pnx.error_api))
131
+ .finally(() => delete this._loadsAPI);
126
132
  }
127
133
  catch(e) {
134
+ delete this._loadsAPI;
128
135
  if(this.loader?.dismiss) {
129
136
  this.loader.dismiss(e, this._t.pnx.error_api);
130
137
  }
@@ -173,7 +180,17 @@ export default class Basic extends LitElement {
173
180
  super.attributeChangedCallback(name, _old, value);
174
181
 
175
182
  if(name === "endpoint") {
176
- if(!this.api || this.api._endpoint !== value) { this._setupAPI(); }
183
+ if(
184
+ !(this._loadsAPI && value && this._loadsAPI === value)
185
+ && !(this.api && this.api._endpoint === value)
186
+ && value
187
+ ) {
188
+ if(this._loadsAPI || this.api) {
189
+ delete this.api;
190
+ delete this._loadsAPI;
191
+ }
192
+ this._setupAPI();
193
+ }
177
194
  }
178
195
  if(["picture", "sequence"].includes(name)) {
179
196
  let seqId, picId, prevSeqId, prevPicId;
@@ -319,4 +336,12 @@ export default class Basic extends LitElement {
319
336
  super.addEventListener(type, listener, options);
320
337
  }
321
338
  }
339
+
340
+ /** @private */
341
+ static GetJSONConverter() {
342
+ return {
343
+ fromAttribute: (value) => JSON5.parse(value),
344
+ toAttribute: (value) => JSON.stringify(value)
345
+ };
346
+ }
322
347
  }
package/src/components/core/CoverageMap.js CHANGED
@@ -44,7 +44,7 @@ export default class CoverageMap extends Basic {
44
44
  * @property {object} [map] [Any map option available in Map class](#Panoramax.components.ui.Map).<br />Example: `map='{"bounds": [[-73.9876, 40.7661], [-73.9397, 40.8002]]}'`
45
45
  */
46
46
  static properties = {
47
- map: {type: Object},
47
+ map: {converter: Basic.GetJSONConverter()},
48
48
  ...Basic.properties
49
49
  };
50
50
 
package/src/components/core/Editor.js CHANGED
@@ -54,7 +54,7 @@ export default class Editor extends Basic {
54
54
  * @property {string} [background=streets] Choose default map background to display (streets or aerial, if raster aerial background available). Defaults to street.
55
55
  */
56
56
  static properties = {
57
- raster: {type: Object},
57
+ raster: {converter: Basic.GetJSONConverter()},
58
58
  background: {type: String},
59
59
  ...Basic.properties
60
60
  };
package/src/components/core/PhotoViewer.js CHANGED
@@ -82,7 +82,7 @@ export default class PhotoViewer extends Basic {
82
82
  * @property {string} [url-parameters=true] Should the component add and update URL query parameters to save viewer state ?
83
83
  */
84
84
  static properties = {
85
- psv: {type: Object},
85
+ psv: {converter: Basic.GetJSONConverter()},
86
86
  widgets: {type: String},
87
87
  "url-parameters": {type: String},
88
88
  ...Basic.properties
@@ -204,7 +204,7 @@ export default class PhotoViewer extends Basic {
204
204
  let waiter;
205
205
  return new Promise(resolve => {
206
206
  waiter = setInterval(() => {
207
- if(typeof this.psv === "object") {
207
+ if(this.psv && typeof this.psv === "object") {
208
208
  if(this.psv.container) {
209
209
  clearInterval(waiter);
210
210
  resolve();
package/src/components/core/Viewer.js CHANGED
@@ -103,7 +103,7 @@ export default class Viewer extends PhotoViewer {
103
103
  * @property {string} [lang] To override language used for labels. Defaults to using user's preferred languages.
104
104
  */
105
105
  static properties = {
106
- map: {type: Object},
106
+ map: {converter: PhotoViewer.GetJSONConverter()},
107
107
  focus: {type: String, reflect: true},
108
108
  geocoder: {type: String},
109
109
  ...PhotoViewer.properties
package/tests/components/core/Basic.test.js CHANGED
@@ -35,7 +35,7 @@ describe("constructor", () => {
35
35
 
36
36
  it("should set up API when endpoint is provided", async () => {
37
37
  basic.endpoint = "https://api.example.com";
38
- basic.connectedCallback();
38
+ basic.attributeChangedCallback("endpoint", null, "https://api.example.com");
39
39
  expect(API).toHaveBeenCalledWith("https://api.example.com", expect.any(Object));
40
40
  });
41
41
  });
package/tests/components/core/BasicMock.js CHANGED
@@ -17,5 +17,8 @@ jest.mock("../../../src/components/core/Basic", () => (
17
17
  onceAPIReady() {
18
18
  return Promise.resolve();
19
19
  }
20
+ static GetJSONConverter() {
21
+ return {};
22
+ }
20
23
  }
21
24
  ));
package/tests/components/core/Viewer.test.js CHANGED
@@ -22,6 +22,9 @@ jest.mock("../../../src/components/core/PhotoViewer", () => (
22
22
  onceAPIReady() {
23
23
  return Promise.resolve();
24
24
  }
25
+ static GetJSONConverter() {
26
+ return {};
27
+ }
25
28
  }
26
29
  ));
27
30