<

Some EE-useful JavaScripts for the IE Context Menu

Published on
13,910 Points
3,210 Views
12 Endorsements
Last Modified:
Awarded
DanRollins
Over the years, I've developed some JavaScript tools that can be useful for Experts-Exchange users, and I decided to reformat a few of them them for use as Internet Explorer Context Menu commands and collect them in one place.

This article provides the following short "EE tool" scripts:

EE Poinx Splitter           Automatically split points among all contributors to an EE question.
EE Get Poster Name    Get an EE user name onto the clipboard.
EE Get Comment Link  Create a link to a specific comment -- full or short version (e.g, http:#a12345567 )
EE Quote From Post     Put some selected text into the comment box, formatted as a quote.
These tools use a novel technique that adds custom code directly to the Internet Explorer's context menu.  This article illustrates a number of useful techniques that you can use in your own JavaScript/DOM programming, including:  Altering the action if the Shift or Ctrl key is pressed, obtaining an HTML element pointer to whatever was clicked upon, and automatically populating input boxes and setting check marks.  It shows many handy examples of working with the Internet Explorer DOM of the current page.

In a previous article, Add a Custom Command to the IE Context Menu,  I described how to add custom commands to the IE right-click Context Menu.  It is often possible to get a similar effect by creating a bookmark that contains the JavaScript, but the technique described there, and used here, has several advantages:
 
It will be on the menu only when certain criteria are met (such as, when the user has selected some text or clicked on an image).
With JavaScript bookmarks, you need to crush out all of the whitespace and line breaks, which makes the code very difficult to read, modify, and debug -- and js bookmarks never contain documenting comments or descriptive variable names.
The commands are right there on the menu, as opposed to mixed in with "real" bookmarks.
In each of the following, I provide a script (embedded in an HTML file) along with a "RegEdit import file" that will modify the registry for you.  If you store the scripts in a different directory, you'll need to modify the RegEdit file.  If you are not comfortable with running a .REG file, you can do the same thing manually -- see the earlier article for step-by-step instructions.
[step="" title="NOTE:"]I wrote these to work with Internet Explorer at EE with the Expert Skin.  If you use the "Premium Skin," you will need to make some changes... I leave that up to you.[/step]

EE Get Poster Name:
Especially when acting in a "badger capacity" -- as a Zone Advisor, Moderator, or Page Editor -- you must be careful to address your comments directly to a particular Member.  And being conscientious, you don't want to misspell that name.  What I usually do is scroll back up to a previous comment, and copy the name to the clipboard.  In Expert Skin, that is harder than it should be (it's hard to keep from selecting other parts of the comment header).  Now have a tool for that.

Usage:
Right-click anywhere in the comment header in Expert Skin and select EE Get Poster Name from the context menu.  Now you can use Ctrl+V to paste that name into the comment box.

File: C:\Program Files\MyScripts\EE_GetPosterName.HTM
<html><body>
<script language="JavaScript">
// click in the comment header in Expert Skin
// puts the name of the comment poster on the clipboard
var sPosterName="";
var oWindow=   window.external.menuArguments;
var oDocument= oWindow.document;
var oSelect=   oDocument.selection;

var x= window.external.menuArguments.event.clientX;
var y= window.external.menuArguments.event.clientY;
var oElem= oDocument.elementFromPoint(x,y);

var oElemParent= oElem.parentElement;
oElemParent= oElemParent.parentElement;
var oColl= oElemParent.getElementsByTagName("A");
for (var j=0; j< oColl.length; j++ ) {    var oEl= oColl[j];
    if ( oEl.href.indexOf("/M_") != -1 ) {
        sPosterName= oEl.innerText;
        break;
    }
}
alert( "About to copy to clipboard: "+sPosterName );
oWindow.clipboardData.setData('Text',sPosterName);  // Note: Warning pops up
</script>
</body></html>

Open in new window

File: EE_GetPosterName.REG
Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt\EE Get Poster &Name]
@="file://C:\\Program Files\\MyScripts\\EE_GetPosterName.HTM"
"Contexts"=dword:00000001

Open in new window


