Skip to content

Added default map location to module config & admin map templates #6

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
loetie wants to merge 2 commits into
base: master
Choose a base branch
from
Open

Added default map location to module config & admin map templates #6

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
b480b1a
Added default map location to module config & admin map templates
loetie May 26, 2017
b556918
Feedback: Fix typo, hardcoded original defaults if no custom defaults…
loetie May 29, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 31 additions & 14 deletions lib/js/admin-geo.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
(function() {

// disable the 'entered address' button when there is no address on the edit page
// disable the 'entered address' button when there is no address on the edit page
if ($('#address_country').length == 0) {
$('#location_address').addClass('disabled');
}
Expand All @@ -12,23 +12,31 @@
var map_location;
var marker;
var currentPosition;
window.setupAdminGeoMap = function(rscLat, rscLng, elementId, rscZoomLevel) {

window.setupAdminGeoMap = function(rscLat, rscLng, elementId, rscZoomLevel, defaultLat, defaultLng, defaultZoom) {

rscLat = parseFloat(rscLat);
rscLng = parseFloat(rscLng);
rscZoomLevel = parseInt(rscZoomLevel, 10);

if(!defaultLat) { defaultLat = "52.3730438" }
if(!defaultLng) { defaultLng = "4.837568000" }
if(!defaultZoom) { defaultZoom = "10" }

defaultLat = parseFloat(defaultLat);
defaultLng = parseFloat(defaultLng);
defaultZoom = parseInt(defaultZoom, 10);

if (rscLat || rscLng) {
currentPosition = new google.maps.LatLng(rscLat, rscLng);
}

var center = currentPosition ? currentPosition : new google.maps.LatLng(52.3730438, 4.837568000);
var center = currentPosition ? currentPosition : new google.maps.LatLng(defaultLat, defaultLng);

// Init map and center the map on the current position
var mapOptions = {
center: center,
zoom: rscZoomLevel > 0 ? rscZoomLevel : 12
zoom: rscZoomLevel > 0 ? rscZoomLevel : defaultZoom
};
map = new google.maps.Map(document.getElementById(elementId), mapOptions);

Expand All @@ -37,22 +45,25 @@
draggable: true,
animation: google.maps.Animation.DROP
});

if (currentPosition) {
marker.setPosition(currentPosition);
marker.setMap(map);
}

google.maps.event.addListener(marker, "dragend", function(e) {
google.maps.event.addListener(marker, "dragend", function(e) {
map_mark_location(e.latLng.lng(), e.latLng.lat(), true);
});
});

google.maps.event.addListener(map, 'click', function(e) {
map_mark_location(e.latLng.lng(), e.latLng.lat(), true);
});

google.maps.event.addListener(map, 'zoom_changed', function(e) {
$('#location_zoom_level').val(map.getZoom().toString());
$('#location_zoom_level').trigger("focus");
$('#location_zoom_level').trigger("change");
$('#location_zoom_level').trigger("blur");
});

$('#location_address').click(function(ev) {
Expand All @@ -68,16 +79,16 @@
z_notify("address_lookup", args);
$(this).addClass('disabled');
}
ev.preventDefault();
ev.preventDefault();
});
$('#location_clear').click(function(ev) {

$('#location_clear').click(function(ev) {
$('#location_lat').val('');
$('#location_lng').val('');
marker.setMap(null);
ev.preventDefault();
});

}

window.map_mark_location_error = function() {
Expand All @@ -91,11 +102,17 @@
marker.setPosition(loc);
$('#location_lat').val(latitude.toString());
$('#location_lng').val(longitude.toString());
$('#location_lat').trigger("focus");
$('#location_lat').trigger("change");
$('#location_lat').trigger("blur");
$('#location_lng').trigger("focus");
$('#location_lng').trigger("change");
$('#location_lng').trigger("blur");
Copy link
Contributor

@ddeboer ddeboer Jan 2, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@loetie Is this necessary?

Copy link
Author

@loetie loetie Feb 7, 2018

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It was needed so the default config save action was triggered when the hidden fields got filled with a new value. So its to simulate that a field has changed and left.

if (!is_click) {
map.setCenter(loc);
z_growl_add("Location has been set.");
$('#location_address').removeClass('disabled');
}
};

})();
22 changes: 22 additions & 0 deletions templates/_admin_configure_map.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{# This template is lazy loaded from the _geomap_admin_location.tpl #}

<div id="{{ #geomap }}" class="admin-geomap" style="height: 300px;"></div>
<style>label.inline { display: inline; padding: 0 10px; }</style>

<div style="margin-top: 10px">
<div class="controls form-group row">
<input id="location_lat" type="hidden" name="location_lat" value="{{ m.config.mod_geo.location_lat.value|escape }}" class="form-control" />
{% wire id="location_lat" type="blur" action={config_toggle module="mod_geo" key="location_lat" on="change"} %}
<input id="location_lng" type="hidden" name="location_lng" value="{{ m.config.mod_geo.location_lng.value|escape }}" class="form-control" />
{% wire id="location_lng" type="blur" action={config_toggle module="mod_geo" key="location_lng" on="change"} %}
</div>
</div>

<span id="geomap-config" data-latitude="{{ m.config.mod_geo.location_lat.value|escape }}" data-longitude="{{ m.config.mod_geo.location_lng.value|escape }}" data-element="{{ #geomap }}"></span>

<input id="location_zoom_level" type="hidden" name="location_zoom_level" value="{{ m.config.mod_geo.location_zoom_level.value|escape }}" />
{% wire id="location_zoom_level" type="blur" action={config_toggle module="mod_geo" key="location_zoom_level" on="change"} %}

{% javascript %}
setupAdminGeoMap('', '', '{{ #geomap }}', '', '{{ m.config.mod_geo.location_lat.value|escape }}', '{{ m.config.mod_geo.location_lng.value|escape }}', '{{ m.config.mod_geo.location_zoom_level.value|escape }}');
{% endjavascript %}
10 changes: 10 additions & 0 deletions templates/_admin_configure_map_field.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
<div class="control-group">
<label class="control-label" for="startingpoint">{_ Google maps starting point _}</label>
<div class="controls">
{% if m.config.mod_geo.api_key.value %}
<div id="{{ #lazy }}">
{% lazy action={update target=#lazy id=id template="_admin_configure_map.tpl"}%}
</div>
{% endif %}
</div>
</div>
7 changes: 6 additions & 1 deletion templates/_admin_configure_module.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,12 @@
{% wire id="apikey" type="blur" action={config_toggle module="mod_geo" key="api_key" on="keyup"} %}
</div>
</div>

{% if m.config.mod_geo.api_key.value %}
{% include "_admin_configure_map_field.tpl" %}
{% else %}
{% wire id="apikey" type="blur" action={update target="showmap" template="_admin_configure_map_field.tpl" } %}
<div id="showmap"></div>
{% endif %}
</div>

<div class="modal-footer">
Expand Down
2 changes: 1 addition & 1 deletion templates/_geomap_admin_location_map.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,5 +34,5 @@


{% javascript %}
setupAdminGeoMap('{{ id.location_lat }}', '{{ id.location_lng }}', '{{ #geomap }}', '{{ id.location_zoom_level }}');
setupAdminGeoMap('{{ id.location_lat }}', '{{ id.location_lng }}', '{{ #geomap }}', '{{ id.location_zoom_level }}', '{{ m.config.mod_geo.location_lat.value|escape }}', '{{ m.config.mod_geo.location_lng.value|escape }}', '{{ m.config.mod_geo.location_zoom_level.value|escape }}');
{% endjavascript %}