@panoramax/web-viewer 4.4.0-develop-746bcb00 → 4.4.0-develop-d8b38e70

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 (341) hide show
  1. package/{src → build}/components/core/Basic.js +22 -16
  2. package/{src → build}/components/core/CoverageMap.js +19 -14
  3. package/{src → build}/components/core/Editor.js +16 -16
  4. package/{src → build}/components/core/PhotoViewer.js +30 -29
  5. package/{src → build}/components/core/Viewer.js +21 -20
  6. package/build/components/core/index.js +10 -0
  7. package/build/components/index.js +11 -0
  8. package/build/components/index_photoviewer.js +6 -0
  9. package/{src → build}/components/layout/BottomDrawer.js +4 -4
  10. package/{src → build}/components/layout/CorneredGrid.js +1 -1
  11. package/{src → build}/components/layout/Mini.js +5 -4
  12. package/{src → build}/components/layout/Tabs.js +1 -1
  13. package/build/components/layout/index.js +9 -0
  14. package/{src → build}/components/menus/LocationPrecisionDoc.js +4 -6
  15. package/{src → build}/components/menus/MapBackground.js +4 -6
  16. package/{src → build}/components/menus/MapFilters.js +16 -21
  17. package/{src → build}/components/menus/MapLayers.js +20 -24
  18. package/{src → build}/components/menus/MapLegend.js +3 -4
  19. package/{src → build}/components/menus/MiniPictureLegend.js +3 -4
  20. package/{src → build}/components/menus/PictureLegend.js +10 -15
  21. package/{src → build}/components/menus/PictureMetadata.js +12 -19
  22. package/{src → build}/components/menus/PlayerOptions.js +5 -7
  23. package/{src → build}/components/menus/QualityScoreDoc.js +3 -4
  24. package/{src → build}/components/menus/ReportForm.js +8 -9
  25. package/{src → build}/components/menus/SemanticsDoc.js +3 -4
  26. package/{src → build}/components/menus/SemanticsDownload.js +3 -3
  27. package/{src → build}/components/menus/SemanticsFilters.js +7 -8
  28. package/{src → build}/components/menus/SemanticsList.js +11 -18
  29. package/{src → build}/components/menus/SemanticsMetadata.js +8 -11
  30. package/{src → build}/components/menus/Share.js +6 -7
  31. package/build/components/menus/index.js +22 -0
  32. package/build/components/menus/index_photoviewer.js +11 -0
  33. package/{src → build}/components/styles.js +0 -2
  34. package/{src → build}/components/ui/AnnotationsSwitch.js +6 -8
  35. package/{src → build}/components/ui/Button.js +1 -1
  36. package/{src → build}/components/ui/ButtonGroup.js +2 -1
  37. package/{src → build}/components/ui/CopyButton.js +4 -6
  38. package/{src → build}/components/ui/Grade.js +5 -5
  39. package/{src → build}/components/ui/GradeFilter.js +3 -3
  40. package/{src → build}/components/ui/IconSwitch.js +1 -1
  41. package/{src → build}/components/ui/LinkButton.js +1 -1
  42. package/{src → build}/components/ui/ListGroup.js +3 -3
  43. package/{src → build}/components/ui/ListItem.js +1 -1
  44. package/{src → build}/components/ui/Loader.js +8 -7
  45. package/{src → build}/components/ui/Map.js +38 -26
  46. package/{src → build}/components/ui/MapMore.js +7 -7
  47. package/{src → build}/components/ui/Photo.js +29 -27
  48. package/{src → build}/components/ui/Popup.js +4 -4
  49. package/{src → build}/components/ui/QualityScore.js +4 -4
  50. package/{src → build}/components/ui/SearchBar.js +6 -7
  51. package/{src → build}/components/ui/SemanticsEditor.js +14 -15
  52. package/{src → build}/components/ui/SemanticsTable.js +4 -5
  53. package/{src → build}/components/ui/Switch.js +1 -1
  54. package/{src → build}/components/ui/TogglableGroup.js +4 -4
  55. package/build/components/ui/index.js +29 -0
  56. package/build/components/ui/index_photoviewer.js +21 -0
  57. package/{src → build}/components/ui/widgets/CopyCoordinates.js +5 -5
  58. package/{src → build}/components/ui/widgets/GeoSearch.js +10 -10
  59. package/{src → build}/components/ui/widgets/Legend.js +9 -8
  60. package/{src → build}/components/ui/widgets/LevelSelect.js +9 -7
  61. package/{src → build}/components/ui/widgets/MapFiltersButton.js +5 -5
  62. package/{src → build}/components/ui/widgets/MapLayersButton.js +5 -5
  63. package/{src → build}/components/ui/widgets/OSMEditors.js +8 -8
  64. package/{src → build}/components/ui/widgets/PictureLegendActions.js +4 -4
  65. package/{src → build}/components/ui/widgets/Player.js +6 -7
  66. package/{src → build}/components/ui/widgets/SemanticsFiltersButton.js +6 -7
  67. package/{src → build}/components/ui/widgets/Zoom.js +6 -6
  68. package/build/components/ui/widgets/index.js +16 -0
  69. package/build/components/ui/widgets/index_photoviewer.js +7 -0
  70. package/build/editor.html +94 -10
  71. package/{src → build}/img/arrow_triangle.svg +0 -1
  72. package/{src → build}/img/arrow_turn.svg +0 -1
  73. package/build/index.html +111 -1
  74. package/build/index.js +6 -95
  75. package/build/index_photoviewer.js +4 -0
  76. package/build/map.html +97 -1
  77. package/build/package.json +141 -0
  78. package/build/photo.html +85 -1
  79. package/build/servers.js +3 -4
  80. package/{src → build}/translations/pt.json +7 -2
  81. package/{src → build}/utils/API.js +33 -33
  82. package/{src → build}/utils/InitParameters.js +11 -9
  83. package/{src → build}/utils/MapStyleComposer.js +39 -37
  84. package/{src → build}/utils/PhotoAdapter.js +1 -0
  85. package/{src → build}/utils/PresetsManager.js +4 -4
  86. package/{src → build}/utils/SemanticsMapProtocol.js +3 -4
  87. package/{src → build}/utils/URLHandler.js +16 -14
  88. package/{src → build}/utils/geocoder.js +5 -5
  89. package/{src → build}/utils/i18n.js +21 -20
  90. package/build/utils/index.js +17 -0
  91. package/build/utils/index_photoviewer.js +14 -0
  92. package/{src → build}/utils/indoor.js +9 -5
  93. package/{src → build}/utils/map.js +15 -11
  94. package/{src → build}/utils/picture.js +22 -17
  95. package/{src → build}/utils/semantics.js +9 -5
  96. package/{src → build}/utils/utils.js +8 -4
  97. package/{src → build}/utils/widgets.js +2 -2
  98. package/build/viewer.html +120 -35
  99. package/build/viewer_indoor.html +90 -8
  100. package/build/widgets.html +410 -1
  101. package/package.json +81 -204
  102. package/.dockerignore +0 -7
  103. package/.gitlab-ci.yml +0 -78
  104. package/CHANGELOG.md +0 -853
  105. package/CODE_OF_CONDUCT.md +0 -134
  106. package/Dockerfile +0 -14
  107. package/build/index.css +0 -36
  108. package/build/index.css.map +0 -1
  109. package/build/index.js.map +0 -1
  110. package/build/photoviewer.css +0 -36
  111. package/build/photoviewer.css.map +0 -1
  112. package/build/photoviewer.js +0 -86
  113. package/build/photoviewer.js.map +0 -1
  114. package/build/static/media/atkinson-hyperlegible-next-latin-400-normal..woff +0 -0
  115. package/build/static/media/atkinson-hyperlegible-next-latin-400-normal..woff2 +0 -0
  116. package/build/static/media/atkinson-hyperlegible-next-latin-ext-400-normal..woff +0 -0
  117. package/build/static/media/atkinson-hyperlegible-next-latin-ext-400-normal..woff2 +0 -0
  118. package/config/env.js +0 -104
  119. package/config/getHttpsConfig.js +0 -69
  120. package/config/getPackageJson.js +0 -25
  121. package/config/jest/babelTransform.js +0 -29
  122. package/config/jest/cssTransform.js +0 -14
  123. package/config/jest/fileTransform.js +0 -40
  124. package/config/jest/mocks.js +0 -230
  125. package/config/modules.js +0 -134
  126. package/config/paths.js +0 -76
  127. package/config/pnpTs.js +0 -35
  128. package/config/webpack/persistentCache/createEnvironmentHash.js +0 -9
  129. package/config/webpack.config.js +0 -825
  130. package/config/webpackDevServer.config.js +0 -131
  131. package/docs/03_URL_settings.md +0 -218
  132. package/docs/05_Compatibility.md +0 -83
  133. package/docs/09_Develop.md +0 -141
  134. package/docs/90_Releases.md +0 -27
  135. package/docs/images/class_diagram.drawio +0 -144
  136. package/docs/images/class_diagram.jpg +0 -0
  137. package/docs/images/comparative_3drender.jpg +0 -0
  138. package/docs/images/indoor_level.png +0 -0
  139. package/docs/images/screenshot.jpg +0 -0
  140. package/docs/index.md +0 -159
  141. package/docs/reference/components/core/Basic.md +0 -211
  142. package/docs/reference/components/core/CoverageMap.md +0 -220
  143. package/docs/reference/components/core/Editor.md +0 -252
  144. package/docs/reference/components/core/PhotoViewer.md +0 -320
  145. package/docs/reference/components/core/Viewer.md +0 -398
  146. package/docs/reference/components/layout/BottomDrawer.md +0 -35
  147. package/docs/reference/components/layout/CorneredGrid.md +0 -29
  148. package/docs/reference/components/layout/Mini.md +0 -45
  149. package/docs/reference/components/layout/Tabs.md +0 -46
  150. package/docs/reference/components/menus/LocationPrecisionDoc.md +0 -15
  151. package/docs/reference/components/menus/MapBackground.md +0 -32
  152. package/docs/reference/components/menus/MapFilters.md +0 -37
  153. package/docs/reference/components/menus/MapLayers.md +0 -15
  154. package/docs/reference/components/menus/MapLegend.md +0 -32
  155. package/docs/reference/components/menus/MiniPictureLegend.md +0 -15
  156. package/docs/reference/components/menus/PictureLegend.md +0 -45
  157. package/docs/reference/components/menus/PictureMetadata.md +0 -32
  158. package/docs/reference/components/menus/PlayerOptions.md +0 -15
  159. package/docs/reference/components/menus/QualityScoreDoc.md +0 -15
  160. package/docs/reference/components/menus/ReportForm.md +0 -15
  161. package/docs/reference/components/menus/SemanticsDoc.md +0 -15
  162. package/docs/reference/components/menus/SemanticsDownload.md +0 -15
  163. package/docs/reference/components/menus/SemanticsFilters.md +0 -33
  164. package/docs/reference/components/menus/SemanticsList.md +0 -97
  165. package/docs/reference/components/menus/SemanticsMetadata.md +0 -15
  166. package/docs/reference/components/menus/ShareMenu.md +0 -32
  167. package/docs/reference/components/ui/AnnotationsSwitch.md +0 -32
  168. package/docs/reference/components/ui/Button.md +0 -40
  169. package/docs/reference/components/ui/ButtonGroup.md +0 -36
  170. package/docs/reference/components/ui/CopyButton.md +0 -41
  171. package/docs/reference/components/ui/Grade.md +0 -32
  172. package/docs/reference/components/ui/GradeFilter.md +0 -42
  173. package/docs/reference/components/ui/IconSwitch.md +0 -53
  174. package/docs/reference/components/ui/LinkButton.md +0 -45
  175. package/docs/reference/components/ui/ListGroup.md +0 -22
  176. package/docs/reference/components/ui/ListItem.md +0 -39
  177. package/docs/reference/components/ui/Loader.md +0 -56
  178. package/docs/reference/components/ui/Map.md +0 -150
  179. package/docs/reference/components/ui/MapMore.md +0 -150
  180. package/docs/reference/components/ui/Photo.md +0 -495
  181. package/docs/reference/components/ui/Popup.md +0 -56
  182. package/docs/reference/components/ui/ProgressBar.md +0 -32
  183. package/docs/reference/components/ui/QualityScore.md +0 -45
  184. package/docs/reference/components/ui/SearchBar.md +0 -63
  185. package/docs/reference/components/ui/SemanticsEditor.md +0 -113
  186. package/docs/reference/components/ui/SemanticsTable.md +0 -32
  187. package/docs/reference/components/ui/Switch.md +0 -49
  188. package/docs/reference/components/ui/TogglableGroup.md +0 -39
  189. package/docs/reference/components/ui/widgets/CopyCoordinates.md +0 -32
  190. package/docs/reference/components/ui/widgets/GeoSearch.md +0 -36
  191. package/docs/reference/components/ui/widgets/Legend.md +0 -58
  192. package/docs/reference/components/ui/widgets/LevelSelect.md +0 -16
  193. package/docs/reference/components/ui/widgets/MapFiltersButton.md +0 -37
  194. package/docs/reference/components/ui/widgets/MapLayersButton.md +0 -15
  195. package/docs/reference/components/ui/widgets/OSMEditors.md +0 -15
  196. package/docs/reference/components/ui/widgets/PictureLegendActions.md +0 -32
  197. package/docs/reference/components/ui/widgets/Player.md +0 -34
  198. package/docs/reference/components/ui/widgets/SemanticsFiltersButton.md +0 -15
  199. package/docs/reference/components/ui/widgets/Zoom.md +0 -15
  200. package/docs/reference/utils/API.md +0 -389
  201. package/docs/reference/utils/InitParameters.md +0 -68
  202. package/docs/reference/utils/MapStyleComposer.md +0 -408
  203. package/docs/reference/utils/PanoraMapProtocol.md +0 -28
  204. package/docs/reference/utils/PresetsManager.md +0 -43
  205. package/docs/reference/utils/SemanticsMapProtocol.md +0 -43
  206. package/docs/reference/utils/URLHandler.md +0 -114
  207. package/docs/reference.md +0 -99
  208. package/docs/shortcuts.md +0 -11
  209. package/docs/tutorials/aerial_imagery.md +0 -21
  210. package/docs/tutorials/authentication.md +0 -10
  211. package/docs/tutorials/custom_widgets.md +0 -59
  212. package/docs/tutorials/indoor_maps.md +0 -50
  213. package/docs/tutorials/map_style.md +0 -83
  214. package/docs/tutorials/migrate_v4.md +0 -153
  215. package/docs/tutorials/migrate_v5.md +0 -103
  216. package/docs/tutorials/semantics_overlays.md +0 -74
  217. package/docs/tutorials/synced_coverage.md +0 -43
  218. package/mkdocs.yml +0 -131
  219. package/public/editor.html +0 -53
  220. package/public/index.html +0 -70
  221. package/public/map.html +0 -55
  222. package/public/photo.html +0 -43
  223. package/public/servers.js +0 -15
  224. package/public/viewer.html +0 -79
  225. package/public/viewer_indoor.html +0 -48
  226. package/public/widgets.html +0 -366
  227. package/scripts/build.js +0 -217
  228. package/scripts/doc.js +0 -79
  229. package/scripts/start.js +0 -172
  230. package/scripts/test.js +0 -52
  231. package/src/components/core/index.js +0 -12
  232. package/src/components/index.js +0 -13
  233. package/src/components/index_photoviewer.js +0 -8
  234. package/src/components/layout/index.js +0 -9
  235. package/src/components/menus/index.js +0 -22
  236. package/src/components/menus/index_photoviewer.js +0 -13
  237. package/src/components/ui/index.js +0 -29
  238. package/src/components/ui/index_photoviewer.js +0 -23
  239. package/src/components/ui/widgets/index.js +0 -16
  240. package/src/components/ui/widgets/index_photoviewer.js +0 -9
  241. package/src/index.js +0 -8
  242. package/src/index_photoviewer.js +0 -6
  243. package/src/utils/index.js +0 -17
  244. package/src/utils/index_photoviewer.js +0 -16
  245. package/tests/components/core/Basic.test.js +0 -168
  246. package/tests/components/core/BasicMock.js +0 -25
  247. package/tests/components/core/CoverageMap.test.js +0 -20
  248. package/tests/components/core/Editor.test.js +0 -20
  249. package/tests/components/core/PhotoViewer.test.js +0 -57
  250. package/tests/components/core/Viewer.test.js +0 -85
  251. package/tests/components/core/__snapshots__/PhotoViewer.test.js.snap +0 -96
  252. package/tests/components/core/__snapshots__/Viewer.test.js.snap +0 -188
  253. package/tests/components/ui/CopyButton.test.js +0 -52
  254. package/tests/components/ui/Loader.test.js +0 -55
  255. package/tests/components/ui/Map.test.js +0 -145
  256. package/tests/components/ui/Photo.test.js +0 -437
  257. package/tests/components/ui/Popup.test.js +0 -26
  258. package/tests/components/ui/QualityScore.test.js +0 -18
  259. package/tests/components/ui/SearchBar.test.js +0 -110
  260. package/tests/components/ui/__snapshots__/CopyButton.test.js.snap +0 -33
  261. package/tests/components/ui/__snapshots__/Loader.test.js.snap +0 -56
  262. package/tests/components/ui/__snapshots__/Map.test.js.snap +0 -16
  263. package/tests/components/ui/__snapshots__/Photo.test.js.snap +0 -263
  264. package/tests/components/ui/__snapshots__/Popup.test.js.snap +0 -29
  265. package/tests/components/ui/__snapshots__/QualityScore.test.js.snap +0 -11
  266. package/tests/components/ui/__snapshots__/SearchBar.test.js.snap +0 -65
  267. package/tests/data/Map_geocoder_ban.json +0 -36
  268. package/tests/data/Map_geocoder_nominatim.json +0 -41
  269. package/tests/data/Viewer_pictures_1.json +0 -148
  270. package/tests/setupTests.js +0 -5
  271. package/tests/utils/API.test.js +0 -752
  272. package/tests/utils/InitParameters.test.js +0 -599
  273. package/tests/utils/MapStyleComposer.test.js +0 -697
  274. package/tests/utils/PresetsManager.test.js +0 -123
  275. package/tests/utils/URLHandler.test.js +0 -587
  276. package/tests/utils/__snapshots__/API.test.js.snap +0 -40
  277. package/tests/utils/__snapshots__/MapStyleComposer.test.js.snap +0 -767
  278. package/tests/utils/__snapshots__/URLHandler.test.js.snap +0 -21
  279. package/tests/utils/__snapshots__/geocoder.test.js.snap +0 -37
  280. package/tests/utils/__snapshots__/map.test.js.snap +0 -1249
  281. package/tests/utils/__snapshots__/picture.test.js.snap +0 -327
  282. package/tests/utils/__snapshots__/widgets.test.js.snap +0 -19
  283. package/tests/utils/geocoder.test.js +0 -37
  284. package/tests/utils/i18n.test.js +0 -111
  285. package/tests/utils/map.test.js +0 -200
  286. package/tests/utils/picture.test.js +0 -745
  287. package/tests/utils/semantics.test.js +0 -174
  288. package/tests/utils/utils.test.js +0 -358
  289. package/tests/utils/widgets.test.js +0 -31
  290. /package/{src → build}/components/core/Basic.css +0 -0
  291. /package/{src → build}/components/core/CoverageMap.css +0 -0
  292. /package/{src → build}/components/core/Editor.css +0 -0
  293. /package/{src → build}/components/core/PhotoViewer.css +0 -0
  294. /package/{src → build}/components/core/Viewer.css +0 -0
  295. /package/{src → build}/components/ui/ButtonGroup.css +0 -0
  296. /package/{src → build}/components/ui/Map.css +0 -0
  297. /package/{src → build}/components/ui/Photo.css +0 -0
  298. /package/{src → build}/components/ui/ProgressBar.js +0 -0
  299. /package/{src → build}/components/ui/widgets/GeoSearch.css +0 -0
  300. /package/{src → build}/components/ui/widgets/LevelSelect.css +0 -0
  301. /package/{src → build}/components/ui/widgets/Player.css +0 -0
  302. /package/{public → build}/favicon.ico +0 -0
  303. /package/{src → build}/img/arrow_360.svg +0 -0
  304. /package/{src → build}/img/arrow_flat.svg +0 -0
  305. /package/{src → build}/img/bg_aerial.jpg +0 -0
  306. /package/{src → build}/img/bg_streets.jpg +0 -0
  307. /package/{src → build}/img/loader_base.jpg +0 -0
  308. /package/{src → build}/img/logo_dead.svg +0 -0
  309. /package/{src → build}/img/marker.svg +0 -0
  310. /package/{src → build}/img/marker_blue.svg +0 -0
  311. /package/{src → build}/img/osm.svg +0 -0
  312. /package/{src → build}/img/panoramax.svg +0 -0
  313. /package/{src → build}/img/switch_big.svg +0 -0
  314. /package/{src → build}/img/switch_mini.svg +0 -0
  315. /package/{src → build}/img/wd.svg +0 -0
  316. /package/{src → build}/translations/ar.json +0 -0
  317. /package/{src → build}/translations/be.json +0 -0
  318. /package/{src → build}/translations/br.json +0 -0
  319. /package/{src → build}/translations/cy.json +0 -0
  320. /package/{src → build}/translations/da.json +0 -0
  321. /package/{src → build}/translations/de.json +0 -0
  322. /package/{src → build}/translations/en.json +0 -0
  323. /package/{src → build}/translations/eo.json +0 -0
  324. /package/{src → build}/translations/es.json +0 -0
  325. /package/{src → build}/translations/fi.json +0 -0
  326. /package/{src → build}/translations/fr.json +0 -0
  327. /package/{src → build}/translations/hu.json +0 -0
  328. /package/{src → build}/translations/it.json +0 -0
  329. /package/{src → build}/translations/ja.json +0 -0
  330. /package/{src → build}/translations/ko.json +0 -0
  331. /package/{src → build}/translations/nl.json +0 -0
  332. /package/{src → build}/translations/nn.json +0 -0
  333. /package/{src → build}/translations/pl.json +0 -0
  334. /package/{src → build}/translations/pt_BR.json +0 -0
  335. /package/{src → build}/translations/sv.json +0 -0
  336. /package/{src → build}/translations/ti.json +0 -0
  337. /package/{src → build}/translations/tr.json +0 -0
  338. /package/{src → build}/translations/uk.json +0 -0
  339. /package/{src → build}/translations/zh_Hant.json +0 -0
  340. /package/{src → build}/utils/PanoraMapProtocol.js +0 -0
  341. /package/{src → build}/utils/services.js +0 -0
