JavaScript

Send Email Link for IE

Mark H. Wagner — Thu, 07 Apr 2005 10:24:00 GMT

I try not to have any (OK, many) obsessions; however, one is my consumption for information. Because of this I have to strictly monitor myself from deviating from my present task. I am sometimes easily distracted.

To help me remember about “something I found interesting“, I have a nice little custom link button labeled “Send” that I use in my Internet Explorer browser to quickly send myself an email. The email contains a subject and the link to the website in the body. Yes, you can do this by clicking, File > Send > Link by E-Mail, but this is to many clicks for me. Yes, I am impatient and have to work on this also.

This works with one click - much better. Your Links toolbar needs to be turned on to easily access the buttons in IE. I have my located immediately after the Address bar as shown here.

Simply paste the the following javascript code into the URL of the link properties.

javascript:navigate('mailto:YOUR-EMAIL@HERE.COM?subject=LINK:%20'+escape(document.title)+'&BODY='+escape(location.href))

The only thing you need to customize is the YOUR-EMAIL@HERE.COM portion. Here is a sample of the properties dialog.

To create a link button you can drag the “e“ icon in the address bar to the Link toobar. To get the properties, right-mouse-click on a link you want to edit. Here is a sample of the properties dialog.

Warning: For me these emails are subtle “tasks” to learn more. Your inbox may quickly fill up. :)

Building a Better Busy Box (Processing… Please Wait) - Ver 1.2

Mark H. Wagner — Wed, 16 Feb 2005 10:09:00 GMT

Building a Better Busy Box - Ver 1.2
(Processing… Please Wait)

Mark Wagner
Castle Rock Software, LLC
http://blogs.crsw.com/mark

February 16, 2005

Updates

February 16, 2005 - Rewrite to use an IFRAME instead of a DIV tag.
January 7, 2005 - Fixed z-Index attribute.
November 13, 2004 - Original article

Summary: We often need to provide a user message informing the user that their request is “processing”. Like the hour-glass mouse pointer lets the Windows user know the system is busy processing their last request, I have a simple, clean, and effect solution to providing this on web pages.

BusyBox Demo
http://blogs.crsw.com/mark/samples/BusyBoxDemo/Default.aspx

Article source and sample code links
This article is located at: http://blogs.crsw.com/mark/articles/642.aspx
Source code sample at: http://blogs.crsw.com/mark/files/BusyBox-1.2-Demo.zip

Technologies employed

JavaScript
HTML (ASP.NET)

Supported browsers

Internet Explorer 6
Netscape Navigator 7.1, 7.2
Firefox 1.0
No other browsers have been tested

Introduction
Anyone who has used the Internet for more than a few hours has encountered times when the “Internet” is being slow. I use the term “Internet” in jest here since it is often the term used when websites are not responding as quickly as we would like. As most of us know, the problem is more often caused by an over-worked website, one that is unable to handle its current workload. This article does not address any performance issues as that is a much larger topic for another time. However, for those well designed and well cared-for websites there are very acceptable times when displaying a “processing” message to the user is very helpful and very appropriate.

I have certainly experienced times; as I am sure you have, where after clicking a submit or search button I began to wonder if the web server was going to process my request successfully. Why shouldn’t it. I didn’t expect it to take more than a second or two. Performing functions like a search, report generation, or the processing of a large order, can often take more time than we would like. These predictably slow responding places in an application are ideal candidates for user feedback in the form of a processing message. As long as your website is not normally slow, your users will appreciate being notified of potentially long running processes.

There are a number of different approaches to accomplishing this. One of the more common methods is to navigate to an intermediate page where an animated image and/or message are presented to the user. The intermediate page then immediately initiates the process of navigating to the long-processing page. This allows the intermediate “please wait” page to be displayed to the user while the long-processing target page is crunching away. When the target page completes its long process it then begins rendering to the user’s browser, thus replacing the “please wait” message. While this technique works well when navigating from page A to page B, it does not work well when a post-back (from page A to page A) is needed. Additionally, having the benefits of things like ViewState become discarded.

My Approach
The approach I am about to cover functions just as well during a post-back as it does when navigating from page X to page Y. Moreover, there is no need (or desire) to have an intermediate processing page. If you are using a custom base page for your application; (i.e. a MasterPage), it becomes even easier to user. I have added this to my personal CastlePage class making it very easy to use at anytime.

