Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WIP] Adding Search bar to Maps . #2582 #2585

Merged
merged 2 commits into from
Apr 6, 2018
Merged

[WIP] Adding Search bar to Maps . #2582 #2585

merged 2 commits into from
Apr 6, 2018

Conversation

sagarpreet-chadha
Copy link
Contributor

@sagarpreet-chadha sagarpreet-chadha commented Apr 4, 2018

Solves First Part of #2582 .
🔍 🗺

  • tests pass -- look for a green checkbox ✔️ a few minutes after opening your PR -- or run tests locally with rake test
  • code is in uniquely-named feature branch and has no merge conflicts
  • PR is descriptively titled
  • PR body includes fixes #0000-style reference to original issue #
  • ask @publiclab/reviewers for help, in a comment below

Thanks!

@PublicLabBot
Copy link

PublicLabBot commented Apr 4, 2018

2 Messages
📖 @sagarpreet-chadha Thank you for your pull request! I’m here to help with some tips and recommendations. Please take a look at the list provided and help us review and accept your contribution! And don’t be discouraged if you see errors – we’re here to help.
📖 Pull Request is marked as Work in Progress

Generated by 🚫 Danger

@sagarpreet-chadha
Copy link
Contributor Author

sagarpreet-chadha commented Apr 6, 2018

Hi @jywarren , @ebarry !

I was thinking of adding a search button on right-most corner of /people map , and on entering the name of any contributor - zooming to that marker .
And when the search-bar collapses , zooming out to normal / original zoom-level .

What do you think 🎈 😄 🗺 🔍 ?

@jywarren
Copy link
Member

jywarren commented Apr 6, 2018

This sounds really good - also, GREAT EMOJI USE HERE 😄 😆

Do we need to zoom back out?

Also, i had originally thought that the search box could be for geocoding, so to type in, for example Buenos Aires and it would zoom over there. But I like people searching too! Maybe we can add a follow-up for the geocoding type of search.

I kind of wish the UI used Bootstrap elements, don't you? I wonder if there's any way to do that.

Great work!!

});
map<%= unique_id %>.addControl(controlSearch<%= unique_id %>);
/*
controlSearch<%= unique_id %>.on('search:collapsed', function(e) {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

So this is basically an Event Listener which is triggered when the search bar collapses .
Currently commented out .

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have commented the zoom-out feature for now .

}
var map<%= unique_id %> = L.map('map<%= unique_id %>').on('load', onMapLoad).setView([<%= lat %>,<%= lon %>], 2);
L.tileLayer("//a.tiles.mapbox.com/v3/jywarren.map-lmrwb2em/{z}/{x}/{y}.png").addTo(map<%= unique_id %>);
var searchLayer<%= unique_id %> = L.layerGroup().addTo(map<%= unique_id %>);
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Given <%=unique_id %> because we may have more than 1 /people map (inline) on a page . So we need unique variable name 😄 .

@sagarpreet-chadha
Copy link
Contributor Author

sagarpreet-chadha commented Apr 6, 2018

This is part of CDN link code , i am wondering whether the search-icon will appear in the production ? The layer icon is not available on /profile page .

See background: url() :
screen shot 2018-04-06 at 11 34 48 pm

I think it should work on production because ../images/search-icon.png is basically https://cdn.jsdelivr.net/npm/leaflet-search@2.4.0/images/search-icon.png , right ?

What do you think ?

@sagarpreet-chadha
Copy link
Contributor Author

GIF :
search_leaflet

@jywarren
Copy link
Member

jywarren commented Apr 6, 2018

OK, i may try to tweak the CSS a bit once it goes into production but it needn't stop us right now. Do you think it's ready to merge? Thank you!!!

@sagarpreet-chadha
Copy link
Contributor Author

Yes ...i think it is ready to merge then .
I will make the follow-up issues of geo-coding . Thanks !

@sukhbir-singh
Copy link
Contributor

sukhbir-singh commented Apr 6, 2018

Hi @sagarpreet-chadha , I am just asking the question out of curiosity. 😄
Which tool you use to record the website actions in gif format which you use in comments on github ??

@jywarren
Copy link
Member

jywarren commented Apr 6, 2018

Great -- will do after #2533!!

@sagarpreet-chadha
Copy link
Contributor Author

sagarpreet-chadha commented Apr 6, 2018

Hi @sukhbir-singh !

I first do the screen recording 🎥 of the feature 😄 .
Then i use this site https://ezgif.com/video-to-gif to convert the video 🎞 📽 into the gif .

Its kind of a long task but it really makes the life of the reviewer easy 🙈 . Thanks !

@jywarren
Copy link
Member

jywarren commented Apr 6, 2018 via email

@jywarren jywarren merged commit 35aeac4 into master Apr 6, 2018
@grvsachdeva
Copy link
Member

And for ubuntu Peek https://github.com/phw/peek works good 😅

@sukhbir-singh
Copy link
Contributor

sukhbir-singh commented Apr 6, 2018

Thank you @sagarpreet-chadha for the reply. yeah!! that's true the gifs makes the review process quite exciting. Looks like licecap is also good one for the purpose. Thanks @jywarren for info. but I actually use fedora linux. I'm a big fan of linux distro 😃

@Gauravano Thanks I will try peek 👍

@icarito icarito mentioned this pull request Apr 8, 2018
SrinandanPai pushed a commit to SrinandanPai/plots2 that referenced this pull request May 5, 2019
* Added CDN links for Map search Feature

* Searching via User name
@emilyashley emilyashley deleted the search_map branch January 15, 2020 21:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

5 participants