[nodebb-plugin-cards] Show cards when hovering over user links!

[baris]

Sorry just keep finding stuff Go to your profile and hover over the edit/followers link those create the tooltip box too?

[julian]

@Schamper

[Schamper]

@baris https://github.com/Schamper/nodebb-plugin-mentions-cards/commit/cae3f7be28be3d9436cef1f95de6228ca1a5ca00
@julian are you on about the followers link or because it hides under the header?

[baris]

I think he just wants to post screenshots Yeah I think those links shouldn't have any tooltips.

[Schamper]

@baris any other bugs? I'll wait till tomorrow to push 0.0.4 just in case

[baris]

Hmm, another thing that can happen is if you mouse over multiple users quickly it will send of multiple $.api() calls and you might end up with multiple tooltips. This might work better.

function createCard(target, url) {

	var api = '/api' + url;
	$.get(api, function(result) {

		....

		if (target !== currentCard) {
			if (currentCard) {	 
				destroyCard(currentCard);
			}

			target.popover({
				html: true,
				content: html,
				placement: 'top',
				trigger: 'manual',
				container: 'body'
			}).popover('show');

			currentCard = target;
		}

		...
	});
}

Totally not tested :), Idea is to not doing anything if the target already has a tooltip and to destroy the previous one if there is no current card or its a different one.

[Schamper]

@baris Actually, that should be impossible to happen, since you have to hover over a link for 500ms before it'll even call createCard.

[tedr56]

@Schamper I think I found another one. If you click on the profile icon of the mention card and go back to the previous page, the mention card is still there and wont close.

Nice plugin anyway

[Schamper]

@tedr56 That should be fixed with https://github.com/Schamper/nodebb-plugin-mentions-cards/commit/cd215d07167907bc0b847f2f3fbfef0b56dbf097, but I'm holding off on publishing another update, incase more bugs are found If there won't be any other reports by tonight I'll publish that fix.

[tedr56]

@Schamper No problem. Thanks

[trevor]

Gonna implement this nao! LOL

[trevor]

Okay so, I have it installed and it works but I hover over anyones name, avatar, etc. it doesn't remove the popover from the dom so its a bunch of cards everywhere.

Card city...

EDIT: I fixed it by changing;
$('.container').off(events, selector).on(events, selector, function(e){
to what I have it all wrapped in which is ._ob

Actually I can just put body and it works just fine too.

[trevor]

Noticed a bug when you hover over the card and leave it on hover and backspace it doesn't remove itself.

[baris]

The issue where the card remains on screen on page navigation is fixed, @Schamper just didn't push a new version yet.

[trevor]

@baris said:

The issue where the card remains on screen on page navigation is fixed, @Schamper just didn't push a new version yet.

Ohh okay, thanks! Yup, I just pulled the latest, looks better and works good now. Example below...

[psychobunny]

wow that card looks awesome @trevor ... such a show off haha

btw these cards seem to get stuck open on mobile, after opening the composer, I can't remove the card. Maybe the cards shouldn't be activated at all on mobile

[trevor]

So you're saying they should either be disabled at a certain viewport, OR, as you've said for mobile devices using mobile detection which leads me to ask this question. Why doesn't NodeBB use Modernizr or some type of browser detection in the core?
I agree with either direction.

[psychobunny]

That's a good question, right now we have some stuff like this, might be better to use Modernizr instead

[Schamper]

@psychobunny either that or destroy it on any "click" not on the card. Also is it just on Android or on Chrome in general that the info is under the profile image, instead of next to it?

@trevor oooh that looks very nice! Is that with just a template override and some styling?

[trevor]

@Schamper Yeah, I didn't have to touch JS.