User:Zhaofeng Li/Floater.js

// forked from User:Equazcion/Floater.js var imageHistory = "//upload.wikimedia.org/wikipedia/commons/1/1d/Clock_simple_white.svg"; var imageEdit = "//upload.wikimedia.org/wikipedia/commons/e/ec/Btn_edit.gif"; var imageSwitch = "//upload.wikimedia.org/wikipedia/commons/e/e8/Play_blauw.png"; // Load prerequisites importStylesheet('User:Zhaofeng Li/Floater.css'); loadJQViewport; // Predict a static floater height var floaterHeight = 31;

// Create/insert empty Floater div $('#mw-head').prepend('. '); // Grab the div var floater = $('.floater');

// Hide floater until it's ready floater.hide; // Set URL prefix var pre = location.protocol + '//' + wgPageContentLanguage + '.' + wgNoticeProject + '.org' + '/w/index.php?title='; // Construct the page title line here. Long titles will need to be truncated. if (wgPageName.length > 40){ if (wgNamespaceNumber == 0){ pageNS = ''; } else if (wgNamespaceNumber == 4) { pageNS = 'WP:'; } else if (wgNamespaceNumber == 5) { pageNS = 'WP Talk:' } else if (wgNamespaceNumber == 8) { pageNS = 'MW:' } else if (wgNamespaceNumber == 9) { pageNS = 'MW Talk:' } else if (wgNamespaceNumber == 14) { pageNS = 'Cat:' } else if (wgNamespaceNumber == 15) { pageNS = 'Cat talk:' } else { pageNS = wgCanonicalNamespace + ':'; }	var pageTitle = pageNS + wgTitle.substr(0,7) + '...' + wgTitle.substr(-15); var titleLine = '' + pageTitle.replace(/_/g,' ') + ' ' } else { var titleLine = '' + wgPageName.replace(/_/g,' ') + ''; } // If the current page has an "add section" tab, construct a link if ($('#ca-addsection').length > 0){ var addSection = ' + Section' + ''; } else { var addSection = ''; } // Add preview and save buttons if we're editing if ((wgAction == 'edit') || (wgAction == 'submit')){ var editButton = ' ' + ' ' + '<li><a href="' + pre + wgPageName + '&action=edit' + '"><img style="padding-right:5px;margin-bottom:3px;" src="' + imageEdit + '" height="17px" alt="">Edit</a>' + '</li>'; } else { var editButton = '<li><a href="' + pre + wgPageName + '&action=edit' + '"><img style="padding-right:5px;margin-bottom:3px;" src="' + imageEdit + '" height="17px" alt="">Edit</a>' + '</li>'; } // Leave out main/talk switch and history buttons on Special pages if (wgNamespaceNumber > -1){ var switchButton = '<li><a href="' + pre + getAssoc('url') + '"><img style="padding-right:5px;margin-bottom:3px;opacity:0.9;" src="' + imageSwitch + '" height="15px" alt="">' + getAssoc('name') + '</a>' + '</li>'; var historyButton = '<li><a href="' + pre + wgPageName + '&action=history' + '"><img style="padding-right:3px;margin-bottom:3px;" src="' + imageHistory + '" height="17px" alt="">History</a>' + '</li>'; } else { var switchButton = ''; var historyButton = ''; } // Fill the Floater div with some crap floater.html(	// Left section for page title, edit, history, and main/talk toggle	' ' + 		'<ul class="floaterPagelinks" style="margin-left:10px;list-style-type:none;list-style-image:none;display:inline;">' +			titleLine + 			editButton +			addSection +			historyButton +			switchButton +		'</ul>' +	' ' + 	// Small links for info, logs, whatlinkshere	' ' +		'<ul class="smallLinks" style="list-style-type:disc;">' +			'<li><a href="' + pre + wgPageName + '&action=info" title="Information for this page">I</a></li>' +			'<li>|</li>' +			'<li><a href="/wiki/Special:Log/' + wgPageName + '" title="Page logs">L</a></li>' +			'<li>|</li>' +			'<li><a href="/wiki/Special:WhatLinksHere/' + wgPageName + '" title="What Links Here">W</a></li>' +			'<li>|</li>' +			'<li><a class="gotoTop" href="#topTop" title="Go back to the top">Top</a></li>' +		'</ul>' +	' ' +	// Search bar	' ' + 		'<form class="searchform" action="/w/index.php">' + '<div id="simpleSearch2" class="simpleSearch" style="margin-top:-4px;margin-bottom:-20px;margin-right: 25px;width:14em;">' + '<input id="searchInput2" class="mw-searchInput" placeholder="Search" name="search" tabindex="10" autocomplete="off" style="width:100%;"> ' + '<input type="hidden" value="Special:Search" name="title"> ' + ' ' +		' ' +	' ' +	// User links ' ' + 		'<ul class="floaterUserlinks" style="list-style-type:none;list-style-image:none;display:inline;margin-right:20px;">' + '<li class="floaterUserpageLink"><a title="Your user page" href = "/wiki/User:' + wgUserName + '">' + wgUserName + '</a></li>' + //'<li><a class="mw-echo-notifications-badge" href="/wiki/Special:Notifications"></a></li>' + '<li><a title="Your talk page" href = "/wiki/User talk:' + wgUserName + '">' + 'Talk' + '</a></li>' + '<li><a title="Your preferences" href = "/wiki/Special:Preferences">' + 'Preferences' + '</a></li>' + '<li><a title="Go to your watchlist" href = "/wiki/Special:Watchlist">' + 'Watchlist' + '</a></li>' + '<li><a title="Display your contribution history" href = "/wiki/Special:Contributions/' + wgUserName + '">' + 'Contributions' + '</a></li>' + ' <a title="Click to purge this page" href="' + pre + wgPageName + '&action=purge"></a></li>' + '</ul>' + ' '); // Set the "go to top" click function: Go to the MediaWiki top anchor, then scroll up some more $('a.gotoTop').click(function{ window.location.hash="top"; window.scrollBy(0, -floaterHeight - 50); }); // Wait half a sec for images to load etc. b4 un-hiding Floater setTimeout(function{floater.prop('hidden', false);floater.show;},500); // Listen for TOC or other internal anchor clicks and adjust page scrolling to un-obscure the associated header $(window).on('hashchange', function{ adjustForHash; }); // Run the scroll function once on load after additional half-second delay to display Floater in case we come in mid-page setTimeout(function{ scroll; adjustForHash; },500); function adjustForHash{	// If we're coming in mid-page due to an anchor link, make sure the anchored header isn't obscured by Floater	if (window.location.hash) {		// Get DOM version of the anchored header using [0], then use DOM method to get its viewport coordinates		var anchorCoords = $('[id="' + window.location.hash.replace('#','') + '"]:last')[0].getBoundingClientRect;		// If the pagetop links aren't in view and the anchored header is likely obscured by Floater, scroll up to reveal it		if (($('#p-namespaces ul li:above-the-top').length > 0) && (anchorCoords.bottom < 25)){			window.scrollBy(0, -floaterHeight - 5);		}	} } // Set the function for scrolling $(window).scroll(function{ scroll; }); // Use :above-the-top (from plugin below) to check for pagetop stuff outside window. If they're there, start the music. function scroll{	if ($('#p-namespaces ul li:above-the-top').length > 0){		floater.css('top','0');	} else {		floater.css('top','-' + floaterHeight + 'px');	} } // Find the title of the associated talk or main page. Is there an easier way? function getAssoc(type){	var toggledTitle = ;	var toggled = ;	if (wgNamespaceNumber == 0){		toggledTitle = "Talk:" + wgTitle;		toggled = "Talk";	} else if (wgNamespaceNumber == 1){		toggledTitle = wgTitle;		toggled = "Article";	} else if (wgNamespaceNumber == 2){		toggledTitle = "User_talk:" + wgTitle;		toggled = "Talk";	} else if (wgNamespaceNumber == 3){		toggledTitle = "User:" + wgTitle;		toggled = "User page";	} else if (wgNamespaceNumber == 4){		toggledTitle = "Wikipedia_talk:" + wgTitle;		toggled = "Talk";	} else if (wgNamespaceNumber == 5){ toggledTitle = "Wikipedia:" + wgTitle; toggled = "Project page"; } else if (wgNamespaceNumber == 6){ toggledTitle = "File_talk:" + wgTitle; toggled = "Talk"; } else if (wgNamespaceNumber == 7){ toggledTitle = "File:" + wgTitle; toggled = "File page"; } else if (wgNamespaceNumber == 8){ toggledTitle = "MediaWiki_talk:" + wgTitle; toggled = "Talk"; } else if (wgNamespaceNumber == 9){ toggledTitle = "MediaWiki:" + wgTitle; toggled = "MediaWiki page"; } else if (wgNamespaceNumber == 10){ toggledTitle = "Template_talk:" + wgTitle; toggled = "Talk"; } else if (wgNamespaceNumber == 11){ toggledTitle = "Template:" + wgTitle; toggled = "Template page"; } else if (wgNamespaceNumber == 12){ toggledTitle = "Help_talk:" + wgTitle; toggled = "Talk"; } else if (wgNamespaceNumber == 13){ toggledTitle = "Help:" + wgTitle; toggled = "Help page"; } else if (wgNamespaceNumber == 14){ toggledTitle = "Category_talk:" + wgTitle; toggled = "Talk"; } else if (wgNamespaceNumber == 15){ toggledTitle = "Category" + wgTitle; toggled = "Cat page"; } else if (wgNamespaceNumber == 16){ toggledTitle = "Portal_talk:" + wgTitle; toggled = "Talk"; } else if (wgNamespaceNumber == 17){ toggledTitle = "Portal:" + wgTitle; toggled = "Portal page"; }	if (type == 'url'){ var returned = toggledTitle; } else if (type == 'name'){ var returned = toggled; }	return returned; } // Add the :above-the-top jQuery selector, which we use to check if user has scrolled past a certain point. function loadJQViewport{ /* Excerpt from http://www.appelsiini.net/projects/viewport, Copyright (c) 2008-2009 Mika Tuupola, MIT license: http://www.opensource.org/licenses/mit-license.php $(":above-the-top") */ (function($) {		$.abovethetop = function(element, settings){			var top = $(window).scrollTop;			return top >= $(element).offset.top + $(element).height - settings.threshold;		};		$.extend($.expr[':'], { "above-the-top": function(a, i, m) { return $.abovethetop(a, {threshold : 0}); }		});	})(jQuery); } //If the clock gadget is enabled, replicate it for Floater if (mw.user.options.get('gadget-UTCLiveClock') == 1){ var $target; function showTime($target){ var dateNode = $('#utcdate2'); if (!dateNode){return;} var now = new Date; var hh = now.getUTCHours; var mm = now.getUTCMinutes; var ss = now.getUTCSeconds; if ($target === undefined){$target = $(dateNode).find('a:first');} var time = ( hh < 10 ? '0' + hh : hh ) + ':' + ( mm < 10 ? '0' + mm : mm ) + ':' + ( ss < 10 ? '0' + ss : ss ); $target.text(time); var ms = now.getUTCMilliseconds; setTimeout( function{showTime($target); }, 1100 - ms); }	showTime; } // The rest of this replicates the MediaWiki suggest functionality for Floater's search box var map2, resultRenderCache2, searchboxesSelectors2; var $searchInput2 = $('#searchInput2'); var $searchRegion2 = $('#simpleSearch2'); function computeResultRenderCache2(context){ var $form, formAction, baseHref, linkParams; $form = context.config.$region.closest('form'); formAction = $form.attr('action'); baseHref = formAction + (formAction.match(/\?/) ? '&' : '?'); linkParams = {}; $.each( $form.serializeArray, function (idx, obj){linkParams[obj.name] = obj.value;}); return {textParam: context.data.$textbox.attr('name'), linkParams: linkParams, baseHref: baseHref}; } function renderFunction2(text, context){ if (!resultRenderCache2){resultRenderCache2 = computeResultRenderCache2(context);} resultRenderCache2.linkParams[resultRenderCache2.textParam] = text; this.append($(' ').css('whiteSpace', 'nowrap').text(text)).wrap($('<a>')		.attr('href', resultRenderCache2.baseHref + $.param( resultRenderCache2.linkParams)).addClass('mw-searchSuggest-link')); } searchboxesSelectors2 = ['#searchInput2']; $(searchboxesSelectors2.join(', ')).suggestions({fetch: function (query){	var $el, jqXhr;	if (query.length !== 0){		$el = $(this);		jqXhr = $.ajax({url: mw.util.wikiScript('api'),data: {format: 'json', action: 'opensearch', search: query, namespace: 0, suggest: ''}, dataType: 'json', success: function (data){if ($.isArray(data) && data.length){$el.suggestions('suggestions', data[1]);}}});		$el.data('request', jqXhr);	}}, cancel: function {	var jqXhr = $(this).data('request');	if (jqXhr && $.isFunction(jqXhr.abort)){jqXhr.abort;$(this).removeData('request');	}},result: {render: renderFunction2,select: function ($input){$input.closest('form').submit;}}, delay: 120,	highlightInput: true}).bind('paste cut drop', function {$(this).trigger('keypress');}); function specialrenderFunction2(query, context){ var $el = this; if (!resultRenderCache2){resultRenderCache2 = computeResultRenderCache2(context);} resultRenderCache2.linkParams[resultRenderCache2.textParam] = query; if ($el.children.length === 0){ $el.append($(' ').addClass('special-label').text(mw.msg('searchsuggest-containing')), $(' ').addClass('special-query').text(query).autoEllipsis).show; } else {$el.find('.special-query').text(query).autoEllipsis;} if ($el.parent.hasClass('mw-searchSuggest-link')){ $el.parent.attr('href', resultRenderCache2.baseHref + $.param(resultRenderCache2.linkParams) + '&fulltext=1'); } else {$el.wrap($('<a>').attr('href', resultRenderCache2.baseHref + $.param(resultRenderCache2.linkParams) + '&fulltext=1').addClass('mw-searchSuggest-link'));} } $searchInput2.attr('placeholder', mw.msg('searchsuggest-search')).placeholder; $searchInput2.suggestions({result: {render: renderFunction2, select: function ($input){$input.closest('form').submit;}},	special: {		render: specialrenderFunction2, select: function ($input){$input.closest('form').append($('<input type="hidden" name="fulltext" value="1"/>'));		$input.closest('form').submit;}},	$region: $searchRegion2});