Extension:Link Suggest

From MediaWiki.org

Jump to: navigation, search

Adding links to an article seems easy. But what happens when you dont know the exact capitalization, or wording of an article? Usually you open a new tab and do a search. This plugin adds a new button to the edit tool bar that when clicked, adds an ajax search bar to find links.

This plugin is in very beta, but I am putting it out here because I think it is usable, and it is as far as I can take it. I would love help on this to make it better.

Manual on MediaWiki Extensions
List of MediaWiki Extensions
Link Suggest

Release status: beta
Implementation Search, Ajax
Description Ajax Search bar to look for and add links.
Author(s) Adam Meyer (noverflowTalk)
Last Version 0.2
MediaWiki 1.10
License I give up all rights. You may do what you please with this code.
Download Download
Example http://risdpedia.net

Contents

[edit] Usage

  • Click on button
  • Type in search field (a list of available articles will appear)
  • Select the article you would like to link to.
  • That is all.

[edit] Download instructions

Please cut and paste the code found below and place it in $IP/extensions/LinkSuggest/LinkSuggest.php. Note: $IP stands for the root directory of your MediaWiki installation, the same directory that holds LocalSettings.php.

[edit] Installation

  • Create a new folder in your extensions called LinkSuggest
  • To install this extension, add the following to LocalSettings.php:
require_once("$IP/extensions/LinkSuggest/LinkSuggest.php");
  • Ajax must also be enabled. This is the default from MediaWiki 1.11 to newer versions. For older versions of MediaWiki, you might need to add the following to LocalSettings.php:
$wgUseAjax = true;

A button called button_addlink.png must be in skins/common/images You can see mine here (it is oversized)

I know of some problems:

  • The added button in IE7 gets added to the beginning not h end of the buttons.
  • IE will lose track of your position when you select a link, so it will always place it at the begining.
  • Safari and FF do not have either of these issues.

[edit] Code

[edit] PHP

Copy the following, and save it in the LinkSuggest folder as LinkSuggest.php

See below for the CSS and javascript

<?php
/**
 * LinkSuggest extension
 * @author Adam Meyer
 * @copyright © 2008 Adam Meyer
 */
 
//See below under "function wfAjaxlinkSuggest" for configuration
 
if( !defined( 'MEDIAWIKI' ) ) {
	echo( "This file is part of an extension to the MediaWiki software and cannot be used standalone.\n" );
	die( 1 );
}
 
$wgExtensionFunctions[] = 'wfAjaxlink';
$wgAjaxExportList[] = 'wfAjaxLinkSuggest';
$wgHooks['AlternateEdit'][] = 'wfAjaxlinkSuggestHeaders';
 
$wgExtensionCredits['other'][] = array(
    'name'=> 'LinkSuggest',
    'author'=> 'Adam Meyer',
    'version'=> '0.2',
    'url' => 'http://www.mediawiki.org/wiki/Extension:Link_Suggest',
    'description'=> 'Ajax-based link suggest that places results below tool bar.'
);
 
function wfAjaxlink() {
	global $wgUseAjax, $wgOut, $wgTitle;
	if (!$wgUseAjax) {
		wfDebug('wfAjaxlink: $wgUseAjax is not enabled, aborting extension setup.');
		return;
	}
}
 
function wfAjaxLinkSuggest( $term ) {
 
	//configure the following to change settings
	$limit = 8; //number of results to spit back
	$location = 1; //set to 1 to search anywhere in the article name, set to 0 to search only at the begining
 
 
	global $wgContLang, $wgOut;
	$response = new AjaxResponse();
	$db = wfGetDB( DB_SLAVE );
	$l = new Linker;
 
	$term = str_replace(' ', '_', $term);
 
	if($location == 1){
 
		$res = $db->select( 'page', 'page_title',
				array(  'page_namespace' => 0,
					"UPPER(page_title) LIKE '%" .$db->strencode( strtoupper ($term)). "%'" ),
					"wfSajaxSearch",
					array( 'LIMIT' => $limit )
				);
	}else{		
 
		$res = $db->select( 'page', 'page_title',
			array(  'page_namespace' => 0,
				"UPPER(page_title) LIKE '". $db->strencode( strtoupper ($term)) ."%'" ),
				"wfSajaxSearch",
				array( 'LIMIT' => $limit )
			);		
	}
 
	$r = "";	
	while ($row = $db->fetchObject( $res ) ){
		$r .= '<li><a href="javascript:Insertlink(\''.addslashes(str_replace('_', ' ', $row->page_title)).'\')">'.str_replace('_', ' ', $row->page_title). "</li>\n";
 
	}
	$html ='<ul>' .$r .'</ul>';
 
	return $html;
}
 
