Archive of entries posted by Kris Gielen

Experimenting with Adobe AIR and jQuery – Part 1

Posted by on

A few days ago, I was at a TOP-100 party, where the dj’s played their 100 most favorite songs. The venue had a few large screens, that showed the number, the artist and the title of each song.
It looked like this:

Whenever the next song started, the new number, artist and title would appear, using some standard PowerPoint-like animation (wipes, blinds, checkerboard, …).

Trying to build something myself seemed like a nice opportunity to experiment with Adobe AIR and jQuery.

  • Adobe AIR is a framework to build rich Internet applications that run on the desktop.
  • jQuery is a “fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages”.

I am a heavy DreamWeaver user, so I had downloaded the Adobe AIR extension for Dreamweaver before. I had worked through the “Hello World” Getting Started demo successfully, but I hadn’t gone further with AIR yet, as I did not have a good experiment in mind. This TOP-100 app would change that.

The first step was to create an AIR application that would simply display the 3 elements on a screen: a number, an artist and a title.

The first step is to create a Site in DreamWeaver. I created the site “Top100” and a new file “step1.html” in it. I added the 3 elements and used some CSS to make it look like the example. This is the code:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Top 100: step 1</title>
<style type="text/css">
body, p {
    font-family:"Arial Rounded MT Bold", "Arial", sans-serif;
    font-size: 24px;
    color: #FFFF00;
    background-color: #3366FF;
    margin: 0;
    padding: 0;
    text-align: center;
}
#number {
    font-size: 12em;
    margin-top: 5px;
    margin-bottom: 10px;
}
#artist {
    font-size: 6em;
    margin-top: 5px;
    margin-bottom: 5px;
}
#title {
    font-size: 4em;
    margin-top: 10px;
    margin-bottom: 5px;
}
</style>
</head>
<body>
<p>
<div id="number">47</div>
<div id="artist">SEAL</div>
<div id="title">KISS FROM A ROSE</div>
</p>
</body>
</html>

The result in a browser was:

which looked pretty much like I wanted it.

The next step was to make this screen show in an AIR application. I will explain how that went in part 2.

♦ Related files: step1.html

Hello world!

Posted by on

More than a year ago, I started blogging. I have been using Google’s Blogger service, but ran into it’s limits a few times:

  • It is very difficult, if not impossible, to print pages with Firefox. It’s unclear why, but for longer topics, not everything is printed.
  • Uploading pictures is easy, but they always get inserted at the top of the edit box, which means you have to drag it down (or cut and paste) to the proper location.
  • I could not manage to get html code pasted properly to show some of the code I’ve been creating (and I’m not the only one)

So I finally decided to try WordPress. I downloaded it from WordPress.org and installed it on my webserver. Installation was quick and easy, and I have to say, it works like a charm! I’m impressed.

Obviously a couple of weeks of usage will confirm whether WordPress is better than Blogger, from what I’m seen so far, it looks great.

Fixing slow loading of attachments from Outlook

Posted by on

Do you experience a long wait when opening attachments from within Outlook? And the same file opens in a snap when you save the attachment first on your hard disk, launch the program and then open the file from within the program?

If you answered yes to all questions above, you probable have a DDE issue. DDE (short for Dynamic Data Exchange) allows applications to communicate with one another. For example, when you double-click a document in Windows Explorer, and the associated application is already running, Explorer sends a DDE message to the application, with instructions to open the document on its own, rather than launching another copy of the application. Sounds neat, no?

Well, on my machine, DDE has the tendency to get corrupted… or at least confused. I’m not sure why, but when that happens, it does cause significant delays in opening documents. Not only when launching it from Outlook, also when double-clicking a file in Windows Explorer.

The solution? Disable DDE for those file types that you have trouble with. Like Word, Excel and PowerPoint documents. This is the process:

  1. Start > Control Panel > Folder Options
  2. In the File Types tab, select the file extension you want to change (e.g. .doc for Word documents)
  3. Click the Advanced button
  4. Select the Open action, click Edit. You will get a dialog box like this:
  5. Uncheck Use DDE
  6. In the field Application used to perform action, you will see something similar to
    “C:\Program Files\Microsoft Office\OFFICE11\WINWORD.EXE” /n /dde
    Remove everything after the application (in this case /n /dde) and add “%1“. (Ensure you put %1 between double quotes (“), otherwise this might not work if the folder and/or filename of the document contains spaces).
    The field should now contain
    “C:\Program Files\Microsoft Office\OFFICE11\WINWORD.EXE” “%1”
  7. Click OK, OK, Close

That’s it. One final note: the DDE functionality gets restored when you re-install the application. But that will probably also fix the DDE issue itself, and if not, simply follow the instructions above again.