Search…

X3 Photo Gallery Support Forums

Search…
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Is it possible to add Map button manually to descriptions?

11 Jan 2023, 19:41

Hello, Karl,

I have a FOLDER that contains 2 identical video files, the 2nd video is there only to illustrate in this post what I wish to accomplish.

The video files are WEBM, which I learned tonight that GeoIP data cannot be added to, unlike images & MP4 files.

At the end of the description for the 1st video, I created a "label" that I called "Map":
Code
<span class="label map">Map</span>
And at the end of the description for the 2nd video, I created a "button" that I also called "Map":
Code
<span class="button map">Map</span>
At present, the map label that I created for the 1st video is just that, a label, and therefore it is not clickable.  And although the map button that I created for the 2nd video is clickable, I have not figured out how or where to add the GeoIP data (lat & long).

Ideally, I would prefer to use the label at the end of the 1st video's description, as it's the same height as all the other labels on that line.  But if that is not possible, I am willing to use the larger (regular-size) map button at the bottom of the 2nd video's description.

I tried adding the GeoIP data to the Parameter fields (i.e. geo=32.29867742319451,-64.7609087847006), but that field seems to be only for panoramas, which of course these videos are not.

I also tried the code for Google Maps as shown HERE on your demo site, but of course that seems to work only when used in Settings | Content.

Now, my question is:
  1. Is there any way that I can add the GeoIP data (lat & long) to the map "label" that I created for the 1st video, and have it clickable?  If not,
  2. Likewise, is there any way that I can add the GeoIP data (lat & long) to the map "button" that I created for the 2nd video?
As clicking the regular Map buttons for images shows the map in a popup, most likely my only option is the map button as shown with the 2nd video.

Thank you in advance & have yourself a great day.

Regards,
John
Last edited by JMM on 15 Apr 2023, 14:54, edited 1 time in total.
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is it possible to add Map button manually to descriptions?

11 Jan 2023, 22:00

Ok so normally X3 creates map buttons from image EXIF. If you want to create buttons manually, it might work. You can try to copy-paste the below code into the page content, or in a video descriptions:
Code
<button data-href="https://www.google.com/maps/search/?api=1&amp;query=60.376061111111,6.7214166666667" data-embed-modal="https://www.google.com/maps/embed/v1/place?q=60.376061111111,6.7214166666667&amp;key=AIzaSyDRp6xla9SxUmTBu6l_kprhjjI9e5-EVZk" class="button small button-map" data-lang="map"></button>
If it works (I tested that it works here), then you would edit the map point by re-assigning the coordinates in query=60.376061111111,6.7214166666667 and q=60.376061111111,6.7214166666667. The function should be assigned to <button> or <a> because this is what tells the browser (and effectively the user) that they are clickable. You could try to use it for a <span>, it might work, although it may class with classes (styles) already provided specifically for the span label style.
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Re: Is it possible to add Map button manually to descriptions?

12 Jan 2023, 01:09

although it may class with classes (styles) already provided specifically for the span label style
You are correct, that's exactly what happened, as you can see with the 1st video... the button itself works fine, as clicking it opens the map.  But the anchor & more-importantly the text (i.e. the word Map) do not display.  The code that I was using is:
Code
<span class="label map" data-href="https://www.google.com/maps/search/?api=1&amp;query=32.303044286130486,-64.74858240630506" data-embed-modal="https://www.google.com/maps/embed/v1/place?q=32.303044286130486,-64.74858240630506&amp;key=AIzaSyDRp6xla9SxUmTBu6l_kprhjjI9e5-EVZk" class="button small button-map" data-lang="map">Map</span>
Thanks anyway.

However, the code that you gave me works perfectly as a button for the 2nd video, thank you.  So that's the format that I will go with, even though the button is larger than the labels... I can live with that.

I do have 1 more question, though: I realize that I cannot change the zoom level for the standard map buttons that appear based on Exif information.  But for these buttons that I add manually with your code that you provided me with today, am I able to add additional code to that button in order for the zoom level to be slightly less (i.e. zoomed out slightly)?  I understand that the zoom level that I set for one particular screen resolution will be slightly different for other resolutions, but I should be able to play with the zoom settings to come up with a level that works from 1080p (1920*1080) perhaps down to 1024*768.

Thanks in advance & enjoy the rest of your day.

Regards,
John
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is it possible to add Map button manually to descriptions?

12 Jan 2023, 03:07

JMM wrote:I do have 1 more question, though: I realize that I cannot change the zoom level for the standard map buttons that appear based on Exif information.  But for these buttons that I add manually with your code that you provided me with today, am I able to add additional code to that button in order for the zoom level to be slightly less (i.e. zoomed out slightly)?
According to the link below, it can be achieved with zoom parameters in the query.
https://developers.google.com/maps/docu ... edding-map
Code
&amp;zoom=10
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Re: Is it possible to add Map button manually to descriptions?

12 Jan 2023, 22:14

Karl, you and your X3 never cease to amaze me... you for your knowledge, and your X3 for it's capabilities :clap:.

Your code for me to create my own Map buttons works perfectly, and I actually prefer the manual map buttons compared to X3's built-in map buttons, because with my manually created map buttons I can set the zoom level for each picture.  The manual map button's don't have that nice pop-up that appears when users hover their rodent over X3's built-in map buttons, but for me that's completely OK, because I can set the zoom levels  :relaxed:.

Thanks again for the code, and the zoom level parameters.
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |