Bookmarklets! (May even be useful!)

[GoogalyMoogaly]

Hi,

First a quick Wiki link to explain what Bookmarklets are:
http://en.wikipedia.org/wiki/Bookmarklet

Now back inm July, azcn started this thread with a bookmarklet in.

This was the first I'd heard of bookmarklets, but I then joined in and later Spunkey contributed too.

I posted a couple more in that thread but felt that it was derailing it or at least detracting/diluting azcn's original idea.

So I thought I'd start a separate thread for them and for anyone else that wants to contribute bookmarklets they think people might find useful, also give it a much more generic title.
Also I guess if anyone has an idea for a bookmarklet they could post the idea and if anyone can and wants to they could then make the bookmarklet.

To use a bookmarklet, create a new bookmark (or favourite), give it a name and then paste the supplied code into the 'Location' (or 'URL') box. Save it. Then go to the page it was designed to run on and use/run/click-on the bookmark.

So I'll start things off with mine:

My first one (ever!) was one that can be run when viewing your shopping basket on OcUK and it will calculate the Quidco cashback you would/will get (the value for the calculation is hard coded so will need updating if Quidco change the %):

javascript:(function(){$table%20=%20document.getElementById("shoppingBkt");%20var%20numRows%20=%20$table.rows.length;%20var%20numCellsInLastRow%20=%20$table.rows[numRows-1].cells.length;%20var%20totalPrice%20=%20parseFloat($table.rows[numRows-1].cells.item(numCellsInLastRow-1).innerHTML.replace(/%C2%A3/,%20'').replace(/,/g,%20''));%20var%20quidco%20=%20(totalPrice%20*%200.01);%20var%20newRow%20=%20$table.rows[numRows-2].cloneNode(true);%20newRow.cells[numCellsInLastRow-2].innerHTML%20=%20'Quidco%20Cashback:';%20newRow.cells[numCellsInLastRow-1].innerHTML%20=%20"£"%20+%20quidco.toFixed(2);%20$table.appendChild(newRow);%20var%20newRow2%20=%20$table.rows[numRows-1].cloneNode(true);%20newRow2.cells[numCellsInLastRow-2].innerHTML%20=%20'Effective%20Total:';%20newRow2.cells[numCellsInLastRow-1].innerHTML%20=%20"£"%20+%20(totalPrice%20-%20quidco).toFixed(2);%20$table.appendChild(newRow2);})()

Spoiler

$table = document.getElementById("shoppingBkt");
var numRows = $table.rows.length;
var numCellsInLastRow = $table.rows[numRows-1].cells.length;
var totalPrice = parseFloat($table.rows[numRows-1].cells.item(numCellsInLastRow-1).innerHTML.replace(/£/, '').replace(/,/g, ''));
var quidco = (totalPrice * 0.01);
var newRow = $table.rows[numRows-2].cloneNode(true);
newRow.cells[numCellsInLastRow-2].innerHTML = 'Quidco Cashback:';
newRow.cells[numCellsInLastRow-1].innerHTML = "£" + quidco.toFixed(2);
$table.appendChild(newRow);
var newRow2 = $table.rows[numRows-1].cloneNode(true);
newRow2.cells[numCellsInLastRow-2].innerHTML = 'Effective Total:';
newRow2.cells[numCellsInLastRow-1].innerHTML = "£" + (totalPrice - quidco).toFixed(2);
$table.appendChild(newRow2);

