Mats

Module: Leaflet Map

Recommended Posts

On 10.1.2018 at 3:32 AM, gebeer said:

...

You'd need a hidden field in the form, e.g. _js_geocode_raw that gets populated from the JS (just like the address field gets populated now) and then on save sends that value and stores it to the DB. You'd need to add that to the set method in LeafletMapMarker.php.

Ok, I'll give it a try on the weekend again. I really want to achieve correct address values so the users cannot mess-up text fields used for json+ld.

Share this post


Link to post
Share on other sites

To give a status: I got it working :rolleyes: I need to do some clean up and then I can provide it.

@BrendonKoz Should I make a pull request to your code or to the original one?

  • Like 1

Share this post


Link to post
Share on other sites

@patman I'd suggest making the PR to the original repo as this feature will be a good improvement to the original module.

Share this post


Link to post
Share on other sites
On 1/13/2018 at 8:08 AM, patman said:

@BrendonKoz Should I make a pull request to your code or to the original one?

Congratulations on your success. If you're going to make a pull request I'd make it to the original Fieldtype module as that was the only reason I had forked the original module's code to begin with - to have workable code to store the raw return data, and offer a possible pull request.

Share this post


Link to post
Share on other sites

I made my cleanup and pushed it to github: https://github.com/madebymats/FieldtypeLeafletMapMarker/compare/PW3...patman15:PW3

There is most probably still an issue with the default value, as I could not figure out how this works in the available time. Nevertheless, that has no real impact. I would be happy if some one could have a look and give feedback and/or test the version. I also added the new DB schema to allow for automatic updates. A smoke test went successfully. I'll wait for some feedback and make then the pull request.

Share this post


Link to post
Share on other sites
On 1/14/2018 at 2:16 PM, patman said:

I made my cleanup and pushed it to github: https://github.com/madebymats/FieldtypeLeafletMapMarker/compare/PW3...patman15:PW3

There is most probably still an issue with the default value, as I could not figure out how this works in the available time. Nevertheless, that has no real impact. I would be happy if some one could have a look and give feedback and/or test the version. I also added the new DB schema to allow for automatic updates. A smoke test went successfully. I'll wait for some feedback and make then the pull request.

I took a look at it. This is not the same thing that I was trying to accomplish (not that it has to be). These alterations don't use the Google geocoder's returned JSON data, it uses OpenStreetMap. I don't remember how, but I do remember I was able to get the JSON results of the OpenStreetMap geocoded data without any modifications to the module. What I was unable to get was the same values (100% of the time) from Google's geocoder, which contains more information (and often, I've found, more properly formatted and correct) than the OpenStreetMaps version. Because the found addresses for PLACES don't always match ("NYS Public Library" might not list a street address on OpenStreetMap, but Google will include everything), doing a manual lookup with Google's geocoder after-the-fact won't work 100% of the time. (Those were some of my reasons anyway.)

As for code:

  1. When changing a version number that has companion modules you'd probably want them all to match. Just a suggestion for any future possible patches. :)
  2. LeafletMapMarker.php around line 62:
} else if($key == 'raw') {
    $value = $value;
}

At first I did that too in my version (I think I removed it in my repo, maybe not) but that's just unnecessary. ;) Still looking through the rest as like I said, I don't fully grasp FieldtypeModule code.

Share this post


Link to post
Share on other sites

Thanks for your feedback, I'll fix a few things

On 24.1.2018 at 10:53 PM, BrendonKoz said:

I took a look at it. This is not the same thing that I was trying to accomplish (not that it has to be). These alterations don't use the Google geocoder's returned JSON data, it uses OpenStreetMap.

Well, it is actually the purpose of this module not to use Google API. The description says

Quote

This is a port of the Map Marker Fieldtype by Ryan Cramer. Instead of Google maps it uses Leaflet maps.

So if you want to use Google you actually forked the wrong module maybe you should take a look at https://modules.processwire.com/modules/fieldtype-map-marker/

If you want the same modifications can for sure be also done there.

Share this post


Link to post
Share on other sites

