Topic on Talk:Reference Tooltips

Jump to navigation Jump to search

References Tooltips reworked; feel free to update!

20
Jack who built the house (talkcontribs)

Hi, I'm a developer active in Russian Wikipedia. We've reworked ReferenceTooltips significantly in our wiki, and I would like to suggest other wikis to update to our version. (Maybe a global gadget would be a better solution, I would welcome such an initiative if the community agrees.) It was developed by me; Facenapalm, Serhio Magpie, IKhitron, Iniquity, Saint Johann helped in testing.

Here it is: w:en:User:Jack who built the house/Gadget-referenceTooltips.js (English translation) / w:ru:MediaWiki:Gadget-referenceTooltips.css.

Changes list:

  • Tooltips inside tooltips are now working properly (they did work before, but there were bugs associated with this behaviour). See the animation.
  • An option is added that allows to convert native browser tooltips for titled <abbr> tags and such into gadget tooltips. It is default on touch devices, allowing users of the desktop version on such devices to see them.
  • The settings dialog is rewritten using OOUI (its modules are loaded on demand) and looks similar to the Page Previews settings dialog.
  • Saving settings doesn't require page reload anymore.
  • The code is refactored. Tooltips & elements having them are objects now. The script used jQuery and pure JavaScript inconsistently – now it uses the first everywhere where appropriate (performance losses are negligable).
  • Old IE support is removed (JavaScript isn't loaded to them anyway).
  • The coding conventions are applied.
Jack who built the house (talkcontribs)

Some details about installation:

  • You will need to translate interface messages to your wiki language.
  • Every wiki can have its own set of elements for which tooltips are applicable (for example, harvard-style links in enwiki & ruwiki have "CIREREF" prefix in fragment links, but this can be not universal). You can set custom CSS selectors for regular tooltips and for tooltips converted from native tooltips in corresponding variables.
  • Every wiki can have its own set of namespaces where reference tooltips are appropriate (tooltips for <abbr> tags are considered appropriate everywhere if switched on). (Removed the namespace check for now.)
  • The gadget is dependent upon Page Previews' classes to show/hide tooltips: .mwe-popups-fade-in-down and such. The code is not so short, so they weren't incorporated into the gadgets. If the classes would be renamed/removed some time, you would have to add them manually. (The animation doesn't work with Page Previews off, so I added them to the CSS.)
Yair rand (talkcontribs)

Looks good. I notice a few bugs that were introduced:

  • The space to the sides of the popup's "tail" is no longer counted as part of the popup for mouseover purposes. This causes the popup to frequently disappear before the user can move their mouse towards it, especially in cases where the "tail" isn't immediately above where the mouse started, meaning that if the gap isn't covered quickly enough, there will be a frustrating disappearance.
  • This isn't so important, but if the user clicks the settings button in the demo popup within the settings menu itself, there's no way to exit the menu, no matter how many times the "Cancel" button is clicked.

Note that the gadget still works, but without the animation, when Page Previews is disabled via preferences.

Jack who built the house (talkcontribs)

@Yair rand: thank you for the original version of the gadget and thank you for the notes. The first one seems legit, although it is the case for Page Previews also. I fixed it. The demo tooltip bug is fixed too. As to the animation, I checked it some time ago and found that the classes work no matter Page Previews is enabled or disabled. Now it changed apparently, so I added the classes to the gadget's CSS.

Jack who built the house (talkcontribs)

One question: in your version there is a namespace check. Is it there because in some namespaces the gadget is undesirable, or is it there because in most namespaces there is just no need for it? If it is the second, I don't see good reasons for that restriction as references appear from time to time in much more namespaces than the main namespace, "Project", "Help" and "Draft". I removed the namespace check for now.

Yair rand (talkcontribs)

@Jack who built the house: The namespace check was added in 2011 by @Kaldari, with the intention of "trying to cut down js bloat for other pages", which seems reasonable. It might be preferable to add some more namespaces to the list, but the gadget certainly doesn't need to run in the Special namespace or Module namespace, for example. Or maybe it should be changed from a whitelist to a blacklist?

Jack who built the house (talkcontribs)

In the Module namespace, refs may appear in docs, and they do. As for the Special namespace, you are probably right. A check for the wgIsArticle wgAction config value could also be useful. Nevertheless I don't really see much gain here as it will only save us a time needed for running 2 selectors (by default).

Jack who built the house (talkcontribs)

On my old notebook in the watchlist with 500 last changes the script runs with no effect for 8ms. On modern machines it's even quicker. So I guess the gain of the script not running where it has no effect is comparable to the price of loading additional lines of code (and for most users who only read Wikipedia, which means they don't visit special pages or page history, it has no effect). So I don't see any clear benifits and will leave the code unchanged for now.

The RedBurn (talkcontribs)

It looks great, thanks for the update and the support of Harvard-style citations!

While translating it, I noticed an orphan bracket at the end of 'rt-tooltipsForComments'.

If possible, it would make the translation easier to keep the translation text at the beginning of the code, like in the original Reference Tooltips code.

Could it be made so that it shows on the bottom of the ref like Page Previews (see meta:WMDE Technical Wishes/ReferencePreviews) (an advantage is that it doesn't hide the text of the sentence) and with the same exact animation?

Jack who built the house (talkcontribs)

@The RedBurn: > While translating it, I noticed an orphan bracket at the end of 'rt-tooltipsForComments'.
That's a Google Translate bug.

> If possible, it would make the translation easier to keep the translation text at the beginning of the code, like in the original Reference Tooltips code.
Done.

> Could it be made so that it shows on the bottom of the ref like Page Previews (see meta:WMDE Technical Wishes/ReferencePreviews) (an advantage is that it doesn't hide the text of the sentence) and with the same exact animation?
I'm afraid I can't understand what you mean here.

The RedBurn (talkcontribs)
Jack who built the house (talkcontribs)

Page Previews are shown above the link by default as well. They are shown below only when there isn't enough space above. To make them appear below you could change the following condition: teOffset.top < this.$element.outerHeight() + $window.scrollTop() + 6.

The RedBurn (talkcontribs)

Indeed, so Reference Tooltips already meets that requirement. :-)

PlavorSeol (talkcontribs)
The RedBurn (talkcontribs)
PlavorSeol (talkcontribs)

Can you also make English translation?

Jack who built the house (talkcontribs)
The RedBurn (talkcontribs)

It looks great! Is it possible to put mw.util.addCSS below the translation text to make translations easier?

Jack who built the house (talkcontribs)

You're right: I changed the link to only-JS version. CSS needs no changes.

The RedBurn (talkcontribs)

Perfect, thanks!

Reply to "References Tooltips reworked; feel free to update!"