Version Comunitat de Memories v0
This commit is contained in:
parent
dcacbcd466
commit
81b2406aa2
@ -22,17 +22,11 @@
|
||||
|
||||
initMap: function(){
|
||||
this.map = L.map('map_canvas',{center: [this.origin.lat, this.origin.lng], zoom: this.origin.zoom});
|
||||
this.layers.push(new L.Google());
|
||||
this.layers.push(new L.Google('TERRAIN'));
|
||||
this.map.addLayer(this.layers[0]);
|
||||
this.map.addControl(
|
||||
new L.Control.Layers(
|
||||
{
|
||||
'Google':this.layers[0],
|
||||
'Google Terrain': this.layers[1]
|
||||
}, {}
|
||||
)
|
||||
);
|
||||
L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token={accessToken}', {
|
||||
id: 'mapbox.streets',
|
||||
maxZoom : 18,
|
||||
accessToken: 'pk.eyJ1IjoibHJ1bGxvIiwiYSI6ImNpaDUydjdoNTAwd3BzdGx5bGlhOTh6bXYifQ.tE8QgNbVSgwP8V5LnJWA3w'
|
||||
}).addTo(this.map);
|
||||
|
||||
this.map.addEventListener('click', this.mapClick, this);
|
||||
|
||||
@ -42,7 +36,7 @@
|
||||
this.map.panTo(_latlng);
|
||||
this.marker.addEventListener('dragend', this.markerDrag, this);
|
||||
}
|
||||
_.bindAll(this);
|
||||
//_.bindAll(this);
|
||||
this.initEvents();
|
||||
;
|
||||
|
||||
@ -50,6 +44,8 @@
|
||||
|
||||
|
||||
initEvents: function(){
|
||||
console.log('init events');
|
||||
//$('#add_files').bind('click', function() {alert('open media file'); });
|
||||
$('#add_files').bind('click', this.openMediaManager);
|
||||
this.file_frame.on('select',this.mediaSelected, this);
|
||||
$('.delete-att-item').live('click', this.removeMedia);
|
||||
@ -63,9 +59,21 @@
|
||||
if ( this.file_frame ){
|
||||
this.file_frame.open();
|
||||
return;
|
||||
};
|
||||
} else {
|
||||
this.file_frame = wp.media.frames.file_frame = wp.media({
|
||||
multiple: false,
|
||||
library: {
|
||||
type: 'audio'
|
||||
}
|
||||
});
|
||||
this.file_frame.on('select',this.mediaSelected, this);
|
||||
this.file_frame.open();
|
||||
return;
|
||||
//console.log('not init file_frame');
|
||||
}
|
||||
},
|
||||
mediaSelected: function(event){
|
||||
console.log('media selected');
|
||||
var attachment = this.file_frame.state().get('selection').first().toJSON();
|
||||
var _cT = _.template(this.attachTemplate);
|
||||
var _o = _cT({
|
||||
@ -76,7 +84,6 @@
|
||||
id: attachment.id
|
||||
});
|
||||
$('#soundmap-attachments-list').append(_o);
|
||||
|
||||
},
|
||||
|
||||
mapClick: function(event){
|
||||
@ -99,11 +106,8 @@
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
$(document).ready(function(){
|
||||
soundmap.initMap();
|
||||
});
|
||||
|
||||
}(jQuery));
|
||||
}(jQuery));
|
||||
|
||||
241
mapa.php
Executable file
241
mapa.php
Executable file
@ -0,0 +1,241 @@
|
||||
<?php
|
||||
// Creación de mapas de los paseos
|
||||
require_once( dirname(dirname(dirname(dirname( __FILE__ )))) . '/wp-load.php' );
|
||||
require_once (dirname( __FILE__ ) . '/libs/classes.php');
|
||||
|
||||
$walks = array();
|
||||
|
||||
// markers
|
||||
if(!isset($_GET['paseo'])) { $id=0; }
|
||||
else {
|
||||
$id = $_GET['paseo'];
|
||||
$file_helper = new Soundwalk_File_Helper();
|
||||
$db_helper = new Soundwalk_DB_Helper();
|
||||
$walk = $db_helper->get_walk($id, true);
|
||||
$walks[] = $walk;
|
||||
// En el caso del mapa general
|
||||
if ($id==26) {
|
||||
$walks[] = $db_helper->get_walk(27,true);
|
||||
$walks[] = $db_helper->get_walk(28,true);
|
||||
$walks[] = $db_helper->get_walk(29,true);
|
||||
$walks[] = $db_helper->get_walk(30,true);
|
||||
}
|
||||
}
|
||||
// fit to location
|
||||
$fit = false;
|
||||
if (isset($_GET['fit'])) {
|
||||
$fit = true;
|
||||
}
|
||||
|
||||
|
||||
?>
|
||||
|
||||
|
||||
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset=utf-8 />
|
||||
<title>Rekording - Audio Map</title>
|
||||
<script src='https://api.mapbox.com/mapbox.js/v2.2.4/mapbox.js'></script>
|
||||
<link href='https://api.mapbox.com/mapbox.js/v2.2.4/mapbox.css' rel='stylesheet' />
|
||||
<!--script src='https://api.tiles.mapbox.com/mapbox-gl-js/v0.12.3/mapbox-gl.js'></script>
|
||||
<link href='https://api.tiles.mapbox.com/mapbox-gl-js/v0.12.3/mapbox-gl.css' rel='stylesheet' /-->
|
||||
<style>
|
||||
body { margin:0; padding:0; }
|
||||
#map { position:absolute; top:0; bottom:0; width:100%;min-height:300px;display:block; }
|
||||
.leaflet-div-icon { border:0; width:40px; height:40px;background:transparent; }
|
||||
.my-icon {
|
||||
border-radius: 100%;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
text-align: center;
|
||||
line-height: 20px;
|
||||
color: white;
|
||||
}
|
||||
.Ahotsak {
|
||||
background: #f7b850;
|
||||
}
|
||||
|
||||
.La_Sonidera {
|
||||
background: #56577c;
|
||||
}
|
||||
|
||||
.InkoMartin_AlbertoDeLaHoz {
|
||||
background: #f58d75;
|
||||
}
|
||||
|
||||
.Audiolab {
|
||||
background: #a0d3cc;
|
||||
}
|
||||
</style>
|
||||
<script type="text/javascript">
|
||||
<?php
|
||||
$marker_color="#000000";
|
||||
print "walk = {
|
||||
\"type\": \"FeatureCollection\",
|
||||
\"features\": [";
|
||||
$w=0;
|
||||
foreach ($walks as $walk) :
|
||||
if (isset($walk->points)) :
|
||||
for ($i=0; $i < count($walk->points); $i++) {
|
||||
$p = $walk->points[$i];
|
||||
switch($p->autor) {
|
||||
case "Ahotsak":
|
||||
$marker_color="#f7b850";
|
||||
break;
|
||||
case "Audiolab":
|
||||
$marker_color="#a0d3cc";
|
||||
break;
|
||||
case "La Sonidera":
|
||||
$marker_color="#56577c";
|
||||
break;
|
||||
case "InkoMartin AlbertoDeLaHoz":
|
||||
$marker_color="#f58d75";
|
||||
break;
|
||||
case "Luca":
|
||||
$marker_color="#00ff00";
|
||||
break;
|
||||
default:
|
||||
$marker_color="#f76565";
|
||||
}
|
||||
|
||||
$finfo = $p->fileInfo;
|
||||
print "{
|
||||
\"type\": \"Feature\",
|
||||
\"geometry\": {
|
||||
\"type\": \"Point\",
|
||||
\"coordinates\": [$p->lng, $p->lat]
|
||||
},
|
||||
\"properties\": {
|
||||
\"title\": \"$p->title\",
|
||||
\"id\": \"$p->id\",
|
||||
\"author\": \"$p->autor\",
|
||||
\"attachment\": \"$finfo->url\",
|
||||
\"icon\": {
|
||||
\"className\": \"my-icon ".str_replace(' ', '_',($p->autor))."\",
|
||||
\"iconSize\": null
|
||||
}
|
||||
}";
|
||||
if ( $i==(count($walk->points)-1) && $w==(count($walks)-1) ) { print "}";}
|
||||
else { print "},"; }
|
||||
}
|
||||
endif;
|
||||
$w=$w+1;
|
||||
endforeach;
|
||||
print "]}\n";
|
||||
?>
|
||||
</script>
|
||||
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<script src='https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-markercluster/v0.4.0/leaflet.markercluster.js'></script>
|
||||
<link href='https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-markercluster/v0.4.0/MarkerCluster.css' rel='stylesheet' />
|
||||
<link href='https://api.tiles.mapbox.com/mapbox.js/plugins/leaflet-markercluster/v0.4.0/MarkerCluster.Default.css' rel='stylesheet' />
|
||||
|
||||
<div id='map'></div>
|
||||
<script type="text/javascript">
|
||||
|
||||
/*mapboxgl.accessToken = 'pk.eyJ1IjoibHJ1bGxvIiwiYSI6ImNpaDUydjdoNTAwd3BzdGx5bGlhOTh6bXYifQ.tE8QgNbVSgwP8V5LnJWA3w';
|
||||
var map = new mapboxgl.Map({
|
||||
container: 'map', // container id
|
||||
style: 'mapbox://styles/lrullo/cijlyga9m00jvbgkhu7aclgp8', //stylesheet location
|
||||
center: [-1.9806718826293945,43.316810229039795], // starting position
|
||||
zoom: 12 // starting zoom
|
||||
});*/
|
||||
|
||||
var audio;
|
||||
var id;
|
||||
|
||||
function audioPlay(s) {
|
||||
audio.stop();
|
||||
audio = new Audio(s);
|
||||
audio.play();
|
||||
}
|
||||
|
||||
function audioStop() {
|
||||
audio.stop();
|
||||
}
|
||||
|
||||
L.mapbox.accessToken = 'pk.eyJ1IjoibHJ1bGxvIiwiYSI6ImNpaDUydjdoNTAwd3BzdGx5bGlhOTh6bXYifQ.tE8QgNbVSgwP8V5LnJWA3w';
|
||||
var mapCluster = L.mapbox.map('map','lrullo.cih52v78z00v4krkrzge97rgg')
|
||||
.setView([43.3072873,-2.0089024], 13);
|
||||
mapCluster.on('click',function(e) {audio.pause();});
|
||||
|
||||
var featureLayer = L.mapbox.featureLayer(walk);
|
||||
|
||||
var clusterGroup = new L.MarkerClusterGroup({
|
||||
iconCreateFunction: function(cluster) {
|
||||
return L.divIcon({
|
||||
iconSize : [30,30],
|
||||
html:'<div style="border:1px;border-color:#fff;text-align:center;color:#fff;width:100%;height:100%;background-color:#aaa;border-radius:100%;padding:5px;font-weight:bold;">'+cluster.getChildCount()+'</div>'
|
||||
});
|
||||
}
|
||||
});
|
||||
featureLayer.eachLayer(function(layer) { clusterGroup.addLayer(layer);});
|
||||
mapCluster.addLayer(clusterGroup);
|
||||
|
||||
var me = L.marker([0, 0], {
|
||||
icon: L.mapbox.marker.icon({
|
||||
'marker-color': '#000',
|
||||
'marker-symbol': 'star',
|
||||
'marker-size': 'small'
|
||||
})
|
||||
});
|
||||
|
||||
me.addTo(mapCluster);
|
||||
mapCluster.featureLayer.on('ready', function(e) {
|
||||
<?php if (!$fit) : ?> mapCluster.fitBounds(featureLayer.getBounds()); <?php endif; ?>
|
||||
featureLayer.eachLayer(function(e) {
|
||||
e.setIcon(L.divIcon(e.feature.properties.icon));
|
||||
e.on("click",function() {
|
||||
if (id==e.feature.properties.id) { audio.pause(); id=""; return;}
|
||||
else { id=e.feature.properties.id; }
|
||||
if(audio!=undefined) { audio.pause();}
|
||||
audio = new Audio(e.feature.properties.attachment);
|
||||
audio.play();
|
||||
});
|
||||
});
|
||||
});
|
||||
<?php if ($fit) : ?>getPosition();<?php endif; ?>
|
||||
|
||||
function displayPosition(position) {
|
||||
console.log("Display position");
|
||||
me.setLatLng(L.latLng([position.coords.latitude,position.coords.longitude]));
|
||||
fg = new L.featureGroup([featureLayer, me]);
|
||||
<?php if (!$fit) :?> mapCluster.fitBounds(fg.getBounds());
|
||||
<?php else:?> mapCluster.setView([position.coords.latitude, position.coords.longitude],18); <?php endif; ?>
|
||||
setTimeout(function() { navigator.geolocation.getCurrentPosition(displayPosition, displayError, {enableHighAccuracy: true, timeout: 5000});},5000);
|
||||
}
|
||||
|
||||
function displayError(error) {
|
||||
var errors = {
|
||||
1: 'Permission denied',
|
||||
2: 'Position unavailable',
|
||||
3: 'Request timeout'
|
||||
};
|
||||
console.log("Error: " + errors[error.code]);
|
||||
switch(errors) {
|
||||
case 1:
|
||||
case 2:
|
||||
map.setView([43.3072873,-2.0089024], 13);
|
||||
break;
|
||||
case 3:
|
||||
alert("timeout");
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
function getPosition() {
|
||||
if (navigator.geolocation) {
|
||||
navigator.geolocation.getCurrentPosition(displayPosition, displayError, {enableHighAccuracy: true, timeout:5000});
|
||||
} else {
|
||||
alert("I'm sorry, but geolocation services are not supported by your browser.");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
49
soundmap.php
49
soundmap.php
@ -14,8 +14,10 @@ Author URI: http://www.audio-lab.org
|
||||
License: GPLv2 or later
|
||||
*/
|
||||
|
||||
require_once (WP_PLUGIN_DIR . "/soundmap/api/soundmap.tags.php");
|
||||
require_once (WP_PLUGIN_DIR . "/soundmap/api/soundmap.api.php");
|
||||
require_once (plugin_dir_path( __FILE__ ) . "api/soundmap.tags.php");
|
||||
require_once (plugin_dir_path( __FILE__ ) . "api/soundmap.api.php");
|
||||
//require_once (WP_PLUGIN_DIR . "/soundmap/api/soundmap.tags.php");
|
||||
//require_once (WP_PLUGIN_DIR . "/soundmap/api/soundmap.api.php");
|
||||
|
||||
if (!class_exists('Soundmap')){
|
||||
|
||||
@ -81,15 +83,15 @@ if (!class_exists('Soundmap')){
|
||||
function metaboxes_register_callback(){
|
||||
add_meta_box('soundmap-map', __("Place the Marker", 'soundmap'), array($this, 'map_meta_box'), 'marker', 'normal', 'high');
|
||||
add_meta_box('soundmap-media-info', __("Info", 'soundmap'), array($this,'info_meta_box'), 'marker', 'side', 'high');
|
||||
add_meta_box('soundmap-media-attachments', __("Media files attached.", 'soundmap'), array($this, 'attachments_meta_box'), 'marker', 'side', 'high');
|
||||
add_meta_box('soundmap-email', __("Uploader Mail", 'soundmap'), array($this, 'email_meta_box'), 'marker', 'side', 'low');
|
||||
//add_meta_box('soundmap-media-attachments', __("Media files attached.", 'soundmap'), array($this, 'attachments_meta_box'), 'marker', 'side', 'high');
|
||||
//add_meta_box('soundmap-email', __("Uploader Mail", 'soundmap'), array($this, 'email_meta_box'), 'marker', 'side', 'low');
|
||||
} //metaboxes_register_callback
|
||||
|
||||
function email_meta_box(){
|
||||
global $post;
|
||||
$mail = get_post_meta($post->ID, 'EMAIL', TRUE);
|
||||
echo "<p>" . $mail . "</p>";
|
||||
}
|
||||
}
|
||||
|
||||
function info_meta_box(){
|
||||
|
||||
@ -107,15 +109,18 @@ if (!class_exists('Soundmap')){
|
||||
$files = get_post_meta($post->ID, 'soundmap_attachments_id', FALSE);
|
||||
echo '<div id="soundmap-attachments">';
|
||||
echo '<div><input type="button" id="add_files" class="button button-primary button-large" value="Add Files"></div>';
|
||||
$out = '';
|
||||
$out = '';
|
||||
print_r($files);
|
||||
if ($files){
|
||||
foreach($files as $file){
|
||||
$data = wp_prepare_attachment_for_js( $file );
|
||||
$out .= "<div class='soundmap-attach-item'><div class='att-icon'><img src='{$data['icon']}'/></div>
|
||||
<div class='att-info'><a href='{$data['url']}'><strong>{$data['title']}</strong></a><br/>
|
||||
<span class='att-length'>{$data['fileLength']}</span><br/>
|
||||
<a href='#' class='delete-att-item'>Borrar</a></div><div class='clear'></div><input type='hidden' name='soundmap-att-ids[]' value='{$file}' /></div>";
|
||||
}
|
||||
foreach($files as $file){
|
||||
if ($file!=null) {
|
||||
$data = wp_prepare_attachment_for_js( $file );
|
||||
$out .= "<div class='soundmap-attach-item'><div class='att-icon'><img src='{$data['icon']}'/></div>
|
||||
<div class='att-info'><a href='{$data['url']}'><strong>{$data['title']}</strong></a><br/>
|
||||
<span class='att-length'>{$data['fileLength']}</span><br/>
|
||||
<a href='#' class='delete-att-item'>Borrar</a></div><div class='clear'></div><input type='hidden' name='soundmap-att-ids[]' value='{$file}' /></div>";
|
||||
}
|
||||
}
|
||||
}
|
||||
echo '<div id="soundmap-attachments-list">' . $out . '</div>';
|
||||
echo '</div>';
|
||||
@ -130,10 +135,8 @@ if (!class_exists('Soundmap')){
|
||||
echo '<input type="hidden" name="soundmap_map_noncename" id="soundmap_map_noncename" value="' .
|
||||
wp_create_nonce( plugin_basename(__FILE__) ) . '" />';
|
||||
echo '<div id="map_canvas"></div>';
|
||||
echo '<label for="soundmap-marker-lat">' . __('Latitud', 'soundmap') . '</label>';
|
||||
echo '<input type="text" name="soundmap_marker_lat" id="soundmap-marker-lat" value = "' . $soundmap_lat . '">';
|
||||
echo '<label for="soundmap-marker-lng">' . __('Longitud', 'soundmap') . '</label>';
|
||||
echo '<input type="text" name="soundmap_marker_lng" id="soundmap-marker-lng" value = "'. $soundmap_lng . '">';
|
||||
echo '<input type="hidden" name="soundmap_marker_lat" id="soundmap-marker-lat" value = "' . $soundmap_lat . '">';
|
||||
echo '<input type="hidden" name="soundmap_marker_lng" id="soundmap-marker-lng" value = "'. $soundmap_lng . '">';
|
||||
}
|
||||
|
||||
function load_options(){
|
||||
@ -165,16 +168,8 @@ if (!class_exists('Soundmap')){
|
||||
}// admin_menu
|
||||
|
||||
function enqueue_map_scripts(){
|
||||
/* Register the basic scripts needed for presenting the maps.
|
||||
- Google Maps
|
||||
- LeafletJS
|
||||
- Leaflet Google Plugin
|
||||
- LeafletCSS
|
||||
*/
|
||||
wp_enqueue_script( 'google-maps', 'http://maps.google.com/maps/api/js?v=3.7&sensor=false' ); // Google Maps
|
||||
wp_enqueue_script('leafletjs','http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.js',array(),'0.7.2',TRUE); // add Leaflet.js
|
||||
wp_enqueue_style('leafletcss','http://cdn.leafletjs.com/leaflet-0.7.2/leaflet.css',array(),'0.7.2','all'); // add CSS Leaflet
|
||||
wp_enqueue_script('leaflet-plugin-google', plugins_url('js/leaflet/plugins/Google.js', __FILE__), array('leafletjs', 'google-maps'), '0.7.2', TRUE);
|
||||
wp_enqueue_script('leafletjs','https://unpkg.com/leaflet@1.2.0/dist/leaflet.js',array(),'1.2.0',TRUE); // add Leaflet.js
|
||||
wp_enqueue_style('leafletcss','https://unpkg.com/leaflet@1.2.0/dist/leaflet.css',array(),'1.2.0','all'); // add CSS Leaflet
|
||||
}
|
||||
|
||||
function wp_enqueue_scripts(){
|
||||
|
||||
Loading…
Reference in New Issue
Block a user