MediaWiki:Gadget-WikitextAutocompleter.js

/* Autocomplete/Dropdown list */ // Won't work with CodeEditor, but that's fine since CodeEditor won't be used for wikitext

//mw.loader.load('https://unpkg.com/textcomplete@0.13.1/dist/textcomplete.min.js'); //^Doesn't wait for it to load nor excecute

//https://api.jquery.com/jQuery.getScript/#success-callback $.getScript( "https://unpkg.com/textcomplete@0.13.1/dist/textcomplete.min.js", function( data, textStatus, jqxhr ) {	console.log( data ); // Data returned	console.log( textStatus ); // Success	console.log( jqxhr.status ); // 200	console.log( "Load was performed. (Script has been loaded but not necessarily executed)" );	wikiAutocomplete; });

function wikiAutocomplete { Textarea = Textcomplete.editors.Textarea; // A 'strategy' for Template:Color templateColorWikiText = ''; colors = {}; //the following is awful to look at, I know. $.get( "https://zelda.gamepedia.com/Template:Color?action=raw", function( data ) {		//yes I know using a global variable is lazy and ng....		templateColorWikiText = data			.split(" ")[0]			.split("#switch:")[1]			.split("\|#default")[0]			.match(/\|[a-zA-Z0-9 ]*/g)			.forEach(function(value, index){ colors[value.slice(1)]=''; });	});	//todo: The regex fails if thre is an instance of {{Color| before it in the textarea? tho it's fine in the example webpage //todo: in addition, whenyou start a "{{Color|", then pop over to a different "{{Color|", it'll show dropdown, but append to the first "{{Color|""	window.colorStrategy = {		id: 'color',		match: /{{Color\|([a-zA-Z 0-9+\-\_\|}]*)$/m, //Need to keep the first capture group for it to work(?)		search: function (term, callback) {			callback(Object.keys(colors).filter(function (name) {				return name.startsWith(term);			}));		},		template: function (name) {			return name;		},		replace: function (name) {			return '{{Color\|' + name + '}}';		}	};	var editor = new Textarea(document.getElementById('wpTextbox1'));	var textcomplete = new Textcomplete(editor, {		dropdown: {			maxCount: 500,			style: { 'margin-top':('-'+$('body').css("margin-top")) } //A negative margin on the dropdown list to offset the shift down caused by the position:relative and margin-top of the `body`		}	});	textcomplete.register([colorStrategy]); }