lrullo/LaFundicioSoundMap
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Version Comunitat de Memories v0

Browse Source
This commit is contained in:
Luca 2017-12-27 02:10:05 +01:00
parent dcacbcd466
commit 81b2406aa2
3 changed files with 285 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
js/soundmap.add.js
View File

@ -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,9 +106,6 @@
});
$(document).ready(function(){
soundmap.initMap();
});

241
mapa.php Executable file
View 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>

31
soundmap.php
View File

@ -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,8 +83,8 @@ 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(){
@ -108,8 +110,10 @@ if (!class_exists('Soundmap')){
echo '<div id="soundmap-attachments">';
echo '<div><input type="button" id="add_files" class="button button-primary button-large" value="Add Files"></div>';
$out = '';
print_r($files);
if ($files){
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/>
@ -117,6 +121,7 @@ if (!class_exists('Soundmap')){
<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&amp;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(){