package/build/viewer_indoor.html CHANGED
@@ -1,9 +1,91 @@
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 - Indoor</title><script src="https://unpkg.com/maplibre-gl-indoorequal@1.3.0/dist/maplibre-gl-indoorequal.umd.min.js"></script><link href="https://unpkg.com/maplibre-gl-indoorequal@1.3.0/maplibre-gl-indoorequal.css" rel="stylesheet"/><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" endpoint="https://panoramax.openstreetmap.fr/api" map-options='{
2
- center: [-1.55958, 47.2135],
3
- zoom: 19,
4
- indoor: {
5
- apiKey: "iek_yFQp8AMQpK78c8wPyAvbXY3ko6nh",
6
- heatmap: false,
7
- level: "2"
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
6
+ <title>Panoramax Web Viewer - Indoor</title>
7
+ <script src="https://unpkg.com/maplibre-gl-indoorequal@1.3.0/dist/maplibre-gl-indoorequal.umd.min.js"></script>
8
+ <link href="https://unpkg.com/maplibre-gl-indoorequal@1.3.0/maplibre-gl-indoorequal.css" rel="stylesheet" />
9
+ <style>
10
+ #viewer {
11
+ position: relative;
12
+ width: 95%;
13
+ margin: 2.5%;
14
+ height: 400px;
8
15
  }