The second sorts the SSD Product listing page by (and displays) the price per GB/TB of the SSDs (should also work with HDDs and pendrives):
(I'd advise viewing all results on 1 page).

javascript:(function(){var%20table%20=%20document.getElementById("productList");%20var%20tbody%20=%20table.getElementsByTagName('tbody')[0];%20var%20rows%20=%20tbody.getElementsByTagName('tr');%20%20var%20rowArray%20=%20new%20Array();%20for%20(var%20i%20=%200;%20i%20<%20rows.length;%20i++)%20{%20%20%20var%20size%20=%20rows[i].cells.item(1).innerHTML.match(/\d+(GB|TB)/);%20%20%20if%20(size%20!=%20null)%20{%20%20%20%20%20var%20ssdSize%20=%20size[0];%20%20%20%20%20var%20units%20=%20ssdSize.match(/(GB|TB)/)[0];%20%20%20%20%20var%20price%20=%20parseFloat(rows[i].cells.item(4).innerHTML.match(/<span%20class=\"price\">%C2%A3\d+\.\d+/)[0].replace(/<span%20class=\"price\">%C2%A3/,%20'').replace(/,/g,%20'').replace(/[\(\)]/,%20''));%20%20%20%20%20var%20sizeInGB%20=%20parseFloat(ssdSize.replace("GB",%20"").replace("TB",%20""));%20%20%20%20%20if%20(units%20==%20'TB')%20{%20%20%20%20%20%20%20sizeInGB%20=%20sizeInGB%20*%201024;%20%20%20%20%20}%20%20%20%20%20var%20pricePerGB%20=%20price/sizeInGB;%20%20%20%20%20rows[i].cells.item(4).innerHTML%20=%20rows[i].cells.item(4).innerHTML.replace(/<p>/g,%20'').replace(/<\/p>/g,%20'').concat("<br/><span%20style=\"font-size:%2012pt;%20color:%20red\">%C2%A3"%20+%20pricePerGB.toFixed(2)%20+%20"/GB</span>").concat("<br/><span%20style=\"font-size:%2010pt;%20color:%20grey\">%C2%A3"%20+%20(pricePerGB*1024).toFixed(2)%20+%20"/TB</span>");%20%20%20}%20%20%20rowArray[i]%20=%20new%20Object;%20%20%20%20%20rowArray[i].oldIndex%20=%20i;%20%20%20%20%20rowArray[i].value%20=%20rows[i].getElementsByTagName('td')[4].innerHTML;%20}%20rowArray.sort(comparePricePerGB);%20%20var%20newTbody%20=%20document.createElement('tbody');%20%20%20for%20(var%20i=0,%20length=rowArray.length%20;%20i<length;%20i++)%20{%20%20%20%20%20newTbody.appendChild(rows[rowArray[i].oldIndex].cloneNode(true));%20%20}%20table.replaceChild(newTbody,%20tbody);%20%20function%20comparePricePerGB(a,b)%20{%20%20%20var%20aValue%20=%20a.value.match(/<span%20style=\"font-size:%2010pt;%20color:%20grey\">%C2%A3\d+.\d+\/TB<\/span>/);%20%20%20if%20(aValue%20!=%20null)%20{%20%20%20%20%20aValue%20=%20parseFloat(aValue[0].replace(/<span%20style=\"font-size:%2010pt;%20color:%20grey\">%C2%A3/,%20'').replace(/\/TB<\/span>/,%20''));%20%20%20}%20else%20{%20%20%20%20%20aValue%20=%2010000;%20%20%20}%20%20%20var%20bValue%20=%20b.value.match(/<span%20style=\"font-size:%2010pt;%20color:%20grey\">%C2%A3\d+.\d+\/TB<\/span>/);%20%20%20if%20(bValue%20!=%20null)%20{%20%20%20%20%20bValue%20=%20parseFloat(bValue[0].replace(/<span%20style=\"font-size:%2010pt;%20color:%20grey\">%C2%A3/,%20'').replace(/\/TB<\/span>/,%20''));%20%20%20}%20else%20{%20%20%20%20%20bValue%20=%2010000;%20%20%20}%20%20%20return%20(aValue%20==%20bValue%20?%200%20:%20(aValue%20>%20bValue%20?%201%20:%20-1));%20}})();

Spoiler

var table = document.getElementById("productList");
var tbody = table.getElementsByTagName('tbody')[0];
var rows = tbody.getElementsByTagName('tr'); 
var rowArray = new Array();
for (var i = 0; i < rows.length; i++) {
  var size = rows[i].cells.item(1).innerHTML.match(/\d+(GB|TB)/);
  if (size != null) {
    var ssdSize = size[0];
    var units = ssdSize.match(/(GB|TB)/)[0];
    var price = parseFloat(rows[i].cells.item(4).innerHTML.match(/<span class=\"price\">£\d+\.\d+/)[0].replace(/<span class=\"price\">£/, '').replace(/,/g, '').replace(/[\(\)]/, ''));
    var sizeInGB = parseFloat(ssdSize.replace("GB", "").replace("TB", ""));
    if (units == 'TB') {
      sizeInGB = sizeInGB * 1024;
    }
    var pricePerGB = price/sizeInGB;
    rows[i].cells.item(4).innerHTML = rows[i].cells.item(4).innerHTML.replace(/<p>/g, '').replace(/<\/p>/g, '').concat("<br/><span style=\"font-size: 12pt; color: red\">£" + pricePerGB.toFixed(2) + "/GB</span>").concat("<br/><span style=\"font-size: 10pt; color: grey\">£" + (pricePerGB*1024).toFixed(2) + "/TB</span>");
  }
  rowArray[i] = new Object;  
  rowArray[i].oldIndex = i;  
  rowArray[i].value = rows[i].getElementsByTagName('td')[4].innerHTML;
}
rowArray.sort(comparePricePerGB);

var newTbody = document.createElement('tbody');  
for (var i=0, length=rowArray.length ; i<length; i++) {  
  newTbody.appendChild(rows[rowArray[i].oldIndex].cloneNode(true)); 
}
table.replaceChild(newTbody, tbody);

function comparePricePerGB(a,b) {
  var aValue = a.value.match(/<span style=\"font-size: 10pt; color: grey\">£\d+.\d+\/TB<\/span>/);
  if (aValue != null) {
    aValue = parseFloat(aValue[0].replace(/<span style=\"font-size: 10pt; color: grey\">£/, '').replace(/\/TB<\/span>/, ''));
  } else {
    aValue = 10000;
  }
  var bValue = b.value.match(/<span style=\"font-size: 10pt; color: grey\">£\d+.\d+\/TB<\/span>/);
  if (bValue != null) {
    bValue = parseFloat(bValue[0].replace(/<span style=\"font-size: 10pt; color: grey\">£/, '').replace(/\/TB<\/span>/, ''));
  } else {
    bValue = 10000;
  }
  return (aValue == bValue ? 0 : (aValue > bValue ? 1 : -1));
}

The third basically what this allows you to do is use the search box to filter the product list by keywords. The script will add a (rather ugly) "Filter" button after the "Go" button. Using this will filter the items listed by finding the words in the text displayed or each item.
As such you will need to view all results on 1 page and do any ordering (e.g. by price) before filtering.
Example of it's use are, when viewing the Quick Disconnects within "Watercooling" -> "Fittings" there's no way to filter by size as with normal fittings. So using this script you can then filter by '1/2 3/4' and it will only return the result containing both 1/2 and 3/4. Different keywords are seperated by as space. If you want to search by an exact phrase, for example panel barb, put them in double quotes like "panel barb".

javascript:(function(){document.getElementById('search').innerHTML%20=%20document.getElementById('search').innerHTML.concat("<input%20id=\"filterButton\"%20type=\"button\"%20value=\"Filter\"%20title=\"Filter\"%20/>");%20document.getElementById('filterButton').onclick%20=%20function()%20{%20%20%20var%20search%20=%20document.getElementsByName('keywords')[1].value;%20%20%20%20%20%20%20search%20=%20search.replace(/%20(?=[^"]*"(?:[^"]*"[^"]*")*[^"]*$)/mg,%20"_space_");%20%20%20var%20terms%20=%20search.split('%20');%20%20%20%20var%20table%20=%20document.getElementById("productList");%20%20%20var%20tbody%20=%20table.getElementsByTagName('tbody')[0];%20%20%20var%20rows%20=%20tbody.getElementsByTagName('tr');%20%20%20%20var%20rowArray%20=%20new%20Array();%20%20%20var%20rowArrayIndex%20=%200;%20%20%20var%20match%20=%20null;%20%20%20%20for%20(var%20i%20=%200;%20i%20<%20rows.length;%20i++)%20{%20%20%20%20%20var%20proceed%20=%20true;%20%20%20%20%20for%20(var%20j%20=%200;%20j%20<%20terms.length;%20j++)%20{%20%20%20%20%20%20%20if(proceed)%20{%20%20%20%20%20%20%20%20%20match%20=%20rows[i].cells.item(1).innerHTML.toLowerCase().match(terms[j].replace(/\"/g,%20"").replace(/_space_/g,%20"%20").toLowerCase().trim());%20%20%20%20%20%20%20%20%20if(match%20==%20null)%20{%20%20%20%20%20%20%20%20%20%20%20proceed%20=%20false;%20%20%20%20%20%20%20%20%20}%20%20%20%20%20%20%20}%20%20%20%20%20}%20%20%20%20%20if(proceed){%20%20%20%20%20%20%20rowArray[rowArrayIndex]%20=%20rows[i];%20%20%20%20%20%20%20rowArray[rowArrayIndex].oldIndex%20=%20i;%20%20%20%20%20%20%20rowArrayIndex++;%20%20%20%20%20}%20%20%20}%20%20%20%20%20%20%20var%20newTbody%20=%20document.createElement('tbody');%20%20%20%20%20for%20(var%20i=0,%20length=rowArray.length%20;%20i<length;%20i++)%20{%20%20%20%20%20%20%20newTbody.appendChild(rows[rowArray[i].oldIndex].cloneNode(true));%20%20%20%20}%20%20%20table.replaceChild(newTbody,%20tbody);%20%20%20%20pTags%20=%20document.getElementsByTagName('p');%20%20%20var%20foundIndex%20=%200;%20%20%20for(var%20i%20=%200;%20i%20<%20pTags.length;%20i++)%20{%20%20%20%20%20if(pTags[i].innerHTML.match(/Showing%20Results/)%20!=%20null)%20{%20%20%20%20%20%20%20foundIndex%20=%20i;%20%20%20%20%20}%20%20%20}%20%20%20%20document.getElementsByTagName('p')[foundIndex].innerHTML%20=%20%20%20%20%20%20document.getElementsByTagName('p')[foundIndex].innerHTML.replace(/Showing%20Results%20\d+%20-%20(\d+)%20.*/,%20"Showing%20Results%20"%20+%20((rowArray.length%20>%200)?%20"1"%20:%20"0")%20+%20"%20to%20"%20+%20rowArray.length%20+%20"%20(instead%20of%20$1)");%20}})()

Spoiler

document.getElementById('search').innerHTML = document.getElementById('search').innerHTML.concat("<input id=\"filterButton\" type=\"button\" value=\"Filter\" title=\"Filter\" />");
document.getElementById('filterButton').onclick = function() {
  var search = document.getElementsByName('keywords')[1].value;
   
  search = search.replace(/ (?=[^"]*"(?:[^"]*"[^"]*")*[^"]*$)/mg, "_space_");
  var terms = search.split(' ');

  var table = document.getElementById("productList");
  var tbody = table.getElementsByTagName('tbody')[0];
  var rows = tbody.getElementsByTagName('tr'); 
  var rowArray = new Array();
  var rowArrayIndex = 0;
  var match = null;

  for (var i = 0; i < rows.length; i++) {
    var proceed = true;
    for (var j = 0; j < terms.length; j++) {
      if(proceed) {
        match = rows[i].cells.item(1).innerHTML.toLowerCase().match(terms[j].replace(/\"/g, "").replace(/_space_/g, " ").toLowerCase().trim());
        if(match == null) {
          proceed = false;
        }
      }
    }
    if(proceed){
      rowArray[rowArrayIndex] = rows[i];
      rowArray[rowArrayIndex].oldIndex = i;
      rowArrayIndex++;
    }
  }
   
  var newTbody = document.createElement('tbody');  
  for (var i=0, length=rowArray.length ; i<length; i++) {  
    newTbody.appendChild(rows[rowArray[i].oldIndex].cloneNode(true)); 
  }
  table.replaceChild(newTbody, tbody);

  pTags = document.getElementsByTagName('p');
  var foundIndex = 0;
  for(var i = 0; i < pTags.length; i++) {
    if(pTags[i].innerHTML.match(/Showing Results/) != null) {
      foundIndex = i;
    }
  }

  document.getElementsByTagName('p')[foundIndex].innerHTML = 
    document.getElementsByTagName('p')[foundIndex].innerHTML.replace(/Showing Results \d+ - (\d+) .*/, "Showing Results " + ((rowArray.length > 0)? "1" : "0") + " to " + rowArray.length + " (instead of $1)");
}