tmdinosaurcenter
/
tainacan
mirror of https://github.com/tainacan/tainacan
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Changes padding for view mode map. #693

This commit is contained in:
mateuswetah 2023-01-20 16:08:29 -03:00
parent e944aa7c82
commit e7dc428c23
3 changed files with 18 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/views/admin/components/lists/items-list.vue
View File

@ -1515,7 +1515,7 @@
<l-map <l-map
:id="'tainacan-admin-view-mode-map'" :id="'tainacan-admin-view-mode-map'"
:ref="'tainacan-admin-view-mode-map'" :ref="'tainacan-admin-view-mode-map'"
style="height: 60vh; width: calc(100% - 286px);" style="height: 60vh; width: 100%;"
:zoom="5" :zoom="5"
:center="[-14.4086569, -51.31668]" :center="[-14.4086569, -51.31668]"
:zoom-animation="true" :zoom-animation="true"
@ -2032,9 +2032,9 @@ export default {
setTimeout(() => { setTimeout(() => {
if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) { if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) {
if (this.itemsLocations.length == 1) if (this.itemsLocations.length == 1)
this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 0] }); this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] });
else else
this.$refs['tainacan-admin-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 0] }); this.$refs['tainacan-admin-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] });
} }
}, 500) }, 500)
}, },
@ -2412,9 +2412,9 @@ export default {
this.selectedMarkerIndexes = []; this.selectedMarkerIndexes = [];
if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) { if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) {
if (this.itemsLocations.length == 1) if (this.itemsLocations.length == 1)
this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 0] }); this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] });
else else
this.$refs['tainacan-admin-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 0] }); this.$refs['tainacan-admin-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] });
} }
}, },
showItemByLocation(index) { showItemByLocation(index) {
@ -2422,7 +2422,7 @@ export default {
this.selectedMarkerIndexes = []; this.selectedMarkerIndexes = [];
this.selectedMarkerIndexes.push(index); this.selectedMarkerIndexes.push(index);
if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject )
this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds( [ this.itemsLocations[index].location ], { animate: true, maxZoom: 16, paddingTopLeft: [0, 286] }); this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds( [ this.itemsLocations[index].location ], { animate: true, maxZoom: 16, paddingTopLeft: [48, 286], paddingTopRight: [48, 48] });
}, },
showLocationsByItem(item) { showLocationsByItem(item) {
this.mapSelectedItemId = item.id; this.mapSelectedItemId = item.id;
@ -2437,9 +2437,9 @@ export default {
if ( selectedLocationsByItem.length) { if ( selectedLocationsByItem.length) {
if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) { if ( this.itemsLocations.length && this.$refs['tainacan-admin-view-mode-map'] && this.$refs['tainacan-admin-view-mode-map'].mapObject ) {
if (selectedLocationsByItem.length > 1) if (selectedLocationsByItem.length > 1)
this.$refs['tainacan-admin-view-mode-map'].mapObject.flyToBounds( selectedLocationsByItem.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 286] }); this.$refs['tainacan-admin-view-mode-map'].mapObject.flyToBounds( selectedLocationsByItem.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 286], paddingTopRight: [48, 48] });
else else
this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds( selectedLocationsByItem.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 286] }); this.$refs['tainacan-admin-view-mode-map'].mapObject.panInsideBounds( selectedLocationsByItem.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 286], paddingTopRight: [48, 48] });
} }
} else { } else {
this.$buefy.snackbar.open({ this.$buefy.snackbar.open({

6
src/views/admin/scss/_view-mode-map.scss
View File

@ -1,14 +1,13 @@
.tainacan-leaflet-map-container { .tainacan-leaflet-map-container {
border: 1px solid var(--tainacan-input-border-color); border: 1px solid var(--tainacan-input-border-color);
border-radius: 3px; border-radius: 3px;
display: flex;
height: 60vh; height: 60vh;
#tainacan-admin-view-mode-map, #tainacan-admin-view-mode-map,
#tainacan-view-mode-map { #tainacan-view-mode-map {
//position: relative;
border: none; border: none;
border-left: 1px solid var(--tainacan-input-border-color); border-left: 1px solid var(--tainacan-input-border-color);
float: right;
/deep/ .leaflet-marker-pane { /deep/ .leaflet-marker-pane {
filter: hue-rotate(-22deg); filter: hue-rotate(-22deg);
@ -294,14 +293,13 @@
} }
@media screen and (max-width: 960px) { @media screen and (max-width: 960px) {
flex-wrap: nowrap;
#tainacan-admin-view-mode-map, #tainacan-admin-view-mode-map,
#tainacan-view-mode-map, #tainacan-view-mode-map,
.tainacan-map-cards-container { .tainacan-map-cards-container {
width: 100% !important; width: 100% !important;
max-width: 100%; max-width: 100%;
float: none;
display: block;
} }
#tainacan-admin-view-mode-map, #tainacan-admin-view-mode-map,

16
src/views/gutenberg-blocks/blocks/faceted-search/theme-search/components/view-mode-map.vue
View File

@ -78,7 +78,7 @@
<l-map <l-map
:id="'tainacan-view-mode-map'" :id="'tainacan-view-mode-map'"
:ref="'tainacan-view-mode-map'" :ref="'tainacan-view-mode-map'"
style="height: 60vh; width: calc(100% - 286px);" style="height: 60vh; width: 100%;"
:zoom="5" :zoom="5"
:center="[-14.4086569, -51.31668]" :center="[-14.4086569, -51.31668]"
:zoom-animation="true" :zoom-animation="true"
@ -434,9 +434,9 @@ export default {
setTimeout(() => { setTimeout(() => {
if ( this.itemsLocations.length && this.$refs['tainacan-view-mode-map'] && this.$refs['tainacan-view-mode-map'].mapObject ) { if ( this.itemsLocations.length && this.$refs['tainacan-view-mode-map'] && this.$refs['tainacan-view-mode-map'].mapObject ) {
if (this.itemsLocations.length == 1) if (this.itemsLocations.length == 1)
this.$refs['tainacan-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 0] }); this.$refs['tainacan-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] });
else else
this.$refs['tainacan-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 0] }); this.$refs['tainacan-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] });
} }
}, 500) }, 500)
}, },
@ -467,9 +467,9 @@ export default {
this.selectedMarkerIndexes = []; this.selectedMarkerIndexes = [];
if ( this.itemsLocations.length && this.$refs['tainacan-view-mode-map'] && this.$refs['tainacan-view-mode-map'].mapObject ) { if ( this.itemsLocations.length && this.$refs['tainacan-view-mode-map'] && this.$refs['tainacan-view-mode-map'].mapObject ) {
if (this.itemsLocations.length == 1) if (this.itemsLocations.length == 1)
this.$refs['tainacan-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 0] }); this.$refs['tainacan-view-mode-map'].mapObject.panInsideBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] });
else else
this.$refs['tainacan-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 0] }); this.$refs['tainacan-view-mode-map'].mapObject.flyToBounds(this.itemsLocations.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 48], paddingTopRight: [48, 48] });
} }
}, },
showItemByLocation(index) { showItemByLocation(index) {
@ -477,7 +477,7 @@ export default {
this.selectedMarkerIndexes = []; this.selectedMarkerIndexes = [];
this.selectedMarkerIndexes.push(index); this.selectedMarkerIndexes.push(index);
if ( this.itemsLocations.length && this.$refs['tainacan-view-mode-map'] && this.$refs['tainacan-view-mode-map'].mapObject ) if ( this.itemsLocations.length && this.$refs['tainacan-view-mode-map'] && this.$refs['tainacan-view-mode-map'].mapObject )
this.$refs['tainacan-view-mode-map'].mapObject.panInsideBounds( [ this.itemsLocations[index].location ], { animate: true, maxZoom: 16, paddingTopLeft: [0, 286] }); this.$refs['tainacan-view-mode-map'].mapObject.panInsideBounds( [ this.itemsLocations[index].location ], { animate: true, maxZoom: 16, paddingTopLeft: [48, 286], paddingTopRight: [48, 48] });
}, },
showLocationsByItem(item) { showLocationsByItem(item) {
this.mapSelectedItemId = item.id; this.mapSelectedItemId = item.id;
@ -492,9 +492,9 @@ export default {
if ( selectedLocationsByItem.length) { if ( selectedLocationsByItem.length) {
if ( this.itemsLocations.length && this.$refs['tainacan-view-mode-map'] && this.$refs['tainacan-view-mode-map'].mapObject ) { if ( this.itemsLocations.length && this.$refs['tainacan-view-mode-map'] && this.$refs['tainacan-view-mode-map'].mapObject ) {
if (selectedLocationsByItem.length > 1) if (selectedLocationsByItem.length > 1)
this.$refs['tainacan-view-mode-map'].mapObject.flyToBounds( selectedLocationsByItem.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 286] }); this.$refs['tainacan-view-mode-map'].mapObject.flyToBounds( selectedLocationsByItem.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 286], paddingTopRight: [48, 48] });
else else
this.$refs['tainacan-view-mode-map'].mapObject.panInsideBounds( selectedLocationsByItem.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [0, 286] }); this.$refs['tainacan-view-mode-map'].mapObject.panInsideBounds( selectedLocationsByItem.map((anItemLocation) => anItemLocation.location), { animate: true, maxZoom: 16, paddingTopLeft: [48, 286], paddingTopRight: [48, 48] });
} }
} else { } else {
this.$buefy.snackbar.open({ this.$buefy.snackbar.open({