UI Design for Web Apps

Personal reminder to read this article later.

Article title: User Interface Design for Web Applications – ItÒ€ℒs a Different World from Web Site Design

And also these links.

Ajax & Interface Design

For those that don’t know… What is a Web Application? (I’ve often been asked what’s the difference between a Website and a Web Application… There is a difference, and one difference is your approach towards it. This PDF is a good quick overview of it.)

Of course, there is the AJAX approach to Web Applications.

Responsiveness is a major issue with Web Applications. The more you can minimise the amount of time the user has to wait between clicking and something appearing on the screen is vitally important. AJAX has a place here.

And with all that talk about AJAX, you may want to get to know some JavaScript (or if you prefer a non-coloured version).

JavaScript is still very useful. It may have been around for quite sometime, and has been given a bad name in the past, but it is still useful nonetheless. (Just don’t abuse it!)

Using ASP.NET to prompt a user to save when they are leaving the current page

Wanted to save this link for anyone else who might find it handy.

Scott Mitchell wrote an articled titled “Using ASP.NET to Prompt a User to Save When Leaving a Page“.

It is exactly what i’ve been looking for, and i’m sure others implementing ASP.NET pages with similar needs, will find it handy too!

And he’s also written another article if you only want to use JavaScript and HTML

The beauty of javascript pop overs

Sometime last year, I was looking into some of those JavaScript based “popups” that people had on their sites.

You know the ones, you put your mouse over the links and you see this expanded popup like area, hovering atop the text on the page.

Yet, unlike a popup, it does not create a new window. No, it just uses a technique involving a hidden DIV tag on the page.

Well, during my web hunt for something that did something along those lines, I came across what I consider one of the best free to use implementations out there. It’s called overLIB, and was written by Eric Bosrup. It’s very nice.

To see an example of its’ usefulness, you can have a look at this blog post by Clarke Scott. That’s just one example

Well, earlier today I was browsing around looking at a few examples, and came across an interesting article demonstrating the usage of an overLIB wrapper, for ASP.NET.

Looks very useful πŸ™‚

You could potentially combine the usage of that, with some of that XMLHttpRequest (aka AJAX — seems to be the current latest craze hitting the web) stuff to generate MSN Messenger style user popup alerts.

Though, one thing to remember is that the alerts will be contained solely within the web browser.

There is a whole heap of things you can do with it if you really wanted to.

Your imagination is powerful stuff in this industry, and never forget that. Though, there are times when it is not feasible to over utilise it πŸ™‚

Specifications and all that jazz, is still important. But you know, if you have the time, personal projects are where you can really flex that creativity πŸ™‚

Or of course, if you’re at Google, there’s always that 20% creative freedom time πŸ˜‰

Enabling/Disabling ASP.NET checkbox using JavaScript

Now this is very strange.

Well, it seemed that way at first anyway πŸ™‚

Assume you have declared in your ASP.NET page some web controls as below:

<asp:checkbox id="chkFirstCheck" runat="server" textalign="Left" text="Check me first!" />
<br />
<asp:checkbox id="chkSecondCheck" runat="server" textalign="Left" text="I'm second!!!" enabled="false" />

And also there is a bit of JavaScript on the ASP.NET page that looks like this:

<script language="javascript">
function getObj(name)
{
/* DHTML Micro API
* Source: http://www.quirksmode.org/js/dhtmloptions.html
*/
if (document.getElementById) // test if browser supports document.getElementById
{
this.obj = document.getElementById(name);
this.style = document.getElementById(name).style;
}
else if (document.all) // test if browser supports document.all
{
this.obj = document.all[name];
this.style = document.all[name].style;
}
else if (document.layers) // test if browser supports document.layers
{
this.obj = document.layers[name];
this.style = document.layers[name].style;
}
}

function checkedChanged()
{
var firstCheck = new getObj('chkFirstCheck');
var secondCheck = new getObj('chkSecondCheck');

if (firstCheck.obj.checked == true)
{
secondCheck.obj.disabled = false;
}
else
{
secondCheck.obj.disabled = true;
secondCheck.obj.checked = false; // if the secondCheck is disabled, then it should not be checked
}
}
</script>

In the code behind, for the ASP.NET page, in your Page_Load, you’d probably be attaching Javascript to the checkboxes, as below:

chkFirstCheck.Attributes.Add("onclick", "checkedChanged();")

Ok, now what is the expected behaviour?

Continue reading “Enabling/Disabling ASP.NET checkbox using JavaScript”

New search engine that is a snap to use!

Just browsed over to boingboing.net and saw a post about a new search engine.

First thought? Oh no, not another one!

Ok, well this one is called Snap. So, what is so special about snap that made me blog about it?

Well, one feature stands out above the rest. That is, it allows for quick, easy search refinements. (That means you can search through your search results!)

All done using JavaScript, good or bad? The loading time is slighty longer than Google. But the JavaScript based search refinement feature is quite useful.

Oh, and it doesn’t have multiple page search results. It’s all there on one page inside what looks like an Frame of some sort (with JavaScript based scrollbars).

Hotmail Calendar

For us free users of Hotmail they have now allowed us to have access to the Hotmail Calendar.

It’s a new feature, but one I don’t really see myself using terribly much, if at all. It also seems rather unstable at the moment.

I keep getting a 404 page not found, and then after a few refreshes, then I can actually get into it. Either that, or it’s just really slow.

Interesting, when you double click on the calendar it actually acts a bit like how the Outlook calendar reacts, it brings up a screen asking you to add a new appointment. Ah, just a bit of Javascript involved there.

Oh, and yes it does work in Firefox, just tried it.

Just noticed that i’m unable to see the “Date” part when i’m trying to add a new appointment to the Calendar using Firefox, but it is very much there in IE6.

Project Ideas – Simplify Javascript & Learn C# 2.0

At this stage I have two personal projects planned… As you can see in the post Title.

The first one which I just thought up over the weekend is all about simplifying JavaScript. There is a tonne and more JavaScript functions and scripts, if pulled together would make life a lot better for many web developers.

From experience I know JavaScript can include lines and lines of code to do certain things and from scratch could take forever to do. I want to change all that, I want to make it so all a user has to do is include the script .js file(s) and have access to a set of JavaScript that does one particular group of tasks…

Have it all broken up into .js files. One for each function area. Just need to sit down and think of what it is that is the most essential areas that needs to be included in each area.

Sort of like how .NET has their System.* namespaces, and Java has their java.* packages.

So using the above analogy we could perhaps have something like: JS.Window.js… JS.Integer.js

Inside the JS.Integer.js file you could have perhaps a function called IsInt(myVar)

Basically the implementation could be something like this:

function IsInt(myVar)
{
// test and validation code to see if it is an integer value.
// return a true or false depending on whether the variable is an int.
}

[Ok, i’m doing things quickly here, so no real implementation].

Now, anyone would be able to have access to all of the code. They can look at it to learn how things were done. And to perhaps provide feedback on certain areas.

They can also extend the existing functionality. They can write their own library like this one, whilst utilising what the core functionality has provided.

I haven’t really given this too much thought, but you should be able to get the idea of what i’m suggesting here. I really have no idea if anything like this has been done before. I should probably check it out.

What I want to do is create an entire JavaScript library which includes many of the great JavaScripts out there in an easy and consistent implementation. The important aspect of which is to encourage reuse.

One thing to remember is that JavaScript, along with StyleSheets are here to stay, even if the big thing at the moment is Server Side scripts which generate their own bit of JavaScript, thus requiring very to no JavaScript knowledge by the server side script author.

I know at my current job, sometimes I wish it was easier for JavaScript and ASP.NET 1.0/1.1 to get along. And I also wish JavaScript had a massive library which would allow me to do things that I can do easily in say, .NET Windows Forms such as Drag And Drop. Don’t get me wrong, I have seen some brilliant Drag and Drop implementations using JavaScript. But do you know how complex those things are?

There are probably a million and one JavaScript authors out there, which leads to many diffrent methods of doing the same thing. Why not somebody just tell them, hey, come over here with your great JavaScript scripts. I’ll give you all credit for the various scripts I make use into the final thing, with modifications to make everything very consistant. You then create a very simple IDE which has syntax highlighting and some basic intellisense and debug. You could probably just use something like C# Express 2005 to write it all up! (And hope that by the time you are finished, you’ll be able to release to public, and the framework is no longer in beta).

Ok, I seriously doubt that I’d get anything like what I just described done. I’ve not actually done too much JavaScript (recently). And what I have done has just been relatively simple JavaScript (opening popup windows, Javascript alert/input/confirmation boxes, etc… ). But it is something I’d really like to see done, someday. I think that perhaps what JavaScript offers right now is not enough for some developers.

A lot of code needs to be written to do what should be relatively simple. That is where something like what I have mentioned, the JavaScript library would come in handy. It’ll be like everyone who wants to do something with JavaScript will say, hey, I need to go download and use that JavaScript Library that is being used by all the really cool JavaScript developers. And then there is this massive rush of people heading off to download the JavaScript Library. Ah well.

A starting point for anyone who wants to do something like what I’ve just mentioned would be to go around to all those websites that offer a lot of JavaScript scripts for download. I’d probably start by asking the script authors whether or not you can use their scripts towards the project. And of course offer to them a credits page on the 1) project website 2) inside the code 3) in a little nice credits/readme file that comes with the scripts.

Free publicity for something you created in the past? Isn’t that what everyone wants? A little bit of publicity, and saying, hey, I contributed to that. I made that possible! Basically, bragging rights among friends/peers and so on.

And then all that needs to complete it is to implement some easy way to invoke certain functions through a server side sript. Eg: Through ASP.NET, ColdFushion, JSP, PHP etc…

Honestly, if anyone wants to do this let me know. I’ll provide all my ideas on this.

Ok, and the second part of the title suggests learning C# 2.0. Well, this one is going to be sort of a group project among myself and a few friends from uni. Yes, you can create stuff and learn at the same time, isn’t that amazing? Alright, well, the plan is to use the Managed Direct X libraries to implement some sort of simple game which makes use of C# 2.0 features such as Generics. I know that my friends like games, and most (if not all are quite good programmers), I feel like it would be important to get them to know more about generics and other features of the upcoming C# 2.0. These are guys I spent most of my time at uni with while doing projects. Knew all 3 of them since first year. We’ve all graduated now, and all working. 3 of us are programmers while the fourth is a tester.

Through this project I hope to sort of get everyone “knowledge sharing” as we all did during uni days. As well as to hopefully maintain a sort of bond with them all, and to not let the friendships made during uni to go astray.

I had always intended to get my head stuck into C# Express 2oo5 and checking out all the features and functionalities, but thought rather than just do it myself, drag the other friends in as well. This way we can all learn, and learn at the same time.

I had gotten responses from them all stating that they are always quite busy with probably only 2 or 3 hours a week to spare. I said that it would be fine. I don’t want to eat up too much of everyones’ time. It is not as though there are any set deadlines for this. And there is no immediate plan to release it. Hence it does not matter if there is no final product.

However, having said that, I do hope that myself and i’ll try to encourage the others, to blog about it. (Which reminds me, I need to encourage them all to setup a blog for themselves). I want to share what I learn from it with the rest of the blog reading world out there (the blogosphere/community).

I was having a thought about whether or not to enter the project into the Summer of Express contest being run over at Channel 9, but i’m leaning against it as this will not likely have a final product. Or if it does, may not be completed within the given timeframe.

I just had a thought, if it is so important for people to have a UI for SQL Express 2005. Why not just write one up using C# Express? I see many complaints about it around various blogs and forums. (Yes, i’m talking about the complaint in regards to the missing Server Explorer in Visual WebDeveloper Express 2005 Beta1).

I recall a remark on the aus-dotnet mailing list by Mark Jarzebowski stating that SQL Express 2005 to be a serious competitor to MS Access. I’ll tell you what, the missing thing there is you also want to have an MS Access like UI to make it really simple to use. And there you have it folks, something that can “almost” kill off MS Access.

Would anyone with a lot of time on their hands like to implement either the MS Access Killer or the JavaScript Library? I’d be very happy to hear what you guys and gals out there think about these two ideas. And I’d be even more delighted if someone decided to take up on the projects.

I have a lot of little projects that need to get done. One of them is to actually redo the entire domain. I need to make a new layout, put my resume back online. And start writing some tutorials/tips and tricks to fill up the whitespaces πŸ™‚