StripSearchSorted.js: provides a menu item to strip search results down to bare page names, sort them alphabetically, and add bullet list wikicode formatting for easy copying and pasting into articles. The menu item is a toggle switch that turns this function on and off, and remembers its status for all searches. By default, just by being installed, the script removes from search results the redirected entries and members of matching categories (as they don't match the search string), even if you don't use the menu item. For Vector skin only.
StripSearchSorted.js: provides a menu item to strip search results down to bare page names, sort them alphabetically, and add bullet list wikicode formatting for easy copying and pasting into articles. The menu item is a toggle switch that turns this function on and off, and remembers its status for all searches. By default, just by being installed, the script removes from search results the redirected entries and members of matching categories (as they don't match the search string), even if you don't use the menu item. For Vector skin only.
In other words, when the menu item is turned on, this script reduces the search results to a list of links. It strips out the data between the page names, including that annoying "from redirect" note. It adds * ]
to each entry and sorts them so they look like this:
* ]
* ]
* ]
* ]
* ]
The formatting makes it easier to copy and paste the links from search results into articles.
Once installed, the menu item "SR sort" will appear in the side bar tools menu, specifying what action it is ready to perform (either "turn on" or "turn off").
Important: this script was developed for use with the Vector skin (it's Wikipedia's default skin), and might not work with other skins. See the top of your Preferences appearance page, to be sure Vector is the chosen skin for your account.
To install this script, add this line to your vector.js page:
importScript("User:The Transhumanist/StripSearchSorted.js");
Save the page and bypass your cache to make sure the changes take effect. By the way, only logged-in users can install scripts.
Quirk in wikEd: When results are copied/pasted into wikEd, the results are erroneously double spaced. Clicking on undo in wikEd reverts it to single spaced as initially intended. (I don't know why. If you do, please tell me.)
This section explains the source code, in detail. It is for JavaScript programmers, and for those who want to learn how to program in JavaScript. Hopefully, this will enable you to adapt existing source code into new user scripts with greater ease, and perhaps even compose user scripts from scratch.
You can only use so many comments in the source code before you start to choke or bury the programming itself. So, I've put short summaries in the source code, and have provided in-depth explanations here.
My intention is Threefold:
In addition to plain vanilla JavaScript code, this script relies heavily on the jQuery library.
If you have any comments or questions, feel free to post them at the bottom of this page under Discussions. Be sure to {{ping}} me when you do.
The script uses the jQuery method .hide() for stripping the elements by class name. Here's an example of stripping out elements with the class name "searchalttitle":
$( ".searchalttitle" ).hide();
Learn about methods at https://www.w3schools.com/js/js_object_methods.asp
Learn about .hide at http://api.jquery.com/hide/
An alias is one string defined to mean another. Another term for "alias" is "shortcut". In the script, the following aliases are used:
$
is the alias for jQuery (the jQuery library)
mw
is the alias for mediawiki (the mediawiki library)
These two aliases are set up like this:
( function ( mw, $ ) {}( mediaWiki, jQuery ) );
That also happens to be a "bodyguard function", which is explained in the section below...
The bodyguard function assigns an alias for a name within the function, and reserves that alias for that purpose only. For example, if you want "t" to be interpreted only as "transhumanist".
Since the script uses jQuery, we want to defend jQuery's alias, the "$". The bodyguard function makes it so that "$" means only "jQuery" inside the function, even if it means something else outside the function. That is, it prevents other javascript libraries from overwriting the $() shortcut for jQuery within the function. It does this via scoping.
The bodyguard function is used like a wrapper, with the alias-containing source code inside it, typically, wrapping the whole rest of the script. Here's what a jQuery bodyguard function looks like:
1 ( function($) {
2 // you put the body of the script here
3 } ) ( jQuery );
See also: bodyguard function solution.
To extend that to lock in "mw" to mean "mediawiki", use the following (this is what the script uses):
1 ( function(mw, $) {
2 // you put the body of the script here
3 } ) (mediawiki, jQuery);
For the best explanation of the bodyguard function I've found so far, see: Solving "$(document).ready is not a function" and other problems (Long live Spartacus!)
The ready() event listener/handler makes the rest of the script wait until the page (and its DOM) is loaded and ready to be worked on. If the script tries to do its thing before the page is loaded, there won't be anything there for the script to work on (such as with scripts that will have nowhere to place the menu item mw.util.addPortletLink), and the script will fail.
In jQuery, it looks like this: $( document ).ready(function() {});
You can do that in jQuery shorthand, like this:
$().ready( function() {} );
Or even like this:
$(function() {});
The part of the script that is being made to wait goes inside the curly brackets. But you would generally start that on the next line, and put the ending curly bracket, closing parenthesis, and semicolon following that on a line of their own), like this:
1 $(function() {
2 // Body of function (or even the rest of the script) goes here, such as a click handler.
3 });
This is all explained further at the jQuery page for .ready()
For the plain vanilla version see: http://docs.jquery.com/Tutorials:Introducing_$(document).ready()
I didn't know what else to call these. I wanted the program to only work when intended, and only on intended pages (search result pages). So, I applied the conditional, if, as follows...
I use the Vector skin, and haven't tested the script on any other skin, so the script basically says "if the vector skin is in use, do what's between the curly brackets". (Which includes the rest of the main program. Note that functions, aka subroutines, follow after the main program.).
// Only activate on Vector skin
if ( mw.config.get( 'skin' ) === 'vector' ) {
// The rest of the script goes here
}
This looks up the value for skin (the internal name of the currently used skin) saved in MediaWiki's configuration file.
"===
" means "equal value and equal type"
// Run this script only if " - Search results - Wikipedia" is in the page title
if (document.title.indexOf(" - Search results - Wikipedia") != -1) {
// The rest of the script goes here
}
There is no prep work in this script. This would be the declaration of global variables and so on.
This is the part that controls the main flow of the script (decides what to do under what circumstances):
if ( mw.config.get( 'skin' ) === 'vector' ) {
$( function() {
// hide elements by class per http://api.jquery.com/hide
$( ".searchalttitle" ).hide();
$( ".searchresult" ).hide();
$( ".mw-search-result-data" ).hide();
} );
}
So, what this does is 4 things:
First, it checks if the Vector skin is being used and runs the rest of the script only if it is.
Then it applies the jQuery method .hide on all elements labeled as any of these 3 classes: searchalttitle, searchresult, or mw-search-result-data.
To use an object method, you append it to the end of an element, as is done with .hide()
3 times above. Don't forget the parentheses, and be sure to end your statements with a semicolon.
Learn more about .hide at http://api.jquery.com/hide/
This looks up the value for skin (the internal name of the currently used skin) saved in MediaWiki's configuration file.
"===
" means "equal value and equal type"
// hide elements of Results from sister projects (per http://api.jquery.com/hide)
$( ".iw-headline" ).hide();
$( ".iw-results" ).hide();
$( ".iw-resultset" ).hide();
$( ".iw-result__title" ).hide();
$( ".iw-result__content" ).hide();
$( ".iw-result__footer" ).hide();
I went through the pagesource looking for the classes of the data displayed in the right-hand column, and inserted them into the code above. (I assume "iw" stands for "interwiki").
Improvements that would be nice:
Run the function if Title includes "intitle:"
Parse the Title with regex to get the intitle string. The string may be a single word or a phrase within double quotation marks. Use regex pipe for or.
Then keep only the search results that include that string. One way to do this is use a regex to inverse match via negative look-arounds. ^((?!hi there).*)$
will match any line not containing "hi there". Those are the lines we want to remove.
See annotationToggle for how to wrap entries in classed span tags, and then hide those spans. But do it with jQuery instead.
The elements that I wish to change have the class mw-search-result-heading.
Each one has an anchor element within it. Perhaps those can be sandwiched with the desired wikicode (between the double square brackets).
Maybe using .splice could work, if regex could be applied somehow.
for (var i = 0; i < x.length; i++) {
// if current array item matches "searchalttitle"
// remove it from array
// x.splice(i)
// i = i--
}
In the loop above, splicing (removing) the current item would shift the next item into its position. When the loop iterates to the next item, it will have inadvertently skipped one. After splicing, you'd have to decrement i by one.
Or use forEach, and...
push all non-matches in a new array, and at the end of forEach replace the original array with the new one.
Or, using standard for loop...
iterate over the array index and decrease the loop index i-- whenever you find a match
The search results are double spaced, which shows up as a blank line between each list item when you cut and paste to an edit window.
First, it might help to be able to see the control characters (like linefeed, \n). One way to look for them is with this:
// Inspect the raw text, so you can look for \n linefeeds
$(".mw-search-results").each(function(index) {
let mwsr_text = JSON.stringify($(this).text());
alert(mwsr_text);
});
This showed the text, but didn't show the linefeeds (\n). Logically, they must be there. The linefeed characters don't show up in the editor I cut and pasted them into. But the editor's search/replace is still able to find/replace them. Therefore, it might be possible to use regex in JS to get rid of them on the web page.
So, I tried the following code to remove linefeeds (\n), but it didn't work.
var str = $(".mw-search-results").html();
var regex = /\n/gi;
$(".mw-search-results").html(str.replace(regex, ""));
I tried it on \s, and it got rid of the linefeeds along with all the other white space characters. Which means they may be specifically accessible.
Post messages below.
I've written a script called StripSearch.js that unclutters search results to make them bare lists of page names.
Now I'm writing a sequel to it called StripSearchInWikicode.js.
I would like the output of search results to look like this:
* ]
* ]
* ]
* ]
* ]
...for easy copying and pasting into articles.
I'm having trouble manipulating the elements of class "mw-search-result-heading".
I gather that you put them into an array like this:
var x = document.getElementsByClassName("mw-search-result-heading");
I'd like to subject the items in that array to a regex, using the jQuery .each method, or the .each function, but I don't know how. The documentation is confusing as hell.
I think the search string (<a.*a>)
and replacement string * ]
ought to work.
Any pointers would be most appreciated.
Sincerely, The Transhumanist 12:58, 29 September 2017 (UTC)
$(".mw-search-result-heading").prepend('* ]');
$(".mw-search-result-heading").children().before('* ]');
]]
) - Evad37 13:53, 29 September 2017 (UTC)mw-search-result-heading
entries that include searchalttitle
inside their divs. I would like to remove just those instances of mw-search-result-heading
..not
work for this, to hide divs with the class mw-search-result-heading
except for those that do not contain searchalttitle
? // Strip out redirected entries
var x = document.getElementsByClassName("mw-search-result-heading");
for (i = 0; i < x.length; i++) {
// somehow remove this entry if
// it contains element of class "searchalttitle"
}
// Sort the search results
var x = document.getElementsByClassName("mw-search-result-heading");
x.sort();
$(".mw-search-result-heading").children().filter(':first-child').before('* ]');
$(".searchalttitle").remove();
$(".mw-search-result-heading").children().filter(':first-child').before('* ]');
.has()
:$(".mw-search-result-heading").has(".searchalttitle").remove();
$(".mw-search-result-heading").children().before('* ]');
$(".mw-search-result-heading").has(".searchalttitle").remove().end().children().before('* ]');
.hide()
instead of .remove()
if you want to be able to show those elements again at some point. - Evad37 02:52, 30 September 2017 (UTC)Wow. You make it looks so easy. So, you chain methods to a selector. Nice. That sure is convenient. jQuery is simpler than I thought. When you chain methods to a class, they work on all the elements of that class. I was doing that with hide, but was just copying the examples and didn't really grasp the underlying structure. Thank you. And on retrospect, with loops and regex, it looks like I was trying to conduct surgery with an icecream scoop. :)
I try to follow along in the documentation during these discussions, so that I can grasp the jargon. While doing so, I noticed this:
$(".searchalttitle").remove();
$(".mw-search-result-heading").children().filter(':first-child').before('* ]');
can be refactored to this:
$(".searchalttitle").remove();
$(".mw-search-result-heading").children(':first-child').before('* ]');
It seems to work!
The script is now operational, thanks to you. But, I came across an unforeseen obstacle. The results look great on the search results page, but when you copy and paste them into an edit page, there is a blank line between all the entries. That requires that the user regex them all out in WikEd. I'd like to eliminate that manual operation by removing the blank lines in the search results.
Also, when we remove the .mw-search-result-heading entries that contain .searchalttitle, additional blank lines are left behind. Is that a clue that can help us track those newlines (\n) down?
It is not apparent where the newlines are inserted in the page source for the search results page. So, I assume they are specified on a style sheet somewhere. What is the most effective way to hunt down the style sheet which defines a particular class used on a Wikipedia page? The Transhumanist 21:24, 30 September 2017 (UTC)
Extended content
|
---|
There is a page named "Genre" on Wikipedia * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] |
Extended content
|
---|
There is a page named "Genre" on Wikipedia * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] |
Extended content
|
---|
There is a page named "Genre" on Wikipedia * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] * ] |
// nuke "li" instead of ".mw-search-result-heading"
$("li").has(".searchalttitle").remove();
var str = $(".mw-search-results").html();
var regex = /\n/gi;
$(".mw-search-results").html(str.replace(regex, ""));
\s
is equivalent to
, so one of those should work. There are various regex-testing website you could use to test, analyse, explain, and experiment with regex patterns – I use https://regex101.com/ (just need to make sure the 'flavor' is javascript), but there are others out there.I'm wondering why the double spacing (extra newline) between list items doesn't show up in the page source.– Since I didn't have the problem with Chrome on Win 7, and FF/IE had different problems to what you're describing, I think its basically down to either browser bugs (or "features") – possibly MediaWiki is serving up (or the JavaScript modification is making) non-standard/non-compliant code, and the browsers have to decide for themselves how to handle it (thus some insert phantom spaces, others don't). - Evad37 13:21, 4 October 2017 (UTC)
User:The Transhumanist/StripSearchInWikicode.js – the recent script you helped me on, which strips WP search results down to a bare list of links, and inserts wikilink formatting for ease of insertion of those links into lists. This is useful for gathering links for outlines. It still has the interlaced CR/LFs problem. Aside from that, I'd like this script to sort its results. So, if you know how, or know someone who knows how, please let me know.
*]
, and have the whole thing within a block tag like <div> or <p>. Do that for each item in the array, and then you can add them all to (or next to) an element on the page using a jQuery method like .before(), .after(), .prepend(), or .append(), each of which can take an array as the input. - Evad37 02:40, 27 October 2017 (UTC)There's a really annoying design flaw in WP's search's intitle feature. Common words like "of" are ignored, even though they are included within a quoted phrase. So, intitle:"of Boston" is interpreted as just intitle:Boston. And the search results are filled with non-matching results. To make matters worse, the search results include matches of the phrase in the contents of pages, watering the results down even more to inlcude pages that don't even have "Boston" in the title. What I need is for results to strictly match the term provided after "intitle:".
For StripSearchSorted.js, you wrote a long sequence of chained methods (which I modified ever so slightly):
// Replace the search results by hiding the original results and use .after to insert a modified version of those results
$('ul.mw-search-results').hide().after(
$('<div id="Stripped"></div>').append(
$('ul.mw-search-results')
.children()
.map( function() {
return $(this).find('a').text();
})
.get()
.sort()
.map( function(title) {
return $('<div></div>').append(
'* [[',
$('<a>').attr({
'href':'https://en.wikipedia.orghttps://wikines.com/en/'+mw.util.wikiUrlencode(title),
'target':'_blank'
}).text(title),
']]'
);
})
)
);
Is it possible to continue adding to this chain in order to filter the array down to elements that only include the intitle search string?
Assume we've put the search string into a variable, say var intitleString;
After the closing parenthesis (included below), the .filter chain continuation might look something like this:
).filter(function () { return this.
})
The problem is, I don't know what to put after "this." to match intitleString. I know regex generally speaking, but I don't know how to include it in a chain, or how to match a variable with it.
By the way, would this nuke the array if intitle wasn't specified in the search? Can an if control structure be put in a chain? (Like: If "intitle" is in the title, do this). The Transhumanist 12:05, 7 December 2017 (UTC)
this
(that only works with jQuery objects) – the basic syntax isnewArray = oldArray.filter(function(arrayElement) {
// do stuff, and return true (or a truthy value) to keep the array element,
// or return false (or a falsey value) to remove the array element
});
string.indexOf(testString)
, which returns -1 if not found, or a number of where it is found. To convert to a true/false value; you just do string.indexOf(testString) !== -1
. That's for case-sensitive results, and dosen't care about word boundaries. To do more advanced matching, you have to make a regex object, and then test for a match using regex.test(string)
, which returns true or false accordingly.var intitlePatt
, then// ... same as code block above ...
.get()
.filter(function(title) {
return intitlePatt.test(title);
})
.sort()
// ... same as code block above ...
intitleString = ''
or intitlePatt = /./
for that case. You can't really have control structures in a chain – you would have to store the intermediate value of the chain in a variable, then put in the control structure, and resume the chain from the intermediate variable. Likevar intermidateFoo = $(foo).bar().baz();
if (condition1) {
intermidateFoo.qux().foobar().barbaz();
} else {
intermidateFoo.barbaz();
}
null
doesn't match anything, so no entries would match. To get all entries to match, you either have to set the variable to something that does actually match any entry (intitleString = ''
or intitlePatt = /./
depending on whether you use indexOf or regex matching inside the filter); or else have an explicit check inside the filter which will just return true if the variable is null. - Evad37 03:02, 11 December 2017 (UTC)
someVar == null
(gives true if someVar is null/undefined, false otherwise). You can combine this with other logical tests using ||
, &&
, !
as usual. - Evad37 04:37, 11 December 2017 (UTC)I'm in the process of trying to fix the intitle bug in Wikipedia's search, by providing the solution as a function within StripSearchSorted.js.
The intitle bug is that when you enter a search phrase in WP's search box with a common word (like this: intitle:"in Germany"), the titles in the search results don't match.
I'm almost done, but I can't figure out how to get :contains to accept a variable:
function TrueMatch() {
// The purpose of this function is to filter out non-matches
// Activation filter:
// Run this function only if 'intitle:"' is in the page title
// Notice the lone " after intitle:
if (document.title.indexOf('intitle:"') != -1) {
// Body of function
// Create variable with page title
var docTitle = document.title;
// Display on screen for checking
//alert ( docTitle );
// Extract the intitle search string from the html page title
// We want the part between the quotation marks
var regexIntitle = new RegExp('intitle:"(.+?)(")(.*)','i');
var intitle;
intitle = docTitle.replace(regexIntitle,"$1");
//alert ( intitle );
// Filter out search results that do not match
$( "li" ).not( 'li:contains(" + intitle + ")' ).remove();
}
}
It works fine up until that last line. I want to remove all li elements that do not contain the text in the intitle variable. The Transhumanist 07:51, 19 January 2018 (UTC)
$( "li" ).not( 'li:contains("' + intitle + '")' ).remove();
'li:contains("' + intitle + '")'
gets processed first, and the result is passed through to .not()
. Or if you wanted to be a bit more explicit, you could do something likevar intitle_selector = 'li:contains("' + intitle + '")';
$( "li" ).not( intitle_selector ).remove();
$( "li" ).remove();
, it removes all results. The Transhumanist 02:16, 20 January 2018 (UTC)$( "li").not('li:contains( "of" )').remove();
resulted in blank results (ie, none).$( "li").not('li:contains( of )').remove();
resulted in no matches (ie results unaffected).
// First, strip out the searchmatch class elements (they match).
$( 'li').find( '.searchmatch').remove();
$( "li" ).not( 'li:contains("' + intitle + '")' ).remove();
$( 'li:contains("' + intitle + '")').remove();
intitle
will be somewhere within the li
, just not neccesarily in the title. Plus we can limit the searching of li
s to just the search results, rather than the whole page:// Mark true results with a class
$('.mw-search-results').find('li').has( 'div > a:contains("' + intitle + '")' ).addClass('truematch');
// Remove other results
$('.mw-search-results').find('li').not('.truematch').remove();
mw-search-results
, find the li
s which have a div
that itself has (as a direct child element) an a
that contains the text intitle
, and add the class truematch
to those li
s. Then, in the mw-search-results
, find the li
s which do not have the class truematch
, and remove them. - Evad37 09:25, 20 January 2018 (UTC)