Wikinews:Javascript

From Wikinews, the free news source you can write!

The purpose of this page is to document the JavaScript used on Wikinews (right now it is more of an overview than documentation, but hopefully it is useful to someone). See also Wikinews:Skins. For information on enabling custom JavaScript for yourself, see meta:Help:User style.

If you discover a bug in the local javascript, or one of the gadgets, please report it at the bottom of this page.

[edit] Gadgets

Gadgets are optional functionality you can enable in your preferences.

• See special:gadgets for full list. Some of the more popular ones are also listed here.

[edit] Hide fundraiser

Only available during fundraisers, hides the fundraiser notice.

• MediaWiki:Gadget-HideFundraisingNotice.css

[edit] Navagation popups

Copied from Wikipedia, so probably out of date. See Wikipedia:Tools/Navigation popups. Provides quick overviews of articles as you hover over text. See File:Popup-preview.png for an example.

[edit] HotCat

Stolen from commons. Allows easy insertion/removal of categories. Modified for Wikinews so that it doesn't remove date categories, or tag categories (published, developing, archived, etc).

[edit] WikEd

Stolen from Wikipedia. Adds syntax highlighting, and better editing toolbar. This directly loads the script from Wikipedia, so it should always be up to date. See w:User:Cacycle/wikEd for more details.

[edit] ReadyAlert

Adds to the sitenotice a list of articles currently needing to be reviewed, as well as a list of articles that are published but need to be re-flagged. Also includes how long the article has been waiting to be reviewed/flagged.

[edit] talkSeperate

Add a yellow border around different levels of indentation to make it easier to tell who is talking. Stolen from french Wikinews.

[edit] CommentWatch

If you add a page to your watchlist, also add the associated comment (opinion) page to your watchlist as well.

[edit] Wiktionary lookup gadget (Hover box variety)

[edit] FAQ

• I want to use this, but at the same time I want to be able to double-click things without the pop-up coming up
  • hold down shift while double clicking
• Can this be translated into <some language>
  • yep, this is already in several languages. See bottom of MediaWiki talk:Gadget-dictionaryLookupHover.js to request a new translation, or help with translation
• Can I use this on my website or wiki
  • Yes you can. See below for details on how to use on your own website. Ask user:Bawolff if you need help.
• I know javascript and want to help with development of the script
  • Awesome, ask user:Bawolff what you could do to help.
• I want to use this as a bookmarklet
  • Sure, just bookmark the following url (In firefox, highligh it and drag to toolbar)

javascript:(function%20()%20%7Bvar%20src%20=%20document.createElement('script');src.type%20=%20'text/javascript';src.src%20=%20'http://en.wikinews.org/w/index.php?title=MediaWiki:WiktionaryLookup-external-bookmarklet.js&action=raw&ctype=text/javascript&scrver=1';document.getElementsByTagName('head')%5B0%5D.appendChild(src);%7D)();void%200

• • Alternatively, follow instructions at http://www.marklets.com/Bookmarklets/Wiktionary+lookup.aspx

[edit] Introduction

Screenshot of a definition given with the Look Up tool from the French Wiktionary

In short, double click a word, get its definition.

This gadget allows you to double click on a word, and a box will be overlaid showing the definition of that word. This gadget works, by detecting what is highlighted when you double-click on the page (double-clicking a word automatically highlights it). The gadget than looks up the word, using the following url http://en.wiktionary.org/w/api.php?action=parse&prop=text&format=xml&xslt=MediaWiki:extractFirst.xsl&page=Word (replacing word with the name of the word. It than displays that page in an overlay (absolutely positioned iframe for those familiar with html) on the current page. To close the overlay just click anywhere outside it. (preferably to the left or right of it. there is a little space directly under the overlay box which won't close [this is because it is actually a transparent part of the box, used to accomadate large definitions]).

A couple of notes

• Internet explorer doesn't work with this gadget as of current. As a fall-back, it will just open up the relevent wiktionary page in a new window on internet explorer
  • This is due to mediawiki giving the xslt stylesheet the type of text/xml, which well technically correct, the real word requires text/xsl for cross-browser support.
• If wiktionary has multiple definitions for a word, it will display the first one. This is not always the most relevent definition
• Hopefully this will soon support searching for definitions in non-english. at the moment this only supports searching in english.
• Holding down shift while double clicking will prevent the box from appearing. This can allow the gadget to be used in combination with the double-click to edit preference.
• If you have any feature requests/suggestions/comments/bugs/hate-mail/love-mail etc. You can put them on MediaWiki talk:Gadget-dictionaryLookupHover.js or ask me directly.

[edit] How to install

[edit] On mediawiki wiki

• If you want to enable this on your local wiki, add the following to somewhere where js is loaded:

importScriptURI('http://en.wikinews.org/w/index.php?title=MediaWiki:Gadget-dictionaryLookupHover.js&action=raw&ctype=text/javascript');

