Blog Home  Home RSS 2.0 Atom 1.0 CDF  
Hairy Spider Blog - Javascript
A web of intrigue
 
 Thursday, February 02, 2006

I've just been reading a book with words like solipsism. What the hell does that mean?

Obviously I had to pick up the dictionary and scan through until I found what the word meant. However, I didn't - I admit it: I'm too lazy to do that so I still don't know what solipsism means. It sounds great, but to me, totally meaningless. The reason why I didn't do it was because there were too many steps involved: Put the book down, Find the dictionary, pick it up, find the right page, read the description, put the dictionary back, pick up the book, find the page, re-read the sentence.

Argh! It's a nightmare. I was then thinking how much easier it would be reading books on the web, it's simple to look up definitions. Then I realised it was just as hard. Wouldn't it be nice to have an easy way to lookup a definition, what I'd like to do is to highlight a word, and press a key.

Well now I can do this. Try it out on this page, highlight a word and press the d key. There is a problem with Mozilla browsers, as I can't find any way to position to the dictionary definition by the selected text. In IE there isn't a problem.

In theory this could be incorporated on any web page just by including this script containing all the code

I would need to change the paths so that they reference this site, but that could be done.

The definitions come from www.dict.org and the code to get it from there can be viewed in the javascript files.

Here's a section of random text for you to play with:

I never spend much time in school but I taught ladies plenty. It's true I hire my body out for pay, hey hey. I've gotten burned over Cheryl Tiegs, blown up for Raquel Welch. But when I end up in the hay it's only hay, hey hey. I might jump an open drawbridge, or Tarzan from a vine. 'Cause I'm the unknown stuntman that makes Eastwood look so fine.

One for all and all for one, Muskehounds are always ready. One for all and all for one, helping everybody. One for all and all for one, it's a pretty story. Sharing everything with fun, that's the way to be. One for all and all for one, Muskehounds are always ready. One for all and all for one, helping everybody. One for all and all for one, can sound pretty corny. If you've got a problem chum, think how it could be.

Top Cat! The most effectual Top Cat! Who's intellectual close friends get to call him T.C., providing it's with dignity. Top Cat! The indisputable leader of the gang. He's the boss, he's a pip, he's the championship. He's the most tip top, Top Cat.

80 days around the world, we'll find a pot of gold just sitting where the rainbow's ending. Time - we'll fight against the time, and we'll fly on the white wings of the wind. 80 days around the world, no we won't say a word before the ship is really back. Round, round, all around the world. Round, all around the world. Round, all around the world. Round, all around the world.

Hong Kong Phooey, number one super guy. Hong Kong Phooey, quicker than the human eye. He's got style, a groovy style, and a car that just won't stop. When the going gets tough, he's really rough, with a Hong Kong Phooey chop (Hi-Ya!). Hong Kong Phooey, number one super guy. Hong Kong Phooey, quicker than the human eye. Hong Kong Phooey, he's fan-riffic!

Text supplied by www.malevole.com
2/2/2006 11:55:48 AM (GMT Standard Time, UTC+00:00)  #      DictionaryDefinitions | Javascript  | 
 Thursday, November 24, 2005

I think this maybe a repost. If not then I apologise or holding this to myself.

It's a bookmarklet to enable you to quickly unhide hidden input elements. Some web developers think that hiding sensitive text in a hidden field is safe. This may help to enlighten them.

Show Hidden Inputs

To use right click the link and choose add to favourites or bookmark this link, then when you are on a page where you want to quickly view the hidden fields, click the "Show Hidden Inputs" bookmark.

11/24/2005 1:03:53 PM (GMT Standard Time, UTC+00:00)  #      Bookmarklet | Javascript  | 
 Thursday, October 13, 2005

I've created a new menu extension for Internet Explorer. This one allows you to view the cookies which you have for the website you are currently visiting and also allows you to modify the values of those cookies.

You can download the zip file containing the menu extension and the installer file Also part of this file is Document Examiner and a few other IE extensions.

Usual disclaimers apply.

10/13/2005 7:21:20 PM (GMT Daylight Time, UTC+01:00)  #      Document Examiner | Javascript | Menu Extensions  | 
 Tuesday, June 22, 2004

UPDATE: At the request of kb in the crossbrowser version you can only change to stylesheets without a media or of "screen".

I mentioned in this entry that I'd like to have a bookmarklet so that IE would be able to change stylesheets in a site which has multiple stylesheets.

I couldn't find one, albeit i managed a cursory 10 minute search. So i decided to write one. In fact I wrote two, the first first one I wrote involved popping up a window and allowing the user to change the stylesheet in that window, however, I couldn't get this to work in IE. The second bookmarlet does work in IE and works on a system of confirm() calls, so heaven help you if you have a load of stylesheets. It only work if you have one active stylesheet so may not be applicable for every site.