EE Get Comment Link:
When referring back to a previous comment, it is sometimes handy to use the comment ID in a hyperlink to set the context of whatever you are about to say.  You can do this manually:  Scroll back up to the comment, select the 8-digit number that is the ID, and then manually create a URL in either of these two formats:

    http:#a2123345678
    http://www.experts-exchange.com/Q_24647549.html#a2123345678

The former can be used when the linked comment is in the current thread.  The latter can be used to identify a comment in any thread.  The following script formats the URL for you and it also illustrates a handy technique of altering its functionality depending upon if you are pressing the Ctrl key when you right-click.  If you press Ctrl, then the script's output is the "full URL" format (useful for posting in other links, or in emails, etc.)

Usage:
Right-click anywhere in the comment header in Expert Skin and select EE Get Get Comment Link from the context menu.  Press Ctrl while clicking if you want the full URL.  Now you can use Ctrl+V to paste that link into the comment box.  

File: C:\Program Files\MyScripts\EE_GetCommentLink.HTM
<html><body>
<script language="JavaScript">
// Right-click in the comment header in Expert Skin
// Puts a link to the comment on the clipboard:  e.g.: http:#a123456789
// Press Ctrl key:  http://www.Experts-Exchange.com/Q_1234567.html#a123456789
var sLink="";
var oWindow=   window.external.menuArguments;
var oDocument= oWindow.document;
var oSelect=   oDocument.selection;

var x= window.external.menuArguments.event.clientX;
var y= window.external.menuArguments.event.clientY;
var ctrlPressed= window.external.menuArguments.event.ctrlKey;
var oElem= oDocument.elementFromPoint(x,y);

var oElemParent= oElem.parentElement;
oElemParent= oElemParent.parentElement;
var oColl= oElemParent.getElementsByTagName("SPAN");
for (var j=0; j< oColl.length; j++ ) {
    var oEl= oColl[j];
    if ( oEl.className=="value" ) {
        sLink= oEl.innerText;
        if ( parseInt(sLink) > 25000000 ) {
            if ( ctrlPressed ) {
                sFullUrl= oWindow.location.href;
                var nOffset= sFullUrl.indexOf( "/Q_" );
                var sURL= sFullUrl.substr(nOffset);
                sLink= "http://www.Experts-Exchange.com" +sURL + "#a" + sLink;
            } 
            else  {
                sLink="http:#a" + sLink;
            }
            break;
        }
        sLink= ""; // try again
    }
}
alert( "About to copy to clipboard:\n"+sLink );
oWindow.clipboardData.setData( 'Text', sLink ); // Note: Warning pops up
</script>
</body></html>

Open in new window

File: EE_GetPosterName.REG
Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt\EE Get Comment Link]
@="file://C:\\Program Files\\MyScripts\\EE_GetPosterName.HTM"
"Contexts"=dword:00000001

Open in new window


EE Poinx Splitter:
There have been a number of these written over the years.  Each time the EE U/I changes, it breaks the script, but what fun is life without change?  Traditionally, auto-split tools are used almost exclusively in the EE Lounge, but it can can be useful in the P&R area and other places where the threads are more often discussions than normal Q & A.  

Anyway, this version takes advantage of the new! automatic point-balancing logic built into the EE site code.  It can set the grade and preset the other radio buttons at the bottom of the page.  It awards points to only the first comment posted by any user.  If the points cannot be divided evenly, it pops up a box letting you know.  Note that it does NOT finalize the splitting:  It just does the first-pass grunt work for you.  You can (and should) go back through the comments and tweak the poink distribution as desired.  Remember that the largest award will be listed as the "Answer" and all of the others as "Assists."

Usage:
It must be your own question, which you want to close.  First, click one of the Accept Multiple Solutions links on the page (any one will do).  Then right-click anywhere on the page and choose EE Poinx Splitter from the IE context menu.  Warning to ZAs and PEs... be careful to not award points to yourself!

