@ulb-darmstadt/shacl-form
Version:
SHACL form generator
17 lines • 10.8 kB
JavaScript
import{a as e,i as t,n,o as r,r as i,t as a}from"./assets/property-template-c2vtkOt_.js";import*as o from"leaflet";import"leaflet-editable/src/Leaflet.Editable.js";import s from"leaflet/dist/leaflet.css?raw";import c from"leaflet.fullscreen/Control.FullScreen.css?raw";import"leaflet.fullscreen/Control.FullScreen.js";import{Literal as l}from"n3";function u(r,o,s){if(s){let s=a(r)>0;if(r.class&&!r.hasValue)return r.config.theme.createListEditor(r.label,o,s,i(r.class,r),r);if(r.in){let e=r.config.lists[r.in];if(e?.length){let t=n(e,r.config.store,r.config.languages);return r.config.theme.createListEditor(r.label,o,s,t,r)}else console.error(`list not found:`,r.in,`existing lists:`,r.config.lists)}if(r.datatype?.equals(e)||r.languageIn?.length||r.datatype===void 0&&o instanceof l&&o.language)return r.config.theme.createLangStringEditor(r.label,o,s,r);switch(r.datatype?.value.replace(t,``)){case`integer`:case`float`:case`double`:case`decimal`:return r.config.theme.createNumberEditor(r.label,o,s,r);case`date`:case`dateTime`:return r.config.theme.createDateEditor(r.label,o,s,r);case`boolean`:return r.config.theme.createBooleanEditor(r.label,o,s,r);case`base64Binary`:return r.config.theme.createFileEditor(r.label,o,s,r)}return r.config.theme.createTextEditor(r.label,o,s,r)}else return o?r.config.theme.createViewer(r.label,o,r):document.createElement(`div`)}var d=`
#shaclMapDialog .closeButton { position: absolute; right: 0; top: 0; z-index: 1; padding: 6px 8px; cursor: pointer; border: 0; background-color: #FFFA; font-size: 24px; z-index: 1000; }
#shaclMapDialog { padding: 0; width:90vw; height: 90vh; margin: auto; }
#shaclMapDialog::backdrop { background-color: #0007; }
#shaclMapDialog .closeButton:hover { background-color: #FFF }
#shaclMapDialog .hint { position: absolute; right: 60px; top: 3px; z-index: 1; padding: 4px 6px; background-color: #FFFA; border-radius: 4px; z-index: 1000; pointer-events: none; }
.leaflet-container { min-height: 300px; }
.fullscreen-icon { background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjYgNTIiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTIwLjYgMzYuN0gxNmEuOS45IDAgMCAxLS44LS44di00LjVjMC0uMi4yLS40LjQtLjRoMS40Yy4zIDAgLjUuMi41LjR2M2gzYy4yIDAgLjQuMi40LjV2MS40YzAgLjItLjIuNC0uNC40em0tOS45LS44di00LjVjMC0uMi0uMi0uNC0uNC0uNEg4LjljLS4zIDAtLjUuMi0uNS40djNoLTNjLS4yIDAtLjQuMi0uNC41djEuNGMwIC4yLjIuNC40LjRIMTBjLjQgMCAuOC0uNC44LS44em0wIDEwLjdWNDJjMC0uNC0uNC0uOC0uOC0uOEg1LjRjLS4yIDAtLjQuMi0uNC40djEuNGMwIC4zLjIuNS40LjVoM3YzYzAgLjIuMi40LjUuNGgxLjRjLjIgMCAuNC0uMi40LS40em02LjkgMHYtM2gzYy4yIDAgLjQtLjIuNC0uNXYtMS40YzAtLjItLjItLjQtLjQtLjRIMTZjLS40IDAtLjguNC0uOC44djQuNWMwIC4yLjIuNC40LjRoMS40Yy4zIDAgLjUtLjIuNS0uNHpNNSAxMC4zVjUuOWMwLS41LjQtLjkuOS0uOWg0LjRjLjIgMCAuNC4yLjQuNFY3YzAgLjItLjIuNC0uNC40aC0zdjNjMCAuMi0uMi40LS40LjRINS40YS40LjQgMCAwIDEtLjQtLjR6bTEwLjMtNC45VjdjMCAuMi4yLjQuNC40aDN2M2MwIC4yLjIuNC40LjRoMS41Yy4yIDAgLjQtLjIuNC0uNFY1LjljMC0uNS0uNC0uOS0uOS0uOWgtNC40Yy0uMiAwLS40LjItLjQuNHptNS4zIDkuOUgxOWMtLjIgMC0uNC4yLS40LjR2M2gtM2MtLjIgMC0uNC4yLS40LjR2MS41YzAgLjIuMi40LjQuNGg0LjRjLjUgMCAuOS0uNC45LS45di00LjRjMC0uMi0uMi0uNC0uNC0uNHptLTkuOSA1LjNWMTljMC0uMi0uMi0uNC0uNC0uNGgtM3YtM2MwLS4yLS4yLS40LS40LS40SDUuNGMtLjIgMC0uNC4yLS40LjR2NC40YzAgLjUuNC45LjkuOWg0LjRjLjIgMCAuNC0uMi40LS40eiIgZmlsbD0iY3VycmVudENvbG9yIi8+PC9zdmc+); }
#shaclMapDialogContainer { width:100%; height: 100%; }
`,f=`
<dialog id="shaclMapDialog" onclick="event.target==this && this.close()">
<div id="shaclMapDialogContainer"></div>
<div class="hint">ⓘ Draw a polygon or marker, then close dialog</div>
<button class="closeButton" type="button" onclick="this.parentElement.close()">✕</button>
</dialog>`,p={lng:8.657238961696038,lat:49.87627570549512},m=`© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>`,h=`https://tile.openstreetmap.de/{z}/{x}/{y}.png`,g=o.icon({iconUrl:`data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAApCAYAAADAk4LOAAAFgUlEQVR4Aa1XA5BjWRTN2oW17d3YaZtr2962HUzbDNpjszW24mRt28p47v7zq/bXZtrp/lWnXr337j3nPCe85NcypgSFdugCpW5YoDAMRaIMqRi6aKq5E3YqDQO3qAwjVWrD8Ncq/RBpykd8oZUb/kaJutow8r1aP9II0WmLKLIsJyv1w/kqw9Ch2MYdB++12Onxee/QMwvf4/Dk/Lfp/i4nxTXtOoQ4pW5Aj7wpici1A9erdAN2OH64x8OSP9j3Ft3b7aWkTg/Fm91siTra0f9on5sQr9INejH6CUUUpavjFNq1B+Oadhxmnfa8RfEmN8VNAsQhPqF55xHkMzz3jSmChWU6f7/XZKNH+9+hBLOHYozuKQPxyMPUKkrX/K0uWnfFaJGS1QPRtZsOPtr3NsW0uyh6NNCOkU3Yz+bXbT3I8G3xE5EXLXtCXbbqwCO9zPQYPRTZ5vIDXD7U+w7rFDEoUUf7ibHIR4y6bLVPXrz8JVZEql13trxwue/uDivd3fkWRbS6/IA2bID4uk0UpF1N8qLlbBlXs4Ee7HLTfV1j54APvODnSfOWBqtKVvjgLKzF5YdEk5ewRkGlK0i33Eofffc7HT56jD7/6U+qH3Cx7SBLNntH5YIPvODnyfIXZYRVDPqgHtLs5ABHD3YzLuespb7t79FY34DjMwrVrcTuwlT55YMPvOBnRrJ4VXTdNnYug5ucHLBjEpt30701A3Ts+HEa73u6dT3FNWwflY86eMHPk+Yu+i6pzUpRrW7SNDg5JHR4KapmM5Wv2E8Tfcb1HoqqHMHU+uWDD7zg54mz5/2BSnizi9T1Dg4QQXLToGNCkb6tb1NU+QAlGr1++eADrzhn/u8Q2YZhQVlZ5+CAOtqfbhmaUCS1ezNFVm2imDbPmPng5wmz+gwh+oHDce0eUtQ6OGDIyR0uUhUsoO3vfDmmgOezH0mZN59x7MBi++WDL1g/eEiU3avlidO671bkLfwbw5XV2P8Pzo0ydy4t2/0eu33xYSOMOD8hTf4CrBtGMSoXfPLchX+J0ruSePw3LZeK0juPJbYzrhkH0io7B3k164hiGvawhOKMLkrQLyVpZg8rHFW7E2uHOL888IBPlNZ1FPzstSJM694fWr6RwpvcJK60+0HCILTBzZLFNdtAzJaohze60T8qBzyh5ZuOg5e7uwQppofEmf2++DYvmySqGBuKaicF1blQjhuHdvCIMvp8whTTfZzI7RldpwtSzL+F1+wkdZ2TBOW2gIF88PBTzD/gpeREAMEbxnJcaJHNHrpzji0gQCS6hdkEeYt9DF/2qPcEC8RM28Hwmr3sdNyht00byAut2k3gufWNtgtOEOFGUwcXWNDbdNbpgBGxEvKkOQsxivJx33iow0Vw5S6SVTrpVq11ysA2Rp7gTfPfktc6zhtXBBC+adRLshf6sG2RfHPZ5EAc4sVZ83yCN00Fk/4kggu40ZTvIEm5g24qtU4KjBrx/BTTH8ifVASAG7gKrnWxJDcU7x8X6Ecczhm3o6YicvsLXWfh3Ch1W0k8x0nXF+0fFxgt4phz8QvypiwCCFKMqXCnqXExjq10beH+UUA7+nG6mdG/Pu0f3LgFcGrl2s0kNNjpmoJ9o4B29CMO8dMT4Q5ox8uitF6fqsrJOr8qnwNbRzv6hSnG5wP+64C7h9lp30hKNtKdWjtdkbuPA19nJ7Tz3zR/ibgARbhb4AlhavcBebmTHcFl2fvYEnW0ox9xMxKBS8btJ+KiEbq9zA4RthQXDhPa0T9TEe69gWupwc6uBUphquXgf+/FrIjweHQS4/pduMe5ERUMHUd9xv8ZR98CxkS4F2n3EUrUZ10EYNw7BWm9x1GiPssi3GgiGRDKWRYZfXlON+dfNbM+GgIwYdwAAAAASUVORK5CYII=`,shadowUrl:`data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACkAAAApCAQAAAACach9AAACMUlEQVR4Ae3ShY7jQBAE0Aoz/f9/HTMzhg1zrdKUrJbdx+Kd2nD8VNudfsL/Th///dyQN2TH6f3y/BGpC379rV+S+qqetBOxImNQXL8JCAr2V4iMQXHGNJxeCfZXhSRBcQMfvkOWUdtfzlLgAENmZDcmo2TVmt8OSM2eXxBp3DjHSMFutqS7SbmemzBiR+xpKCNUIRkdkkYxhAkyGoBvyQFEJEefwSmmvBfJuJ6aKqKWnAkvGZOaZXTUgFqYULWNSHUckZuR1HIIimUExutRxwzOLROIG4vKmCKQt364mIlhSyzAf1m9lHZHJZrlAOMMztRRiKimp/rpdJDc9Awry5xTZCte7FHtuS8wJgeYGrex28xNTd086Dik7vUMscQOa8y4DoGtCCSkAKlNwpgNtphjrC6MIHUkR6YWxxs6Sc5xqn222mmCRFzIt8lEdKx+ikCtg91qS2WpwVfBelJCiQJwvzixfI9cxZQWgiSJelKnwBElKYtDOb2MFbhmUigbReQBV0Cg4+qMXSxXSyGUn4UbF8l+7qdSGnTC0XLCmahIgUHLhLOhpVCtw4CzYXvLQWQbJNmxoCsOKAxSgBJno75avolkRw8iIAFcsdc02e9iyCd8tHwmeSSoKTowIgvscSGZUOA7PuCN5b2BX9mQM7S0wYhMNU74zgsPBj3HU7wguAfnxxjFQGBE6pwN+GjME9zHY7zGp8wVxMShYX9NXvEWD3HbwJf4giO4CFIQxXScH1/TM+04kkBiAAAAAElFTkSuQmCC`,iconSize:[25,41],shadowSize:[41,41],iconAnchor:[12,41],shadowAnchor:[14,41],popupAnchor:[-3,-76]}),_=class extends r{constructor(e){super(e,s+`
`+c+`
`+d)}initEditMode(e){e.insertAdjacentHTML(`beforeend`,f);let t=e.querySelector(`#shaclMapDialogContainer`);this.map=o.map(t,{fullscreenControl:!0,editable:!0,layers:[o.tileLayer(h)],zoom:5,maxBounds:v,center:p}),this.map.attributionControl.addAttribution(m);let n=o.Control.extend({options:{position:`topleft`,callback:null,kind:``,html:``},onAdd:function(e){let t=o.DomUtil.create(`div`,`leaflet-control leaflet-bar`),n=o.DomUtil.create(`a`,``,t);return n.href=`#`,n.title=`Create a new `+this.options.kind,n.innerHTML=this.options.html,o.DomEvent.on(n,`click`,o.DomEvent.stop).on(n,`click`,()=>{window.LAYER=this.options.callback.call(e.editTools)},this),t}});this.map.addControl(new(n.extend({options:{callback:()=>{this.displayedShape?.remove(),this.displayedShape=this.map?.editTools.startPolygon()},kind:`polygon`,html:`▰`}}))),this.map.addControl(new(n.extend({options:{callback:()=>{this.displayedShape?.remove(),this.displayedShape=this.map?.editTools.startMarker(void 0,{icon:g})},kind:`marker`,html:`•`}}))),this.map.on(`editable:drawing:end`,()=>{this.saveChanges()}),this.map.on(`editable:vertex:dragend`,()=>{this.saveChanges()});let r=e.querySelector(`#shaclMapDialog`);return r.addEventListener(`close`,()=>{let e=document.body.style.top;document.body.style.position=``,document.body.style.top=``,window.scrollTo(0,parseInt(e||`0`)*-1),this.currentEditor&&this.createdGeometry&&(this.currentEditor.value=b(this.createdGeometry),this.currentEditor.dispatchEvent(new Event(`change`,{bubbles:!0})))}),r}createEditor(e,t){let n=e.config.form.querySelector(`#shaclMapDialog`);n||=this.initEditMode(e.config.form);let r=e.config.theme.createButton(`Open map...`,!1);r.style.marginLeft=`5px`,r.classList.add(`open-map-button`),r.onclick=()=>{this.currentEditor=i.querySelector(`.editor`),this.createdGeometry=void 0,this.displayedShape?.remove(),this.drawAndZoomToGeometry(y(this.currentEditor.value||``),this.map),document.body.style.top=`-${window.scrollY}px`,document.body.style.position=`fixed`,n.showModal()};let i=u(e,t||null,!0);return i.appendChild(r),i}createViewer(e,t){let n=document.createElement(`div`),r=y(t.value);if(r?.coordinates?.length){let e=o.map(n,{fullscreenControl:!0,layers:[o.tileLayer(h)],zoom:5,center:p,maxBounds:v});e.attributionControl.addAttribution(m),this.drawAndZoomToGeometry(r,e)}return n}drawAndZoomToGeometry(e,t){if(setTimeout(()=>{t.invalidateSize()}),e?.type===`Point`){let n={lng:e.coordinates[0],lat:e.coordinates[1]};this.displayedShape=o.marker(n,{icon:g}).addTo(t),t.setView(n,15,{animate:!1})}else if(e?.type===`Polygon`){let n=e.coordinates[0].map(e=>({lng:e[0],lat:e[1]})),r=o.polygon(n).addTo(t);this.displayedShape=r,t.fitBounds(r.getBounds(),{animate:!1}),setTimeout(()=>{t.fitBounds(r.getBounds(),{animate:!1}),t.setView(r.getCenter(),void 0,{animate:!1})},1)}else t.setZoom(5)}saveChanges(){if(this.displayedShape instanceof o.Marker){let e=this.displayedShape.getLatLng();this.createdGeometry={type:`Point`,coordinates:[e.lng,e.lat]}}else if(this.displayedShape instanceof o.Polygon){let e=this.displayedShape.getLatLngs();e[0][0].equals(e[0][e[0].length-1])||e[0].push(e[0][0]),this.createdGeometry={type:`Polygon`,coordinates:[e[0].map(e=>[e.lng,e.lat])]}}else this.createdGeometry=void 0}},v=[[-90,-180],[90,180]];function y(e){let t=e.match(/^POINT\((.*)\)$/);if(t?.length==2){let e=t[1].split(` `);if(e.length===2)return{type:`Point`,coordinates:[parseFloat(e[0]),parseFloat(e[1])]}}let n=e.match(/^POLYGON[(]{2}(.*)[)]{2}$/);if(n?.length==2){let e=n[1].split(`,`);if(e.length>2){let t=[],n=[];t.push(n);for(let t of e){let e=t.split(` `);e.length===2&&n.push([parseFloat(e[0]),parseFloat(e[1])])}return{type:`Polygon`,coordinates:t}}}}function b(e){return e.type===`Point`?`POINT(${e.coordinates.join(` `)})`:e.type===`Polygon`?`POLYGON((${e.coordinates[0].map(e=>e.join(` `)).join(`,`)}))`:``}export{_ as LeafletPlugin,b as geometryToWkt,y as wktToGeometry,v as worldBounds};