Display Bootstrap-like tooltips for menu items

[jywarren]

This may need to be upstream in Leaflet.Toolbar? https://github.com/leaflet/Leaflet.toolbar

R - toggle rotate/distort L - lock T - transparent O - outline (pretty similar to transparent)

@imvec

[roshniRam]

@jywarren Can I work on this?

[jywarren]

yes please, that would be great!

On Tue, Oct 2, 2018 at 10:06 AM Roshni Ram [email protected] wrote:

@jywarren https://github.com/jywarren Can I work on this?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/Leaflet.DistortableImage/issues/104#issuecomment-426286770, or mute the thread https://github.com/notifications/unsubscribe-auth/AABfJxiYO5_awTjK5G6AMQqxK3ivmu9_ks5ug3LFgaJpZM4V0NuL .

[jywarren]

Hi @roshniRam are you still interested in this at all?

I think we may be able to remove the tooltip attribute here and just build in the Bootstrap-style tooltips into the span:

https://github.com/publiclab/Leaflet.DistortableImage/blob/90c977770658453d57233e1a150159cf7a38b1cb/src/edit/DistortableImage.EditToolbar.js#L14-L16

It would require calling the tooltip bootstrap javascript function here, too:

https://getbootstrap.com/docs/3.3/javascript/#tooltips

[jywarren]

This has been marked as a good candidate for becoming a first-timers-only issue like these, meaning that it's simple, self-contained, and with some extra formatting, could be a great entry point for a new contributor. If you're familiar enough with this code, please consider reformatting or reposting it as a first-timers-only issue, and then ping @publiclab/reviewers to get it labelled. Or, if this is not your first time, try to solve it yourself!

---

[sashadev-sky]

Ah just saw this one after all my tooltip updates! I will open an issue for this soon to get one done and the workflow down then an FTO for the rest. Will use the nice tooltips from material kit pro to match the icons :)

[jywarren]

ok awesome. Not critical either, i just appreciate the tooltips you've put in there, and at least in bootstrap, styling them is pretty easy and looks great.

On Fri, Jun 14, 2019 at 4:44 PM Sasha Boginsky [email protected] wrote:

Ah just saw this one after all my tooltip updates! I will open an issue for this soon to get one done and the workflow down then an FTO for the rest. Will use the nice tooltips from material kit pro to match the icons :)

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/publiclab/Leaflet.DistortableImage/issues/104?email_source=notifications&email_token=AAAF6J2QI4DZEFPKHAFQQQDP2P7IBA5CNFSM4FOQ3OF2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODXX5J7Y#issuecomment-502256895, or mute the thread https://github.com/notifications/unsubscribe-auth/AAAF6J4K6X55MF6JHQFGISTP2P7IBANCNFSM4FOQ3OFQ .

[rexagod]

Uploaded to GCI dashboard.

[SidharthBansal]

published

[neelesh17]

could i try this issue?

[sashadev-sky]

@neelesh17 yes would love your help on this! The one catch is that we should do it without pulling in an external library, so you you'll have to make them from scratch. (I find that more fun anyways) 👍

[neelesh17]

hey @sashadev-sky, i am still unclear about what is it we are trying to achive in this issue.Would you help me out please.

[sashadev-sky]

@neelesh17 Currently the tooltips look like this:

And we were thinking to make them look nicer, closer to this: (this screenshot is from a toolbar in a different PL project, only the tooltip is relevant)

but also open to other designs if theres a specific one you like and want to implement

[vanithaak]

Hi @roshniRam are you still interested in this at all?

I think we may be able to remove the tooltip attribute here and just build in the Bootstrap-style tooltips into the span:

https://github.com/publiclab/Leaflet.DistortableImage/blob/90c977770658453d57233e1a150159cf7a38b1cb/src/edit/DistortableImage.EditToolbar.js#L14-L16

It would require calling the tooltip bootstrap javascript function here, too:

https://getbootstrap.com/docs/3.3/javascript/#tooltips

Hi @jywarren , @sashadev-sky , @TildaDares I think the file "DistortableImage.EditToolbar.js" inside edit folder isn't their anymore. Please correct me if I'm wrong. Thanks!!

[jywarren]

Hi, good point! Do you think the code lives here now?

https://github.com/publiclab/Leaflet.DistortableImage/blob/8b7211174c8b9607a039cf6bd9f091ec0aa4f5fc/src/edit/actions/EditAction.js#L10-L13