Template talk:Audio/Archive 3

Archive 1

Archive 2

Archive 3

Archive 4

Formatting

This template was recently edited to recommend the following formatting:

• is a port city in...

The previous formatting was:

• Bordeaux () is a port city in...

WP:MOS suggests that as a general rule links should not be put in the bold reiteration of the title in the article's lead sentence, but user Omegatron rightly points out that this is a special case (diff). I think we should establish that this is an appropriate exception before we commit to a non-standard formatting on such a widely used template. (I've added a note about this issue on the WP:MOS talk page). --Muchness 22:21, 22 April 2006 (UTC)

I don't see how this is a special case that merits exception. We could link to all sorts of things in the bolded reiteration, and the consensus is that it should not be done. That said, I would still argue against it if it were clearly a special case. The article is not about the pronunciation but about the subject, and so linking in the former manner is overloading the reiteration far too much. Even if it was not considered an overload, having the audio icon and the (help-info) right after is cluttering and confusing (what is the help for and the info about, the subject of the article or the audio?) and does not improve the style or accessibility at all. Finally, putting the word "pronunciation" there is an important semantic cue for non-standard browsers and screen scrapers: putting the media link on the word leaves little clue for a non-visual browser-user as to what the heck the link is. So, there's three nested reasons and one independent reason why I think this isn't a good idea. For cases like this, I believe the latter formatting or {{listen}} to be stylisticly better and semantically more appropriate. — Saxifrage ✎ 00:34, 23 April 2006 (UTC)

Ok. — Omegatron 01:09, 23 April 2006 (UTC)

I consider having five elements (brackets, speaker, "pronunciation", "help", "info") to indicate a sound file places a lot of clutter on the page. Not only for headwords does this distract from the content. I would be in favour of limiting to just the speaker symbol being immediately visible and clickable. The text like "pronunciation" should be visible on hovering only. −Woodstone 09:48, 23 April 2006 (UTC)

I'm the one who made the edit and I find the implementation of the semi-official ban on linking bolded words to be a bit too strict. Bolding aside, I agree with Woodstone. The amount of clutter with too many links is problematic.

Peter ^Isotalo 09:51, 28 April 2006 (UTC)

As has been said on this page many times, the extra links are necessary.

I wrote a little mock-up javascript to hide them and only display them in a little box on hover, if you're interested in trying that out. If enough people like the idea, we can write a robust version and include it site-wide so that everyone with javascript will see only a single link (and browsers without js will see it the way it is now). — Omegatron 13:49, 28 April 2006 (UTC)

Javascript solution?

Javascript can be used to make a little popup, like a tooltip for audio links, to hide the file description link and media help link until the reader mouses over the filename. Here is a rough mock-up. You can try it by adding this to User:YourName/monobook.js:

document.write(
    '<st' + 'yle type="text/css">            ' +
    ' div.audiolinkbox {                     ' +
    '     border:2px solid rgb(170,170,170); ' +
    '     background-color:rgb(250,250,250); ' +
    '     position:absolute;                 ' +
    '     margin:-1.2em;                     ' +
    '     display:none;                      ' +
    ' }                                      ' +
    '<' + '/style>'
    );

