we can pass code from php to js

This commit is contained in:
lenovo
2022-10-31 10:21:24 +01:00
parent fe6810f159
commit 25be1d2a99
6 changed files with 59 additions and 155 deletions

132
:w
View File

@@ -1,132 +0,0 @@
<?php
/*
Plugin Name: map_prof
Plugin URI:
Description: add/remove locations on map at publication/deletion of posts
Author: hugogogo
Version: 1.0.0
Author URI:
*/
include_once('./console_log.php');
//require_once('./mp_gapi.php');
function wpa_enqueue_scripts() {
$path = plugins_url('mp_style.css', __FILE__);
wp_enqueue_style('mp_style', $path, [], null, false);
// $path = mp_url_api();
// wp_enqueue_script('mp_gapi', $path, [], null, true);
$path = plugins_url('mp_create_map.js', __FILE__);
// wp_enqueue_script('mp_create_map', $path, ['mp_gapi'], null, true);
wp_enqueue_script('mp_create_map', $path, [], null, true);
}
add_action( 'wp_enqueue_scripts', 'wpa_enqueue_scripts' );
function mp_add_div() {
$mp_api_script = '<div id="map"></div>';
return $mp_api_script;
}
function mp_add_api() {
$mp_create_url = array(
'src' => 'https://maps.googleapis.com/maps/api/js',
'key' => 'AIzaSyCvdGV2ssD4ov4a9CuIlQhoJyz5gWWiSvE',
'callback' => 'mp_init_map',
);
$mp_src = "";
foreach ($mp_create_url as $url_key => $url_value) {
if ($url_key === 'src') {
$mp_src .= $url_value;
if (count($mp_create_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;
}
function show_map() {
$mp_api_script = mp_add_div();
$mp_api_script .= mp_add_api();
return $mp_api_script;
}
add_shortcode('lejourduprof_map', 'show_map');
//add_shortcode('lejourduprof_map', 'mp_add_div');
//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

@@ -15,6 +15,8 @@
- [my post on unix stack](https://unix.stackexchange.com/questions/722503/symlink-doent-works-with-nginx-and-php-fpm-and-docker/722511#722511)
- [my post on wordpress stack](https://wordpress.stackexchange.com/questions/410735/i-dont-understand-how-symlinks-in-plugin-work)
- [maps api in php](http://www.learningaboutelectronics.com/Articles/Google-maps-API-JSON-PHP.php)
- [google maps api url parameters](https://developers.google.com/maps/documentation/javascript/url-params)
---
---

View File

@@ -8,32 +8,49 @@ Version: 1.0.0
Author URI:
*/
include_once(dirname(__FILE__) . '/mp_console_log.php');
require_once(dirname(__FILE__) . '/mp_url_api.php');
require_once(dirname(__FILE__) . '/mp_add_to_scripts.php');
add_action( 'wp_enqueue_scripts', 'wpa_enqueue_scripts' );
function wpa_enqueue_scripts() {
/**
* add scripts and styles to the header or the footer
*/
function mp_enqueue_scripts() {
wp_enqueue_style( 'mp_style', plugins_url('mp_style.css', __FILE__), '', '', '');
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);
// wp_register_script('mp_init_map', plugins_url('mp_init_map.js', __FILE__), '', '', true);
// wp_register_script('mp_google_api', mp_url_api(), ['mp_init_map'], '', true);
mp_get_locations();
mp_get_markers();
}
add_action( 'wp_enqueue_scripts', 'mp_enqueue_scripts' );
//function wpa_defer_scripts($tag, $handle) {
// if ('mp_google_api' === $handle)
// return str_replace(' src="', ' async defer src="', $tag);
// if ('mp_googe_api' === $handle)
// return str_replace(' src="', ' defer src="', $tag);
// return $tag;
//}
//add_filter('script_loader_tag', 'wpa_defer_scripts', 10, 2);
add_shortcode('lejourduprof_map', 'mp_add_div');
/**
* to add a tag, like defer or async, to a script
*/
function mp_tag_scripts($tag, $handle) {
if ('mp_googe_api' === $handle)
return str_replace(' src="', ' async src="', $tag);
return $tag;
}
add_filter('script_loader_tag', 'mp_tag_scripts', 10, 2);
/**
* when 'shortcode' in page, replace by 'return'
*/
function mp_add_div() {
$mp_api_script = '<div id="ljdp_map">map here</div>';
return $mp_api_script;
}
add_shortcode('lejourduprof_map', 'mp_add_div');
//function print_content($content){

View File

@@ -0,0 +1,17 @@
<?php
function mp_get_locations() {
$locations = '
let locations = [
{lat: 38.8833, lng: -77.0167},
{lat: 39.8833, lng: -76.0167},
];
';
wp_add_inline_script('mp_init_map', $locations, 'before');
}
function mp_get_markers() {
$markers = 'let icon_url = "'
. '/wp-content/plugins/map_prof/marker.png'
. '";';
wp_add_inline_script('mp_init_map', $markers, 'before');
}
?>

View File

@@ -1,9 +1,12 @@
function mp_init_map() {
var locations = [
{lat: 38.8833, lng: -77.0167},
{lat: 39.8833, lng: -76.0167},
];
var map = new google.maps.Map(
/*
* following variable are created by mp_locations.php
* - let locations
* - let icon_url
*/
let map = new google.maps.Map(
document.getElementById("ljdp_map"),
{
zoom: 5,
@@ -11,11 +14,9 @@ function mp_init_map() {
center: locations[0],
}
);
var marker, icon;
// icon = "/wp-content/plugins/map_prof/marker.png";
let marker, icon;
icon = {
//url: document.location.href + "marker.png",
url: "/wp-content/plugins/map_prof/marker.png",
url: icon_url,
scaledSize: new google.maps.Size(35, 50)
};
for (loc of locations) {

View File

@@ -2,7 +2,6 @@
function mp_url_api() {
$mp_url = array(
'src' => 'https://maps.googleapis.com/maps/api/js',
'sensor' => 'false',
'key' => 'AIzaSyCvdGV2ssD4ov4a9CuIlQhoJyz5gWWiSvE',
'callback' => 'mp_init_map',
);