Talk:Reference Tooltips/Flow

About this board

Tooltip style is outdated, please update

2
Diskdance (talkcontribs)

Initially the gadget used Page Preview's classes to show tooltip and later changed to its own copies of them. However, after that, there were some visual changes to Page Preview's classes including changing border colors which didn't reflect on reference tooltips.

I hope these changes will be applyed to reference tooltips. Thanks!

JWBTH (talkcontribs)

I was too lazy to take on this for 3 years (hehe), but now I'm wondering does it make sense to try and match Page Previews since Reference Previews are best suited for this job. Page/Reference Previews currently use some styles that divert from Codex (including border styles you mentioned and box-shadow). I'm leaning towards updating this to Codex styles inasmuch as reasonable.

Reply to "Tooltip style is outdated, please update"

Not clear how to install and enable Reference Tooltips

7
Anbh42 (talkcontribs)

Where are ReferenceTooltips.js and ReferenceTooltips.css meant to go?

I have a Debian package installation and there are a whole load of file links between /etc/www/mywiki/w and /usr/share/mediawiki/extensions-core/Gadgets and /var/lib/mediawiki. Unfortunately the document writer's assumption that I should know is just overoptimistic.

Does it matter if I called the JS and CSS files something different? The only place they are referenced is in MediaWiki:Gadgets-definition, is that right?

I've just got this in my LocalSettings.php:

$wgGadgetsRepoClass = "MediaWikiGadgetsDefinitionRepo"

wfLoadExtension( 'Gadgets' );


And is this good:

ReferenceTooltips[ResourceLoader|default|type=general|dependencies=mediawiki.cookie,jquery.client]|Gadget-ReferenceTooltips.js|Gadget-ReferenceTooltips.css


or will those dependencies foobar It? I took that off wikipedia.org. Being a noob, I don't even know how to confirm if those 2 dependencies are present.

Þjarkur (talkcontribs)

They are not kept as files on a server, instead you only need to add some pages to your wiki. So you have to create a page in your wiki named "MediaWiki:Gadget-ReferenceTooltips.js" and so on for all of the steps.

Anbh42 (talkcontribs)

Hit the next issue - not sure if this is a foobar that I sneaked in with my fat fingers or a real problem:

Fatal error: Uncaught Exception: /usr/share/mediawiki/extensions/Gadgets/extension.json does not exist!

It's obviously having a problem because that file is at /usr/share/mediawiki/extensions-core/Gadgets

I put:

wfLoadExtension( 'Gadgets' );

in my LocalSettings.php - is that wrong?

Þjarkur (talkcontribs)

Can you move the extension to the "extensions" folder instead of "extensions-core"?

Anbh42 (talkcontribs)

Ah, I see. Yes. Even simpler, I just created a link like many of the other packages had. Obviously the Debian Gadgets package is way behind. However, now mediawiki is happy, but although I see the Gadgets entry on Special:Version, Gadgets isn't loading somehow:

- it doesn't have any entries in Special:Gadgets

- it doesn't show up as a tab in my Preferences

- the ReferencesTooltip functionality isn't present.

Anbh42 (talkcontribs)

OK - panic over. I hadn't called the two files "MediaWiki:Gadget-ReferenceTooltips.js/css" - stupidly confused. It's probably worth making a small edit to the setup doc to clarify this point. In my first attempt, I put them on the file system - doh!

On my second attempt, I called them "MediaWiki:ReferenceTooltips.js" and in my Gadgets-definition page, I referred to them as "ReferenceTooltips.js".

On my third attempt I renamed them to "MediaWiki:Gadget-ReferenceTooltips.js" but I haven't changed the names in Gadgets-definition so that is in contrast to the instructions here, yet it works.

Quīlubet (talkcontribs)

On page MediaWiki:Gadgets-definition there must be an "* " (asterix space) bevor each description for the gadget, otherwise it wount show up as a gadget on user preference page

Reply to "Not clear how to install and enable Reference Tooltips"

"does not work if 'Navigation popups' is enabled above".

1
Timeshifter (talkcontribs)

In Wikipedia preferences it says: "does not work if 'Navigation popups' is enabled above".

They both work for me. I am using Firefox on a desktop PC.

Reply to ""does not work if 'Navigation popups' is enabled above"."
קיפודנחש (talkcontribs)

there's a beta feature called "Reference Previews". didn't see it here, but ATM, it exists in beta preferences on enwiki and hewiki, and probably most wikimedia wikis.

presumably not a "gadget", but part of core.

these two features "collide" - both show the cite note in two separate popups.

one of them should check if the other is on and disable itself. i think this one already self-disable when the old "popup" enwiki gadget is on, and something similar should be done WRT the beta feature too.


peace.

Reply to "beta feature"

Pop-up window does not render wide enough for long equations

3
Jonesey95 (talkcontribs)
Þjarkur (talkcontribs)

.rt-tooltip has a max-width: 350px;. Would require some additional code to check what the overflow is and then overwrite the max-width value. How about just adding word breaks inside the math equations?

Þjarkur (talkcontribs)

.rt-tooltip img { max-width: 100%; } would also solve this (for when people are using the default image renderer and not MathML)

Reply to "Pop-up window does not render wide enough for long equations"
Summary by Daylen

Go to MediaWiki:Gadget-ReferenceTooltips on your wiki

Daylen (talkcontribs)
Þjarkur (talkcontribs)

What wiki are you on? If you go to MediaWiki:Gadget-ReferenceTooltips on your wiki you will see what label this option has and you should be able to look for that label in your Preferences.

Daylen (talkcontribs)

