Connect with jrEmbed?

michael
@michael
10 years ago
7,746 posts
Hi Steve,

Wondering if its possible to connect it up with jrEmbed.

Thinking that it might be useful to be able to embed a map in a blog post or other location like:
[jrEmbed module="ujGoogleMaps" location="happyraft shikoku japan"]

and have it display
https://goo.gl/maps/mpCsk

Could it work like that?
updated by @michael: 10/25/14 12:40:07AM
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
Hi Michael,

Yes it would be useful, let me take a look at this over the weekend and see if it's possible


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
There isn't currently a tab interface, but you can add a map using a jrEmbed tag in ujGoogleMaps 1.0.4.

***Edit - This documentation (with screenshots!!!) can now be found here:
https://www.jamroom.net/ultrajam/documentation/modules/2055/using-the-tinymce-jrembed-function

First you need to enable the Google Maps Embed API in your Google control panel. Unlike the Javascript API, an API key is compulsory. It is the same API key as the javascript API, you just need to enable the service with Google. The API is simpler than the rest of the module (you can't do complex custom maps), but there are no usage limits imposed.

Then you can use:
Quote: [jrEmbed module="ujGoogleMaps" location="happyraft shikoku japan"]
The location parameter is required.
This is using the default "place" mode.

There are 3 other modes:
1. Directions
Quote: [jrEmbed module="ujGoogleMaps" mode="directions" origin="Oslo Norway" destination="Helsinki Finland" avoid="tolls|highways" maptype="satellite" travel_mode="bicycling"]
The mode, origin and destination parameters are required, the following are optional.

travel_mode can be one of driving, walking, bicycling, transit or flying
avoid will avoid tolls, ferries and/or highways. Multiple values separated by pipe e.g. avoid=tolls|highways
units specifies either metric or imperial, default is determined by the origin country of the query.
waypoints specifies one or more intermediary places to route directions through between the origin and destination. Multiple waypoints can be specified by using the pipe character (|) to separate places (e.g. Berlin,Germany|Paris,France). You can specify up to 20 waypoints.

2. Search
Quote: [jrEmbed module="ujGoogleMaps" mode="search" search="record stores in Seattle"]
The mode and search parameters are required, the others are optional.

Search mode displays results for a search across the visible map region. It's recommended that a location for the search be defined, either by including a location in the search term (record+stores+in+Seattle) or by including a center and zoom parameter to bound the search.

3. View
Quote: [jrEmbed module="ujGoogleMaps" mode="view" center="-33.8569,151.2152" zoom="18" maptype="satellite"]
The mode and center parameters are required, the others are optional.



Optional Parameters which can be used in all views:

center defines the center of the map view. It accepts a comma-separated latitude and longitude value (such as 37.4218,-122.0840). Note: center is required for the view mode.

zoom sets the initial zoom level of the map. Accepted values range from 0 (the whole world) to 21 (individual buildings). The upper limit can vary depending on the map data available at the selected location.

maptype can be either roadmap (the default) or satellite, and defines the type of map tiles to load.

language defines the language to use for UI elements and for the display of labels on map tiles. Note that this parameter is only supported for some country tiles; if the specific language requested is not supported for the tile set, then the default language for that tileset will be used. By default, visitors will see a map in their own language.

region defines the appropriate borders and labels to display, based on geo-political sensitivities. Accepts a region code specified as a two-character ccTLD (top-level domain) value.

width the width of the map. Default 100%.


height the height of the map. Default 400.


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

updated by @ultrajam: 10/26/14 03:08:13PM
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
Hey Michael, can you let me know when you try to use this.

I have one site where the jrEmbed tag is parsed, and one where it isn't parsed. Both sites are identical as far as I can see, both are set up the same with Google (although that should make no difference on the parsing), skins are the same, jrEmbed is the same, same versions of everything.

Does it work for your site?


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
Actually I can see a difference, the site where it is working has only one quota. The site where the tag isn't parsed has two quotas, although jrEmbed is allowed for the quota on both sites.

The listener runs on one site, but not on the other. Any idea why that might be?


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
A difference in behaviour - on the site where it works the tag does not appear in the timeline. On the other site, the unparsed tag appears in the timeline.


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
michael
@michael
10 years ago
7,746 posts
going to play with it now. Thanks for the book on how to use it. ;)
michael
@michael
10 years ago
7,746 posts
SteveX:
A difference in behaviour - on the site where it works the tag does not appear in the timeline. On the other site, the unparsed tag appears in the timeline.