9
- }'></pnx-viewer></body></html>
16
+ #viewer.fullpage {
17
+ position: fixed;
18
+ top: 0;
19
+ bottom: 0;
20
+ left: 0;
21
+ right: 0;
22
+ height: unset;
23
+ width: unset;
24
+ margin: 0;
25
+ }
26
+ </style>
27
+
28
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/maplibre-gl@5.21.1/dist/maplibre-gl.css" />
29
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/core@5.14.1/index.css" />
30
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/virtual-tour-plugin@5.14.1/index.css" />
31
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/gallery-plugin@5.14.1/index.css" />
32
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/markers-plugin@5.14.1/index.css" />
33
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fontsource/atkinson-hyperlegible-next/index.css" />
34
+ </head>
35
+ <body>
36
+ <script type="importmap">
37
+ {
38
+ "imports": {
39
+ "@fortawesome/fontawesome-svg-core": "https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-svg-core@6.7.2/index.mjs",
40
+ "@fortawesome/free-regular-svg-icons": "https://cdn.jsdelivr.net/npm/@fortawesome/free-regular-svg-icons@6.7.2/index.mjs",
41
+ "@fortawesome/free-solid-svg-icons": "https://cdn.jsdelivr.net/npm/@fortawesome/free-solid-svg-icons@6.7.2/index.mjs",
42
+ "@maplibre/vt-pbf": "https://cdn.jsdelivr.net/npm/@maplibre/vt-pbf@4.3.0/dist/index.es.js",
43
+ "@mapbox/vector-tile": "https://cdn.jsdelivr.net/npm/@mapbox/vector-tile@2.0.4/index.js",
44
+ "@photo-sphere-viewer/core": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/core@5.14.1/index.module.js",
45
+ "@photo-sphere-viewer/equirectangular-tiles-adapter": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/equirectangular-tiles-adapter@5.14.1/index.module.js",
46
+ "@photo-sphere-viewer/gallery-plugin": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/gallery-plugin@5.14.1/index.module.js",
47
+ "@photo-sphere-viewer/markers-plugin": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/markers-plugin@5.14.1/index.module.js",
48
+ "@photo-sphere-viewer/compass-plugin": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/compass-plugin@5.14.1/index.module.js",
49
+ "@photo-sphere-viewer/virtual-tour-plugin": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/virtual-tour-plugin@5.14.1/index.module.js",
50
+ "geojson-vt": "https://cdn.jsdelivr.net/npm/geojson-vt@4.0.2/src/index.js",
51
+ "iconify-icon": "https://cdn.jsdelivr.net/npm/iconify-icon@3.0.2/dist/iconify-icon.mjs",
52
+ "json5": "https://cdn.jsdelivr.net/npm/json5@2.2.3/dist/index.min.mjs",
53
+ "lit": "https://cdn.jsdelivr.net/npm/lit@3.3.2/index.js",
54
+ "lit/": "https://cdn.jsdelivr.net/npm/lit@3.3.2/",
55
+ "lit-html": "https://cdn.jsdelivr.net/npm/lit-html@3.3.2/lit-html.js",
56
+ "lit-html/": "https://cdn.jsdelivr.net/npm/lit-html@3.3.2/",
57
+ "lit-element/": "https://cdn.jsdelivr.net/npm/lit-element@4.2.2/",
58
+ "maplibre-gl": "https://cdn.jsdelivr.net/npm/maplibre-gl@5.21.1/dist/maplibre-gl.js",
59
+ "pmtiles": "https://cdn.jsdelivr.net/npm/pmtiles@4.4.0/dist/esm/index.js",
60
+ "query-selector-shadow-dom": "https://cdn.jsdelivr.net/npm/query-selector-shadow-dom@1.0.0/dist/querySelectorShadowDom.js",
61
+ "@panoramax/web-viewer": "./src/index.js",
62
+ "@lit/reactive-element": "https://cdn.jsdelivr.net/npm/@lit/reactive-element@2.1.2/reactive-element.js",
63
+ "@mapbox/point-geometry": "https://cdn.jsdelivr.net/npm/@mapbox/point-geometry@1.1.0/index.js",
64
+ "fflate": "https://cdn.jsdelivr.net/npm/fflate@0.8.2/esm/browser.js",
65
+ "pbf": "https://cdn.jsdelivr.net/npm/pbf@4.0.1/index.js",
66
+ "three": "https://cdn.jsdelivr.net/npm/three@0.179.1/build/three.module.js"
67
+ }
68
+ }
69
+ </script>
70
+ <noscript>
71
+ You need to enable JavaScript to run this app.
72
+ </noscript>
73
+
74
+ <pnx-viewer
75
+ id="viewer"
76
+ class="fullpage"
77
+ endpoint="https://panoramax.openstreetmap.fr/api"
78
+ map-options='{
79
+ center: [-1.55958, 47.2135],
80
+ zoom: 19,
81
+ indoor: {
82
+ apiKey: "iek_yFQp8AMQpK78c8wPyAvbXY3ko6nh",
83
+ heatmap: false,
84
+ level: "2"
85
+ }
86
+ }'
87
+ ></pnx-viewer>
88
+
89
+ <script type="module" src="./index.js"></script>
90
+ </body>
91
+ </html>
package/build/widgets.html CHANGED
@@ -1 +1,410 @@
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 Widgets</title><style>body{font-family:sans-serif;padding-bottom:100px}h1,h2,nav,p{text-align:center}.test-bench{display:flex;width:100%;max-width:600px;margin:7px auto;justify-content:space-between;align-items:center}.test-bench h3{margin:0}hr.test-sep{width:100%;max-width:600px}</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><h1>Panoramax widgets</h1><p>Test page for common Panoramax viewer widgets</p><nav><a href="#button">Button</a> <a href="#link-button">Link Button</a> <a href="#copy-button">Copy button</a> <a href="#button-group">Button Group</a> <a href="#5stars">5-stars grade</a> <a href="#quality-score">Quality Score</a> <a href="#search-bar">Search bar</a> <a href="#progress-bar">Progress bar</a> <a href="#tabs">Tabs</a> <a href="#semantics-editor">Semantics Editor</a> <a href="#switch">Switch</a></nav><h2 id="button">Button</h2><div class="test-bench"><h3>Text + click</h3><pnx-button onclick='alert("Stuff")'>Click to do stuff</pnx-button></div><div class="test-bench"><h3>Icon</h3><pnx-button>⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Active</h3><pnx-button active="true">Settings</pnx-button></div><div class="test-bench"><h3>CSS override</h3><div style="width:50%;display:flex;gap:5px;max-width:300px"><pnx-button style="width:50%">⚙️ Settings</pnx-button><pnx-button style="width:50%">🖨️ Print</pnx-button></div></div><hr class="test-sep"/><div class="test-bench"><h3>Full</h3><pnx-button kind="full">⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Full active</h3><pnx-button kind="full" active>⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Full L</h3><pnx-button kind="full" size="l">⚙️</pnx-button></div><div class="test-bench"><h3>Full XXL</h3><pnx-button kind="full" size="xxl">⚙️</pnx-button></div><div class="test-bench"><h3>Outline</h3><pnx-button kind="outline">⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Outline active</h3><pnx-button kind="outline" active>⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Outline L</h3><pnx-button kind="outline" size="l">⚙️</pnx-button></div><div class="test-bench"><h3>Outline XXL</h3><pnx-button kind="outline" size="xxl">⚙️</pnx-button></div><div class="test-bench"><h3>Inline</h3><pnx-button kind="inline">⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Inline active</h3><pnx-button kind="inline" active>⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Inline L</h3><pnx-button kind="inline" size="l">⚙️</pnx-button></div><div class="test-bench"><h3>Inline XXL</h3><pnx-button kind="inline" size="xxl">⚙️</pnx-button></div><div class="test-bench"><h3>Superinline</h3><pnx-button kind="superinline">⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Superinline active</h3><pnx-button kind="superinline" active>⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Superinline L</h3><pnx-button kind="superinline" size="l">⚙️</pnx-button></div><div class="test-bench"><h3>Superinline XXL</h3><pnx-button kind="superinline" size="xxl">⚙️</pnx-button></div><div class="test-bench"><h3>Flat</h3><pnx-button kind="flat">⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Flat active</h3><pnx-button kind="flat" active>⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Flat L</h3><pnx-button kind="flat" size="l">⚙️</pnx-button></div><div class="test-bench"><h3>Flat XXL</h3><pnx-button kind="flat" size="xxl">⚙️</pnx-button></div><div class="test-bench"><h3>Superflat</h3><pnx-button kind="superflat">⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Superflat active</h3><pnx-button kind="superflat" active>⚙️ Settings</pnx-button></div><div class="test-bench"><h3>Superflat L</h3><pnx-button kind="superflat" size="l">⚙️</pnx-button></div><div class="test-bench"><h3>Superflat XXL</h3><pnx-button kind="superflat" size="xxl">⚙️</pnx-button></div><h2 id="link-button">Link Button</h2><div class="test-bench"><h3>None set</h3><pnx-link-button>Click for nothing</pnx-link-button></div><div class="test-bench"><h3>All set</h3><pnx-link-button target="_blank" href="https://panoramax.fr" title="Do stuff">Click to do stuff</pnx-link-button></div><h2 id="copy-button">Copy button</h2><div class="test-bench"><h3>Default + text</h3><pnx-copy-button text="copypasta1"></pnx-copy-button></div><div class="test-bench"><h3>Custom + text</h3><pnx-copy-button text="copypasta2">🌐 Share URL</pnx-copy-button></div><div class="test-bench"><h3>Default + input</h3><div style="display:flex;gap:5px;align-items:center"><input value="copypasta3" id="copy-input-1"/><pnx-copy-button input="copy-input-1"></pnx-copy-button></div></div><h2 id="button-group">Button Group</h2><div class="test-bench"><h3>Full Row x2</h3><div><pnx-button-group dir="row"><pnx-button>☹️</pnx-button><pnx-button>🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Full Row x3</h3><div><pnx-button-group dir="row"><pnx-button>☹️</pnx-button><pnx-button>😐</pnx-button><pnx-button>🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Full Row mixed</h3><div><pnx-button-group dir="row"><pnx-button>☹️</pnx-button><pnx-link-button>😐</pnx-link-button><pnx-copy-button>🙂</pnx-copy-button></pnx-button-group></div></div><div class="test-bench"><h3>Full Column x2</h3><div><pnx-button-group dir="column"><pnx-button>☹️</pnx-button><pnx-button>🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Full Column x3</h3><div><pnx-button-group dir="column"><pnx-button>☹️</pnx-button><pnx-button>😐</pnx-button><pnx-button>🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Full Column mixed</h3><div><pnx-button-group dir="column"><pnx-button>☹️</pnx-button><pnx-link-button>😐</pnx-link-button><pnx-copy-button>🙂</pnx-copy-button></pnx-button-group></div></div><hr class="test-sep"/><div class="test-bench"><h3>Outline Row x2</h3><div><pnx-button-group dir="row"><pnx-button kind="outline">☹️</pnx-button><pnx-button kind="outline">🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Outline Row x3</h3><div><pnx-button-group dir="row"><pnx-button kind="outline">☹️</pnx-button><pnx-button kind="outline">😐</pnx-button><pnx-button kind="outline">🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Outline Column x2</h3><div><pnx-button-group dir="column"><pnx-button kind="outline">☹️</pnx-button><pnx-button kind="outline">🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Outline Column x3</h3><div><pnx-button-group dir="column"><pnx-button kind="outline">☹️</pnx-button><pnx-button kind="outline">😐</pnx-button><pnx-button kind="outline">🙂</pnx-button></pnx-button-group></div></div><hr class="test-sep"/><div class="test-bench"><h3>Flat Row x2</h3><div><pnx-button-group dir="row"><pnx-button kind="flat">☹️</pnx-button><pnx-button kind="flat">🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Flat Row x3</h3><div><pnx-button-group dir="row"><pnx-button kind="flat">☹️</pnx-button><pnx-button kind="flat">😐</pnx-button><pnx-button kind="flat">🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Flat Column x2</h3><div><pnx-button-group dir="column"><pnx-button kind="flat">☹️</pnx-button><pnx-button kind="flat">🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Flat Column x3</h3><div><pnx-button-group dir="column"><pnx-button kind="flat">☹️</pnx-button><pnx-button kind="flat">😐</pnx-button><pnx-button kind="flat">🙂</pnx-button></pnx-button-group></div></div><hr class="test-sep"/><div class="test-bench"><h3>Row XL</h3><div><pnx-button-group size="xl" dir="row"><pnx-button kind="flat">☹️</pnx-button><pnx-button kind="flat">😐</pnx-button><pnx-button kind="flat">🙂</pnx-button></pnx-button-group></div></div><div class="test-bench"><h3>Column XL</h3><div><pnx-button-group size="xl" dir="column"><pnx-button kind="flat">☹️</pnx-button><pnx-button kind="flat">😐</pnx-button><pnx-button kind="flat">🙂</pnx-button></pnx-button-group></div></div><h2 id="5stars">5-stars grade</h2><div class="test-bench"><h3>With a grade</h3><pnx-grade stars="5"/></div><div class="test-bench"><h3>Without a grade</h3><pnx-grade/></div><h2 id="quality-score">Quality Score</h2><div class="test-bench"><h3>Classic no grade</h3><pnx-quality-score/></div><div class="test-bench"><h3>Classic 1/5</h3><pnx-quality-score grade="1"/></div><div class="test-bench"><h3>Classic 2/5</h3><pnx-quality-score grade="2"/></div><div class="test-bench"><h3>Classic 3/5</h3><pnx-quality-score grade="3"/></div><div class="test-bench"><h3>Classic 4/5</h3><pnx-quality-score grade="4"/></div><div class="test-bench"><h3>Classic 5/5</h3><pnx-quality-score grade="5"/></div><hr class="test-sep"/><div class="test-bench"><h3>Input</h3><pnx-quality-score input="qs"/></div><div class="test-bench"><h3>Input 1/5</h3><pnx-quality-score input="qs" grade="1"/></div><div class="test-bench"><h3>Input 2/5</h3><pnx-quality-score input="qs" grade="2"/></div><div class="test-bench"><h3>Input 3/5</h3><pnx-quality-score input="qs" grade="3"/></div><div class="test-bench"><h3>Input 4/5</h3><pnx-quality-score input="qs" grade="4"/></div><div class="test-bench"><h3>Input 5/5</h3><pnx-quality-score input="qs" grade="5"/></div><div class="test-bench"><h3>Input many</h3><pnx-quality-score input="qs" grade="1,3,5"/></div><h2 id="search-bar">Search bar</h2><div class="test-bench"><h3>Simple</h3><pnx-search-bar placeholder="Start your search"></pnx-search-bar></div><div class="test-bench"><h3>With pre</h3><pnx-search-bar placeholder="Look for a place"><span slot="pre">🗺️</span></pnx-search-bar></div><div class="test-bench"><h3>Reduced</h3><pnx-search-bar reduceable reduced placeholder="Look for a place"></pnx-search-bar></div><hr class="test-sep"/><div class="test-bench"><h3>Size md full</h3><pnx-search-bar size="md" placeholder="Look for a place"><span slot="pre">🗺️</span></pnx-search-bar></div><div class="test-bench"><h3>Size md reduced</h3><pnx-search-bar size="md" reduceable reduced placeholder="Look for a place"></pnx-search-bar></div><div class="test-bench"><h3>Size xxl full</h3><pnx-search-bar size="xxl" placeholder="Look for a place"><span slot="pre">🗺️</span></pnx-search-bar></div><div class="test-bench"><h3>Size xxl reduced</h3><pnx-search-bar size="xxl" reduceable reduced placeholder="Look for a place"></pnx-search-bar></div><h2 id="progress-bar">Progress bar</h2><div class="test-bench"><h3>Half</h3><pnx-progress-bar value="42"></pnx-progress-bar></div><div class="test-bench"><h3>Indeterminate</h3><pnx-progress-bar></pnx-progress-bar></div><div class="test-bench"><h3>Full</h3><pnx-progress-bar value="100"></pnx-progress-bar></div><h2 id="tabs">Tabs</h2><div class="test-bench"><h3>Many</h3><pnx-tabs><h4 slot="title">Tab 1</h4><div slot="content">Tab 1 content</div><h4 slot="title">Tab 2</h4><div slot="content">Tab 2 content</div><h4 slot="title">Tab 3</h4><div slot="content">Tab 3 content</div></pnx-tabs></div><h2 id="semantics-editor">Semantics editor</h2><script>window.addEventListener("load",(()=>{const e=document.getElementsByTagName("pnx-semantics-editor");for(let t=0;t<e.length;t++){const n=e[t];n.nextSibling;n.addEventListener("change",(e=>{console.log("Semantics change > evt =",e.detail,"| attr =",n.getAttribute("semantics"))}))}}))</script><div class="test-bench"><h3>Empty</h3><pnx-semantics-editor _t='{"pnx": {"semantics_editor_error": "La syntaxe est invalide. Vos attributs doivent avoir cette forme:\nclé=valeur\npréfixe|clé=valeur\npréfixe|clé[qualif_clé=qualif_val]=valeur\n\nLongueur max des clés : 256 caractères, max des valeurs 2048 caractères.","semantics_editor_example": "clé=valeur\npréfixe|clé=valeur"}}'></pnx-semantics-editor></div><div class="test-bench"><h3>Filled</h3><pnx-semantics-editor semantics="[{key: 'osm|traffic_sign', value: 'FR:A14b'}]"></pnx-semantics-editor></div><div class="test-bench"><h3>Many rows</h3><pnx-semantics-editor rows="5" semantics="[{key: 'osm|traffic_sign', value: 'FR:A14b'}]"></pnx-semantics-editor></div><div class="test-bench"><h3>Custom style</h3><style>#pnx-sem-ed3::part(text){color:#00f}</style><pnx-semantics-editor id="pnx-sem-ed3" semantics="[{key: 'osm|traffic_sign', value: 'FR:A14b'}]"></pnx-semantics-editor></div><h2 id="switch">Switch</h2><div class="test-bench"><h3>Classic</h3><pnx-switch name="sw1">Label text</pnx-switch></div><div class="test-bench"><h3>Switched</h3><pnx-switch name="sw2" checked="true">Label text</pnx-switch></div><div class="test-bench"><h3>Disabled</h3><pnx-switch name="sw3" disabled="true">Label text</pnx-switch></div><div class="test-bench"><h3>Switched disabled</h3><pnx-switch name="sw4" checked="true" disabled="true">Label text</pnx-switch></div><div class="test-bench"><h3>Icon switch</h3><pnx-icon-switch name="isw1"><span slot="icon-left">⏪</span> <span slot="label-left">Left</span> <span slot="icon-right">⏩</span> <span slot="label-right">Right</span></pnx-icon-switch></div></body></html>
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
6
+ <title>Panoramax Widgets</title>
7
+ <style>
8
+ body {
9
+ font-family: sans-serif;
10
+ padding-bottom: 100px;
11
+ }
12
+ h1, h2, p, nav { text-align: center; }
13
+ .test-bench {
14
+ display: flex;
15
+ width: 100%;
16
+ max-width: 600px;
17
+ margin: 7px auto;
18
+ justify-content: space-between;
19
+ align-items: center;
20
+ }
21
+ .test-bench h3 { margin: 0; }
22
+ hr.test-sep {
23
+ width: 100%;
24
+ max-width: 600px;
25
+ }
26
+ </style>
27
+
28
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/maplibre-gl@5.21.1/dist/maplibre-gl.css" />
29
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/core@5.14.1/index.css" />
30
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/virtual-tour-plugin@5.14.1/index.css" />
31
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/gallery-plugin@5.14.1/index.css" />
32
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/markers-plugin@5.14.1/index.css" />
33
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@fontsource/atkinson-hyperlegible-next/index.css" />
34
+ </head>
35
+ <body>
36
+ <script type="importmap">
37
+ {
38
+ "imports": {
39
+ "@fortawesome/fontawesome-svg-core": "https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-svg-core@6.7.2/index.mjs",
40
+ "@fortawesome/free-regular-svg-icons": "https://cdn.jsdelivr.net/npm/@fortawesome/free-regular-svg-icons@6.7.2/index.mjs",
41
+ "@fortawesome/free-solid-svg-icons": "https://cdn.jsdelivr.net/npm/@fortawesome/free-solid-svg-icons@6.7.2/index.mjs",
42
+ "@maplibre/vt-pbf": "https://cdn.jsdelivr.net/npm/@maplibre/vt-pbf@4.3.0/dist/index.es.js",
43
+ "@mapbox/vector-tile": "https://cdn.jsdelivr.net/npm/@mapbox/vector-tile@2.0.4/index.js",
44
+ "@photo-sphere-viewer/core": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/core@5.14.1/index.module.js",
45
+ "@photo-sphere-viewer/equirectangular-tiles-adapter": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/equirectangular-tiles-adapter@5.14.1/index.module.js",
46
+ "@photo-sphere-viewer/gallery-plugin": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/gallery-plugin@5.14.1/index.module.js",
47
+ "@photo-sphere-viewer/markers-plugin": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/markers-plugin@5.14.1/index.module.js",
48
+ "@photo-sphere-viewer/compass-plugin": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/compass-plugin@5.14.1/index.module.js",
49
+ "@photo-sphere-viewer/virtual-tour-plugin": "https://cdn.jsdelivr.net/npm/@photo-sphere-viewer/virtual-tour-plugin@5.14.1/index.module.js",
50
+ "geojson-vt": "https://cdn.jsdelivr.net/npm/geojson-vt@4.0.2/src/index.js",
51
+ "iconify-icon": "https://cdn.jsdelivr.net/npm/iconify-icon@3.0.2/dist/iconify-icon.mjs",
52
+ "json5": "https://cdn.jsdelivr.net/npm/json5@2.2.3/dist/index.min.mjs",
53
+ "lit": "https://cdn.jsdelivr.net/npm/lit@3.3.2/index.js",
54
+ "lit/": "https://cdn.jsdelivr.net/npm/lit@3.3.2/",
55
+ "lit-html": "https://cdn.jsdelivr.net/npm/lit-html@3.3.2/lit-html.js",
56
+ "lit-html/": "https://cdn.jsdelivr.net/npm/lit-html@3.3.2/",
57
+ "lit-element/": "https://cdn.jsdelivr.net/npm/lit-element@4.2.2/",
58
+ "maplibre-gl": "https://cdn.jsdelivr.net/npm/maplibre-gl@5.21.1/dist/maplibre-gl.js",
59
+ "pmtiles": "https://cdn.jsdelivr.net/npm/pmtiles@4.4.0/dist/esm/index.js",
60
+ "query-selector-shadow-dom": "https://cdn.jsdelivr.net/npm/query-selector-shadow-dom@1.0.0/dist/querySelectorShadowDom.js",
61
+ "@panoramax/web-viewer": "./src/index.js",
62
+ "@lit/reactive-element": "https://cdn.jsdelivr.net/npm/@lit/reactive-element@2.1.2/reactive-element.js",
63
+ "@mapbox/point-geometry": "https://cdn.jsdelivr.net/npm/@mapbox/point-geometry@1.1.0/index.js",
64
+ "fflate": "https://cdn.jsdelivr.net/npm/fflate@0.8.2/esm/browser.js",
65
+ "pbf": "https://cdn.jsdelivr.net/npm/pbf@4.0.1/index.js",
66
+ "three": "https://cdn.jsdelivr.net/npm/three@0.179.1/build/three.module.js"
67
+ }
68
+ }
69
+ </script>
70
+ <noscript>You need to enable JavaScript to run this app.</noscript>
71
+
72
+ <script type="module" src="./index.js"></script>
73
+
74
+ <h1>Panoramax widgets</h1>
75
+ <p>Test page for common Panoramax viewer widgets</p>
76
+ <nav>
77
+ <a href="#button">Button</a>
78
+ <a href="#link-button">Link Button</a>
79
+ <a href="#copy-button">Copy button</a>
80
+ <a href="#button-group">Button Group</a>
81
+ <a href="#5stars">5-stars grade</a>
82
+ <a href="#quality-score">Quality Score</a>
83
+ <a href="#search-bar">Search bar</a>
84
+ <a href="#progress-bar">Progress bar</a>
85
+ <a href="#tabs">Tabs</a>
86
+ <a href="#semantics-editor">Semantics Editor</a>
87
+ <a href="#switch">Switch</a>
88
+ </nav>
89
+
90
+ <h2 id="button">Button</h2>
91
+ <div class="test-bench"><h3>Text + click</h3><pnx-button onclick="alert('Stuff')">Click to do stuff</pnx-button></div>
92
+ <div class="test-bench"><h3>Icon</h3><pnx-button>⚙️ Settings</pnx-button></div>
93
+ <div class="test-bench"><h3>Active</h3><pnx-button active="true">Settings</pnx-button></div>
94
+ <div class="test-bench">
95
+ <h3>CSS override</h3>
96
+ <div style="width: 50%; display: flex; gap: 5px; max-width: 300px">
97
+ <pnx-button style="width: 50%;">⚙️ Settings</pnx-button>
98
+ <pnx-button style="width: 50%;">🖨️ Print</pnx-button>
99
+ </div>
100
+ </div>
101
+ <hr class="test-sep" />
102
+ <div class="test-bench"><h3>Full</h3><pnx-button kind="full">⚙️ Settings</pnx-button></div>
103
+ <div class="test-bench"><h3>Full active</h3><pnx-button kind="full" active>⚙️ Settings</pnx-button></div>
104
+ <div class="test-bench"><h3>Full L</h3><pnx-button kind="full" size="l">⚙️</pnx-button></div>
105
+ <div class="test-bench"><h3>Full XXL</h3><pnx-button kind="full" size="xxl">⚙️</pnx-button></div>
106
+ <div class="test-bench"><h3>Outline</h3><pnx-button kind="outline">⚙️ Settings</pnx-button></div>
107
+ <div class="test-bench"><h3>Outline active</h3><pnx-button kind="outline" active>⚙️ Settings</pnx-button></div>
108
+ <div class="test-bench"><h3>Outline L</h3><pnx-button kind="outline" size="l">⚙️</pnx-button></div>
109
+ <div class="test-bench"><h3>Outline XXL</h3><pnx-button kind="outline" size="xxl">⚙️</pnx-button></div>
110
+ <div class="test-bench"><h3>Inline</h3><pnx-button kind="inline">⚙️ Settings</pnx-button></div>
111
+ <div class="test-bench"><h3>Inline active</h3><pnx-button kind="inline" active>⚙️ Settings</pnx-button></div>
112
+ <div class="test-bench"><h3>Inline L</h3><pnx-button kind="inline" size="l">⚙️</pnx-button></div>
113
+ <div class="test-bench"><h3>Inline XXL</h3><pnx-button kind="inline" size="xxl">⚙️</pnx-button></div>
114
+ <div class="test-bench"><h3>Superinline</h3><pnx-button kind="superinline">⚙️ Settings</pnx-button></div>
115
+ <div class="test-bench"><h3>Superinline active</h3><pnx-button kind="superinline" active>⚙️ Settings</pnx-button></div>
116
+ <div class="test-bench"><h3>Superinline L</h3><pnx-button kind="superinline" size="l">⚙️</pnx-button></div>
117
+ <div class="test-bench"><h3>Superinline XXL</h3><pnx-button kind="superinline" size="xxl">⚙️</pnx-button></div>
118
+ <div class="test-bench"><h3>Flat</h3><pnx-button kind="flat">⚙️ Settings</pnx-button></div>
119
+ <div class="test-bench"><h3>Flat active</h3><pnx-button kind="flat" active>⚙️ Settings</pnx-button></div>
120
+ <div class="test-bench"><h3>Flat L</h3><pnx-button kind="flat" size="l">⚙️</pnx-button></div>
121
+ <div class="test-bench"><h3>Flat XXL</h3><pnx-button kind="flat" size="xxl">⚙️</pnx-button></div>
122
+ <div class="test-bench"><h3>Superflat</h3><pnx-button kind="superflat">⚙️ Settings</pnx-button></div>
123
+ <div class="test-bench"><h3>Superflat active</h3><pnx-button kind="superflat" active>⚙️ Settings</pnx-button></div>
124
+ <div class="test-bench"><h3>Superflat L</h3><pnx-button kind="superflat" size="l">⚙️</pnx-button></div>
125
+ <div class="test-bench"><h3>Superflat XXL</h3><pnx-button kind="superflat" size="xxl">⚙️</pnx-button></div>
126
+
127
+ <h2 id="link-button">Link Button</h2>
128
+ <div class="test-bench"><h3>None set</h3><pnx-link-button>Click for nothing</pnx-link-button></div>
129
+ <div class="test-bench"><h3>All set</h3><pnx-link-button target="_blank" href="https://panoramax.fr" title="Do stuff">Click to do stuff</pnx-link-button></div>
130
+
131
+ <h2 id="copy-button">Copy button</h2>
132
+ <div class="test-bench"><h3>Default + text</h3><pnx-copy-button text="copypasta1"></pnx-copy-button></div>
133
+ <div class="test-bench"><h3>Custom + text</h3><pnx-copy-button text="copypasta2">🌐 Share URL</pnx-copy-button></div>
134
+ <div class="test-bench">
135
+ <h3>Default + input</h3>
136
+ <div style="display: flex; gap: 5px; align-items: center;">
137
+ <input type="text" value="copypasta3" id="copy-input-1" />
138
+ <pnx-copy-button input="copy-input-1"></pnx-copy-button>
139
+ </div>
140
+ </div>
141
+
142
+ <h2 id="button-group">Button Group</h2>
143
+ <div class="test-bench">
144
+ <h3>Full Row x2</h3>
145
+ <div>
146
+ <pnx-button-group dir="row">
147
+ <pnx-button>☹️</pnx-button>
148
+ <pnx-button>🙂</pnx-button>
149
+ </pnx-button-group>
150
+ </div>
151
+ </div>
152
+ <div class="test-bench">
153
+ <h3>Full Row x3</h3>
154
+ <div>
155
+ <pnx-button-group dir="row">
156
+ <pnx-button>☹️</pnx-button>
157
+ <pnx-button>😐</pnx-button>
158
+ <pnx-button>🙂</pnx-button>
159
+ </pnx-button-group>
160
+ </div>
161
+ </div>
162
+ <div class="test-bench">
163
+ <h3>Full Row mixed</h3>
164
+ <div>
165
+ <pnx-button-group dir="row">
166
+ <pnx-button>☹️</pnx-button>
167
+ <pnx-link-button>😐</pnx-link-button>
168
+ <pnx-copy-button>🙂</pnx-copy-button>
169
+ </pnx-button-group>
170
+ </div>
171
+ </div>
172
+ <div class="test-bench">
173
+ <h3>Full Column x2</h3>
174
+ <div>
175
+ <pnx-button-group dir="column">
176
+ <pnx-button>☹️</pnx-button>
177
+ <pnx-button>🙂</pnx-button>
178
+ </pnx-button-group>
179
+ </div>
180
+ </div>
181
+ <div class="test-bench">
182
+ <h3>Full Column x3</h3>
183
+ <div>
184
+ <pnx-button-group dir="column">
185
+ <pnx-button>☹️</pnx-button>
186
+ <pnx-button>😐</pnx-button>
187
+ <pnx-button>🙂</pnx-button>
188
+ </pnx-button-group>
189
+ </div>
190
+ </div>
191
+ <div class="test-bench">
192
+ <h3>Full Column mixed</h3>
193
+ <div>
194
+ <pnx-button-group dir="column">
195
+ <pnx-button>☹️</pnx-button>
196
+ <pnx-link-button>😐</pnx-link-button>
197
+ <pnx-copy-button>🙂</pnx-copy-button>
198
+ </pnx-button-group>
199
+ </div>
200
+ </div>
201
+ <hr class="test-sep" />
202
+ <div class="test-bench">
203
+ <h3>Outline Row x2</h3>
204
+ <div>
205
+ <pnx-button-group dir="row">
206
+ <pnx-button kind="outline">☹️</pnx-button>
207
+ <pnx-button kind="outline">🙂</pnx-button>
208
+ </pnx-button-group>
209
+ </div>
210
+ </div>
211
+ <div class="test-bench">
212
+ <h3>Outline Row x3</h3>
213
+ <div>
214
+ <pnx-button-group dir="row">
215
+ <pnx-button kind="outline">☹️</pnx-button>
216
+ <pnx-button kind="outline">😐</pnx-button>
217
+ <pnx-button kind="outline">🙂</pnx-button>
218
+ </pnx-button-group>
219
+ </div>
220
+ </div>
221
+ <div class="test-bench">
222
+ <h3>Outline Column x2</h3>
223
+ <div>
224
+ <pnx-button-group dir="column">
225
+ <pnx-button kind="outline">☹️</pnx-button>
226
+ <pnx-button kind="outline">🙂</pnx-button>
227
+ </pnx-button-group>
228
+ </div>
229
+ </div>
230
+ <div class="test-bench">
231
+ <h3>Outline Column x3</h3>
232
+ <div>
233
+ <pnx-button-group dir="column">
234
+ <pnx-button kind="outline">☹️</pnx-button>
235
+ <pnx-button kind="outline">😐</pnx-button>
236
+ <pnx-button kind="outline">🙂</pnx-button>
237
+ </pnx-button-group>
238
+ </div>
239
+ </div>
240
+ <hr class="test-sep" />
241
+ <div class="test-bench">
242
+ <h3>Flat Row x2</h3>
243
+ <div>
244
+ <pnx-button-group dir="row">
245
+ <pnx-button kind="flat">☹️</pnx-button>
246
+ <pnx-button kind="flat">🙂</pnx-button>
247
+ </pnx-button-group>
248
+ </div>
249
+ </div>
250
+ <div class="test-bench">
251
+ <h3>Flat Row x3</h3>
252
+ <div>
253
+ <pnx-button-group dir="row">
254
+ <pnx-button kind="flat">☹️</pnx-button>
255
+ <pnx-button kind="flat">😐</pnx-button>
256
+ <pnx-button kind="flat">🙂</pnx-button>
257
+ </pnx-button-group>
258
+ </div>
259
+ </div>
260
+ <div class="test-bench">
261
+ <h3>Flat Column x2</h3>
262
+ <div>
263
+ <pnx-button-group dir="column">
264
+ <pnx-button kind="flat">☹️</pnx-button>
265
+ <pnx-button kind="flat">🙂</pnx-button>
266
+ </pnx-button-group>
267
+ </div>
268
+ </div>
269
+ <div class="test-bench">
270
+ <h3>Flat Column x3</h3>
271
+ <div>
272
+ <pnx-button-group dir="column">
273
+ <pnx-button kind="flat">☹️</pnx-button>
274
+ <pnx-button kind="flat">😐</pnx-button>
275
+ <pnx-button kind="flat">🙂</pnx-button>
276
+ </pnx-button-group>
277
+ </div>
278
+ </div>
279
+ <hr class="test-sep" />
280
+ <div class="test-bench">
281
+ <h3>Row XL</h3>
282
+ <div>
283
+ <pnx-button-group size="xl" dir="row">
284
+ <pnx-button kind="flat">☹️</pnx-button>
285
+ <pnx-button kind="flat">😐</pnx-button>
286
+ <pnx-button kind="flat">🙂</pnx-button>
287
+ </pnx-button-group>
288
+ </div>
289
+ </div>
290
+ <div class="test-bench">
291
+ <h3>Column XL</h3>
292
+ <div>
293
+ <pnx-button-group size="xl" dir="column">
294
+ <pnx-button kind="flat">☹️</pnx-button>
295
+ <pnx-button kind="flat">😐</pnx-button>
296
+ <pnx-button kind="flat">🙂</pnx-button>
297
+ </pnx-button-group>
298
+ </div>
299
+ </div>
300
+
301
+ <h2 id="5stars">5-stars grade</h2>
302
+ <div class="test-bench"><h3>With a grade</h3><pnx-grade stars="5" /></div>
303
+ <div class="test-bench"><h3>Without a grade</h3><pnx-grade /></div>
304
+
305
+ <h2 id="quality-score">Quality Score</h2>
306
+ <div class="test-bench"><h3>Classic no grade</h3><pnx-quality-score /></div>
307
+ <div class="test-bench"><h3>Classic 1/5</h3><pnx-quality-score grade="1" /></div>
308
+ <div class="test-bench"><h3>Classic 2/5</h3><pnx-quality-score grade="2" /></div>
309
+ <div class="test-bench"><h3>Classic 3/5</h3><pnx-quality-score grade="3" /></div>
310
+ <div class="test-bench"><h3>Classic 4/5</h3><pnx-quality-score grade="4" /></div>
311
+ <div class="test-bench"><h3>Classic 5/5</h3><pnx-quality-score grade="5" /></div>
312
+ <hr class="test-sep" />
313
+ <div class="test-bench"><h3>Input</h3><pnx-quality-score input="qs" /></div>
314
+ <div class="test-bench"><h3>Input 1/5</h3><pnx-quality-score input="qs" grade="1" /></div>
315
+ <div class="test-bench"><h3>Input 2/5</h3><pnx-quality-score input="qs" grade="2" /></div>
316
+ <div class="test-bench"><h3>Input 3/5</h3><pnx-quality-score input="qs" grade="3" /></div>
317
+ <div class="test-bench"><h3>Input 4/5</h3><pnx-quality-score input="qs" grade="4" /></div>
318
+ <div class="test-bench"><h3>Input 5/5</h3><pnx-quality-score input="qs" grade="5" /></div>
319
+ <div class="test-bench"><h3>Input many</h3><pnx-quality-score input="qs" grade="1,3,5" /></div>
320
+
321
+ <h2 id="search-bar">Search bar</h2>
322
+ <div class="test-bench"><h3>Simple</h3><pnx-search-bar placeholder="Start your search"></pnx-search-bar></div>
323
+ <div class="test-bench"><h3>With pre</h3><pnx-search-bar placeholder="Look for a place"><span slot="pre">🗺️</span></pnx-search-bar></div>
324
+ <div class="test-bench">
325
+ <h3>Reduced</h3>
326
+ <pnx-search-bar reduceable reduced placeholder="Look for a place"></pnx-search-bar>
327
+ </div>
328
+ <hr class="test-sep" />
329
+ <div class="test-bench"><h3>Size md full</h3><pnx-search-bar size="md" placeholder="Look for a place"><span slot="pre">🗺️</span></pnx-search-bar></div>
330
+ <div class="test-bench"><h3>Size md reduced</h3><pnx-search-bar size="md" reduceable reduced placeholder="Look for a place"></pnx-search-bar></div>
331
+ <div class="test-bench"><h3>Size xxl full</h3><pnx-search-bar size="xxl" placeholder="Look for a place"><span slot="pre">🗺️</span></pnx-search-bar></div>
332
+ <div class="test-bench"><h3>Size xxl reduced</h3><pnx-search-bar size="xxl" reduceable reduced placeholder="Look for a place"></pnx-search-bar></div>
333
+
334
+ <h2 id="progress-bar">Progress bar</h2>
335
+ <div class="test-bench"><h3>Half</h3><pnx-progress-bar value="42"></pnx-progress-bar></div>
336
+ <div class="test-bench"><h3>Indeterminate</h3><pnx-progress-bar></pnx-progress-bar></div>
337
+ <div class="test-bench"><h3>Full</h3><pnx-progress-bar value="100"></pnx-progress-bar></div>
338
+
339
+ <h2 id="tabs">Tabs</h2>
340
+ <div class="test-bench">
341
+ <h3>Many</h3>
342
+ <pnx-tabs>
343
+ <h4 slot="title">Tab 1</h4>
344
+ <div slot="content">Tab 1 content</div>
345
+ <h4 slot="title">Tab 2</h4>
346
+ <div slot="content">Tab 2 content</div>
347
+ <h4 slot="title">Tab 3</h4>
348
+ <div slot="content">Tab 3 content</div>
349
+ </pnx-tabs>
350
+ </div>
351
+
352
+ <h2 id="semantics-editor">Semantics editor</h2>
353
+ <script>
354
+ window.addEventListener("load", () => {
355
+ const semeditors = document.getElementsByTagName("pnx-semantics-editor");
356
+ for(let i=0; i < semeditors.length; i++) {
357
+ const semeditor = semeditors[i];
358
+ const div = semeditor.nextSibling;
359
+ semeditor.addEventListener("change", e => {
360
+ console.log("Semantics change > evt =", e.detail, "| attr =", semeditor.getAttribute("semantics"));
361
+ });
362
+ }
363
+ });
364
+ </script>
365
+ <div class="test-bench">
366
+ <h3>Empty</h3>
367
+ <pnx-semantics-editor _t='{"pnx": {"semantics_editor_error": "La syntaxe est invalide. Vos attributs doivent avoir cette forme:\nclé=valeur\npréfixe|clé=valeur\npréfixe|clé[qualif_clé=qualif_val]=valeur\n\nLongueur max des clés : 256 caractères, max des valeurs 2048 caractères.","semantics_editor_example": "clé=valeur\npréfixe|clé=valeur"}}'></pnx-semantics-editor>
368
+ </div>
369
+ <div class="test-bench">
370
+ <h3>Filled</h3>
371
+ <pnx-semantics-editor semantics="[{key: 'osm|traffic_sign', value: 'FR:A14b'}]"></pnx-semantics-editor>
372
+ </div>
373
+ <div class="test-bench">
374
+ <h3>Many rows</h3>
375
+ <pnx-semantics-editor rows="5" semantics="[{key: 'osm|traffic_sign', value: 'FR:A14b'}]"></pnx-semantics-editor>
376
+ </div>
377
+ <div class="test-bench">
378
+ <h3>Custom style</h3>
379
+ <style>#pnx-sem-ed3::part(text) { color: blue; }</style>
380
+ <pnx-semantics-editor id="pnx-sem-ed3" semantics="[{key: 'osm|traffic_sign', value: 'FR:A14b'}]"></pnx-semantics-editor>
381
+ </div>
382
+
383
+ <h2 id="switch">Switch</h2>
384
+ <div class="test-bench">
385
+ <h3>Classic</h3>
386
+ <pnx-switch name="sw1">Label text</pnx-switch>
387
+ </div>
388
+ <div class="test-bench">
389
+ <h3>Switched</h3>
390
+ <pnx-switch name="sw2" checked="true">Label text</pnx-switch>
391
+ </div>
392
+ <div class="test-bench">
393
+ <h3>Disabled</h3>
394
+ <pnx-switch name="sw3" disabled="true">Label text</pnx-switch>
395
+ </div>
396
+ <div class="test-bench">
397
+ <h3>Switched disabled</h3>
398
+ <pnx-switch name="sw4" checked="true" disabled="true">Label text</pnx-switch>
399
+ </div>
400
+ <div class="test-bench">
401
+ <h3>Icon switch</h3>
402
+ <pnx-icon-switch name="isw1">
403
+ <span slot="icon-left">⏪</span>
404
+ <span slot="label-left">Left</span>
405
+ <span slot="icon-right">⏩</span>
406
+ <span slot="label-right">Right</span>
407
+ </pnx-icon-switch>
408
+ </div>
409
+ </body>
410
+ </html>