@geops/rvf-mobility-web-component 0.1.30 → 0.1.32

package/CHANGELOG.md

@@ -2,6 +2,32 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.32](https://github.com/geops/rvf-mobility-web-component/compare/v0.1.31...v0.1.32) (2025-02-20)
+
+
+### Bug Fixes
+
+* remove default border and add documentation ([8291492](https://github.com/geops/rvf-mobility-web-component/commit/82914928dd2cbe2150d32f1a9cc4f4e82ffa3f9c))
+
+### [0.1.31](https://github.com/geops/rvf-mobility-web-component/compare/v0.1.30...v0.1.31) (2025-02-19)
+
+
+### Features
+
+* add line network details view ([038082f](https://github.com/geops/rvf-mobility-web-component/commit/038082fec96a2b5b0a705556c742252d5c239d28))
+* add notifications details ([b37e9e2](https://github.com/geops/rvf-mobility-web-component/commit/b37e9e29194664445558864bd36c0280855f8de9))
+* add notifications details ([dfa3c10](https://github.com/geops/rvf-mobility-web-component/commit/dfa3c10c8493d195a909b42537fb1eef456b62aa))
+
+
+### Bug Fixes
+
+* add border radius ([19b0293](https://github.com/geops/rvf-mobility-web-component/commit/19b0293af213c7ccce043c5685323578e844d8ab))
+* add border radius ([042d2b9](https://github.com/geops/rvf-mobility-web-component/commit/042d2b97f8f10d2ebcdd4244459b174aaa31a916))
+* add border radius ([b5ca9d2](https://github.com/geops/rvf-mobility-web-component/commit/b5ca9d2ba77e78d74e38376d885c163944c62043))
+* improve documentation ([7b1f39b](https://github.com/geops/rvf-mobility-web-component/commit/7b1f39b2dc33e6d3ee7b20379b7da2a323874e51))
+* improve documentation ([d06619d](https://github.com/geops/rvf-mobility-web-component/commit/d06619d9a060fbdba3b6f1c874f5e95ae4ee3119))
+* re add preview ([b994540](https://github.com/geops/rvf-mobility-web-component/commit/b994540bb51a9e593242e3c9cefaf90ffa628246))
+
 ### [0.1.30](https://github.com/geops/rvf-mobility-web-component/compare/v0.1.29...v0.1.30) (2025-02-18)
 
 

package/docutils.js

@@ -63,6 +63,7 @@ function generateAttributesTable(
   wc,
   attrs,
   booleanAttrs = [],
+  booleanTrueByDefault = [],
   descriptionByAttr = {},
 ) {
   let innerHMTL = `<table class="table-auto w-full" >
@@ -79,6 +80,14 @@ function generateAttributesTable(
     .sort()
     .map((key) => {
       const isBoolean = booleanAttrs.includes(key);
+      const defaultChecked = booleanTrueByDefault.includes(key)
+        ? "checked"
+        : "";
+      const currValue = wc.getAttribute(key);
+      let checked = currValue === "true" ? "checked" : "";
+      if (currValue !== "true" && currValue !== "false") {
+        checked = defaultChecked;
+      }
       return `
     <tr>
       <td class="border px-4 py-2">${key}</td>
@@ -92,7 +101,7 @@ function generateAttributesTable(
           type="checkbox"
           class="border"
           name="${key}"
-          ${wc.getAttribute(key) === "true" ? "checked" : ""}
+          ${checked ? "checked" : ""}
           onchange="document.querySelector('${wc.localName}').setAttribute('${key}', this.checked);onAttributeUpdate(document.querySelector('${wc.localName}'),this.name, this.checked);" 
           />`
           : `
@@ -126,7 +135,7 @@ function generateCodeText(
   let codeText = "";
   codeText = `&lt;script\n\ttype="module"\n\tsrc="${pkgSrc}"&gt;
 &lt;/script&gt;
-&lt;${wc.localName} style="display:block;width:100%;height:500px;"`;
+&lt;${wc.localName} style="display:block;width:100%;height:500px;border:1px solid #e5e7eb;border-radius:16px;"`;
 
   attrs.forEach((key) => {
     const attributeValue = wc.getAttribute(key);

package/index.html

@@ -38,10 +38,10 @@
       <h1 class="flex gap-4"><img src="./Logo.svg">Mobility Web Component</h1>
       <p>This is a demo of the Mobility Web Component.</p>
       <h2>Usage example</h2>
-      <pre id="code" class="bg-slate-800 text-slate-200 p-4 rounded"></pre>
+      <pre id="code" class="bg-slate-800 text-slate-200 p-4 rounded overflow-auto"></pre>
 
       <geops-mobility
-        class="h-96 block resize overflow-auto w-full"
+        class="h-96 block resize overflow-hidden w-full border rounded-[16px]"
       ></geops-mobility>
 
       <br />
@@ -67,11 +67,13 @@
       const attrs = [
           // "apikey",
           // "baselayer",
-          // "center",
+          "center",
           "details",
-          // "geolocation",
+          "extent",
+          "geolocation",
           "layers",
           "layertree",
+          "maxextent",
           // "mapsurl",
           // "mots",
           // "notification",
@@ -81,11 +83,13 @@
           "realtime",
           "share",
           // "realtimeUrl",
-          "search",
+          // "search",
           // "tenant",
-          // "zoom",
+          "zoom",
           "permalink",
-          "print"
+          "print",
+          "toolbar",
+          "maxextent",
         ];
 
       const booleanAttrs = [
@@ -93,12 +97,14 @@
         "geolocation",
         "notification",
         "realtime",
-        "search",
+        // "search",
         "permalink",
         "layertree",
         "share",
-        "print"
+        "print",
+        "toolbar",
       ];
+      const booleanTrueByDefault = [ "details", "print", "share", "layertree", "geolocation", "toolbar", "realtime"];
 
       const events = [
         "singleclick",
@@ -107,11 +113,23 @@
       ];
 
       const descriptionByAttr = {
+        extent: "The extent to show when opening the map in EPSG:3857 coordinates, ex: 831634,5933959,940649,6173660. Default is the RVF data extent: 834896.1809495519,6057089.852937808,940649.6972031617,6173660.451962929 . Parameter required if center and zoom are not set.",
+        maxextent: "The maximum extent of the map in EPSG:3857 coordinates, ex: 831634,5933959,940649,6173660. Default is the RVF data extent: [834896.1809495519,6057089.852937808,940649.6972031617,6173660.451962929 .",
+        search: "Show/hide the search bar on the map. Default to false.",
+        permalink: "Add/remove url paremeters to the current window location. These parameters are used to store the current state of the map. They will be used on page load to configure the web-compnent. Default to false. Parameter required if extent is not set.",
+        center: "The center of the map in EPSG:3857 coordinates, ex: 831634,5933959. The center must be inside the RVF extent: [834896.1809495519, 6057089.852937808, 940649.6972031617, 6173660.451962929]. Default to null. Parameter required if extent is not set.",
+        zoom: "The zoom level of the map (between 0 and 20). Default to null. If maxextent paramter is defined some values will not have any effects because the view will be constraint to the maxextent defined. Parameter required if extent is not set.",
+        print: "Show/hide the print button in the toolbar. Default to true.",
+        share: "Show/hide the share button in the toolbar. Default to true.",
+        layertree: "Show/hide the layer tree button in the toolbar. Default to true.",
+        geolocation: "Show/hide geolocation button on the map. Default to true.",
+        toolbar: "Show/hide the toolbar on the left. Default to true.",
         layers: "A comma separated list of layers: echtzeit,haltestellen,verkaufsstellen,liniennetz,tarifzonen,fahrrad,auto,cargobike,e-roller,mitfahrpunkt,pois",
         details: "Show shared mobility details in the sidebar when we click on an shared mobility feature.", 
+        realtime: "Show/hide the realtime data in the map. Default to true."
       };
 
-      document.querySelector('#attributes').innerHTML = generateAttributesTable(wc, attrs, booleanAttrs, descriptionByAttr);
+      document.querySelector('#attributes').innerHTML = generateAttributesTable(wc, attrs, booleanAttrs, booleanTrueByDefault, descriptionByAttr);
       document.querySelector('#events').innerHTML = generateEventsTable(wc, events);
       document.querySelector('#code').innerHTML = generateCodeText(wc, attrs, pkgSrc);
       wc.addEventListener('mwc:attribute', (event) => {