First place to check is the ACP -> SYSTEM CORE -> QUOTA CONFIG -> (change to the quota not working) -> Make sure "Convert Embed Tags" is checked.

-- edit --
the QUOTA CONFIG on the jrEmbed module is "People in this quota are allowed to embed stuff, so will see the embed button when they are using the editor."

The link above is "People in this quota will see stuff thats embeded converted into its correct format."
updated by @michael: 10/27/14 08:44:35PM
michael
@michael
10 years ago
7,746 posts
Yeah, that first one is working fantastic! Great Job Steve! I'll continue to fiddle.
michael
@michael
10 years ago
7,746 posts
Got an interface started for this today, should be able to get it done tonight and will send it over to see if its of any use to you.
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
michael:First place to check is the ACP -> SYSTEM CORE -> QUOTA CONFIG -> (change to the quota not working) -> Make sure "Convert Embed Tags" is checked.

Thanks Michael, that was the one!


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
michael
@michael
10 years ago
7,746 posts
Just sent you what I was working on today. See if you like the direction and if its ok, ill get the last piece working tomorrow. (just got to find a way to sort the user input into the tag to be embeded in the editor.)
michael
@michael
10 years ago
7,746 posts
Fantastic work mate. Love the new embed setup.
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
Thanks for getting the interface together, it does make it much easier to use.

Let me know if there is anything else that is needed from the module, both in functionality/templates and documentation/examples.

I'm thinking that when I next have some time I'm going to make a tutorial showing 2 ways how to map a band tour. First very simply using the directions and waypoints using embed in TinyMCE, and then a better version using jrEvent and marker templates.

As a longer term plan, I'd also like to provide the ability to make maps as module items, where you can define multiple markers manually and combine with items from multiple jrCore lists, stored in the db for use in jrEmbed (map_id="3"). Maybe with switchable layers and custom styling as well, so an "easy" maps mashup available to admin and technically able quotas. Probably need an interested paying client to make all that a reality though.

Then there's all the streetview stuff, which is becoming more interesting as it progresses...

In the near future I probably need to concentrate on a quiz module and interactive learning - more relevant to my new day job (which is a bit of a cultureshock, but a lot of fun :) ).


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

updated by @ultrajam: 10/30/14 02:11:16PM
Ken Rich
Ken Rich
@ken-rich
10 years ago
926 posts
Hi Steve,

Thanks for getting maps working on my Events - that's the bomb.

I was posting something the other day and noticed it as an option now in my jrEmbed - way cool...

However, when I type in a location it doesn't seem to fetch it, at least not while the editor is open. Is it supposed to be that way?

I mean, is this something that is still going through updates and not quite ready, or is everyone else's working differently than mine and fetching locations with the editor open.

When I post anyway I get this, but I believe you told me no key is required unless a large number of requests are being made???

"The Google Maps API server rejected your request. This service requires an API key"


--

Ken Rich
indiegospel.net
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
You just type in an address when using jrEmbed.

Make sure you have turned on the embed api in your google account, and have a valid key - the key is compulsory when using the jrEmbed functionality.


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)
Ken Rich
Ken Rich
@ken-rich
10 years ago
926 posts
OK - thanks - I'll look get a key put in and see what happens...


--

Ken Rich
indiegospel.net
Ken Rich
Ken Rich
@ken-rich
10 years ago
926 posts
Hi Steve,

I appreciate that you have put up so much clear documentation, superb job really - kudos.