Thank you! I thought that it was a global setting and was trying to change it on MediaWiki to take effect on my enwiki account.

Quiddity (WMF) (talkcontribs)

You might also be looking for "Reference Previews", which is a different thing. That can be found under the "Preferences -> Beta Features" tab.

Fireattack (talkcontribs)

I understand this does not work together with Navigation popups.

But before, if you enabled both, Navigation popups will simply override Reference Tooltips. But currently, if you leave Reference Tooltips on (with default setting, "Click") and then enable Navigation popup, it causes a bug that, if you want to jump to the reference by clicking the reference number, you have to CLICK TWICE.

This doesn't happen a few months ago. So I mark it as a regression bug.

Tofiq Kərimli (talkcontribs)

Both of my sites are active. But on one of my sites, only one opens. Normal. On my other site, they both open at once. This is certainly bad (Google Chrome). What should I do to be normal on the second site? I don't want to give up the Navigation popups.

Tofiq Kərimli (talkcontribs)

I solved the problem. I replaced "Popups 1_33" with "Popups 1_32". Now everything is exactly what I want. The latest version does not have "Popups.php" and "package-lock.json" files. It is possible that this was the cause of the problem.

Reply to "Regression: conflict with Wikipedia:Tools/Navigation popups"

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!"

Activating on Wikiversity

2
Evolution and evolvability (talkcontribs)

Hello,

I'd like to add this extension to Wikiversity. What are the steps to add it?

Yair rand (talkcontribs)
Reply to "Activating on Wikiversity"

Not able to get script functioning

6
Coyote897 (talkcontribs)

Hi, on a 3rd party mediawiki site I have installed the script as per the instructions (as far as I can tell) but I am not able to get the pop-up functionality working. I would really appreciate some assistance please.

I have installed both manually (according to the instructions) and via export and special page import from here: https://en.wikipedia.org/wiki/Special:Gadgets/export/ReferenceTooltips

In total I now have relevant script on all the following pages:

https://www.domain.com/x/User:Yair_rand/ReferenceTooltips.js

https://www.domain.com/x/User:Yair_rand/ReferenceTooltips.css

https://www.domain.com/x/User:Louisa/common.js

[On the above page have tried: importStylesheet('User:Yair rand/ReferenceTooltips.css');

and:

/* Reference Tooltips. Version for testing before adding to gadget */

/* See en.wikipedia.org/wiki/User:Yair_rand/ReferenceTooltips */

/* Discussion: en.wikipedia.org/wiki/User_talk:Yair_rand/ReferenceTooltips */

importScript('User:Yair rand/ReferenceTooltips.js'); importStylesheet('User:Yair rand/ReferenceTooltips.css');

]

https://www.domain.com/x/User:Louisa/monobook.js

contains: importScript('User:Yair rand/ReferenceTooltips.js');

https://www.domain.com/x/MediaWiki:Common.js (just in case required)

[The following two urls contain the same code as their matching pages above.]

https://www.domain.com/x/MediaWiki:Gadget-ReferenceTooltips.js

https://www.domain.com/x/MediaWiki:Gadget-ReferenceTooltips.css

https://www.domain.com/x/MediaWiki:Gadgets-definition

The script appears as a gadget in preferences > gadgets.

I have cleared the browser cache by various methods.

The "Navigation popups" script is not installed on the server.

Yair rand (talkcontribs)

@Coyote897 Is the site publicly visible? If so, could you provide a link?

Also, does the javascript console show any errors?

Yair rand (talkcontribs)

@Coyote897 The JS console is showing "ReferenceError: importScript is not defined". Seems as though "importScript" is no longer always available at the start, so that line is breaking things. You could wrap it in mw.loader.using( 'mediawiki.legacy.wikibits', function () {} );, but since this is a gadget anyway, I think it would just work if you removed the importScript/importStylesheet lines from Common.js and the user js pages.

Coyote897 (talkcontribs)

@Yair rand Thankyou. Though do not seem to be getting a console error (at least with FF 52.0.2) I am still not able to get the script working. Please see here for a screenshot of the console while cursor is over a reference number.

I have tried the following:

a) Removing the importscript lines

b) Enclosing the importscript lines with the following:

mw.loader.using( 'mediawiki.legacy.wikibits', function () {

/* importscript line here */

} );

and the following variant (using the format of the line from the main wiki common.js)

mw.loader.using( ['mediawiki.legacy.wikibits'] ).done( function () {

/* Begin of mw.loader.using callback */

/* importscript line here */

/* End of mw.loader.using callback */

} );

c) And I have removed the full url in the importscript lines - so that it is back to the format in the instructions.

Is there anything I can set access wise, for the account I listed above - which would help you ascertain more. If so, please if you could copy the credentials so that I can delete them from the above post.

Yair rand (talkcontribs)

@Coyote897 Ah, the issue is that that page is in the userspace. By default, the script only runs in the main namespace, and the project, help, and draft namespaces. You can change this by modifying the line containing the text [ "", "Project", "Help", "Draft" ] in the JS code. The gadget seems to be working as expected in the main namespace of the site.

I've removed the credentials from your post and "deleted" the old revision, making it only visible to mediawiki.org administrators (which includes myself). If you want to further remove the content, the only people with the ability to do that here are Wikimedia Stewards (see m:Stewards).

Coyote897 (talkcontribs)

@Yair randThankyou so much for your generous attention in identifying what the issue was. I am so pleased to get the script working :) :) :)

As you wrote, I just needed to add "User" to the relevant line so as to add that namespace.

The script is working perfectly now.

Reply to "Not able to get script functioning"
Return to "Reference Tooltips/Flow" page.