• If you just want to enable it for yourself, put it in special:mypage/skinname.js (replacing skinname with your skin. for example special:mypage/monobook.js if monobook is your skin.)
• If you want to enable it for everyone, put it in mediawiki:Common.js
• If you want to make it a gadget, put the js snipit above in mediawiki:Gadget-wiktLookup.js . create mediawiki:Gadget-wiktLookup and put a description of the gadget in there (preferably with a link back here for bug reports). Add wiktLookup|wiktLookup.js to mediawiki:Gadgets-defintion .

[edit] On an arbitrary website (aka your blog)

Add the folowing somewhere into the html (preferably in the <head>, but should work anywhere:

<script src='http://en.wikinews.org/w/index.php?title=MediaWiki%3AWiktionaryLookup-external.js&action=raw&ctype=text/javascript' type='text/javascript'></script>

Note if for some reason you don't want to hot link hot-linking is highly recomended though), contact me (user:Bawolff) and i'll tell you how to set that up.

The script uses the lang attribute on the <html> element to determine the language of your website. You can also override this by setting a global js variable wgContentLanguage. For example: var wgContentLanguage = 'fr';. Theres some other options that can customize the script, but i havn't documented them yet (don't worry, they are not really useful).

[edit] Configuration options

This script has a number of configuration options. to configure add the following to somewhere where js is loaded (could be loaded before or after the script). For example on a wiki, if you wanted to configure for the entire site, it could be at mediawiki:Common.js . If its just for you, special:mypage/monobook.js (or special:mypage/vector.js if you use vector, etc for other skins). If its a blog, where ever you can execute js (for example, insert it between a <script> and </script> tags.

The following parameters are supported (prefix with wiktLookup.)

• count - maximun number of definitions to display (defaults to 1; values other than 1 not well tested. Will only display a maximun of the number of definitions it can find.)
• showWord - show the word that this definition is for. (use one of link, none, or bold. defaults to none)
• noRedir - disable auto-redirection. for example disable mapping FOOD → food (not recomended).
• preferLang - this is your user language. This is the language that the definition appears in (not the language that the word is assumed to be of) (don't mess with this unless you have a good reason. defaults to your mediawiki preference)
• audio - One of true, false, autoplay. have audio pronounciation of word where available. Not yet implemented
• height - how many pixels high the maximun size of the box should be. defaults to about 420
• width - how many pixels wide the max size of box should be. defaults 180.
• key - a single (lowercase) letter to specify the ctrl+shift+key combo. for example if you put wiktLookup.key = 'b', ctrl+shift+b will look up any word thats highlighted. defaults to 'l'. Note: sometimes the box will popup in weird places when looking up things by key combo.
• reverseShift - Normally if you press shift, it stops the popup from coming up when double clicking. with this option, you have to press shift and double click for the pop up to come up.

For example, to use a count of 3 defintions, the bold showWord, a slightly wider box, add the following js:

if (!window.wiktLookup) wiktLookup = {};
wiktLookup.count = 3;
wiktLookup.showWord = 'bold';
wiktLookup.width = 220;

If you are on a wiki, you would either add it to special:mypage/monobook.js (replacing monobook with the skin you use) if you just want it for you, or mediawiki:Common.js if you want the options. If you are using an external website, such as blog, you would suround it with <script> tags, and insert it into the html source of your website.

If you are using this from a blog (not a wiki), you can also use the global variable wgContentLanguage to overide the assumed content language of your blog (it defaults to the lang attribute of the html element) This is used to figure out what language the word you clicked on is in. The global variable wgUserLanguage controls what language it is assumed the user speaks (aka what language to present the definition in).

[edit] Always enabled

[edit] mediawiki:Common.js

[edit] Rss Feeds

• A <link> to http://toolserver.org/~zach/cgi-bin/rss.cgi?cat=<Category Name> is included for every category. This allows browsers like Firefox to put a little RSS icon in the corner linking to an RSS feed for recently published articles in that category only. The main feed is handled on mediawiki side.
• Any portal page that has some element with the id rssFeedLink Will add a rss <link> for http://toolserver.org/~zach/cgi-bin/rss.cgi?cat=<Page name without portal prefix>. {{topic header}} and {{Region header}} automatically add such an id if it is detected there is a category with the same name as the portal in existence.

[edit] Dynamic Navigation

A script for the collapsible boxes you know and love. It was stolen from some other project a long time, and was modified so that there is an option to make the open boxes close if another one is opened (only one open at a time). This script is rather ugly, and could be much improved.

• See Special:Prefixindex/Template:Dynamic navigation
• Uses css found in mediawiki:common.css

[edit] Tabber

script to create tab boxes. Created by by Patrick Fitzgerald, and released under an open source MIT license (go open source). Was modified slightly to suit our purposes. Creates tab boxes.

• Uses various css in mediawiki:common.css
• See {{Picture select}}, {{howdy}} and {{htab-box}}
• There is some special case code for {{howdy}} in the js to allow linking between the tabs. see [1]

[edit] IRC box

Creates an IRC login box anytime you put <div id="cgiircbox"></div> on a page. Logs you into the wikizine cgi:irc web interface. Used to be used on WN:IRC, not anymore. Still on WN:V

[edit] Custom edit buttons

Adds a button to the edit toolbar for Linking to Wikipedia, and for creating redirects.

• For an example of extensive use, edit a page on the french wikinews.

[edit] Comment crap

• Script for making the comment namespace a pseudo-second-talk ns. (adds a opinions tab, and turns it red if it doesn't exist) Could be improved imho. Mostly contained in MediaWiki:Comments.js

[edit] Ticker

Shows a list of items, one at a time. If you're using an old computer, and don't want to waste cpu cycles, it can be disabled via a gadget, or by doing var disable_ticker2=true;.

• See {{ticker}}
• Demo page at User:Bawolff/sandbox/ticker
• See comments in mediawiki:Ticker2.js for detailed information on how it works.

Note: Historically we used a different ticker system - mediawiki:Ticker.js. It is no longer loaded by the english wikinews js, but some other languages use it.

[edit] Edit tools (MediaWiki:Edittools.js)

Add a drop down menu to the insert markup box that comes after the editbox.

[edit] per page customization

• Loads [[mediawiki:common.css/<PageName>]] and [[mediawiki:Common.js/<pageName]] dependent on what page you're looking at. The following per page scripts/css currently exists.

• Of particular note:
  • mediawiki:Common.js/Main Page allows edit lead links to be hidden from anon users who can't edit them (but currently not in use)
  • mediawiki:Common.js/Wikinews:Syndication Allows users to get customized feeds of the site, using CSpurrier's RSS tool
  • mediawiki:Common.js/Special:MovePage yells at people about double redirects. (however it misses triple redirects)
  • User:Bawolff/sandbox/powerFlag Allows you to set flagged revision settings on a per flag basis.

[edit] Social networking stuff

For use with template:Social bookmarks.

• Looks for an element with an id of social_bookmarks.
• Finds all links (<a> elements) that are children of the social bookmark element
  • Add on onclick handler so that any links will open in a new window (the window currently has the following options: width=640,height=480,menubar,resizable,scrollbars,status,toolbar )
  • If any of the links link to somewhere start with http://twitter.com/home/?status dynamically replace the location of the link with something along the lines of http://twitter.com/home/?status=Look%20what%20I%20found%20on%20Wikinews%3A%20http%3A%2F%2Fenwn.net/+<wgArticleId> where <wgArticleId> is the id of the current article (This is to shorten twitter messages, as they have a 140 character limit. Compare Look what I found on Wikinews: http://enwn.net/+113953 (54 characters) vs Look what I found on Wikinews: http://en.wikinews.org/wiki/UK_government%27s_Information_Commissioner_takes_enforcement_action_against_Liberal_Democrat_party_for_cold_calling_voters (181 characters; 41 characters over the limit).
  • http://enwn.net is a url shortening service specifically for wikinews, created/owned by User:ShakataGaNai. Before that we'd use http://en.wikinews.org/wiki/article?curid=113953

[edit] Custom Editintros

[edit] from wikipedia

We append &editintro=Template:Editintro_from_wikipedia to all the editlinks on any page, when the user has a referrer starting with http://en.wikipedia.org . This puts {{Editintro from wikipedia}} above the edit box.

[edit] not current

Any article that has a publish date (in {{date}}, or more accurately the date category that the date template adds) over 48 hours ago, is in category published, and not in category archived, has &editintro=template:Editintro_notcurrent to the end of all edit urls (unless they already have an edit intro). This makes {{Editintro notcurrent}} go on top of the edit box

Note if there is a conflict between not current, and from wikipedia, not current wins. This was a completely arbitrary decesion, it could be switched, or we could have another template when both apply if people would prefer that.

[edit] {{develop}} → {{review}}

Recognizes a span with a specific id (develop_to_review_link), that contains a link to edit the current page, and replaces it with a button that magically replaces {{Develop}} with {{review}}. Note you can change the text inside the link to change the text in the button, but do not change the link or the span, or add whitespace between the span and the link.

[edit] mediawiki:Monobook.js

Monobook only JavaScript

[edit] Alt stylesheets

• Loads alternate stylesheets for the monobook skin. These can be accessed in Firefox and Opera. In Firefox it is under View→Page Style→ <stylesheet>.

[edit] Main Page stuff

Hides the title if skin is monobook, and page is main page (This should possibly be moved to css).

[edit] Mediawiki:Modern.js

• Add the Wikinews logo to the left navigation bar.

[edit] Other Stuff

[edit] user:Bawolff/mwapilib.js/user:Bawolff/mwapilib2.js

Called by some of the per-page js, and some js in my (Bawolff's) userspace. Aims to make using the mediawiki api easier to use. Some docs at user:Bawolff/mwapilib

• Note, user:Bawolff/mwapilib2.js is actually usable (and beautiful), where the first one is kind of crap.

[edit] jQuery

• Some scripts use jQuerry by calling importScriptURI('http://en.wikinews.org/w/extensions/UsabilityInitiative/Resources/jquery.combined.js'); something else. ITs somewhere in mediawiki land.

[edit] Bugs

Please use this area to report bugs and/or feature requests (for gadgets or the core js. If its a gadget maintained on wikinews you can alternatively report it to the maintainer of that gadget)

• DragonFire's supercool lead thingy.