commentaires et refactorisation
davvalent

davvalent commited on 2023-03-27 13:18:16
Showing 1 changed files, with 48 additions and 27 deletions.

... ...
@@ -2,13 +2,15 @@
2 2
  * Plan interactif du Faubourg à m’lasse (PIFM)
3 3
  * 
4 4
  * intégration des données structurées du projet QDMTL
5
- * intégration des photograpies d’archives
5
+ * intégration des photographies d’archives :
6
+ * Archives de montréal, VM094, SY, SS1, SSS3, C196
6 7
  * intégration du plan d’expropriation du Fabourg à m’lasse
7 8
  *
8 9
  * @author David Valentine <d@ntnlv.ca>
9
- * @todo rdfa
10
+ * @license MIT https://spdx.org/licenses/MIT.html
11
+ * @todo rdfa for information header
10 12
  * @todo loading messages for body tag (chargement)
11
- * @todo cache
13
+ * @todo caching
12 14
  * @todo error handling
13 15
  * @todo build process and cp in dist folder for deployment
14 16
  * @todo get rid of warnings liens source (map)
... ...
@@ -17,6 +19,10 @@
17 19
  * @todo geolocalisation : si geojson.io, charger buildings.json
18 20
  * @todo geolocalisation : voir placemark @placemarkio
19 21
  */
22
+console.log(
23
+  "%cBienvenue sur le PIFM",
24
+  "font-family:monospace;font-size:14px;color:darkblue;"
25
+);
20 26
 
21 27
 (async function main() {
22 28
 
... ...
@@ -47,14 +53,14 @@
47 53
     }
48 54
   }
49 55
 
50
-  /** SPARQL query */
56
+  /** SPARQL query for buildings */
51 57
   const buildingsQuery = "query=" + encodeURIComponent(
52 58
     "PREFIX ecrm:<http://erlangen-crm.org/current/>PREFIX geo:<http://www.opengis.net/ont/geosparql#>SELECT ?a ?b WHERE{?a a <http://onto.qdmtl.ca/E24_Building>;ecrm:P53_has_former_or_current_location ?c.?c ecrm:P168_place_is_defined_by ?d.?d geo:asGeoJSON ?b.}"
53 59
     );
54 60
 
55 61
   /**
56 62
    * fetching data from triple store
57
-   * buildings and geographic coordinates
63
+   * buildings with geographic coordinates
58 64
    */
59 65
   response = await fetch(tripleStoreEndpointUrl, {
60 66
     method: "POST",
... ...
@@ -64,11 +70,18 @@
64 70
     },
65 71
     body: buildingsQuery
66 72
   });
73
+
74
+  if(!response.ok){
75
+    throw new Error(`An error occurred: ${response.status}`)
76
+  }
77
+
67 78
   const sparqlResponse = await response.json();
68 79
 
69
-  if (dev()) { // develop
70
-    console.log("Dev: sparqlResponse", sparqlResponse);
71
-  };
80
+  console.log(
81
+    "%c%i bâtiments géolocalisés",
82
+    "font-family:monospace;font-size:14px;color:darkblue;",
83
+    sparqlResponse.results.bindings.length
84
+  );
72 85
 
73 86
   /**
74 87
    * making of geoJSON object
... ...
@@ -76,30 +89,20 @@
76 89
    */
77 90
   const geojsonFeatures = (sparqlJson) => {
78 91
 
79
-    let featuresArray = [];
80
-
81
-    sparqlJson.results.bindings.forEach(feature => {
82
-
83
-      featuresArray.push({
92
+    let featuresArray = sparqlJson.results.bindings.map(feature => {
93
+      return {
84 94
         "type": "Feature",
85 95
         "properties": {
86 96
           "URI": feature.a.value
87 97
         },
88 98
         "geometry": JSON.parse(feature.b.value)
89
-      });
99
+      }
90 100
     });
91 101
 
92
-    const geojsonFeatures = {
102
+    return {
93 103
       "type": "FeatureCollection",
94 104
       "features": featuresArray
95 105
     };
96
-
97
-    if (dev()) { // develop
98
-      console.log("Dev geojsonFeatures:", geojsonFeatures);
99
-    };
100
-
101
-    return geojsonFeatures;
102
-    
103 106
   };
104 107
 
105 108
   /** GeoJSON Layer */
... ...
@@ -318,7 +321,6 @@
318 321
       zoomDelta: 0.5,
319 322
       zoomSnap: 0.5,
320 323
       zoomControl: false,
321
-
322 324
       layers: [
323 325
         baseLayer,
324 326
         faubourgLayer,
... ...
@@ -350,24 +352,43 @@
350 352
 
351 353
   })();
352 354
 
355
+  /** récupérer données de géolocalisation */
356
+  pifm.on("click", (e) => {
357
+
358
+    console.log(e.latlng);
359
+
360
+    let coordinates   = `[ a ecrm:E53_Place ;\n`;
361
+        coordinates  += `  ecrm:P168_place_is_defined_by [\n`;
362
+        coordinates  += `    a geo:Geometry ;\n`;
363
+        coordinates  += `    geo:asGeoJSON "{\\"type\\": \\"Point\\", \\"coordinates\\": [${e.latlng.lng},${e.latlng.lat}]}"^^geo:geoJSONLiteral\n`
364
+        coordinates  += `  ]\n`;
365
+        coordinates  += `]`;
366
+
367
+        console.log(coordinates);
368
+  })
369
+
353 370
   if (dev()) {
354 371
     pifm.on("popupopen", () => {
355
-      console.log("Dev: Message fired on POPUP OPENING");
372
+      devConsole("Dev: Message fired on POPUP OPENING");
356 373
     });
357 374
     pifm.on("popupclose", (e) => {
358
-      console.log("Dev CLOSE: Message fired on pop-up closing", e);
375
+      devConsole("Dev CLOSE: Message fired on pop-up closing", e);
359 376
     });
360
-    pifm.on('click', (e) => console.log("EVENT: click on map", e));
361 377
   };
362 378
 
363 379
 })();
364 380
 
365 381
 /**
366 382
  * dev env tester
367
- * @returns boolean
368 383
  */
369 384
 function dev() {
370 385
   return (location.host === "localhost" || location.host === "127.0.0.1")
371 386
     ? true
372 387
     : false;
373 388
 }
389
+function devConsole(log) {
390
+  console.log(
391
+    `%c${log}: `,
392
+    "font-family:monospace;color:darkblue;",
393
+  );
394
+}
374 395
\ No newline at end of file
375 396