File: C:\Program Files\MyScripts\EE_PoinxSplitter.HTM
<html><body>
<script language="JavaScript">
// Click the "Accept Multiple Solutions" link
// Right-click anywhere on the page and select EE Poinx Splitter
//
var oWindow=   window.external.menuArguments;
var oDocument= oWindow.document;
var p=0;
var sa='';
var c= oDocument.getElementsByTagName('INPUT');
for( i=0; i<c.length; i++) {
    if( c[i].type=='checkbox' ){
        s= c[i].parentNode.innerHTML;
        x= s.indexOf('.html">')+7;
        s1= s.substr(x);
        if( sa.indexOf(s1) == -1 ){  // none allocated to this poster yet
            sa += s1;
            c[i].click();  // click the checkbox to let autocalc happen
            p++;  // one more commenter 
        }
    }
}
// display an alert when not divided evenly
s= oDocument.body.outerHTML;
x= s.indexOf('pointsTitle>')+12;
n= parseInt( s.substr(x) );
alert( n%(p-1)+' extra!\n\nPoinx Splitter\n...written by DanRollins' );

// these set the radio buttons at the bottom automatically
oDocument.getElementById('gradeTypeID4').click(); // always an A
//oDocument.getElementById('clar1').click();  // not clear at all
//oDocument.getElementById('comp1').click();  // not complete at all
//oDocument.getElementById('acc1').click();   // not easy to follow
oDocument.getElementById('knowledgeBase').checked='checked';

oDocument.getElementById('comments').value="Thank you, one and all!";
oDocument.getElementById('comments').focus();
</script>
</body></html>

Open in new window

File: EE_PoinxSplitter.REG
Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt\EE Poinx Splitter]
@="file://C:\\Program Files\\MyScripts\\EE_PoinxSplitter.HTM"
"Contexts"=dword:00000001

Open in new window

You may want to modify the script to auto-insert a different "closing comment" and you may want to uncomment some of the lines at the bottom, depending upon how badly you want to malign the posters :-)


EE QuoteFromPost:
It's easy enough to select some text and paste it into comment box.  But I have some specific goals when quoting from a previous post, and I wanted a tool to simplify the task. The output is:

   MemberName,
   >>text that you selected, in italics

...which gets inserted directly into the comment input box.  This was especially challenging because it's not at all obvious how to programatically add text into the Rich Text edit box.  In any case, this is the most complex script and some of the code might be useful in your own context-menu-tool programming.
Quote from posts -- automatically!Usage:
This script expects you to highlight some text from a previous comment, then right-click that selection and choose EE Quote from Post from the menu. It auto-scrolls back to the bottom so that you can see (and typically) modify, the inserted text, and then type your response.

File: C:\Program Files\MyScripts\EE_QuoteFromPost.HTM
<html><body>
<script language="JavaScript">
// Highlight (select) some text from a previous post, then right-click on it
// and select EE Quote from Post 
// Appends that text to the end of the comment, formatted as a quote.

//------------- get the current selected text:
var oWindow=      window.external.menuArguments;
var oDocument=    oWindow.document;
var oSelect=      oDocument.selection;
var oSelectRange= oSelect.createRange();
var sSelText=     oSelectRange.text;

//------------- get the poster's EE handle (Expert Skin version)
var sPosterName="";
var x= window.external.menuArguments.event.clientX;
var y= window.external.menuArguments.event.clientY;
var oElem= oDocument.elementFromPoint(x,y);

var oElemParent= oElem.parentElement;
oElemParent= oElemParent.parentElement;
var oColl= oElemParent.getElementsByTagName("A");
for (var j=0; j< oColl.length; j++ ) {
    var oEl= oColl[j];
    if ( oEl.href.indexOf("/M_") != -1 ) {
        sPosterName= oEl.innerText;
        break;
    }
}
oTE=oDocument.getElementById('textBottom'); // the comment input TextArea

//------- different handling for Rich Text or Plain Text
if ( oTE.style.display == "none" ) {
    //alert( "About to copy to clipboard: " + sMsg );
    //oWindow.clipboardData.setData( 'Text', sMsg );
    // finally figured out how to append to RichText editor!

    var sMsg= sPosterName+ ",\n";
    sMsg += ">><i>" + sSelText + "</i>\n";
    sMsg= sMsg.replace(/(\r\n)|(\n)/ig, "<br>");

    var eWisy= oDocument.getElementById("wysiwygtextBottom"); // an iframe
    var eBody= eWisy.contentWindow.document.body;
    eBody.innerHTML= eBody.innerHTML + sMsg;
    eWisy.focus();
    eWisy.scrollTop= eWisy.scrollHeight-eWisy.clientHeight;
}
else { // much easier:: Append to the textArea
    var sMsg= sPosterName+ ",\n";
    sMsg += ">>" + sSelText + "\n";
    var sCur= oTE.value; 
    if ( sCur.charCodeAt(sCur.length-1) != 10 ) {
        sCur += "\n";
    }
    oTE.value= sCur + sMsg;
    oTE.focus();
    oTE.scrollTop= oTE.scrollHeight-oTE.clientHeight;
}
</script>
</body></html>