addOnloadHook(function () {
    
    function lightup () {
        this.audioPop.style.display="inline";
    }

    function lightout () {
        var savedThis=this;
        clearInterval(this.lightTimer);
        this.lightTimer=setInterval(function(){hideAudioPop(savedThis);}, 2000);
    }

    function hideAudioPop (caller) {
        clearInterval(caller.lightTimer);
        caller.audioPop.style.display="none";
        caller.audioPop.onmouseout = null;
    }

    function mouseoverAudioPop () {
        var hotspot = this.hotspot;
        if (!hotspot) { return; }
        clearInterval(hotspot.lightTimer);
        this.onmouseout = function () {
            hotspot.lightTimer=setInterval(function(){hideAudioPop(hotspot);},2000);
        };
    }

    /* Get all the span tags */
    spans = document.getElementsByTagName('span');

    /* go through them all */
    for (i=0;i<spans.length;i++) {
    /* If the span is class audiolinkinfo */
        if (spans[i].className.indexOf("audiolinkinfo") != -1) {
            /* Put it in a box */
            box = document.createElement('div');
            box.className="audiolinkbox";
            spans[i].parentNode.insertBefore(box,spans[i]);
            box.appendChild(spans[i]);
            /* Remove the parentheses */
            insidebox = spans[i].firstChild
            for (j=0;j<insidebox.childNodes.length;j++) {
                if (insidebox.childNodes[j].textContent == "(" || 
                    insidebox.childNodes[j].textContent == ")") {
                    insidebox.removeChild(insidebox.childNodes[j])
                }
            }
            /* Add the hover thing to the audiolink span */
            var hotspot = spans[i-1];
            hotspot.onmouseout=lightout;
            hotspot.onmouseover=lightup;
            hotspot.audioPop=box;
            box.hotspot = hotspot;
            box.onmouseover = mouseoverAudioPop;
        }
    }

});

What it currently looks like

What it could look like

It strips the parentheses, moves the extra info into a box and then hides the box until you roll your mouse over the audio link. That way the links aren't obstructive, the extra info is still there, etc. For people without javascript, it will just appear as it currently appears, so someone who is actually a good programmer could make a good version and we could put it in the site-wide javascript. This is not a finalized version; just a visual mock-up. See the images to the side for what it looks like, and what it could look like.

You can't click on the links because they disappear when you move your mouse towards them, but someone writing a real script could fix that easily enough.  :-) You can still see what it would look like. This would be trivial for User:Lupin, I bet (Wikipedia:Tools/Navigation popups), or using something like this. — Omegatron 21:54, 6 May 2006 (UTC)

User:Lupin has now updated it so it actually works. If there is a strong consensus that this is a good idea, we can tweak the style to make it more consistent with the rest of the site and then deploy it site-wide. Please leave comments. — Omegatron 04:18, 18 July 2006 (UTC)

Printing issues

Hi guys,

I tried to fix some printing issues with this but, unfortunately, I think there's no way to do that without modifying (at least) common.css. You can see yourself what the problem is by doing a print preview of the template page and, for instance, of Morse Code (look at the first table in the section "Letters, numbers, punctuation, prosigns"). I think either the icon and the link text should both appear in print (though not the help/info addendum) or everything should be removed including any surrounding parentheses (it's obvious that something like "( )" is unacceptable for the user; he would wonder forever what was inside there that the printer refused to report :)) --Gennaro Prota^•Talk 02:28, 19 May 2006 (UTC)

I believe that's just because of the metadata class. I don't know why this template uses it. I asked above. No answer. — Omegatron 03:40, 19 May 2006 (UTC)

More elegant solution

I think the Help/Audio links are distracting and we should try moving to something resembling Template:Spoken Wikipedia. Anybody agree? ☆ CieloEstrellado 06:31, 7 June 2006 (UTC)

Yes, I agree. And the latter, BTW, has a wonderful icon! (Just kidding, I think I've still to tweak it a bit :-s) —Gennaro Prota^•Talk 13:52, 7 June 2006 (UTC)

You're going to put a big gray box inline with the text?? — Omegatron 15:40, 7 June 2006 (UTC)

I fully agree we should reduce the amount of clutter the current template places on the page, but it should not resemble the colossal template "Spoken Wikipedia" mentioned above. −Woodstone 17:20, 7 June 2006 (UTC)

Actually, as I've intended the proposal (and consequently replied), Cielo was just referring to the characteristics of lying "outside" the text flow (Omegatron? :)), not to its size. —Gennaro Prota^•Talk 18:55, 7 June 2006 (UTC)

We already have the {{listen}} template for audio examples set apart from the text. — Omegatron 19:07, 7 June 2006 (UTC)

At a rough guess I would say you're right :) Sorry for the noise. I lieu of what I said in my first reply I would say now "yes, I agree and prefer, in fact, {{listen}} "boxes" to inline audio links, even for pronunciation files". —Gennaro Prota^•Talk 12:50, 8 June 2006 (UTC)

Because the help and info links are clutter? Is that the only reason? We are thinking of hiding them with javascript. — Omegatron 14:20, 8 June 2006 (UTC)

That's *one* reason. I think we are being a little too "paternalistic", so to speak. What's the next step? Explaining how to click? Please, don't take this as a polemic; I'm just trying to explain what I think: we are being "excessively" helpful, to the point of offending the users' intelligence. That said, I think JavaScript should be the last option, for reasons you certainly know (Incidentally, there's a zero day exploit related to JS which affects both IE and Firefox; I have currently disabled it). Another reason: have you tried a print preview on a page that has inline audio links? —Gennaro Prota^•Talk 15:14, 8 June 2006 (UTC)

