Benutzer:Hk kng/svgdirect.js

/*
 * Ersetzt SVG-Vorschaubilder durch die SVGs selbst
 * Browser-Support:
 * - Opera 9.5 (getestet)
 * - IE 5.5 und neuer mit ASV-Plugin 3 (vermutlich)
 * - Safari 3.0 und neuer (vermutlich)
 * - Firefox 3 mit kleineren Bugs
 *
 * Die Seite kann durch folgenden Code in der persönlichen Spezial:Mypage/monobook.js
 * (bzw. der dem Skin entsprechenden Datei) eingebunden werden:
 * importScript('Benutzer:Hk kng/svgdirect.js');
 */

var is_ie = clientPC.indexOf('MSIE') != -1;

var XMLNS_SVG = "http://www.w3.org/2000/svg";
var XMLNS_XHTML = "http://www.w3.org/1999/xhtml";
var XMLNS_XLINK = "http://www.w3.org/1999/xlink";
var MIME_SVG = "image/svg+xml";

var commonsDomain = "http://commons.wikimedia.org";
var qUrlJson = "/api.php?format=json&action=query&titles=";
var qUrlInfo = "&prop=imageinfo&iilimit=max&iiprop=url|size|mime";
var qUrlList = "&generator=images&gimlimit=max";
var qCallbackDefault = "&callback=svgDirect.resultArrived";
var qCallbackFile = "&callback=svgDirect.fileResultArrived";

var imgStyleAtts = ['borderTopColor', 'borderLeftColor', 'borderRightColor', 'borderBottomColor',
	'borderTopWidth', 'borderLeftWidth', 'borderRightWidth', 'borderBottomWidth',
	'borderTopStyle', 'borderLeftStyle', 'borderRightStyle', 'borderBottomStyle',
	'marginTopWidth', 'marginLeftWidth', 'marginRightWidth', 'marginBottomWidth',
	'paddingTopWidth', 'paddingLeftWidth', 'paddingRightWidth', 'paddingBottomWidth'];

var svgDirect = {
	queryUrl : wgScriptPath + qUrlJson + wgPageName + qUrlList + qUrlInfo + qCallbackDefault,
	queryCommonsUrl : commonsDomain + wgScriptPath + qUrlJson
		+ wgCanonicalNamespace + ':' + wgTitle + qUrlList + qUrlInfo + qCallbackDefault,
	queryFileUrl : wgScriptPath + qUrlJson + wgPageName + qUrlInfo + qCallbackFile,
	query : {},
 
	createWrapper : function (img, imgInfo) {
		var svg = document.createElementNS( XMLNS_SVG, "svg:svg" );
		svg.setAttribute( "width", img.width );
		svg.setAttribute( "height", img.height );
		svg.style.minWidth = img.width + "px";
		svg.style.minHeight = img.height + "px";
		var imgStyle = document.defaultView.getComputedStyle(img, null);
		for ( st in imgStyleAtts )
			svg.style[imgStyleAtts[st]] = imgStyle[imgStyleAtts[st]];
		svg.setAttribute( "version", "1.1" );
		svg.setAttribute( "viewBox", "0 0 " + imgInfo.width  + " " + imgInfo.height );
		//Firefox workaround
		if ( is_gecko ) {
			var fo = document.createElementNS( XMLNS_SVG, "svg:foreignObject" );
			fo.setAttribute( "x", "0" );
			fo.setAttribute( "y", "0" );
			fo.setAttribute( "width", "100%" );
			fo.setAttribute( "height", "100%" );
			var obj = document.createElementNS( XMLNS_XHTML, "xhtml:object" );
			obj.setAttribute( "data", imgInfo.url );
			obj.setAttribute( "type", MIME_SVG );
			obj.setAttribute( "width", imgInfo.width + 1 );
			obj.setAttribute( "height", imgInfo.height + 1 );
			fo.appendChild ( obj );
			svg.appendChild ( fo );
		} else {
			var image = document.createElementNS( XMLNS_SVG, "svg:image" );
			image.setAttribute( "x", "0" );
			image.setAttribute( "y", "0" );
			image.setAttribute( "width", "100%" );
			image.setAttribute( "height", "100%" );
			image.setAttributeNS( XMLNS_XLINK, "xlink:href", imgInfo.url );
			svg.appendChild ( image );
		}
		img.parentNode.replaceChild( svg, img );
	},
 
	execute : function () {
		//Only for Internet Explorer with Adobe SVG Plugin: Reroute svg fragment to ASV
		if ( is_ie ) {
			var headID = document.getElementsByTagName("head")[0];
			var obj = document.createElement('object');
			obj.setAttribute('id', 'AdobeSVG');
			obj.setAttribute('classid', "clsid:78156a80-c6a1-4bbf-8e6a-3cd390eeb4e2");
			txt = document.createTextNode("Adobe SVG Viewer is required for this to work");
			obj.appendChild(txt);
			headID.appendChild(obj);
			txt = document.createTextNode("<?import namespace=\"svg\" implementation=\"#AdobeSVG\"?>");
			headID.appendChild(txt);
		}
		if ( wgNamespaceNumber == 6 ) {
			mw.loader.load(svgDirect.queryFileUrl);
		} else {
			mw.loader.load(svgDirect.queryUrl);
		}
	},
 
	resultArrived : function ( res ) {
		if ( !res || !res.query || !res.query.pages ) return;
		for ( var page in res.query.pages ) {
			if ( !res.query.pages[page].imageinfo ) continue;
			svgDirect.query[res.query.pages[page].title] = res.query.pages[page].imageinfo[0];
		}
		if ( res && res['query-continue'] ) {
			var c = res['query-continue'];
			mw.loader.load(svgDirect.queryUrl + '&gimcontinue='
				+ encodeURIComponent( c.images.gimcontinue ) );
		} else svgDirect.findSvgs();
	},
 
	fileResultArrived : function ( res ) {
		if ( !res || !res.query || !res.query.pages ) return;
		for ( var page in res.query.pages ) {
			if ( !res.query.pages[page].imageinfo ) continue;
			svgDirect.query[res.query.pages[page].title] = res.query.pages[page].imageinfo[0];
		}
		if ( wgArticleId == 0 ) {
			mw.loader.load(svgDirect.queryCommonsUrl);
		} else {
			mw.loader.load(svgDirect.queryUrl);
		}
	},

	findSvgs : function () {
		var imgs = document.getElementsByTagName("img");
		var len = imgs.length;
		var imgId = new Array(len);
		for ( var i = 0; i<len; i++ ) {
			var UID = "uniqueImg_" + i;
			imgs[i].id = UID;
			imgId[i] = UID;
		}
		for ( var i = 0; i < len; i++ ) {
			var img = document.getElementById( imgId[i] );
			var srcStr = img.getAttribute("src");
			srcStr = srcStr.substr( 0, srcStr.lastIndexOf( "/" ) );
			srcStr = srcStr.replace( /\057thumb/, "" );
			var imgInfo;
			for ( var info in svgDirect.query ) {
				imgInfo = svgDirect.query[info];
				if ( imgInfo.url == srcStr ) break;
				imgInfo = {};
			}
			if ( imgInfo === undefined ) continue;
			if ( imgInfo.mime == MIME_SVG ) svgDirect.createWrapper( img, imgInfo ); 
		}
	}
}
 
$( svgDirect.execute );