UNPKG

@ulb-darmstadt/shacl-form

Version:
18 lines (17 loc) 13.1 kB
import*as c from"leaflet";import"leaflet-editable/src/Leaflet.Editable.js";import E from"leaflet/dist/leaflet.css?raw";import D from"leaflet.fullscreen/Control.FullScreen.css?raw";import"leaflet.fullscreen/Control.FullScreen.js";import{P as R}from"./assets/plugin-VN3CfgGe.js";import{DataFactory as d,Literal as O}from"n3";const l="http://www.w3.org/ns/shacl#",S="http://www.w3.org/2001/XMLSchema#",M="http://www.w3.org/1999/02/22-rdf-syntax-ns#",w="http://www.w3.org/2000/01/rdf-schema#",h="http://www.w3.org/2004/02/skos/core#",x="http://www.w3.org/2002/07/owl#",T="http://purl.org/dc/terms/",k="http://xmlns.com/foaf/0.1/",P=d.namedNode("loaded-shapes"),F=d.namedNode("loaded-data"),g=d.namedNode(M+"type"),z=d.namedNode(M+"langString");d.namedNode(T+"conformsTo");const f=d.namedNode(w+"subClassOf");d.namedNode(x+"imports");const v=d.namedNode(h+"broader"),B=d.namedNode(h+"narrower");d.namedNode(l+"NodeShape");d.namedNode(l+"IRI");d.namedNode(l+"property");d.namedNode(l+"class");d.namedNode(l+"node");d.namedNode(l+"targetClass");d.namedNode(l+"nodeKind");d.namedNode(S+"string");function u(t,o,i=l,e){let n="";const s=U(t,o,i,e);return s&&(n=s.value),n}function U(t,o,i=l,e){let n;const s=i+o;if(e?.length){for(const a of e)for(const r of t)if(r.predicate.value===s){if(r.object.id.endsWith(`@${a}`))return r.object;r.object.id.indexOf("@")<0?n=r.object:n||(n=r.object)}}else for(const a of t)if(a.predicate.value===s)return a.object;return n}function b(t,o){return u(t,"prefLabel",h,o)||u(t,"label",w,o)||u(t,"name",k,o)}function y(t,o,i){const e=[];for(const n of t)e.push({value:n,label:b(o.getQuads(n,null,null,null),i),children:[]});return e}function m(t,o,i,e,n=new Set){for(const s of o.owlImports)n.has(s.id)||(n.add(s.id),e.push(...i.getSubjects(g,t,s)));o.parent&&m(t,o.parent,i,e,n)}function I(t,o){if(o.in){const i=o.config.lists[o.in];return y(i?.length?i:[],o.config.store,o.config.languages)}else{const i=o.config.store.getSubjects(g,t,P);i.push(...o.config.store.getSubjects(g,t,F)),m(t,o,o.config.store,i);const e=new Map,n=new Map;for(const a of i)e.set(a.id,{value:a,label:b(o.config.store.getQuads(a,null,null,null),o.config.languages),children:[]});for(const a of i){for(const r of o.config.store.getObjects(a,v,null))e.has(r.id)&&n.set(a.id,r.id);for(const r of o.config.store.getObjects(a,B,null))e.has(r.id)&&n.set(r.id,a.id);for(const r of o.config.store.getObjects(a,f,null))e.has(r.id)&&n.set(a.id,r.id)}for(const[a,r]of n.entries())e.get(r)?.children?.push(e.get(a));const s=[];for(const[a,r]of e.entries())n.has(a)||s.push(r);for(const a of o.config.store.getSubjects(f,t,null))s.push(...I(a,o));return s}}function Y(t,o,i){{const e=t.minCount!==void 0&&t.minCount>0;if(t.class&&!t.hasValue)return t.config.theme.createListEditor(t.label,o,e,I(t.class,t),t);if(t.in){const n=t.config.lists[t.in];if(n?.length){const s=y(n,t.config.store,t.config.languages);return t.config.theme.createListEditor(t.label,o,e,s,t)}else console.error("list not found:",t.in,"existing lists:",t.config.lists)}if(t.datatype?.equals(z)||t.languageIn?.length||t.datatype===void 0&&o instanceof O&&o.language)return t.config.theme.createLangStringEditor(t.label,o,e,t);switch(t.datatype?.value.replace(S,"")){case"integer":case"float":case"double":case"decimal":return t.config.theme.createNumberEditor(t.label,o,e,t);case"date":case"dateTime":return t.config.theme.createDateEditor(t.label,o,e,t);case"boolean":return t.config.theme.createBooleanEditor(t.label,o,e,t);case"base64Binary":return t.config.theme.createFileEditor(t.label,o,e,t)}return t.config.theme.createTextEditor(t.label,o,e,t)}}const H=` #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%; } `,Q=` <dialog id="shaclMapDialog" onclick="event.target==this && this.close()"> <div id="shaclMapDialogContainer"></div> <div class="hint">&#x24D8; Draw a polygon or marker, then close dialog</div> <button class="closeButton" type="button" onclick="this.parentElement.close()">&#x2715;</button> </dialog>`,L={lng:8.657238961696038,lat:49.87627570549512},p='&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',C="https://tile.openstreetmap.de/{z}/{x}/{y}.png",j=c.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 J extends R{constructor(o){super(o,E+` `+D+` `+H)}initEditMode(o){o.insertAdjacentHTML("beforeend",Q);const i=o.querySelector("#shaclMapDialogContainer");this.map=c.map(i,{fullscreenControl:!0,editable:!0,layers:[c.tileLayer(C)],zoom:5,maxBounds:A,center:L}),this.map.attributionControl.addAttribution(p);const e=c.Control.extend({options:{position:"topleft",callback:null,kind:"",html:""},onAdd:function(s){let a=c.DomUtil.create("div","leaflet-control leaflet-bar"),r=c.DomUtil.create("a","",a);return r.href="#",r.title="Create a new "+this.options.kind,r.innerHTML=this.options.html,c.DomEvent.on(r,"click",c.DomEvent.stop).on(r,"click",()=>{window.LAYER=this.options.callback.call(s.editTools)},this),a}});this.map.addControl(new(e.extend({options:{callback:()=>{this.displayedShape?.remove(),this.displayedShape=this.map?.editTools.startPolygon()},kind:"polygon",html:"▰"}}))),this.map.addControl(new(e.extend({options:{callback:()=>{this.displayedShape?.remove(),this.displayedShape=this.map?.editTools.startMarker(void 0,{icon:j})},kind:"marker",html:"•"}}))),this.map.on("editable:drawing:end",()=>{this.saveChanges()}),this.map.on("editable:vertex:dragend",()=>{this.saveChanges()});const n=o.querySelector("#shaclMapDialog");return n.addEventListener("close",()=>{const s=document.body.style.top;document.body.style.position="",document.body.style.top="",window.scrollTo(0,parseInt(s||"0")*-1),this.currentEditor&&this.createdGeometry&&(this.currentEditor.value=G(this.createdGeometry),this.currentEditor.dispatchEvent(new Event("change",{bubbles:!0})))}),n}createEditor(o,i){let e=o.config.form.querySelector("#shaclMapDialog");e||(e=this.initEditMode(o.config.form));const n=o.config.theme.createButton("Open&#160;map...",!1);n.style.marginLeft="5px",n.classList.add("open-map-button"),n.onclick=()=>{this.currentEditor=s.querySelector(".editor"),this.createdGeometry=void 0,this.displayedShape?.remove(),this.drawAndZoomToGeometry(N(this.currentEditor.value||""),this.map),document.body.style.top=`-${window.scrollY}px`,document.body.style.position="fixed",e.showModal()};const s=Y(o,i||null);return s.appendChild(n),s}createViewer(o,i){const e=document.createElement("div"),n=N(i.value);if(n?.coordinates?.length){const s=c.map(e,{fullscreenControl:!0,layers:[c.tileLayer(C)],zoom:5,center:L,maxBounds:A});s.attributionControl.addAttribution(p),this.drawAndZoomToGeometry(n,s)}return e}drawAndZoomToGeometry(o,i){if(setTimeout(()=>{i.invalidateSize()}),o?.type==="Point"){const e={lng:o.coordinates[0],lat:o.coordinates[1]};this.displayedShape=c.marker(e,{icon:j}).addTo(i),i.setView(e,15,{animate:!1})}else if(o?.type==="Polygon"){const e=o.coordinates[0].map(s=>({lng:s[0],lat:s[1]})),n=c.polygon(e).addTo(i);this.displayedShape=n,i.fitBounds(n.getBounds(),{animate:!1}),setTimeout(()=>{i.fitBounds(n.getBounds(),{animate:!1}),i.setView(n.getCenter(),void 0,{animate:!1})},1)}else i.setZoom(5)}saveChanges(){if(this.displayedShape instanceof c.Marker){const o=this.displayedShape.getLatLng();this.createdGeometry={type:"Point",coordinates:[o.lng,o.lat]}}else if(this.displayedShape instanceof c.Polygon){const o=this.displayedShape.getLatLngs();o[0][0].equals(o[0][o[0].length-1])||o[0].push(o[0][0]),this.createdGeometry={type:"Polygon",coordinates:[o[0].map(i=>[i.lng,i.lat])]}}else this.createdGeometry=void 0}}const A=[[-90,-180],[90,180]];function N(t){const o=t.match(/^POINT\((.*)\)$/);if(o?.length==2){const e=o[1].split(" ");if(e.length===2)return{type:"Point",coordinates:[parseFloat(e[0]),parseFloat(e[1])]}}const i=t.match(/^POLYGON[(]{2}(.*)[)]{2}$/);if(i?.length==2){const e=i[1].split(",");if(e.length>2){const n=[],s=[];n.push(s);for(const a of e){const r=a.split(" ");r.length===2&&s.push([parseFloat(r[0]),parseFloat(r[1])])}return{type:"Polygon",coordinates:n}}}}function G(t){return t.type==="Point"?`POINT(${t.coordinates.join(" ")})`:t.type==="Polygon"?`POLYGON((${t.coordinates[0].map(o=>o.join(" ")).join(",")}))`:""}export{J as LeafletPlugin,G as geometryToWkt,N as wktToGeometry,A as worldBounds};