Last active
December 19, 2015 17:19
-
-
Save pushandplay/5990511 to your computer and use it in GitHub Desktop.
MODX GoogleMap TV from here - http://miragram.com/blog/2013/02/18/udobnyij-vvod-koordinat-google-maps-cherez-tv/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
/** | |
* @package modx | |
* @subpackage processors.element.tv.renders.mgr.input | |
* | |
* core/model/modx/processors/element/tv/renders/mgr/input/gmaps.class.php | |
*/ | |
class modTemplateVarInputRenderGmaps extends modTemplateVarInputRender { | |
public function getTemplate() { | |
return 'element/tv/renders/input/gmaps.tpl'; | |
} | |
} | |
return 'modTemplateVarInputRenderGmaps'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
manager/templates/default/element/tv/renders/input/gmaps.tpl | |
--> | |
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=YourAPIKeyHere&sensor=false&language=ru"></script> | |
<style> | |
#canvas { | |
width: 100%; | |
height: 400px; | |
} | |
</style> | |
<input id="tv{$tv->id}" name="tv{$tv->id}" type="text" class="textfield" value="{$tv->get('value')|escape}"{$style}tvtype="{$tv->type}"/> | |
<br/><br/> | |
<script type="text/javascript"> | |
// <![CDATA[ | |
{literal} | |
Ext.onReady(function() { | |
var fld = MODx.load({ | |
{/literal} | |
xtype: 'textfield' | |
,applyTo: 'tv{$tv->id}' | |
,width: '99%' | |
,enableKeyEvents: true | |
,msgTarget: 'under' | |
,allowBlank: {if $params.allowBlank == 1 || $params.allowBlank == 'true'}true{else}false{/if} | |
{if $params.maxLength},maxLength: {$params.maxLength}{/if} | |
{if $params.minLength},minLength: {$params.minLength}{/if} | |
{literal} | |
,listeners: { 'keydown': { fn:MODx.fireResourceFormChange, scope:this}} | |
}); | |
Ext.getCmp('modx-panel-resource').getForm().add(fld); | |
MODx.makeDroppable(fld); | |
}); | |
{/literal} | |
// ]]> | |
</script><div id="canvas"></div> | |
<script type="text/javascript"> | |
// configuration | |
var myZoom = 12; | |
var myMarkerIsDraggable = true; | |
var myCoordsLenght = 6; | |
var str = document.getElementById('tv{$tv->id}').value; | |
if (str=='') { | |
var defaultLat = 55.7512419; | |
var defaultLng = 37.6184217; | |
} else { | |
var arr = str.split(","); | |
var defaultLat = arr[0]; | |
var defaultLng = arr[1]; | |
} | |
{literal} | |
// creates the map | |
// zooms | |
// centers the map | |
// sets the map’s type | |
var map = new google.maps.Map(document.getElementById('canvas'), { | |
zoom: myZoom, | |
center: new google.maps.LatLng(defaultLat, defaultLng), | |
mapTypeId: google.maps.MapTypeId.ROADMAP | |
});// creates a draggable marker to the given coords | |
var myMarker = new google.maps.Marker({ | |
position: new google.maps.LatLng(defaultLat, defaultLng), | |
draggable: myMarkerIsDraggable | |
});// adds a listener to the marker | |
// gets the coords when drag event ends | |
// then updates the input with the new coords | |
google.maps.event.addListener(myMarker, 'dragend', function(evt){ | |
{/literal} | |
document.getElementById('tv{$tv->id}').value = evt.latLng.lat().toFixed(myCoordsLenght) + "," + evt.latLng.lng().toFixed(myCoordsLenght); | |
{literal} | |
});// centers the map on markers coords | |
map.setCenter(myMarker.position);// adds the marker on the map | |
myMarker.setMap(map); | |
if (navigator.geolocation && str === '') { | |
navigator.geolocation.getCurrentPosition(function(position) { | |
userCenter = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); | |
map.setCenter(userCenter); | |
myMarker.setPosition(userCenter); | |
}); | |
} | |
</script> | |
{/literal} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment