devopsdays / devopsdays-web

This is the website for devopsdays
https://www.devopsdays.org
Other
176 stars 664 forks source link

Add support to localize map #82

Closed barkerd427 closed 8 years ago

barkerd427 commented 8 years ago

The map is getting pretty cluttered, so it would be good to be able to localize the map to a region by zooming based off the user's location. If the location can't be found, then we can either zoom all the way out or zoom to a default location. In the past, Google has zoomed to their headquarters. That was annoying, so hopefully we can find a better solution.

Here is some code I've used in the past. I can't promise that the code is complete, but I'm happy to add more of my code as the site is still up and running with this functionality. I'm an awful front-end dev, so any help is appreciated.

function initialize() {
          var mapOptions = {
            zoom: 12
          };
          map = new google.maps.Map(document.getElementById('map-canvas'),
              mapOptions);

          // Try HTML5 geolocation
          if(navigator.geolocation) {
            navigator.geolocation.getCurrentPosition(function(position) {
              var pos = new google.maps.LatLng(position.coords.latitude,
                                               position.coords.longitude);

              map.setCenter(pos);
            }, function() {
              handleNoGeolocation(true);
            });
          } else {
            // Browser doesn't support Geolocation
            handleNoGeolocation(false);
          }
        }

function handleNoGeolocation(errorFlag) {
          if (errorFlag) {
            var content = 'Error: The Geolocation service failed.';
          } else {
            var content = 'Error: Your browser doesn\'t support geolocation.';
          }

          var options = {
            map: map,
            position: new google.maps.LatLng(39.106667, -94.676389),
            content: content
          };

          map.setCenter(options.position);
        }

google.maps.event.addDomListener(window, 'load', initialize);

This code will take the user's location if allowed or set it to a default location if the user doesn't allow the location service. It also sets the default zoom level. Some amount of this was lifted from some tutorial several years ago.

bridgetkromhout commented 8 years ago

Hi, @barkerd427! Thanks for this idea. I think it's worth checking it out. Would you like to submit a PR with it working for you? (I assure you I'm a much worse front-end dev than you are.)

bridgetkromhout commented 8 years ago

Thank you, @barkerd427! I really appreciate the work here. I pulled down this branch and built it.

First I noticed that it asks me for location:

screen shot 2016-06-05 at 9 55 44 am

I get kinda annoyed when sites want me to reply to something immediately upon visiting, so immediately this inclines me to prefer this as a toggle they can opt into instead of something they get asked immediately upon visiting. (I don't know if that's possible.)

When I allowed it to use my location, it zoomed way in:

screen shot 2016-06-05 at 9 56 28 am

I don't think that's what I would want people to see as the full map, to be honest. It seems so limiting! I mean, I might want to go to an event somewhere I'd like to visit, not just one so close to me. Ideally my whole country in the US or whole region in EMEA or APJ?

I am not a front-end dev so I don't know what's possible, but for some reason when I read this issue I was imagining the map just being centered in a different place, not zoomed way in. Let's talk about what we intend here... for the experience, and the visual... and come up with something people are happy with.

