Run Javascript through a Firefox Bookmark to Highlight Components

Read <a href=’https://scottizu.wordpress.com/2014/10/31/executing-javascript-through-a-firefox-bookmark/’>Executing Javascript Through A Firefox Bookmark</a> to find out how to run javascript through a bookmark.

The modification from that page will allow you to store your BookmarkScript.js file in the root directory of Tomcat.  This is accessed in the Firefox Bookmark via:

http://localhost:8080/BookmarkScript.js

This code will highlight components whose id matches the string given. For instance, the following code will place an overlay on top of all div elements whose id starts with “abc_”.

This code needs to reside in the Root directory of your local Tomcat instance and be named as BookmarkScript.js.


// Print a message at the bottom of the page
err=function(e){
  s=e.description;
  if(!s){
    s=String(e);
  }
  d=document.createElement("div");
  d.innerHTML=s;
  d.style.color="red";
  document.body.appendChild(d);
  return d;
};
// Create an overlay above the placement
createOverlayDiv=function(e, zind){
  d=document.createElement("div");
  d.id=e.id+"_epo";
  d.name=e.name+"_epo";
  
  // Set style, width and height, top and left offset based off e
  d.style.cssText=e.style.cssText;
  d.style.width=e.clientWidth+"px";
  d.style.height=e.clientHeight+"px";
  d.style.top=e.offsetTop+"px";
  d.style.left=e.offsetLeft+"px";

  // Add extra overlay styling
  d.style.zIndex=zind;
  d.style.position="absolute";
  d.style.opacity = .5;
  d.style.display="block";
  d.style.textAlign="center";
  d.style.border="2px solid #A7A"; // Pink Outline
  d.style.background="#ADF"; // Blue Background
  
  // Set Minimum Width/Height and add text (undefined, auto, 0)
  w=e.clientWidth;
  if((!w)||((w!="auto")&&(w<150))){
	w=150;
	d.style.width="150px";
  }
  h=e.clientHeight;
  if((!h)||((h!="auto")&&(h<50))){
    h=50;
    d.style.height="50px";
  }
  d.innerHTML=d.id+"<br>"+w+" x "+h;
	
  return d;
}
// Highlights the placement by creating an overlay
highlighter=function(es, match){
  els=[];
  for(i=0;i<es.length;i++){
    e=es[i];
    if(e.id.indexOf(match)>-1){
      els.push(e);
    }
  }
  for(i=0;i<els.length;i++){
    e=els[i];
    d=createOverlayDiv(e, 10+i);
	e.parentNode.appendChild(d);
  }
};
err("Highlighter, Version 1.0");
err("Errors:");
err("").style.paddingTop="50px";
// Highlight Divs with Ids starting with abc_
try{
  highlighter(document.getElementsByTagName("div"), "abc_");
}catch(e){
  err(e);
}
Advertisements