Inside Technique : SETools for IE5
By Scott Isaacs

SETools is our latest bookmarklet. SETools is a webmaster utility for Internet Explorer 5.0 that makes it easy to:

• Resize the window to standard resolutions
• Switch any page into full-screen mode
• Test different background, text and link colors,
• and hide all the images on the page.

SETools Requires IE5

This utility works on any webpage (except framesets). To install this utility, just drag the SETools link above onto your Internet Explorer Links toolbar or add SETools to your favorites. Once on your toolbar, clicking on the SETools link popups the utility window. The utility window always displayed at the top of your document.

How does it work?

SETools contains a script instead of a URL for the link's HREF attribute. When clicked, the script executes and inserts the popup window in the page. When SETools are added to your Links toolbar or favorites menu, any script is executed in the context of the current page.

The function that builds the SETools pop-up can be easily modified. Below we provide the complete script for the SETools link. After the script, we explain how the array of commands is generated.

<A HREF='javascript:
function RUNSEWMUTILITIES() {
  if (!document.all.SEWMUTILITIES) {
    var c= new Array();
    c[0] = new Array("Window Size");
    c[1] = new Array("640x480","window.resizeTo(640,480)");
    c[2] = new Array("800x600","window.resizeTo(800,600)");
    c[3] = new Array("1024x768","window.resizeTo(1024,768)");
    c[4] = new Array("Full Screen","void(window.open(window.location,null,&#39;fullscreen=yes&#39;))");
    c[5] = new Array("Color Management");
    c[6] = new Array("Background Color",
       "void(document.bgColor=prompt(&#39;Change the background to what color?&#39;,document.bgColor))");
    c[7] = new Array("Text Color",
       "void(document.fgColor=prompt(&#39;Change the text to what color?&#39;,document.fgColor))");
    c[8] = new Array("Link Color",
        "void(document.linkColor=prompt(&#39;Change links to what color?&#39;,document.linkColor))");
    c[9] = new Array("Visited Color",
        "void(document.vlinkColor=prompt(&#39;Change visited links to what color?&#39,document.vlinkColor))");
    c[10] = new Array("Active Color",
        "void(document.alinkColor=prompt(&#39;Change the active link to what color?&#39,document.alinkColor))");
    c[11] = new Array("Miscellaneous");
    c[12] = new Array("Hide All Images",
        "for (var i=0;i<document.images.length;i++) void(document.images[i].style.visibility = &#39;hidden&#39)");
  
    sPopup="<TABLE CELLSPACING=0 BGCOLOR=lightgrey ID=\"SEWMUTILITIES\";
    sPopup+="STYLE=\"border:1px black solid;position: absolute; top:0; left: 100\">";
    sPopup+="<TR><TD><FONT SIZE=-1 FACE=\"verdana\">";
    for (var i=0;i<c.length;i++)
        if (c[i][1]) {
          sPopup+="<A HREF=\"javascript:" + c[i][1] + "\">" + c[i][0] + "</A><BR>";
        } else {
          sPopup+="<B>" + c[i][0] + "</B><BR>";
        };
    sPopup+="<HR><FONT SIZE=-2>"
    sPopup+="<A HREF=\"javascript:void(document.all.SEWMUTILITIES.outerHTML=&#39;&#39;)\">Close SETools</A>";
    sPopup+="<BR>&copy; 1999 <A HREF=\"http://www.siteexperts.com\">SiteExperts.com</A>";
    sPopup+="</FONT></FONT></TD></TR></TABLE>";
    document.body.insertAdjacentHTML("beforeEnd",sPopup);
  };
};

void(RUNSEWMUTILITIES());
'>SETools&;lt;/A>

The array, c is used to generate the menu. Each item in the menu is stored in its own array location. Each item in the array can either be a header or an action. Headers are used to group related actions together, and the action is a script that executes against the current document.

Headers are created as a single array entry:

    c[0] = new Array("Header Name");

For actions, you define both a header and an associated script:

    c[1] = new Array("640x480","window.resizeTo(640,480)");

The best way to better understand how to create commands is to review the SETools script. Just keep in mind the following rules as you write your own commands:

1. If specifying multiple lines of script, each line must end with a semicolon.
2. Any function that returns a value must be wrapped in a void statement.
3. Any strings must be specified using an escaped single quote, '
4. Do not create more than 11 or 12 entries. This is because the HREF attribute has a size limit. If your script becomes too large it will silently fail.

We hope you enjoy SETools. We plan on creating a few more tools plus a Netscape version. Meanwhile, please send us any of your creations. We will update this article with new and useful tools that you send in.

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.