My main concern right now is that a person could visit once, say yes to the geolocation, and then see a map with only a few things on it (that don't match the map header). We know what's what, but would new visitors be confused?

barkerd427 commented 8 years ago

Let's see if email reply will work. The map should have started out zoomed to fit all markers. Once it discovers the location of the user, it zooms in. That zoom level can be changed. There's a call to the smooth zoom function with a number in it. Make the number smaller to zoom out and larger to zoom in. We can add a longer delay to ensure the original map is visible for a little longer. The controls should still be available to zoom out and all markers are available on the map.

As a visitor looking for a devopsdays, I'd be interested in what's nearby. I can zoom out if I'm planning to travel further. The next level of zoom gives the whole US, which leaves the East coast a bit cluttered. Although my change with removing labels helps that a bit.

I'm a back-end developer working on distributed systems. I just happened to start making a website with some of this years ago. You can see it in all of its awfulness: cafezvous.com. On Jun 5, 2016 10:05, "Bridget Kromhout" notifications@github.com wrote:

Thank you, @barkerd427 https://github.com/barkerd427! I really appreciate the work here. I pulled down this branch and built it.

First I noticed that it asks me for location:

[image: screen shot 2016-06-05 at 9 55 44 am] https://cloud.githubusercontent.com/assets/2104453/15806206/33618a4c-2b04-11e6-8cdf-d5c9919e2785.png

I get kinda annoyed when sites want me to reply to something immediately upon visiting, so immediately this inclines me to prefer this as a toggle they can opt into instead of something they get asked immediately upon visiting. (I don't know if that's possible.)

When I allowed it to use my location, it zoomed way in:

[image: screen shot 2016-06-05 at 9 56 28 am] https://cloud.githubusercontent.com/assets/2104453/15806211/60d6b93e-2b04-11e6-9b34-1de6ffca51a1.png

I don't think that's what I would want people to see as the full map, to be honest. It seems so limiting! I mean, I might want to go to an event somewhere I'd like to visit, not just one so close to me. Ideally my whole country in the US or whole region in EMEA or APJ?

I am not a front-end dev so I don't know what's possible, but for some reason when I read this issue I was imagining the map just being centered in a different place, not zoomed way in. Let's talk about what we intend here... for the experience, and the visual... and come up with something people are happy with.

My main concern right now is that a person could visit once, say yes to the geolocation, and then see a map with only a few things on it (that don't match the map header). We know what's what, but would new visitors be confused?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/devopsdays/devopsdays-web/issues/82#issuecomment-223818132, or mute the thread https://github.com/notifications/unsubscribe/AF0uxfuNvlB4K57xGb3KhbrFty5Dodo7ks5qIuXKgaJpZM4Hx8lP .

barkerd427 commented 8 years ago

I like 5.5 better than 5 or 6. Although, I could live with 6.

Here's the line if you want to play with it: https://github.com/devopsdays/devopsdays-web/pull/527/files#diff-eee5484f725bd5f3ddf37315d508d6f5R65

bridgetkromhout commented 8 years ago

Thanks. Something else I noticed - with the blue footer gone, this change (to have no labels on the map) removes all dates from the front page. I think we'd probably need a calendar or something before we can afford to merge something that removes these dates.

barkerd427 commented 8 years ago

Click on the markers. The dates and location are on there. Maybe we should add some text stating such, but it seems like a common function of maps these days when I'm using them. Only one perspective here, though.

On Sun, Jun 5, 2016 at 11:21 AM, Bridget Kromhout notifications@github.com wrote:

Thanks. Something else I noticed - with the blue footer gone, this change (to have no labels on the map) removes all dates from the front page. I think we'd probably need a calendar or something before we can afford to merge something that removes these dates.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/devopsdays/devopsdays-web/issues/82#issuecomment-223822209, or mute the thread https://github.com/notifications/unsubscribe/AF0uxdM05z-c0fUdLmX5XNlMJfJIKH_iks5qIveEgaJpZM4Hx8lP .

bridgetkromhout commented 8 years ago

I have thought about this on and off for weeks, and I'm now ready to state that I'm sure that this is not the default behavior I want to see. Sorry for the wait.

I'm fine with offering a choice to zoom in, but I don't want the initial experience of coming to the website to be:

I think that detracts from the global feel of the site, and I don't think the (admittedly cluttered during the height of the season) map is enough of a problem to accept those drawbacks.

If I hear no compelling arguments to the contrary I'm going to close the PR with a comment pointing to this. I'm willing to discuss further but I'm not willing to keep the PR pending in a branch forever.

barkerd427 commented 8 years ago

I generally see two patterns when it comes to location requests. Either a site asks when you first access it, or it asks later during some process like checking out. It's generally as soon as it's needed. I'm not bothered by the prompt, but that's a personal preference. We could also change it so the user has to click something before getting the prompt.

bridgetkromhout commented 8 years ago

I'm not bothered by the prompt, but that's a personal preference.

I dislike when sites want info from me the second I first visit them, before I've tried to do anything. That's back-button territory for me, and I don't want to create that kind of reaction.

We could also change it so the user has to click something before getting the prompt.

I would be totally cool with merging this if it were presented to the user as an optional thing they could choose to click on (in a non-intrusive, non-modal way). I just don't want it to display as the default or ask questions about location by default.

mattstratton commented 8 years ago

Here's my $0.02, which tl;dr means close this PR.

The map itself isn't a very good nav element. Localizing it is basically throwing good money after bad - or rather, it's encouraging the behavior of the map as a nav element. The point of the map isn't really for nav of events, but to show the "zomg, look at all the devopsdays all over the world!" The greybox nav is more useable than the map elements.

So the thing is, regardless of the location services requirement, localizing the map kind of defeats the purpose of it in the first place, IMHO. I vote to close this PR.

(sidenote - I do suggest we have a different discussion about the map in general as part of the redesign/reboot discussion)

bridgetkromhout commented 8 years ago

Okay. I'm with Matt - closing this, as it doesn't accomplish what he's describing (and I agree with) as our goals here. Thanks for helping us work through this, @barkerd427!