Greasemonkey: Re-write all links based on param

Question

Hi,

I need alittle help with getting a script that will take param from the orginal link and re-write them into a new link. I guess it should be pretty easy but I'm a noob still when it comes to this.

Here is the orginal HTML code for 1 link. (should be replaced globaly on the page. image1.jpg, image2.jpg etc.)

<div align="center"><a href="/index.php?Submit=ok&seson=b1e4&connect=127.0.0.1&id=13033&name=on"><img src="/preview/image1.jpg" width="128" height="128" border="0" style="border: 0px black solid;" /></a></div>

This should be done global on all the links that contain the imagepath "/preview/"

Thanks to Brock Adams I kinda understand how to get the param values with this code but I still don't really get it how to re-write all the links in a page.

var searchableStr   = document.URL + '&';
var value1  = searchableStr.match (/[\?\&]id=([^\&\#]+)[\&\#]/i) [1];
var value2  = searchableStr.match (/[\?\&]connect=([^\&\#]+)[\&\#]/i) [1];

and then rewrite the links with "newlink"

var domain  = searchableStr.match (/\/\/([w\.]*[^\/]+)/i) [1];
var newlink = '//' + domain + '/' + value1 + '/data/' + value2 + '.ext';  

If someone could be so nice to help me setup an example greasemonkey script I would be very greatful for it.

Answer 1

OK, This is a fairly common task and I don't see any previous, StackOverflow questions like it -- at least in a 2 minute search.

So, here's a script that should do what you want, based on the information provided...

//
// ==UserScript==
// @name            Site_X, image relinker.
// @namespace       StackOverflow
// @description     Rewrites the preview links to ???
// @include         http://Site_X.com/*
// @include         http://www.Site_X.com/*
// @include         https://Site_X.com/*
// @include         https://www.Site_X.com/*
// ==/UserScript==
//


function LocalMain ()
{
    /*--- Get all the images that have /preview/ in their path.
    */
    var aPreviewImages      = document.evaluate
                            (
                                "//img[contains (@src, '/preview/')]",
                                document,
                                null,
                                XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE,
                                null
                            );
    var iNumImages          = aPreviewImages.snapshotLength;
    GM_log (iNumImages + ' preview images found.');


    /*--- Rewrite the parent links to our new specifications.
        Note, all the target links are of the form:
            <a href="/index.php?Submit=ok&seson=b1e4&connect=127.0.0.1&id=13033&name=on">
            <img src="/preview/image1.jpg" width="128" height="128" border="0" style="border: 0px black solid;" />
            </a>

        The desired rewrite changes the link to this form:
            <a href="{current page's domain}/{id-value}/data/{connect-value}.ext">
    */
    for (var iLinkIdx=0;  iLinkIdx < iNumImages;  iLinkIdx++)
    {
        var zThisImage      = aPreviewImages.snapshotItem (iLinkIdx);
        var zParentLink     = zThisImage.parentNode;

        //--- Get the key href parameters.
        var sIdValue        = sGetUrlParamValue (zParentLink, 'id');
        if (!sIdValue)      continue;   //-- Oopsie, this link was a malformed.

        var sConnectValue   = sGetUrlParamValue (zParentLink, 'connect');
        if (!sConnectValue) continue;


        //--- Get the current page's domain.  (Or just use a relative link.)
        var sPageDomain     = document.URL.match (/\/\/([w\.]*[^\/]+)/i) [1];


        //--- Generate the desired link value.
        var sDesiredLink    = 'http://' + sPageDomain + '/' + sIdValue + '/data/' + sConnectValue + '.ext';


        //--- Rewrite the target link.
        zParentLink.href    = sDesiredLink;
    }
}


function sGetUrlParamValue (zTargLink, sParamName)
{
    var zRegEx  = eval ('/[\?\&]' + sParamName + '=([^\&\#]+)[\&\#]/i');

    var aMatch  = (zTargLink.href + '&').match (zRegEx);
    if (aMatch)
        return decodeURI (aMatch[1]);
    else
        return null;
}


window.addEventListener ("load", LocalMain, false);