The purpose of the module is to provide a way to display Leaflet Maps. Leaflet =/= OpenStreetMap. Leaflet is a map display library whereas OpenStreetMaps is the actual map layer data source. OSM can be displayed using Leaflet (popular), OpenLayers, or even Google's map library, so I don't know (for sure) if the purpose of the module was specifically to avoid using Google's technology behind the scenes (which it does anyway as is evidenced from previous discussions of the code). I prefer OpenStreetMaps' imagery and ToS, but prefer Google's geocoder. Like I said though, your fork of the code is your own -- it did not have to follow my personal ideas. :)

Share this post


Link to post
Share on other sites

I just upgraded a site to the latest version of this module and ran into some problems.

When I tried to upgrade the module via the ProcessWireUpgrade module, it showed a Fatal error.  I think it was WireData class undefined (Can't remember exactly).  It kept saying it was on a the 2.x version instead of the 3.x version.  So then I proceeded to just download it from github.  After I did that, the error went away.

Now on one page the leaflet map loads on the frontend, but it doesn't load any pins on the map like it did before.

Here is the error in Chrome's console:

errors.thumb.jpg.e96ec688aee3430b7e36a63194062533.jpg

On another frontend page the map doesn't load at all and I see this error in the console:

error2.jpg.c6a3a2d9feb40ee523ca158564fc8c4e.jpg

If I edit the page, I see the following error "WireDatabasePDO: SQLSTATE[42S22]: Column not found: 1054 Unknown column 'field_cleanup_location.raw' in 'field list'".  So I checked the table "field_cleanup_location" and it was missing a "raw" column.  So maybe the update script didn't run correctly?

PW 3.0.90, Google Chrome-Mac, I also refreshed the modules page and cleared the compiled files.

Anybody have any ideas?

Share this post


Link to post
Share on other sites

Tried on another site... The exact error I get is "Fatal Error Class 'WireData' not found"

error.thumb.jpg.c93a663865f04fa90996349188c94fcf.jpg

I get this error directly after I click on the Upgrade link.

upgradelink.thumb.jpg.d195441d79191a129e6d37ffb3365b51.jpg

Hope that helps

Share this post


Link to post
Share on other sites

The upgrade schema errors should now be fixed now.

I did see another problem.  It looks like when you output a map on the frontend, it includes both leaflet 0.7.3 and leaflet 0.7.7 css and javascript files from unpkyg.com.  I pretty sure this could cause problems.

In MarkupLeafletMap.module init() line 109... If I comment out the following lines:

        $this->config->styles->add('https://unpkg.com/leaflet@0.7.3/dist/leaflet.css');
        $this->config->styles->add($assetPath . "assets/leaflet-markercluster/MarkerCluster.css");
        $this->config->styles->add($assetPath . "assets/leaflet-markercluster/MarkerCluster.Default.css");
        $this->config->scripts->add('https://unpkg.com/leaflet@0.7.3/dist/leaflet.js');
        $this->config->scripts->add($assetPath . 'assets/leaflet-markercluster/leaflet.markercluster.js');
        $this->config->scripts->add($assetPath . 'assets/leaflet-providers/leaflet-providers.js');
        $this->config->scripts->add($assetPath . 'MarkupLeafletMap.js');

then leaflet 0.7.3 no longer loads its js and css.  It will only load leaflet 0.7.7 js and css.

I wonder if those lines are really needed for anything?

  • Thanks 1

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now


  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By Lex Sanchez
      Video or Social Post Embed
      Based on the TextformatterVideoEmbed module developed by Ryan Cramer, we have added the possibility to embed publications of the main social networks Facebook, Twitter and Instagram.
      ProcessWire Textformatter module that enables translation of YouTube, Vimeo, Instagram, Facebook, Twitter or Issuu URLs to full embed codes, resulting in a viewable video or social post in textarea fields you apply it to.
      How to install
      Download or Clone from Github: https://github.com/lexsanchez/VideoOrSocialPostEmbed
      Copy the VideoOrSocialPostEmbed.module file to your /site/modules/ directory (or place it in /site/modules/VideoOrSocialPostEmbed/).
      Click check for new modules in ProcessWire Admin Modules screen. Click install for the module labeled: "Video or Social Post Embed".
      Now you will be on the module config screen. Please make note of the config options and set as you see fit.
      How to use
      Edit your body field in Setup > Fields (or whatever field(s) you will be placing videos in). On the details tab, find the Text Formatters field and select "Video or Social Post Embed". Save.
      Edit a page using the field you edited and paste in YouTube, Vimeo, Facebook, Twitter, Instagram and/or Issuu URLs each on their own paragraph.
      Example
      How it might look in your editor (like TinyMCE):
      How it works
      This module uses YouTube, Vimeo, Instagram, Facebook, Twitter and Issuu oEmbed services to generate the embed codes populated in your content. After these services are queried the first time, the embed code is cached so that it doesn't need to be pulled again.
      Configuration
      You may want to update the max width and max height settings on the module's configuration screen. You should make these consistent with what is supported by your site design.
      If you change these max width / max height settings you may also want to check the box to clear cache, so that YouTube/Vimeo/Facebook/Twitter/Instagram/Issuu oembed services will generate new embed codes for you.
      Using with Markdown, Textile or other LML
      This text formatter is looking for a YouTube, Vimeo, Instagram, Facebook, Twitter or Issuu video URL surrounded by paragraph tags. As a result, if you are using Markdown or Textile (or something else like it) you want that text formatter to run before this one. That ensures that the expected paragraph tags will be present when VideoOrSocialPostEmbed runs. You can control the order that text formatters are run in by drag/drop sorting in the field editor.
      Copyright 2018 by Ryan Cramer / Updated by Lex Sanchez
    • By kixe
      Email Verification
      This module provides functions to validate email adresses and hosts. The module generates a textfile for blacklisted mailhosts (trashmail), which will be always up to date.
      Download
      https://modules.processwire.com/modules/email-verification/
      API
      // get module $mailcheck = $modules->get('EmailVerification'); // return bool/ string - automatted update of blacklist file $mailcheck->blacklisted(email|domain) // return bool - validate a top level domain, checks against IANA list $mailcheck->validTLD(tld) // return array of punycoded TLDs - cyclic updated, data pulled from IANA $mailcheck->getTLDs(cycle=2592000) // return bool - checks syntax converts to punycode $mailcheck->validDomainName(domain); // return bool - checks punycode encoded syntax $mailcheck->validHostName(host); // return bool - checks syntax and accessibility $mailcheck->validHost(email|domain) // add a single value to blacklist $mailcheck->addToBlacklist(email|domain) USAGE
      $mailcheck = $modules->get('EmailCheck'); $email = 'susi@trashmail.com'; if($mailcheck->blacklisted($email)) echo 'Email Provider not allowed'; if(!$mailcheck->validHost($email)) echo 'Mailhost not available'; Example blacklist file:  blacklist.txt
       
    • By teppo
      Code Blocks Textformatter is a tiny Textformatter module I cooked up to add support for code blocks to text/textarea/RTE fields on some of the sites I work with. Unlike a full-blown Markdown Textformatter – which is something that we already have in the core – this module simply adds support for fenced and inline code blocks.
      The syntax is based on the GitHub code block documentation, so please refer to that for additional instructions. The README at GitHub also includes some basic examples. As with any Textformatter, in order to enable this one, install it and enable it via field settings. Note that there's no syntax highlighting built in (at least for the time being), so use a tool of your choice for that – personally I prefer Prism.js.
      Since this module doesn't use a Markdown tool behind the scenes, but rather some home baked regular expressions, there's always the possibility that I've missed something – but please let me know if you use this module and run into any issues. On the other hand this module should be relatively fast and unobtrusive, as there are no unnecessary bits of code to run 
      GitHub repository: https://github.com/teppokoivula/TextformatterCodeBlocks Modules directory: http://modules.processwire.com/modules/textformatter-code-blocks/
    • By theo
      Here is my first processwire module (beta).
      https://github.com/theo222/ImagePickerField
      A lot of "first times". First time Github, Markdown and of course PW Modules.
      So be gentle please.
      I hope it works.