map is showing and files are enqueued and included the right way

This commit is contained in:
lenovo
2022-10-30 18:58:08 +01:00
parent 92cb24cb89
commit c35adaa732
9 changed files with 307 additions and 118 deletions

View File

@@ -21,7 +21,7 @@ function ink_menu_page() {
}
function ink_gm_setting(){
?>
<h2> Google Map </h2>
<h2>Google Map</h2>
<form action="" method="post">
<div class="ink_set">
<label>Latitude : </label>
@@ -56,25 +56,24 @@ function my_init_script() {
wp_enqueue_script('my_script', $script_path, array('jquery'));
$style_path = plugins_url('style.css', __FILE__);
wp_enqueue_style('my_style', $style_path);
console_log("urlencode : " . urlencode("128 rue de la croix nivert, paris"));
}
add_shortcode('googlemap', 'show_google_map');
function show_google_map() {
global $wpdb;
$GoogleMap_Latitude = get_option('googleMap_latitude_position');
$GoogleMap_Longitude = get_option('googleMap_longitude_position');
$GoogleMap_zoom = get_option('map_zoom_value');
//src="https://maps.googleapis.com/maps/api/geocode/json?address=paris&key=AIzaSyCvdGV2ssD4ov4a9CuIlQhoJyz5gWWiSvE
?>
<script
src="http://maps.googleapis.com/maps/api/js?&sensor=false?&key=AIzaSyCvdGV2ssD4ov4a9CuIlQhoJyz5gWWiSvE">
</script>
<div class="latitude"><?php echo $GoogleMap_Latitude; ?></div>
<div class="longitude" ><?php echo $GoogleMap_Longitude; ?></div>
<div class="zoom"><?php echo $GoogleMap_zoom; ?></div>
<div id="showmap"> </div>
<?php
return '
<script
src="https://maps.googleapis.com/maps/api/js?&sensor=false?&key=AIzaSyCvdGV2ssD4ov4a9CuIlQhoJyz5gWWiSvE">
</script>
<div class="latitude"><?php echo $GoogleMap_Latitude; ?></div>
<div class="longitude" ><?php echo $GoogleMap_Longitude; ?></div>
<div class="zoom"><?php echo $GoogleMap_zoom; ?></div>
<div id="showmap"> </div>
';
}
add_shortcode('googlemap', 'show_google_map');
?>

View File

@@ -8,108 +8,92 @@ Version: 1.0.0
Author URI:
*/
add_action( 'init', 'my_init_script' );
function my_init_script() {
$style_path = plugins_url('style.css', __FILE__);
wp_enqueue_style('my_style', $style_path);
include_once(dirname(__FILE__) . '/mp_console_log.php');
require_once(dirname(__FILE__) . '/mp_url_api.php');
add_action( 'wp_enqueue_scripts', 'wpa_enqueue_scripts' );
function wpa_enqueue_scripts() {
wp_enqueue_style( 'mp_style', plugins_url('mp_style.css', __FILE__), '', '', false);
wp_enqueue_script('mp_init_map', plugins_url('mp_init_map.js', __FILE__), '', '', true);
wp_enqueue_script('mp_google_api', mp_url_api(), ['mp_init_map'], '', true);
}
// if block theme : https://wordpress.org/support/topic/twenty-twenty-two-cpt-template-error-theme-without-header-is-deprecated/
function add_map_api(){
?>
<script type="text/javascript" src="https://www.openstreetmap.org/openlayers/OpenStreetMap.js"></script>
<script type="text/javascript" defer>
//<![CDATA[
import Map from 'ol/Map';
import View from 'ol/View';
import OSM from 'ol/source/OSM';
import TileLayer from 'ol/layer/Tile';
new Map({
layers: [
new TileLayer({source: new OSM()}),
],
view: new View({
center: [0, 0],
zoom: 2,
}),
target: 'map',
});
//]]>
</script>
<?php
add_shortcode('lejourduprof_map', 'mp_add_div');
function mp_add_div() {
$mp_api_script = '<div id="map">map here</div>';
return $mp_api_script;
}
//add_action('wp_head', 'add_map_api');
function print_content($content){
// print only on the page 'map', and other conditions
// https://developer.wordpress.org/reference/hooks/the_content/
if (!( is_page('map_prof') && in_the_loop() && is_main_query() ))
return $content;
// https://developer.wordpress.org/reference/functions/get_posts/
$get_posts_args = array(
'numberposts' => -1,
'post_status' => 'publish',
);
$posts_list = get_posts($get_posts_args);
$content .= "<p>";
$content .= "nb posts published : ";
$content .= count($posts_list);
$content .= "</p>";
foreach ($posts_list as $post_value) {
$content .= "<div>";
$content .= "- post title: [";
$content .= $post_value->post_title;
$content .= "] - content: [";
$content .= $post_value->post_content;
$content .= "]";
$content .= "</div>";
}
// TESTS : print posts full content
//
//$posts_list = get_posts($args);
//$content .= "<p>";
//$content .= "nb posts published : ";
//$content .= count($posts_list);
//$content .= "</p>";
//foreach ($posts_list as $post_key => $post_value) {
// $content .= "<p>";
// $content .= "post content : ";
// $content .= $post_key;
// $content .= " : ";
// $content .= "<br>";
// foreach ($post_value as $key => $value) {
// $content .= "- [";
// $content .= $key;
// $content .= "]: [";
// $content .= $value;
// $content .= "]<br>";
// }
// $content .= "</p>";
//}
$content .= '<div id="map"></div>';
$content .= '<script>
function initMap() {
var location = {lat: 38.8833, lng: -77.0167};
var map = new google.maps.Map(document.getElementById("map"), {
zoom: 12,
center: location
});
var marker = new google.maps.Marker({
position: location,
map: map
});
}
</script>';
$content .= '<script async defer src="https://maps.googleapis.com/maps/api/js?sensor=false&key=AIzaSyCvdGV2ssD4ov4a9CuIlQhoJyz5gWWiSvE&callback=initMap"></script>';
return $content;
};
add_action('the_content', 'print_content', 1);
//function print_content($content){
//
// // print only on the page 'map', and other conditions
// // https://developer.wordpress.org/reference/hooks/the_content/
// if (!( is_page('map_prof') && in_the_loop() && is_main_query() ))
// return $content;
//
// // https://developer.wordpress.org/reference/functions/get_posts/
// $get_posts_args = array(
// 'numberposts' => -1,
// 'post_status' => 'publish',
// );
//
// $posts_list = get_posts($get_posts_args);
// $content .= "<p>";
// $content .= "nb posts published : ";
// $content .= count($posts_list);
// $content .= "</p>";
// foreach ($posts_list as $post_value) {
// $content .= "<div>";
// $content .= "- post title: [";
// $content .= $post_value->post_title;
// $content .= "] - content: [";
// $content .= $post_value->post_content;
// $content .= "]";
// $content .= "</div>";
// }
//
// // TESTS : print posts full content
// //
// //$posts_list = get_posts($args);
// //$content .= "<p>";
// //$content .= "nb posts published : ";
// //$content .= count($posts_list);
// //$content .= "</p>";
// //foreach ($posts_list as $post_key => $post_value) {
// // $content .= "<p>";
// // $content .= "post content : ";
// // $content .= $post_key;
// // $content .= " : ";
// // $content .= "<br>";
// // foreach ($post_value as $key => $value) {
// // $content .= "- [";
// // $content .= $key;
// // $content .= "]: [";
// // $content .= $value;
// // $content .= "]<br>";
// // }
// // $content .= "</p>";
// //}
//
// $content .= '<div id="map"></div>';
// $content .= '<script>
// function initMap() {
// var location = {lat: 38.8833, lng: -77.0167};
// var map = new google.maps.Map(document.getElementById("map"), {
// zoom: 12,
// center: location
// });
// var marker = new google.maps.Marker({
// position: location,
// map: map
// });
// }
// </script>';
// $content .= '<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCvdGV2ssD4ov4a9CuIlQhoJyz5gWWiSvE&callback=initMap"></script>';
//
// return $content;
//};
//add_action('the_content', 'print_content', 1);
?>

View File

@@ -0,0 +1,11 @@
<?php
// https://stackify.com/how-to-log-to-console-in-php/
function mp_console_log($output, $with_script_tags = true) {
$js_code = 'console.log(' . json_encode($output, JSON_HEX_TAG) .
');';
if ($with_script_tags) {
$js_code = '<script>' . $js_code . '</script>';
}
echo $js_code;
}
?>

View File

@@ -0,0 +1,11 @@
function mp_init_map() {
var location = {lat: 38.8833, lng: -77.0167};
var map = new google.maps.Map(document.getElementById("map"), {
zoom: 12,
center: location
});
var marker = new google.maps.Marker({
position: location,
map: map
});
}

View File

@@ -2,3 +2,6 @@
height: 500px;
width: 100%;
}
#temoin {
color: blue;
}

View File

@@ -0,0 +1,25 @@
<?php
function mp_url_api() {
$mp_url = array(
'src' => 'https://maps.googleapis.com/maps/api/js',
'sensor' => 'false',
'key' => 'AIzaSyCvdGV2ssD4ov4a9CuIlQhoJyz5gWWiSvE',
'callback' => 'mp_init_map',
);
$mp_src = "";
foreach ($mp_url as $url_key => $url_value) {
if ($url_key === 'src') {
$mp_src .= $url_value;
if (count($mp_url > 1))
$mp_src .= "?";
}
else
$mp_src .= "&" . $url_key . "=" . $url_value;
};
//$mp_api_script = '<script async defer ';
//$mp_api_script .= 'src="' . $mp_src . '"></script>';
//return $mp_api_script;
return $mp_src;
}
?>