Mozilla only stylesheet changer

Cross browser stylesheet changer

To add them to your favourites / bookmarks right click the link and choose add to favourites / bookmarks. In IE you may get a warning and if you don't trust me don't add the link to favourites. There's no reason to trust me, you don't know me.

6/22/2004 1:20:13 PM (GMT Daylight Time, UTC+01:00)  #      Javascript  | 
 Wednesday, June 09, 2004

I remember back in the good old days when all I seemed to do was to debug VB applications, the most useful feature was the immediate window. So I thought, what would be great is a similar feature for IE . So I set to writing Immediate Window For IE.

My first approach took me along the lines of popping up a new window to contain the textbox that would execute and report the commands. However, the access denied problem which I experienced with Document Examiner popped up it's secure concious head. After doing some digging the document.domain property is blank for a menu extension. I'd have thought that this should be the same as the domain property of the window.opener but clearly not.

Anyway, I managed to solve the problem by inserting the html at the end of the body of the window.opener.

So here it is: Immediate Window For IE

To install the extension, extract the contents of the file somewhere, right-click the .inf file and choose install. Restart IE and then from a right-click choose the Immediate Window option.

You are able to query and set various properties using this tool, placing a ? (question mark) before the command will write out the return value of the expression on the following line. See this screen shot for a visual example (opens new window)

6/9/2004 11:55:31 AM (GMT Daylight Time, UTC+01:00)  #      Immediate Window | Javascript  | 
 Thursday, May 06, 2004

You can now use Document Examiner on any page in any site now by adding it to Internet Explorer as a menu extension (right-click menu).

Well I knew I'd remember how to properly implement a menu extension in Internet Explorer. The key is that the page called runs only the script, then the window is closed.

Following the example in the web accessories for Internet Explorer I remembered that you need to open a new window and create the html in there using document.write(). The short cut I used was to document.write the whole of the HTML in the page.

So the next problem was trying to set the _mWin and _mDoc variables. This was done by setting them as properties of the new window. If I ever see that "Access Denied" message again I'll go mad.

Anyway you can download a zip file containing Document Examiner Menu Extension and the installation file. The installation is done using a .inf file.

To install the file extract the html and inf files to a directory somewhere, right-click the inf file and choose install. Thanks to Richard Birkby for help with this technique.

Use of the file is as before. To load the file after installing, browse to the page you are interested in right click and in that menu there will be an item called Document Examiner.

5/6/2004 1:48:36 PM (GMT Daylight Time, UTC+01:00)  #      Javascript  | 
 Friday, April 30, 2004

I often get some hideous HTML given me where the nesting of tables is so extreme that to find anything out you have to dig and dig, then only find that the style that's been applied is somewhere else altogether. Anyway to help me with this I've written a Document Examiner I've very loosely based it on the DOM Inspector that ships with Firefox.

Now I'd like to get it working as a MenuExt(ension) in IE, however, I've come across a problem and can't remember how I've resolved it in the past. I've added all the keys in the registry, I can even attach a debugger but the window doesn't actually display. I'll work it out at some point.

Anyway it still works, the major limitation is that it needs to be hosted at the same URL as the document you are examining. So for example with this site you could click this link and then in the input box enter http://www.hairy-spider.com/blog/index.aspx

Then by clicking on the nodes in the left you can drill down to a point in the DOM tree. Then try out the Style, Object and OuterHTML tags.

It's very much a work in progress piece of work. However, it works well enough for me that I can use it. Maybe soon I'll get it to work.

Update:

I've improved the performance of it and also put the property lists in alpha order.

4/30/2004 5:13:30 AM (GMT Daylight Time, UTC+01:00)  #      Javascript  | 
 Wednesday, March 31, 2004

Websites where the context menu (right click menu) has been disabled really bug me, it's a pain having to find other methods to view the source.

So what with these bookmarklets being the in thing I decided to write one which you could use to toggle this annoying behaviour.

Just add this link to your favourites and then try it out on a page Toggle Context Menu In Firefox you can do this by right clicking the link and clicking bookmark this link. In IE the only way I can find is to drag the link into the Favorites (sp?) menu.

3/31/2004 1:09:48 PM (GMT Daylight Time, UTC+01:00)  #      Javascript  | 
 Wednesday, March 10, 2004

I got bored so I thought I'd try to create Life. Well it's more Jim Conway's Game of Life, anyway here's the link

Oh yeah, it's all cross browser dhtml. Not too hot, but it does the job

3/10/2004 5:15:38 AM (GMT Standard Time, UTC+00:00)  #      Javascript  | 
 Monday, March 01, 2004

Mondays: the second worst day of the working week.

One thing I did to cheer myself up was tp append into this HTML Edit from Jesse Ruderman the following snippet of html: <div style="visibility:hidden">Oh no it doesn't </div>