However, being the absolute "noob" that I am, I am still having difficulties. I see this error when I try to use the jrEmbed version of the maps.
Quote:
"The Google Maps API server rejected your request. This API project is not authorized to use this API. Please ensure that this API is activated in the APIs Console: Learn more: https://code.google.com/apis/console"

I will attach pictures to show you what I have enabled, and perhaps you can spot what I'm doing wrong.
maps2.JPG.jpg
maps2.JPG.jpg  •  29KB




--

Ken Rich
indiegospel.net

updated by @ken-rich: 11/14/14 12:32:41PM
Ken Rich
Ken Rich
@ken-rich
10 years ago
926 posts
Am I listing modules correctly?
maps.JPG.jpg
maps.JPG.jpg  •  34KB




--

Ken Rich
indiegospel.net

updated by @ken-rich: 11/14/14 12:26:12PM
Ken Rich
Ken Rich
@ken-rich
10 years ago
926 posts
I used API key from here
maps3.jpg
maps3.jpg  •  51KB




--

Ken Rich
indiegospel.net

updated by @ken-rich: 11/14/14 12:28:15PM
Ken Rich
Ken Rich
@ken-rich
10 years ago
926 posts
Do any of these have to be turned on at Google or just the "Google Maps JavaScript API v3 service"?
maps4.JPG.jpg
maps4.JPG.jpg  •  19KB




--

Ken Rich
indiegospel.net

updated by @ken-rich: 11/14/14 12:31:19PM
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
You will need to enable the Google Maps Embed API if you are using the jrEmbed maps in TinyMCE, and the Google Maps Javascript API v3 for the main module maps in Form Designer fields.

Then in the Simple API form, change the Referrers field from indiegospel.net to *indiegospel.net/*

That will then allow requests from all subdomains (such as www.indiegospel.net) and all pages on the site.

Give that a try and let me know if that fixes things.

Thanks


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

updated by @ultrajam: 11/14/14 01:35:09PM
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
Ken_Rich:
Am I listing modules correctly?

You don't need to list modules in that field unless you are using the ujExif module to extract Exif GPS data from photos as they are uploaded. I'm pretty sure you aren't doing that, so it's best to remove the modules from that field so that the listener doesn't run.

If you are using ujExif, you would only list modules which have images which can be listed using jrCore_list, such as jrGallery.

There is a bit of documentation about that on this page:
https://www.jamroom.net/ultrajam/documentation/modules/1790/multi-item-multi-marker-maps-eg-gps-location-for-photos-in-jrgallery
But bear in mind that extracting Exif data is an "unsupported" advanced feature which needs ujExif to be installed (and I haven't installed that module for over a year, it's available on github).


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

updated by @ultrajam: 11/14/14 01:48:41PM
Ken Rich
Ken Rich
@ken-rich
10 years ago
926 posts
Dude - you're a genius - it's working now...lol

Just to confirm, I've got "Gallery Image EXIF" but that's not the same as the "ujExif" you are referring to, so I guess I can skip that part - right?


--

Ken Rich
indiegospel.net

updated by @ken-rich: 11/14/14 02:47:00PM
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
Cool, glad that's working for you!

Yes, best to remove all modules from the image mapping field in config.

The Exif module with the gallery is one of Brian's so I doubt that it will work with the maps module. It's something I can look at if you really need it to work (ie map the gps locations of gallery photos uploaded) - it would probably only be possible if Brian's module stores the latitude and longitude in fields.


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

updated by @ultrajam: 11/14/14 02:57:03PM
Ken Rich
Ken Rich
@ken-rich
10 years ago
926 posts
No that's nothing I need - what's there already is blowing my mind - thanks...


--

Ken Rich
indiegospel.net
SteveX
SteveX
@ultrajam
10 years ago
2,584 posts
:) That's good to hear! Thanks Ken! :)


--
¯\_(ツ)_/¯ Education, learning resources, TEL, AR/VR/MR, CC licensed content, panoramas, interactive narrative, sectional modules (like jrDocs), lunch at Uni of Bristol. Get in touch if you share my current interests or can suggest better :)

updated by @ultrajam: 11/14/14 03:15:02PM

Tags