Open in new window

File: EE_QuoteFromPost.REG
Windows Registry Editor Version 5.00

[HKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExt\EE &Quote from Post]
@="file://C:\\Program Files\\MyScripts\\EE_QuoteFromPost.HTM"
"Contexts"=dword:00000010

Open in new window

Conclusion:
Writing and reworking the scripts here turned into a great opportunity for me to hone my JavaScript and browser DOM skills.  I hope that one or more of them will be useful to you here at Experts-Exchange!

=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
If you liked this article and want to see more from this author,  please click the Yes button near the:
      Was this article helpful?
label that is just below and to the right of this text.   Thanks!
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
12
Comment
Author:DanRollins
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
9 Comments
 
LVL 38

Expert Comment

by:lherrou
Great work, but what about us FF users? :)
0
 
LVL 49

Author Comment

by:DanRollins
Note: To avoid the popup clipboard warning in two of the above scripts, see:

    Allowing Access to the Windows Clipboard
    http://www.experts-exchange.com/A_1777.html
0
 
LVL 30

Expert Comment

by:captain
Thanks Dan. I will bookmark this for reference.
0
On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

 
LVL 10

Expert Comment

by:Horn E. Towed
Thanks Dan.

FYI The Poinx Splitter [at least] works in FF by pasting the Java Script into a bookmark just like the previous splitters.

I have not tried the other scripts, yet.
0
 
LVL 18

Expert Comment

by:Ravi Agrawal
StoneG,

How did you use it? please clarify. I love FF more than IE.

Ravi.
0
 
LVL 10

Expert Comment

by:Horn E. Towed
grtraders>

Copy the Poinx Splitter script.
Create a bookmark, right click it and select Properties.
In the Function window paste the Java code.
Change the bookmark name and description to suit yourself.
Store it where you want [Organize Bookmarks]

To use, open one of your threads, and choose Accept Multiple Solutions.
Go to Bookmarks & select the splitter & it will spread the poinx out; once for each member.
The Accepted Answer will be the one that gets the most poinx [or the first one in the group that has the most poinx]
You can manually modify the value awarded so that any commenter can get the accepted answer.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
What's IE?

Almost entirely on MAC now. Only using IE at work when I must test how things look for other people ;)
0
 
LVL 47

Expert Comment

by:Martin Liss
Dan, while I've been an EE member for a few years I've only been at all active for a month or so. Anyhow I recently found that the EE bullet tag forced me to manually add them to every line in a list and I thought that that could be improved so I created an IE context menu extension to do the whole list automatically. I published information about it and other IE extensions (and a Safari extension) in this article which is a work in progress.. In looking for my article I came across yours and I think I'll add some of them to my IE.

BTW do you know if the techniques you and I describe work in IE9?
0
 
LVL 49

Author Comment

by:DanRollins
I ran into one problem that occurred (I think) after a Windows Update tweaked some security settings.  When I run as a reduced-privledge user, most of the scripts fail.  Sometimes if you put EE on your "Trusted Sites" list, things start to work again.

And of course, the most significant problem is that whenever EE changes anything in the page layout, most of screen-scraping techniques fail.  EE is currently doing a major rewrite of the entire site, so a lot of these "useful little tips" will need to be revised.
0

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Join & Write a Comment

The Bounty Board allows you to request an article or video on any technical topic, or fulfill a bounty request to earn points. Watch this video to learn how to use the Bounty Board to get the content you want, earn points, and browse submitted bount…
Articles on a wide range of technology and professional topics are available on Experts Exchange. These resources are written by members, for members, and can be written about any topic you feel passionate about. Learn how to best write an article t…

Keep in touch with Experts Exchange

Tech news and trends delivered to your inbox every month