Creates geocoordinate-item-metadatum block to have client-side script for displaying maps. #692.
This commit is contained in:
parent
bf28bc96a8
commit
e463b935b8
|
@ -11,6 +11,7 @@
|
||||||
:zoom-animation="true"
|
:zoom-animation="true"
|
||||||
@click="onMapClick"
|
@click="onMapClick"
|
||||||
:options="{
|
:options="{
|
||||||
|
name: 'map--' + itemMetadatumIdentifier,
|
||||||
trackResize: false // We handle this manually in the component
|
trackResize: false // We handle this manually in the component
|
||||||
}">
|
}">
|
||||||
<l-tile-layer
|
<l-tile-layer
|
||||||
|
|
|
@ -63,19 +63,33 @@ class GeoCoordinate extends Metadata_Type {
|
||||||
$item_metadatum_id .= $metadatum->get_parent() ? ( $metadatum->get_parent() . '_parent_meta_id-') : '';
|
$item_metadatum_id .= $metadatum->get_parent() ? ( $metadatum->get_parent() . '_parent_meta_id-') : '';
|
||||||
|
|
||||||
$return = '';
|
$return = '';
|
||||||
$return .= '<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.3/dist/leaflet.css"
|
if ( $item_metadata->is_multiple() ) {
|
||||||
integrity="sha256-kLaT2GOSpHechhsozzB+flnD+zUyjE2LlfWPgU04xyI="
|
$prefix = $item_metadata->get_multivalue_prefix();
|
||||||
crossorigin=""/>';
|
$suffix = $item_metadata->get_multivalue_suffix();
|
||||||
$return .= '<script src="https://unpkg.com/leaflet@1.9.3/dist/leaflet.js"
|
$separator = $item_metadata->get_multivalue_separator();
|
||||||
integrity="sha256-WBkoXOwTeyKclOHuWtc+i2uENFpDZ9YPdf5Hf+D7ewM="
|
|
||||||
crossorigin=""></script>';
|
foreach ( $value as $coordinate ) {
|
||||||
$return .= '<script type="text/javascript">
|
|
||||||
function loadMap() {
|
$coordinate_as_array = explode(",", $coordinate);
|
||||||
map = L.map("map--' . $item_metadatum_id . '").setView([51.505, -0.09], 13);
|
$latitude = isset($coordinate_as_array[0]) ? $coordinate_as_array[0] : '';
|
||||||
|
$longitude = isset($coordinate_as_array[1]) ? $coordinate_as_array[1] : '';
|
||||||
|
|
||||||
|
$single_value = "<span class='tainacan-coordinates' data-latitude='{$latitude}' data-longitude='{$longitude}'><span>{$latitude}</span><span class='coordinates-separator'>,</span><span>{$longitude}</span></span>";
|
||||||
|
$return .= empty($return)
|
||||||
|
? $prefix . $single_value . $suffix
|
||||||
|
: $separator . $prefix . $single_value . $suffix;
|
||||||
}
|
}
|
||||||
loadMap();
|
|
||||||
</script>';
|
} else {
|
||||||
$return .= '<div data-module="tainacan-maps" id="map--' . $item_metadatum_id . '" style="height: 320px; width:100%; border: 1px solid var(--tainacan-input-border-color, #dbdbdb);"></div/>';
|
$coordinate_as_array = explode(",", $value);
|
||||||
return $return;
|
$latitude = isset($coordinate_as_array[0]) ? $coordinate_as_array[0] : '';
|
||||||
|
$longitude = isset($coordinate_as_array[1]) ? $coordinate_as_array[1] : '';
|
||||||
|
|
||||||
|
$return .= "<span class='tainacan-coordinates' data-latitude='{$latitude}' data-longitude='{$longitude}'><span>{$latitude}</span><span class='coordinates-separator'>,</span><span>{$longitude}</span></span>";
|
||||||
|
}
|
||||||
|
|
||||||
|
return '<span id="tainacan-geocoordinatemetadatum--' . $item_metadatum_id . '" data-module="geocoordinate-item-metadatum">
|
||||||
|
' . $return . '
|
||||||
|
</span>';
|
||||||
}
|
}
|
||||||
}
|
}
|
|
@ -0,0 +1,55 @@
|
||||||
|
{
|
||||||
|
"$schema": "https://schemas.wp.org/trunk/block.json",
|
||||||
|
"name": "tainacan/geocoorinate-item-metadatum",
|
||||||
|
"title": "Tainacan Geo Coordinate Item Metadatum",
|
||||||
|
"apiVersion": 2,
|
||||||
|
"category": "tainacan-blocks",
|
||||||
|
"keywords": [ "item", "location", "geographic", "coordinates", "metadatum", "field", "value" ],
|
||||||
|
"description": "A single item geographic metadatum, containing location information.",
|
||||||
|
"textdomain": "tainacan",
|
||||||
|
"parent": [],
|
||||||
|
"example": {
|
||||||
|
"attributes": {
|
||||||
|
"content": "preview"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"attributes": {
|
||||||
|
"content": {
|
||||||
|
"type": "array",
|
||||||
|
"source": "query",
|
||||||
|
"selector": "div"
|
||||||
|
},
|
||||||
|
"dataSource": {
|
||||||
|
"type": "string",
|
||||||
|
"default": "selection"
|
||||||
|
},
|
||||||
|
"templateMode": {
|
||||||
|
"type": "boolean",
|
||||||
|
"default": false
|
||||||
|
},
|
||||||
|
"collectionId": {
|
||||||
|
"type": "integer"
|
||||||
|
},
|
||||||
|
"itemId": {
|
||||||
|
"type": "integer"
|
||||||
|
},
|
||||||
|
"metadatumId": {
|
||||||
|
"type": "integer"
|
||||||
|
},
|
||||||
|
"isModalOpen": {
|
||||||
|
"type": "boolean",
|
||||||
|
"default": false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"usesContext": [
|
||||||
|
"tainacan/itemId"
|
||||||
|
],
|
||||||
|
"supports": {
|
||||||
|
"align": ["full", "wide"],
|
||||||
|
"multiple": true,
|
||||||
|
"html": true,
|
||||||
|
"anchor": true
|
||||||
|
},
|
||||||
|
"editorScript": "geocoordinate-item-metadatum",
|
||||||
|
"editorStyle": "geocoordinate-item-metadatum"
|
||||||
|
}
|
|
@ -0,0 +1 @@
|
||||||
|
export default [];
|
|
@ -0,0 +1,165 @@
|
||||||
|
const { __ } = wp.i18n;
|
||||||
|
const { Button, Placeholder, ToolbarDropdownMenu, SVG, Path } = wp.components;
|
||||||
|
|
||||||
|
const ServerSideRender = wp.serverSideRender;
|
||||||
|
const { useBlockProps, BlockControls, AlignmentControl } = (tainacan_blocks.wp_version < '5.2' ? wp.editor : wp.blockEditor );
|
||||||
|
|
||||||
|
import SingleItemMetadatumModal from '../../js/selection/single-item-metadatum-modal.js';
|
||||||
|
import TainacanBlocksCompatToolbar from '../../js/compatibility/tainacan-blocks-compat-toolbar.js';
|
||||||
|
import getCollectionIdFromPossibleTemplateEdition from '../../js/template/tainacan-blocks-single-item-template-mode.js';
|
||||||
|
|
||||||
|
export default function ({ attributes, setAttributes, className, isSelected }) {
|
||||||
|
|
||||||
|
let {
|
||||||
|
content,
|
||||||
|
collectionId,
|
||||||
|
itemId,
|
||||||
|
metadatumId,
|
||||||
|
metadatumType,
|
||||||
|
isModalOpen,
|
||||||
|
dataSource,
|
||||||
|
templateMode,
|
||||||
|
} = attributes;
|
||||||
|
|
||||||
|
// Gets blocks props from hook
|
||||||
|
const blockProps = tainacan_blocks.wp_version < '5.6' ? { className: className } : useBlockProps( {
|
||||||
|
className: {
|
||||||
|
[ `has-text-align-${ textAlign }` ]: textAlign,
|
||||||
|
}
|
||||||
|
} );
|
||||||
|
const currentWPVersion = (typeof tainacan_blocks != 'undefined') ? tainacan_blocks.wp_version : tainacan_plugin.wp_version;
|
||||||
|
|
||||||
|
// Checks if we are in template mode, if so, gets the collection Id from URL.
|
||||||
|
if ( !templateMode ) {
|
||||||
|
const possibleCollectionId = getCollectionIdFromPossibleTemplateEdition();
|
||||||
|
if (possibleCollectionId) {
|
||||||
|
collectionId = possibleCollectionId;
|
||||||
|
templateMode = true
|
||||||
|
setAttributes({
|
||||||
|
collectionId: collectionId,
|
||||||
|
templateMode: templateMode
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return content == 'preview' ?
|
||||||
|
<div className={className}>
|
||||||
|
<img
|
||||||
|
width="100%"
|
||||||
|
src={ `${tainacan_blocks.base_url}/assets/images/related-carousel-items.png` } />
|
||||||
|
</div>
|
||||||
|
: (
|
||||||
|
<div { ...blockProps }>
|
||||||
|
{ dataSource == 'selection' ? (
|
||||||
|
<BlockControls group="other">
|
||||||
|
{
|
||||||
|
TainacanBlocksCompatToolbar({
|
||||||
|
label: templateMode ? __('Select metadatum', 'tainacan') : __('Select item metadatum', 'tainacan'),
|
||||||
|
icon: <svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="-2 -2 24 24"
|
||||||
|
height="24px"
|
||||||
|
width="24px">
|
||||||
|
<path d="m 6,3.9960001 h 5.016 c 0.544,0 1.008,0.192 1.392,0.576 L 19.416,11.58 c 0.384,0.384 0.576,0.856 0.576,1.416 0,0.56 -0.192,1.032 -0.576,1.416 l -4.992,4.992 c -0.176,0.176 -0.392,0.32 -0.648,0.432 -0.24,0.112 -0.496,0.168 -0.768,0.168 -0.272,0 -0.536,-0.056 -0.792,-0.168 -0.24,-0.112 -0.448,-0.256 -0.624,-0.432 L 4.608,12.42 c -0.4,-0.4 -0.6,-0.872 -0.6,-1.416 V 5.988 C 4.008,5.428 4.2,4.956 4.584,4.572 4.968,4.188 5.44,3.996 6,3.9960001 Z m 1.512,4.992 c 0.416,0 0.768,-0.144 1.056,-0.432 C 8.856,8.2680001 9,7.916 9,7.5 9,7.084 8.856,6.732 8.568,6.444 8.28,6.14 7.928,5.988 7.512,5.988 7.096,5.988 6.736,6.14 6.432,6.444 6.144,6.732 6,7.084 6,7.5 c 0,0.416 0.144,0.7680001 0.432,1.0560001 0.304,0.288 0.664,0.432 1.08,0.432 z"/>
|
||||||
|
</svg>,
|
||||||
|
onClick: () => {
|
||||||
|
isModalOpen = true;
|
||||||
|
setAttributes( {
|
||||||
|
isModalOpen: isModalOpen
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
</BlockControls>
|
||||||
|
): null
|
||||||
|
}
|
||||||
|
|
||||||
|
{ isSelected ?
|
||||||
|
(
|
||||||
|
<div>
|
||||||
|
{ isModalOpen ?
|
||||||
|
<SingleItemMetadatumModal
|
||||||
|
modalTitle={ templateMode ? __('Select one metadatum', 'tainacan') : __('Select one item to render its metadata', 'tainacan') }
|
||||||
|
existingCollectionId={ collectionId }
|
||||||
|
existingItemId={ itemId }
|
||||||
|
existingMetadatumId={ metadatumId }
|
||||||
|
isTemplateMode={ templateMode }
|
||||||
|
onSelectCollection={ (selectedCollectionId) => {
|
||||||
|
collectionId = selectedCollectionId;
|
||||||
|
setAttributes({
|
||||||
|
collectionId: collectionId
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
onSelectItem={ (selectedItemId) => {
|
||||||
|
itemId = selectedItemId;
|
||||||
|
setAttributes({
|
||||||
|
itemId: itemId
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
onApplySelectedMetadatum={ (selectedMetadatum) => {
|
||||||
|
metadatumId = selectedMetadatum.metadatumId;
|
||||||
|
metadatumType = selectedMetadatum.metadatumType;
|
||||||
|
|
||||||
|
setAttributes({
|
||||||
|
metadatumId: metadatumId,
|
||||||
|
metadatumType: metadatumType,
|
||||||
|
isModalOpen: false
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
onCancelSelection={ () => setAttributes({ isModalOpen: false }) }/>
|
||||||
|
: null
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
) : null
|
||||||
|
}
|
||||||
|
|
||||||
|
{ dataSource == 'selection' && !(collectionId && (templateMode || itemId) && metadatumId) ? (
|
||||||
|
<Placeholder
|
||||||
|
className="tainacan-block-placeholder"
|
||||||
|
icon={(
|
||||||
|
<img
|
||||||
|
width={148}
|
||||||
|
src={ `${tainacan_blocks.base_url}/assets/images/tainacan_logo_header.svg` }
|
||||||
|
alt="Tainacan Logo"/>
|
||||||
|
)}>
|
||||||
|
<p>
|
||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="-2 -2 24 24"
|
||||||
|
height="24px"
|
||||||
|
width="24px">
|
||||||
|
<path d="m 6,3.9960001 h 5.016 c 0.544,0 1.008,0.192 1.392,0.576 L 19.416,11.58 c 0.384,0.384 0.576,0.856 0.576,1.416 0,0.56 -0.192,1.032 -0.576,1.416 l -4.992,4.992 c -0.176,0.176 -0.392,0.32 -0.648,0.432 -0.24,0.112 -0.496,0.168 -0.768,0.168 -0.272,0 -0.536,-0.056 -0.792,-0.168 -0.24,-0.112 -0.448,-0.256 -0.624,-0.432 L 4.608,12.42 c -0.4,-0.4 -0.6,-0.872 -0.6,-1.416 V 5.988 C 4.008,5.428 4.2,4.956 4.584,4.572 4.968,4.188 5.44,3.996 6,3.9960001 Z m 1.512,4.992 c 0.416,0 0.768,-0.144 1.056,-0.432 C 8.856,8.2680001 9,7.916 9,7.5 9,7.084 8.856,6.732 8.568,6.444 8.28,6.14 7.928,5.988 7.512,5.988 7.096,5.988 6.736,6.14 6.432,6.444 6.144,6.732 6,7.084 6,7.5 c 0,0.416 0.144,0.7680001 0.432,1.0560001 0.304,0.288 0.664,0.432 1.08,0.432 z"/>
|
||||||
|
</svg>
|
||||||
|
{__('Select an item metadata to display its label and value.', 'tainacan')}
|
||||||
|
</p>
|
||||||
|
<Button
|
||||||
|
isPrimary
|
||||||
|
type="button"
|
||||||
|
onClick={ () => {
|
||||||
|
isModalOpen = true;
|
||||||
|
setAttributes( {
|
||||||
|
isModalOpen: isModalOpen
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}>
|
||||||
|
{__('Select Item Metadatum', 'tainacan')}
|
||||||
|
</Button>
|
||||||
|
</Placeholder>
|
||||||
|
) : null
|
||||||
|
}
|
||||||
|
|
||||||
|
{ (collectionId && (itemId || templateMode) && metadatumId) ? (
|
||||||
|
<div className={ 'item-metadatum-edit-container' }>
|
||||||
|
<ServerSideRender
|
||||||
|
block="tainacan/item-metadatum"
|
||||||
|
attributes={ attributes }
|
||||||
|
httpMethod={ currentWPVersion >= '5.5' ? 'POST' : 'GET' }
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
) : null
|
||||||
|
}
|
||||||
|
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
};
|
|
@ -0,0 +1,14 @@
|
||||||
|
const { SVG, Path } = wp.components;
|
||||||
|
|
||||||
|
export default (
|
||||||
|
<SVG
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
height="24px"
|
||||||
|
width="24px">
|
||||||
|
<Path
|
||||||
|
d="m 6,3.9960001 h 5.016 c 0.544,0 1.008,0.192 1.392,0.576 L 19.416,11.58 c 0.384,0.384 0.576,0.856 0.576,1.416 0,0.56 -0.192,1.032 -0.576,1.416 l -4.992,4.992 c -0.176,0.176 -0.392,0.32 -0.648,0.432 -0.24,0.112 -0.496,0.168 -0.768,0.168 -0.272,0 -0.536,-0.056 -0.792,-0.168 -0.24,-0.112 -0.448,-0.256 -0.624,-0.432 L 4.608,12.42 c -0.4,-0.4 -0.6,-0.872 -0.6,-1.416 V 5.988 C 4.008,5.428 4.2,4.956 4.584,4.572 4.968,4.188 5.44,3.996 6,3.9960001 Z m 1.512,4.992 c 0.416,0 0.768,-0.144 1.056,-0.432 C 8.856,8.2680001 9,7.916 9,7.5 9,7.084 8.856,6.732 8.568,6.444 8.28,6.14 7.928,5.988 7.512,5.988 7.096,5.988 6.736,6.14 6.432,6.444 6.144,6.732 6,7.084 6,7.5 c 0,0.416 0.144,0.7680001 0.432,1.0560001 0.304,0.288 0.664,0.432 1.08,0.432 z"
|
||||||
|
/>
|
||||||
|
</SVG>
|
||||||
|
);
|
||||||
|
|
|
@ -0,0 +1,15 @@
|
||||||
|
import tainacanRegisterBlockType from '../../js/compatibility/tainacan-blocks-compat-register.js';
|
||||||
|
|
||||||
|
import metadata from './block.json';
|
||||||
|
import icon from './icon.js';
|
||||||
|
import edit from './edit.js';
|
||||||
|
import save from './save.js';
|
||||||
|
import deprecated from './deprecated.js';
|
||||||
|
|
||||||
|
tainacanRegisterBlockType({
|
||||||
|
metadata,
|
||||||
|
icon,
|
||||||
|
edit,
|
||||||
|
save,
|
||||||
|
deprecated
|
||||||
|
});
|
|
@ -0,0 +1,3 @@
|
||||||
|
export default function() {
|
||||||
|
return null
|
||||||
|
};
|
|
@ -0,0 +1,51 @@
|
||||||
|
<?php
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Renders the content of the item metadata block
|
||||||
|
* using Tainacan template functions
|
||||||
|
*/
|
||||||
|
function tainacan_blocks_render_geocoordinate_item_metadatum( $block_attributes, $content, $block ) {
|
||||||
|
|
||||||
|
// Basic check, otherwise we don't have nothing to render here.
|
||||||
|
$item_id = !empty($block->context['tainacan/itemId']) ? $block->context['tainacan/itemId'] : (isset($block_attributes['itemId']) ? $block_attributes['itemId'] : false);
|
||||||
|
$metadatum_id = isset($block_attributes['metadatumId']) ? $block_attributes['metadatumId'] : false;
|
||||||
|
$collection_id = isset($block_attributes['collectionId']) ? $block_attributes['collectionId'] : false;
|
||||||
|
$data_source = isset($block_attributes['dataSource']) ? $block_attributes['dataSource'] : 'parent';
|
||||||
|
$template_mode = isset($block_attributes['templateMode']) ? $block_attributes['templateMode'] : false;
|
||||||
|
|
||||||
|
if ( !$metadatum_id )
|
||||||
|
return '';
|
||||||
|
|
||||||
|
// Builds args from backend query
|
||||||
|
$args = array(
|
||||||
|
'metadata' => $metadatum_id,
|
||||||
|
'before_title' => '<h3 class="wp-block-tainacan-item-metadatum__metadatum-label">',
|
||||||
|
'after_title' => '</h3>',
|
||||||
|
'before_value' => '<p class="wp-block-tainacan-item-metadatum__metadatum-value">',
|
||||||
|
'after_value' => '</p>'
|
||||||
|
);
|
||||||
|
|
||||||
|
// Classes from block and Text alignment
|
||||||
|
$wrapper_attributes = get_block_wrapper_attributes(
|
||||||
|
array(
|
||||||
|
'class' => 'metadata-type-$type',
|
||||||
|
)
|
||||||
|
);
|
||||||
|
$args['before'] = '<div ' . $wrapper_attributes . '>';
|
||||||
|
$args['after'] = '</div>';
|
||||||
|
|
||||||
|
if ( $template_mode && $collection_id ) {
|
||||||
|
// Checks if we are in the edit page or in the published
|
||||||
|
$current_post = get_post();
|
||||||
|
$collection_pt_pattern = '/' . \Tainacan\Entities\Collection::$db_identifier_prefix . '\d+' . \Tainacan\Entities\Collection::$db_identifier_sufix . '/';
|
||||||
|
|
||||||
|
if ( $current_post === NULL )
|
||||||
|
return '<div>Map Demo</div>';
|
||||||
|
else if ( $current_post->post_type !== false && preg_match($collection_pt_pattern, $current_post->post_type) ) {
|
||||||
|
return tainacan_get_the_metadata( $args, $current_post->ID );
|
||||||
|
}
|
||||||
|
|
||||||
|
} else if ( $item_id ) {
|
||||||
|
return tainacan_get_the_metadata( $args, $item_id );
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,5 @@
|
||||||
|
.tainacan-leaflet-map-container {
|
||||||
|
display: block;
|
||||||
|
height: 320px;
|
||||||
|
width:100%;
|
||||||
|
}
|
|
@ -0,0 +1,53 @@
|
||||||
|
// TAINACAN LEAFLET MAP COMPONENT --------------------------------------------------------
|
||||||
|
//
|
||||||
|
// Counts on some HMTL markup to instantiate some leaflet maps
|
||||||
|
import * as TainacanLeaflet from "leaflet";
|
||||||
|
import 'leaflet/dist/leaflet.css';
|
||||||
|
import iconUrl from 'leaflet/dist/images/marker-icon.png';
|
||||||
|
import iconRetinaUrl from 'leaflet/dist/images/marker-icon-2x.png';
|
||||||
|
import shadowUrl from 'leaflet/dist/images/marker-shadow.png';
|
||||||
|
|
||||||
|
delete TainacanLeaflet.Icon.Default.prototype._getIconUrl;
|
||||||
|
TainacanLeaflet.Icon.Default.mergeOptions({
|
||||||
|
iconRetinaUrl: iconRetinaUrl,
|
||||||
|
iconUrl: iconUrl,
|
||||||
|
shadowUrl: shadowUrl
|
||||||
|
});
|
||||||
|
|
||||||
|
/* Loads and instantiates map components passed to data-module="geocoordinate-item-metadatum"*/
|
||||||
|
export default (element) => {
|
||||||
|
if (element && element.id) {
|
||||||
|
|
||||||
|
const children = element.children ? element.children : [];
|
||||||
|
if ( !children.length )
|
||||||
|
return;
|
||||||
|
|
||||||
|
const coordinates = [];
|
||||||
|
for (let i = 0; i < children.length; i++) {
|
||||||
|
if ( children[i].hasAttribute('data-latitude') && children[i].hasAttribute('data-longitude') )
|
||||||
|
coordinates.push([children[i].getAttribute('data-latitude'), children[i].getAttribute('data-longitude')]);
|
||||||
|
}
|
||||||
|
|
||||||
|
if ( !coordinates.length )
|
||||||
|
return;
|
||||||
|
|
||||||
|
// Sets basic css that should be here only if this javascript is loaded.
|
||||||
|
element.classList.add('tainacan-leaflet-map-container');
|
||||||
|
element.style.setProperty('height', '320px');
|
||||||
|
element.style.setProperty('width', '100%');
|
||||||
|
element.style.setProperty('display', 'block');
|
||||||
|
|
||||||
|
var tainacanMap = TainacanLeaflet.map(element.id).setView([-14.4086569, -51.31668], 5);
|
||||||
|
|
||||||
|
TainacanLeaflet.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
|
||||||
|
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>'
|
||||||
|
})
|
||||||
|
.addTo(tainacanMap);
|
||||||
|
|
||||||
|
coordinates.forEach(coordinate => {
|
||||||
|
TainacanLeaflet.marker(coordinate).addTo(tainacanMap);
|
||||||
|
});
|
||||||
|
|
||||||
|
tainacanMap.panInsideBounds(coordinates);
|
||||||
|
}
|
||||||
|
};
|
|
@ -21,6 +21,7 @@ const TAINACAN_BLOCKS = [
|
||||||
'item-metadata-section' => ['render_callback' => 'tainacan_blocks_render_metadata_section'],
|
'item-metadata-section' => ['render_callback' => 'tainacan_blocks_render_metadata_section'],
|
||||||
'item-metadata' => ['render_callback' => 'tainacan_blocks_render_item_metadata'],
|
'item-metadata' => ['render_callback' => 'tainacan_blocks_render_item_metadata'],
|
||||||
'item-metadatum' => ['render_callback' => 'tainacan_blocks_render_item_metadatum'],
|
'item-metadatum' => ['render_callback' => 'tainacan_blocks_render_item_metadatum'],
|
||||||
|
'geocoordinate-item-metadatum' => ['render_callback' => 'tainacan_blocks_render_geocoordinate_item_metadatum'],
|
||||||
'metadata-section-name' => [],
|
'metadata-section-name' => [],
|
||||||
'metadata-section-description' => []
|
'metadata-section-description' => []
|
||||||
];
|
];
|
||||||
|
|
|
@ -27,6 +27,7 @@ module.exports = {
|
||||||
block_item_metadata_section: './src/views/gutenberg-blocks/blocks/item-metadata-section/index.js',
|
block_item_metadata_section: './src/views/gutenberg-blocks/blocks/item-metadata-section/index.js',
|
||||||
block_item_metadata: './src/views/gutenberg-blocks/blocks/item-metadata/index.js',
|
block_item_metadata: './src/views/gutenberg-blocks/blocks/item-metadata/index.js',
|
||||||
block_item_metadatum: './src/views/gutenberg-blocks/blocks/item-metadatum/index.js',
|
block_item_metadatum: './src/views/gutenberg-blocks/blocks/item-metadatum/index.js',
|
||||||
|
block_geocoordinate_item_metadatum: './src/views/gutenberg-blocks/blocks/geocoordinate-item-metadatum/index.js',
|
||||||
block_metadata_section_name: './src/views/gutenberg-blocks/blocks/metadata-section-name/index.js',
|
block_metadata_section_name: './src/views/gutenberg-blocks/blocks/metadata-section-name/index.js',
|
||||||
block_metadata_section_description: './src/views/gutenberg-blocks/blocks/metadata-section-description/index.js'
|
block_metadata_section_description: './src/views/gutenberg-blocks/blocks/metadata-section-description/index.js'
|
||||||
},
|
},
|
||||||
|
|
Loading…
Reference in New Issue