XF 1.4 Adding a Browser Tooltip to the Registration Date

[Amaury]

How could I accomplish this on all the pages it appears?

As trivial as I know this is, I'd like to add a browser tooltip to the registration date so when users hover over it, then can see both the user's registration date and their exact registration time, essentially the same way you can hover over time stamps and see the exact dates and times.

Thanks.

 

[Steve F]

I'm not certain but I don't think an actual time is stored for user registration. Would have to look...

 

[Amaury]

 

[Steve F]

You kind of answered your own question really. If you look in the member_notable template you would see how it is used.

 

[Amaury]

I'm wanting to add a browser tooltip, though, and I'm not finding anything references I can use for that.



@mike406 did this in a few areas, but I don't quite understand what he did.

For example, he added a tooltip to the expiration date of a warning (see this thread), but I'm not seeing a tooltip class anywhere in the code. Although perhaps browser tooltips don't have a tooltip class. However, I wouldn't know what to use.

It looks like, for the example above, he changed:

<dd><span class="muted">{xen:date $warning.expiry_date, 'absolute'}</span></dd>

To:

<dd><span class="DateTime" title="{xen:datetime $warning.expiry_date, 'absolute'}">{xen:datetime $warning.expiry_date, 'absolute'}</span></dd>

Hm. Attempting to use the above as a reference, would this be correct for a registration date hover tooltip? However, what are all the templates I would need to apply it in?

<dd><span class="DateTime" title="{xen:datetime $user.register_date}">{xen:datetime $user.register_date}</span></dd>

 

[Steve F]

In that case just add a title attribute to any element, the class="DateTime" isn't really doing anything.

 

[Amaury]

the class="DateTime" isn't really doing anything

With what I want to do, anyway, I assume.

In that case just add a title attribute to any element

Can you provide an example?

What about templates, though? Which templates do I edit or does that matter in this case?

 

[Steve F]

This is what would be needed.

title="{xen:datetime $user.register_date}"

In member_view template:

Find

<dl><dt>{xen:phrase joined}:</dt>
                    <dd>{xen:date $user.register_date}</dd></dl>

Replace with

<dl><dt>{xen:phrase joined}:</dt>
                    <dd title="{xen:datetime $user.register_date}">{xen:date $user.register_date}</dd></dl>

 

[Amaury]

Thanks, that worked, though mine seems to be missing the time:



Looking at my ACP profile, this is when I joined:



Also, what other templates would I edit? I know the member card would be one.

 

[Steve F]

Try it it on a default style - seems yours has been edited or something.

 

[Amaury]

 

[Steve F]

Possibly you have changed the language to read differently?

 

[Amaury]

Nope, we only have the default English (US) language, if that's what you're referring to.

I wonder if it's to do with the fact that it's no longer relative time. If you look at a user who's been registered for more than a week on wherever you tested it, does it show both the date and time or just the date?

 

[Steve F]

Yeah just the date.

 

[Amaury]

It's just a matter of getting the code, then. It's certainly possible based on the fact that there's already a tooltip for that in ACP profiles.

 

[mike406]

title="{xen:datetime $user.register_date, 'absolute'}"

Alternatively you could replace

<dd>{xen:date $user.register_date}</dd>

With

<dd><xen:datetime time="$user.register_date" /></dd>

However I'll note that <xen:datetime ...> will not always work the same in every location as sometimes it will spit out the date and time and in other cases just the date. An example of this being the Date and Expiry columns under the Warning tab in profiles. Both use <xen:datetime ...> but only the Expiry dates include the time. I'm not too sure why <xen:datetime ...> includes the time only sometimes, but in any case it works here so I figure I will include it.