MediaWiki:Imagemap-Hightlight.js: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
KMA (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
JSC (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung |
||
| (7 dazwischenliegende Versionen von 2 Benutzern werden nicht angezeigt) | |||
| Zeile 82: | Zeile 82: | ||
}); | }); | ||
} else { | } else { | ||
context.clearRect(0, 0, context.canvas.width, context.canvas.height); | |||
} | } | ||
} | } | ||
| Zeile 89: | Zeile 89: | ||
// massage the area "href" and create a human legible string to be used as the tooltip of "li" | // massage the area "href" and create a human legible string to be used as the tooltip of "li" | ||
function pageOfHref(href, cssClass) { | function pageOfHref(href, cssClass) { | ||
var page = href.replace(document.location.protocol + | var page = href.replace(document.location.protocol + mw.config.get( 'wgServerName' ) + "/wiki/", '').replace(/.*\/\//, '').replace(/_/g, ' '); /*JSC 210819: veraltete Funktion ausgetauscht */ | ||
page = page.replace(/#(.*)/, function(toReplace){return toReplace.replace(/\.([\dA-F]{2})/g, '%$1');}); | page = page.replace(/#(.*)/, function(toReplace){return toReplace.replace(/\.([\dA-F]{2})/g, '%$1');}); | ||
page = decodeURIComponent(page); // used for "title" of legends - just like "normal" wiki links. | page = decodeURIComponent(page); // used for "title" of legends - just like "normal" wiki links. | ||
| Zeile 98: | Zeile 98: | ||
function init() { | function init() { | ||
mw.util.addCSS('li.' + myClassName + '{white-space:nowrap;}\n' + //css for li element | |||
'li.' + liHighlightClass + '{background-color:yellow;}\n' + //css for highlighted li element. | 'li.' + liHighlightClass + '{background-color:yellow;}\n' + //css for highlighted li element. | ||
'.rtl li.' + myClassName + '{float: right; margin-left: 3em;}\n' + | '.rtl li.' + myClassName + '{float: right; margin-left: 3em;}\n' + | ||
| Zeile 104: | Zeile 104: | ||
$(hilightDivMarker+ ' img').each(function() { | $(hilightDivMarker+ ' img').each(function() { | ||
var img = $(this), map = img.siblings('map:first'); | var img = $(this), map = img.siblings('map:first'); | ||
if (map.length === 0) | |||
map = img.closest('span').siblings('map:first'); | |||
if (!('area', map).length) | if (!('area', map).length) | ||
return; //not an imagemap. inside "each" anonymous function, 'return' means "continue". | return; //not an imagemap. inside "each" anonymous function, 'return' means "continue". | ||
| Zeile 126: | Zeile 128: | ||
img.fadeTo(1, 0); // make the image transparent - we see canvas and bgimg through it. | img.fadeTo(1, 0); // make the image transparent - we see canvas and bgimg through it. | ||
var ol = $('<ol>', {'class': myClassName}) | var ol = $('<ol>', {'class': myClassName}) | ||
.css({clear: 'both', margin: 0, listStyle: 'none', maxWidth: w + 'px', float: 'left', position: 'relative'}) | .css({clear: 'both', margin: 0, listStyle: 'none', maxWidth: w + 'px', float: 'left', position: 'relative', display: 'none'}) | ||
.attr({'data-expandtext' : expandLegend, 'data-collapsetext': collapseLegend}); | .attr({'data-expandtext' : expandLegend, 'data-collapsetext': collapseLegend}); | ||
// ol below image, hr below ol. original caption pushed below hr. | // ol below image, hr below ol. original caption pushed below hr. | ||
div.after($('<hr>', {'class': myClassName}).css('clear', 'both')).after(ol); | //div.after($('<hr>', {'class': myClassName}).css('clear', 'both')).after(ol); | ||
var lis = {}; //collapse areas with same caption to one list item | var lis = {}; //collapse areas with same caption to one list item | ||
$('area', map).each(function() { | $('area', map).each(function() { | ||