It's the small things that make the difference. However, to justify my ridiculously sad experience - is that it's an interesting and simple demonstration of an HTML editor.

3/1/2004 9:50:23 AM (GMT Standard Time, UTC+00:00)  #      Javascript  | 
 Sunday, January 25, 2004

The Mozilla implementation of an XML Document doesn't include the xml property, so you can't get to the source of the xml document. However, you can access this by using the XMLSerializer object.

I have implemented this as a get property on a Node. I have used the incredibly lacking in documentation function of a prototype __defineGetter__

In the example of extending the Node object to add xml I have also included a second function and button to show how you could implement a method similar to the innerHtml call used in the IE DOM

1/25/2004 3:58:37 AM (GMT Standard Time, UTC+00:00)  #      Javascript  | 
 Monday, January 12, 2004

Today I've been working on refining a stock search, depending on uncontrollable factors a typical search can take anywhere from 2 to 10 seconds to return results to the client. From the client's point of view the worst thing to do in a situation like this is nothing, instant feedback is critical in this situation. For one thing, if after a few seconds nothing seems to have happened, the automatic response of most users is to click the search again, which in most circumstances will re-issue the search request. Also an unresponsive site is almost as bad as a broken one.

So one of the first things the results page must do is send some HTML content back to the client this is done using the Response.Flush() method. With a minimum set of data in the buffer to flush this will have the effect of loading an empty results page, the rest of the content will then follow when the server has finished compiling the search results. One nice thing to do is to add a message at the top of the page to inform the client that the page is loading. In this example {source} I have also added a bit of DHTML to animate the message.

For pages which involve a lot of processing, for example report building it's very nice to extend the above functionality and add status data to the document download. In this example {source} the server will send status information to the client every second. In a real life situation you may want to inform the user or yourself even how long a stage of a report has taken to run, compile or print.

1/12/2004 4:23:16 AM (GMT Standard Time, UTC+00:00)  #      Javascript  | 
 Friday, January 09, 2004

I've been using the MSXML object for many years but the problem with this is obviously it's an IE thing only. Lately though I've been revisiting my old code to make it compatible with Firebird for a while firebird has supported XML parsing and standard DOM2 methods, except for the most useful selectNodes and selectSingleNodes.

However, we can add these methods simply by extending the XMLDocument object and the Element object via the prototype.

I would include the code here, but it's probably easier to link to a demonstration.

The xml for the demo can be found here Xml Source

Now I say crossbrowser-ish as this works only on IE and Gecko based browsers.

1/9/2004 5:35:51 AM (GMT Standard Time, UTC+00:00)  #      Javascript  | 
 Tuesday, January 06, 2004

Everyone seems to like DHTML on their site, we've all seen and written DHTML menus and trees. I've recently rewritten a vertical scroller component, the original code was Netscape 4 compliant and so the code was insane, the latest version just needed to work with Mozilla and IE browsers, so I took a different approach than previously.

Using DOM methods I was able to create a scroller in two simple functions, one to create the scroller the second to control the position of the scroller. The HTML is constructed with a containing <div> (viewport) and a second <div> to hold the content.

The first function startScroller() sets some various properties on the content div and clones the content div. The reason for cloning the node is that when the bottom of the content div is within the the viewport, what happens is you will get a blank area tracking up through the viewport and then a discontinuity when the top is set to 0.

Then this function sets the window.setTimeout() to call... The second function Scroll() increments a variable which will be used to set the how far in pixels the top of the content div is from the top of the viewport. This function then recalls itself after a short period. If all the position of the content div is wholly outside the the viewport then the position is set back to 0.

The 2 javascript functions are:

			

	var pos;
	var dvContent;
	var dvDup;

	function startScroller()
	{
		var dvScroll = document.getElementById("dvViewport");
		dvContent = document.getElementById("dvContent");
		dvContent.style.position="absolute";

		dvDup = dvContent.cloneNode(true);
		dvDup.id = "dvOverallContainerDup";
		dvDup.style.position="absolute";

		dvScroll.appendChild(dvDup);
		pos = 0;
		window.setTimeout("Scroll()", 500);
	}

	function Scroll()
	{
		pos += 1;

		if (pos

Naturally, there are some shortcomings of this method which may or not be a problem:

If the content height is less than half the viewport height.

Also under mozilla depending on the size of your window you may see a some strange behaviour with the scrollbar.

Because of the use of global variables you can't set more than one scroller per page.

A scroller example can be found here

1/6/2004 12:31:49 PM (GMT Standard Time, UTC+00:00)  #      Javascript  | 
Copyright © 2008 Rhys Jeremiah. All rights reserved.
DasBlog 'Portal' theme by Johnny Hughes.
Pick a theme: