The webpage as wallpaper technique

[murderbus]

Hi everyone. I've been lurking for a while. Periodically I like to run this technique past people since it's not a really common approach to customizing one's desktop environment. I think it's pretty good, though.

The idea is to set the desktop background as a webpage. So what, you ask? Well, you can use javascript to imbed ActiveX controls, which means you can custom program desktop "widgets" in DHTML. It's really easy.

Here are some examples of what my desktop looks like:

Here is a .rar which contains all of the files that you need to make this possible:

desktop.rar

In the RAR is a .reg file which you have to run to disable activeX warnings on your desktop. You don't NEED to run it, but it's annoying not to. Please note: this ONLY disables the warnings for web pages run locally. You DON'T NEED TO WORRY about this disabling your security when you're surfing the web, only if you download a malicious web page MANUALLY and run it. Which will never happen.

Just unpack the folder to D:\Desk2, run the .reg file, and then set desktop.html as your background. If you don't have a D: drive, it will still work, but you have to edit the HTML and replace the places where it says "D:\" with "C:\". You will also need to edit "\txtfiles\lastfile.txt" and "\scripts\desktop.css". Trust me, it will be TOTALLY OBVIOUS how to do this. There are about 13 instances of "D:\" at the very top of the html file, and the css and txt file are pretty obvious, too.

This isn't really a template for a desktop, it's more of an example. I have very limited javascript knowledge (though I know C++), and I cobbled this together from online code examples and a little trial and error. You can customize this however you want.

I have another much more complex example with embedded search functions and command prompt. Maybe I will upload that in a little bit. Enjoy!

[murderbus]

So it looks like not many people will care, but I updated the code substantially. Now you only have to change THREE directories to get it to work on your computer.

Desktop2.rar is the new version.

Here are the lines you must change: The first is at the VERY top of "desktop.html". I highlighted it with comments. The next (the background) is in \scripts\desktop.css at the VERY TOP. The final instance is \txtfiles\lastfile.txt. I added some extra comments, too, and fixed a minor bug in text-file read-in and read-out, so everything will work perfectly smoothly now.

As before, you can edit the layout and style easily and intuitively with desktop.css.

Is there any interest in more complex desktop widgets? I programmed a calendar, as well as imbedded search functions and a command prompt.

Edited May 12, 2008 by murderbus

[Dave.Net]

It's very interesting, pal. Let's just say you didn't choose the most visual-appealing example to get people into it.

[murderbus]

Haha - you're right. The background is kind of a joke.

I'll try posting another example later tonight.

[murderbus]

Here's a slightly more visually appealing example. Notice on the bottom-left there are text entry bars - just type something in and hit enter to open a browser with the specific search or run a console command. Bottom-right is the calendar.

The layout still isn't stellar in this example, but you get the idea. I made drop-down menus but they're not in this version, though there's an included dropdown.js you might be able to figure out if you were motivated.

desktop3.rar

Background theme here is "Anorganic". Anyone else program their desktop in this way using HTML / Javascript?

Edited May 14, 2008 by murderbus