The average first-time Google clicker can open .ogg files with no problems? They know how to manually manipulate the URL to get to the audio file's description page? The links are necessary.

The print preview can (and should) be changed easily, but no one seems to know why we print some aspects of audio but not others. — Omegatron 16:10, 8 June 2006 (UTC)

The merits of the help link is certainly worth discussing, but the info link is simply not optional. These are media files that are copyrighted, just like our photos and images. We would never tolerate a solution that displayed an image without instant access to license information and I don't see how this is any different. Linking to audio files without supplying a link to the license page here or over at Commons is a violation of our copyright policy as far as I can tell.

Peter ^Isotalo 15:51, 7 July 2006 (UTC)

That is why we should link to the audio file's page, as we do with ALL images in Wikipedia. Those help/info links are insane. —☆ CieloEstrellado 13:03, 6 February 2007 (UTC)

New icon

A new (SVG) icon has been created. Here they are at the same size for comparison:

• Audio file (SVG)
• Audio file (PNG)

Do you like it? If so, I'll update the site's CSS. — Omegatron 19:20, 19 July 2006 (UTC)

I updated it, as no one seems to care, and I think the newer is superior. — Omegatron 16:09, 26 July 2006 (UTC)

Newer javascript version

What the new version looks like in Firefox

Not that anyone's paying attention, but I updated the javascript prototype to be more verbose, etc. To try it, add the following to User:YOURUSERNAME/monobook.js:

document.write('<scr' + 'ipt type="text/javascript" src="' 
             + 'http://en.wiki.x.io/w/index.php?title=User:Omegatron/monobook.js/audiopops.js'
             + '&action=raw&ctype=text/javascript&dontcountme=s"></scr' 
             + 'ipt>');

It still has bugs, of course, as I am not a real js programmer, but it gives you an idea of what we could have. Does this look like a good idea to deploy site-wide? What could be done to improve it? — Omegatron 15:00, 18 August 2006 (UTC)

Looks pretty good, and I like the way it degrades gracefully without Javascript. A couple of comments, after a very cursory look:

• The corners are square in Safari—I suppose that's a Mozilla CSS property at work.
• Sometimes it doesn't disappear at all, and it's not clear why this happens. The normal delay before disappearing is so long, it's hard to tell what makes it go away. This aggravates the following two problems:
• Sometimes the pop-up obscures the entire word that is being listened to, and it doesn't repeat the text. It would be nice if it appeared below and to the right of the mouse pointer, or of the linked text.
• Sometimes it's completely impossible to click the ogg link on the page (happens to me in antidisestablishmentarianism when the window is about 800px wide). The pop-up comes up and obscures the link so fast I can't click it, and never disappears while the mouse is over it. As in tool-tips, there should be a brief delay before it appears, and it should disappear very soon after I mouse away. (appears to be caused by interaction with a floating info-box to the right; changing the window width can help—moving the box completely below the mouse pointer might fix this)
• Might be nice to add a drop shadow to the box, to help show that this is a floating element over the page—its unexpected appearance can be slightly disconcerting.

This is a promising solution, but please get the details right before implementing, or it will be hard to gain acceptance. Good luck. —Michael Z. 2006-08-20 19:47 Z