function wfAjaxlinkSuggestHeaders(){
	global $wgOut;
	wfAjaxSetlinkSuggestHeaders($wgOut);
	return true;
}
 
 
function wfAjaxSetlinkSuggestHeaders($outputPage) {
	global $wgJsMimeType, $wgStylePath, $wgScriptPath;
	$outputPage->addLink( 
		array( 
			'rel' => 'stylesheet', 
			'type' => 'text/css', 
			'href' => $wgScriptPath.'/extensions/LinkSuggest/LinkSuggest.css' 
		) 
	);
	$outputPage->addScript( "<script type=\"{$wgJsMimeType}\" src=\"$wgScriptPath/extensions/LinkSuggest/LinkSuggest.js\">"."</script>\n");
	$outputPage->addScript( "<script type=\"{$wgJsMimeType}\">hookEvent(\"load\", mwLinkSuggestButton);</script>\n" );
}

[edit] JavaScript

Copy the following, and save it in the LinkSuggest folder as LinkSuggest.js

function link_hide(obj){
	var element = document.getElementById(obj); 
	element.style.display='none';
	return true
}	
 
function mwLinkSuggestButton(){	
	var toolbar = document.getElementById("toolbar");
	if(!toolbar){
		return false
	}
	var button = document.createElement("a");
	button.href = "#";
 
	button.onclick = function () {
	ls_ajax_onload();
	return false;
	};
 
	var add_image=document.createElement('img');
    add_image.src="skins/common/images/button_addlink.png";
 
	toolbar.appendChild(button);
	button.appendChild(add_image);
 
	return true
}
 
var ss_memory = null;
 
function LinkSearchCall() {
	var newdiv = document.getElementById("linksuggest");
 
	if(!newdiv){
		var newdiv = document.createElement("div");
		newdiv.id = "linksuggest";
		newdiv.style.display='block'
 
		var output = document.getElementById("toolbar");
		output.appendChild(newdiv);
	}else{
		newdiv.style.display='block'
	}	
	var x = document.getElementById("link_search_input").value;
 
	if (x == ss_memory) {
        return;
    }
    ss_memory = x;
    if (x.length < 30 && x.length > 2 && x.value != "") {
        sajax_do_call("wfAjaxLinkSuggest", [x], newdiv);
	}
}
 
 
function ls_ajax_onload() {
 
	var newdiv = document.getElementById("linksearch");
	if (!newdiv) {
 
		var newdiv = document.createElement("div");
		newdiv.id = "linksearch";
 
		var output = document.getElementById("toolbar");
		output.appendChild(newdiv);
 
		var search = document.createTextNode("Find Link ");
		newdiv.appendChild(search);
 
		var html = document.createElement("input");
		html.id = "link_search_input";
 
		newdiv.appendChild(html);
 
		var x = document.getElementById( 'link_search_input' );
 
		var hide = document.createElement("a");
		hide.href = "#";
 
		hide.onclick = function () {
			link_hide('linksearch');
                        link_hide('linksuggest');
                        x.value = '';
			return false;
		};
 
		newdiv.appendChild(hide);	
 
		var hide_text = document.createTextNode("(close)");
		hide.appendChild(hide_text);
 
 
	}else{
		var x = document.getElementById( 'link_search_input' );
		var element = document.getElementById('linksearch'); 
		element.style.display='';
	}	
 
	x.onkeyup = function(){
		LinkSearchCall();
    }
}
 
 
function Insertlink(name) {
	var input = document.getElementById("link_search_input");
	input.value = '';
 
	link_hide('linksuggest');
	insertTags('[['+name+']]', '', '');		
}	
 
 
document.onclick=check; 
 
function check(e){ 
	var target = (e && e.target) || (event && event.srcElement); 
	var obj = document.getElementById('linksuggest'); 
	if (obj) {
		var parent = checkParent(target); 
		if(parent){
			obj.style.display='none';
		}	
	} 
} 
 
function checkParent(t){ 
	while(t.parentNode){ 
		if(t==document.getElementById('linksuggest')){ 
			return false 
		} 
		t=t.parentNode 
	} 
	return true 
}

[edit] CSS

Copy the following, and save it in the searchsuggest folder as LinkSuggest.css (this can all be changed without issue on-wiki by editing your wiki's MediaWiki:Common.css)

#linksuggest {
	float: left;
	position: absolute;
	z-index: 3;
	text-align: left;
	border: 1px solid #737373;
	font-size: 11px;
	width: 300px;
	border-top-style: none;
	background-color: white;
	padding-top: .5em;
	padding-bottom: 1em;
	margin-left: .5em;
}
 
#link_search_input{
	border: 1px solid #333;
}
 
#linksuggest a {
	color: black;
	background: #7cff00;
	padding-left: .5em;
	display: block;
	font-weight: bold;
	font-style: normal;
}
 
#linksuggest ul{
	list-style: none;
	margin: 0;
 
}
 
#linksuggest li{
	padding:1px 5px;
	white-space: nowrap;
	text-align:left;
	margin: 0;
 
}
 
#linksuggest a:hover{
	font-weight: bold;
	text-decoration: underline;
	background: white;
	color: #4a1500;
 
}
 
#linksearch {
	text-align: left;
	border: 1px solid #737373;
	padding: .5em;
}
Retrieved from "http://www.mediawiki.org/wiki/Extension:Link_Suggest"
Personal tools