add location to seminaries

views/html/seminaries/edit.tpl

@@ -70,5 +70,79 @@
         <label for="description"><?=_('Description')?>:<br />
         <textarea name="description" placeholder="<?=_('Description')?>"><?=$description?></textarea><br />
     </fieldset>
+    <fieldset>
+        <legend><?=_('Location')?></legend>
+        <div id="map" class="map"></div>
+        <input id="longitude" name="longitude" type="hidden" value="<?=$longitude?>" />
+        <input id="latitude" name="latitude" type="hidden" value="<?=$latitude?>" />
+    </fieldset>
     <input type="submit" name="edit" value="<?=_('edit')?>" />
 </form>
+<script>
+    var drawSource = new ol.source.Vector({
+        wrapX: false
+    });
+    var drawLayer = new ol.layer.Vector({
+        source: drawSource,
+        style: new ol.style.Style({
+            text: new ol.style.Text({
+                text: '\uf276',
+                font: 'normal 28px FontAwesome',
+                textBaseline: 'Bottom',
+                fill: new ol.style.Fill({
+                    color: '#0F373C'
+                })
+            })
+        })
+    });
+    var map = new ol.Map({
+        layers: [
+            new ol.layer.Tile({
+                source: new ol.source.OSM()
+            }),
+            drawLayer
+        ],
+        controls: ol.control.defaults(),
+        target: 'map',
+        view: new ol.View({
+<?php if(!is_null($latitude) && !is_null($longitude)) : ?>
+            center: ol.proj.transform([<?=$longitude?>, <?=$latitude?>], 'EPSG:4326', 'EPSG:3857'),
+            zoom: 17,
+<?php else : ?>
+            center: [0, 0],
+            zoom: 0,
+<?php endif ?>
+            maxZoom: 19
+        })
+    });
+    var draw = new ol.interaction.Draw({
+        source: drawSource,
+        type: 'Point',
+        maxPoints: 1,
+    });
+    map.addInteraction(draw);
+
+    // Add existing point
+    var longitude = $('#longitude').val();
+    var latitude = $('#latitude').val();
+    if(longitude && latitude) {
+        drawSource.addFeature(
+            new ol.Feature({
+                geometry: new ol.geom.Point(
+                    ol.proj.transform([parseFloat(longitude), parseFloat(latitude)], 'EPSG:4326', 'EPSG:3857')
+                )
+            })
+        );
+    }
+
+    // Wire events
+    drawSource.on('addfeature', function(event) {
+        var coordinates = event.feature.getGeometry().getCoordinates();
+        coordinates = ol.proj.transform(coordinates, 'EPSG:3857', 'EPSG:4326');
+        $('#longitude').val(coordinates[0]);
+        $('#latitude').val(coordinates[1]);
+    });
+    draw.on('drawstart', function() {
+        drawSource.clear();
+    });
+</script>