My approach is to pre-load my busy box message in a hidden IFRAME tag on any page that will navigate (or post-back) to a potentially long running process. After all, my busy box message has a pretty small code footprint. The page will begin it’s unload process whenever the browser posts to a new page or performs a post-back. By placing JavaScript code in the onbeforeunload event of the body tag I can instantly reveal the busy box message to the user. Since this is part of the original page it will display immediately and remain visible until the new page completes its processing and begins to render in the user's browser. Best of all, this works great with post-backs too.

Click here for the complete article.

Busy Box improvements...

Mark H. Wagner — Thu, 10 Feb 2005 11:18:00 GMT

I have my updated busy box completed. Before I post the new code to my blog, I need to update my article and sample. Should be up sometime in the next day or so.

JavaScript ASP.NET Rater control (Rating control): Sneak Peek

Mark H. Wagner — Sun, 30 Jan 2005 17:15:00 GMT

Rater Control, Rating Control, or 5-Star Rating Control, call it what you like.

I have created a new JavaScript ASP.NET Rater control (Rating Control). The entire functionality is driven by JavaScript, but I have also created an custom .NET control to facilitate easy use in an ASP.NET web appication. I intend on writing a much more detailed article, soon I hope. For now you can see my demo page for a better look.

Technologies:
JavaScript
C#
ASP.NET

Here is a sneak peak at the Rater control in action: (Hint: use your mouse.)

Demo: http://blogs.crsw.com/mark/samples/CastleRaterDemo/

Download the demo (and control).
Download the control only.

Note: For anyone who would like to link to my Rater control, please link to this post and not my demo page. Thanks. Also, I will make the C# source code for the .NET control available soon.

JavaScript Object Browser

Mark H. Wagner — Wed, 22 Dec 2004 13:39:00 GMT

Below is a small JavaScript application that allows you to browse through various objects on the DOM as well as JavaScript variables. I wrote this in an attempt to better understand the differences between various web browsers, specifically Internet Explorer, Netscape, and Firefox.

You can download my sample.

You will find a top level window object with all its immediate children located blow. Links are available on child objects where appropriate. This is 100% driven by looking at each object property generically, meaning, nothing is hard-coded. This allows any of your custom JavaScript variables (in a Netscape browser its even better) to be viewed.

Areas I found of particular interest:

the windows.document node of the tree.
functions will appear with a function link. Clicking on this link will reveal the JavaScript for that function.
the window.top.document.scripts link will list all the script tags, and the associated script if the actual script is embedded within the document.

Click here for the complete article...

Building a Better Busy Box (Processing… Please Wait)

Mark H. Wagner — Mon, 15 Nov 2004 21:50:00 GMT

Building a Better Busy Box (Processing… Please Wait)
Mark Wagner
Castle Rock Software, LLC
http://blogs.crsw.com/mark

UPDATED February 15, 2005
A NEW VERSION (1.2) IS COVERD BY A NEW ARTICLE HERE:
http://blogs.crsw.com/mark/articles/734.aspx

November 13, 2004

UPDATED January 7, 2005

Known Issues

BusyBox Demo
http://blogs.crsw.com/mark/samples/BusyBoxSample/Page1.aspx

Article source and sample code links
This article is located at: http://blogs.crsw.com/mark/articles/581.aspx
Source code sample at: http://blogs.crsw.com/mark/files/busyboxsample.zip

Technologies employed

JavaScript
ASP.NET (HTML)

Supported browsers

Internet Explorer 6
Netscape Navigator 7
Firefox 1.0
No other browsers have been tested

Introduction
Anyone who has used the Internet for more than a few hours has encountered times when the “Internet” is being slow. I use the term “Internet” in jest here since it is often the term used when websites are not responding as quickly as we would like. As most of us know, the problem is more often caused by an over-worked website, one that is unable to handle current workload. This article does not address any performance issues as that is a much larger topic for another time. However, for those well designed and well cared-for websites there are very acceptable times when displaying a “processing” message to the user is very helpful and very appropriate.

My approach is to pre-load my busy box message in a hidden div tag on any page that will navigate (or post-back) to a potentially long running process. After all, my busy box message has a pretty small code footprint. The page will begin it’s unload process whenever the browser posts to a new page or performs a post-back. By placing JavaScript code in the onbeforeunload event of the body tag I can instantly reveal the busy box message to the user. Since this is part of the original page it will display immediately and remain visible until the new page completes its processing and begins to render in the users browser. Best of all, this works great with post-backs too.

click here for the complete article...