• Yep; Mozilla-specific. I'm so used to seeing Wikipedia with rounded corners I forgot it's not what people see by default.
• Everything else: yeah, this is just a mock-up of what it would look like. The behavior of the pop-up would need tweaking and fixing before it went live. But you like the idea? — Omegatron 19:53, 20 August 2006 (UTC)

Add lang:bg please

• bg:Шаблон:Audio --Петър Петров 15:35, 23 November 2006 (UTC)

• ru:Шаблон:Audio
• eo:Ŝablono:Sondosiero --Koryakov Yuri 14:10, 19 January 2007 (UTC)

Done. Luna Santin 08:48, 20 January 2007 (UTC)

• rmy:Format:Shun should be changed to rmy:Sikavno:Shun, Desiphral-देसीफ्राल 11:48, 24 January 2007 (UTC)

{{editprotected}} Please, add sl:Predloga:Avdio and sort interwikis alphabetically. Thanks a lot. --Eleassar ^{my talk} 10:52, 21 February 2007 (UTC)

Done, Garion96 (talk) 17:49, 22 February 2007 (UTC)

Protected template

{{protected template}}

--Kjoonlee 01:47, 20 January 2007 (UTC)

Done. Luna Santin 08:53, 20 January 2007 (UTC)

Help/info

Can the "help-info" links please be removed? Just link to the audio file's page and add the links there. The "help-info" text is really distracting. I'm sure most people would be fine visiting the audio file's page. If you agree please voice your support. —☆ CieloEstrellado 13:00, 6 February 2007 (UTC)

• Disagree - defeats the whole point of the template. I suggested a solution with JavaScript to hide the extra links until the link is hovered over, but no one seems to have noticed. — Omegatron 14:14, 6 February 2007 (UTC)
  • I support anything that hides those links, so I give you my support. ☆ CieloEstrellado 09:39, 28 April 2007 (UTC)
• Strong oppose — Why should you stop giving people help..? --Kjoonlee 16:14, 6 April 2007 (UTC)
  • Because it is redundant and it clutters the article. People can go to the Image page and get help there. ☆ CieloEstrellado 09:37, 28 April 2007 (UTC)
    • I don't think that's redundancy, and I don't think that's good enough help. We should provide help in at least one place in articles, and we have -nohelp audio templates for when we have to use multiple audio samples. --Kjoonlee 12:40, 28 April 2007 (UTC)
      • And please don't even think about using -nohelp audio templates exclusively. (Provide help with {{Inline audio}}, or at the very least use a regular audio template for the first link.) --Kjoonlee 13:07, 28 April 2007 (UTC)
        • What is a "-nohelp audio template"? And what is a "regular audio template"? Your "please don't even think" is alarming and not helpful. Thanks. ☆ CieloEstrellado 01:21, 29 April 2007 (UTC)
          • {{audio-nohelp}}. But don't use it without providing the help in some other form.  :-) — Omegatron 01:28, 29 April 2007 (UTC)

This currently uses class=metadata. It should probably use class=noprint instead. (It does not contain information about our content, but is a "navigational" aid you could say.) Using noprint will also make sure that this does not show up in the new book print function. --TheDJ (talk • contribs) 18:25, 3 March 2009 (UTC)

Proposal

Lately I've seen the extended use in Wikipedia of the question mark (?) to symbolize help, such as in the country infoboxes (see United States, look at Gini index). The question mark is placed inside a special <sup> tag which makes it conveniently unobtrusive and comes with a nice question mark mouse gesture. Example: ^?.

So, my proposal is to change this:

with this:

The proposed template is at Template:Audio/tmp.

Please voice your opinion. Thanks! ☆ CieloEstrellado 22:02, 20 June 2007 (UTC)

I have proposed several times that we just use javascript to hide the extra links until they are hovered over. I have it installed on my own monobook.js and it seems to work fine. We just need a javascript expert to make it compatible with all browsers and test it for problems. — Omegatron 15:23, 28 July 2007 (UTC)

I support your proposal wholeheartedly. Very unobtrusive and it also solves the )) problem. Shinobu (talk) 17:20, 24 March 2008 (UTC)