How to create Auto-Update extensions Support

No more exchange lurking!

Introduction
Are you one of those insane characters that can be seen lurking about in the shadows by the Macromedia Exchange? Waiting............some people would say stalking...............for the next extension for Dreamweaver and UltraDev.

If you are then this extension could change your life and pull you back into normal society........Welcome to the Auto-Update extension!

Auto-Update (beta 1) your extensions.
Although this extension is aimed at the extension developer I think you'll agree that the end user can also benefit greatly by having input into it's development. Created by Paul R Boon ( Public Domain Ltd ) it gives the extension developer a way of directly linking with users to offer them the latest versions of his/her work.

By simply going through a wizard and uploading content to a web server you can feed your own extension community from one centralised place. You can quickly apply bug-fixes and make them instantly available, not to mention the possibilities for commercial extensions.

At the moment the update can be activated when the extension has loaded, or triggered by the user. Requests for other options can be seen on the Auto-Update (beta 1) Forum on Udzone.

Show me it in action then?
If you are not a developer but would like to see the extension in action then simply download my completed Set Server Timeout extension, install it (make a note of it's version number in the Extension Manager!), run the update and then check the version number again :)

If you agree with me that this is pretty awesome and have any requests, questions, bugs or would simply like to know more then check out both the Auto-Update (beta 1) page and the Auto-Update (beta 1) Forum on UDzone.

How's it done?

As with everything the easiest way to learn is to have a go. First of all download Auto-Update, a copy of my old Set Server Timeout extension and it's code. Unzip the code into a directory, install the Set Server Timeout and the auto-update extension and we're ready to go :) The auto-update extension works by integrating it's code into our own extension. We then update the extension code to create a new version, and finally upload our new extension code to our server which makes it accessible for all users.

First, we need to integrate the code from the auto-update extension into our already created Server Behaviour. As the updating will be done from our extensions interface we need to load this into DW/UD. Open up the Set "ServerTimeout.htm" file from the ServerTimeout_v1.0 directory and then runCommands > Create Auto-Updateto launch the auto-update process.

Screen one simply asks for your extension details. However, you cannot give the auto-update extension code the same name as your extension! This restriction is because all files created have to reside in one directory on the server for the update to work. Normally in DW you can use files with the same name in different folders for your extension, because they now all have to be put in the same folder on the server you can't. My extension is called "Set ServerTimeout" and my update code will be called "Set Server Timeout" (notice the extra space!).

Next we need to give the location of where we will store our extension remotely by providing the server address and directory (you can enter your own server details here! ).

Now we need to add all the files that make up the extension we are applying the auto-update to. If we load our "Set_ServerTimeout.mxi" file into our editor we can use this to find the Install Path for our extension files.

For each file from the ServerTimeout_v1.0 directory select it by using the Browse button and then give it it's install directory. This is simply telling the auto-update extension builder where each element of our own extension should go when we are updating it from the remote server. Once you have added your file information hit the OK button which will take you back to the Add Files dialog.

At present (beta 1) the "-" icon on the Add Files page does not work!

Notice that we have also included our mxi file that we use to create the extension with. We need to add this to the installation process to ensure that the Extension Manager will also be updated with the right information and stay in-sync. All installed extensions have their mxi file installed into the following directory:

<your DW/UD install directory>\Configuration\Extensions\

Next we give a location for the auto-update code to be installed. As we have already installed v1.0 of our Set Server Timeout extension we can see the following directories within our DW/UD configuration folder.

<your DW/UD install directory>\Configuration\Shared\Ultra-Dumb\

We will use this to store our code by adding a new directory called "autoupdates". Add this to your file directory like so:

<your DW/UD install directory>\Configuration\Shared\Ultra-Dumb\autoupdates\

Now go back to DW/UD and give this as the storage location for our auto-update code.

Finally we get the auto-update extension to insert all the right code for our Set Server Timeout interface.

If we now take a look at the "Set Server Timeout.htm" file we can see that it now contains the auto-update code :)

However, it has given the script source location on line 70 an absolute path that won't be relevant when the new extension has been installed on another machine. We need to set this to be relative to it's installed position.

What we need to do now is give the user a way of activating the update procedure! We'll create a new icon for our extension, add this to the interface and link it to the auto-update javascript code. We will have to do is repackage the extension after we have added this.

Split the cell containing the Ultra-Dumb logo and place the new update icon next to it. Add the icon and then set the right path for it which is based on it's location when the extension has been installed. We can see what path to use by viewing the source location of the "ud_logo.gif" file :) Finally set an onMouseDown event to the image which will activate the auto-update procedure.

<img src="../../../Shared/ultra-dumb/downloads/Tutorial_auto-update.zip/images/update_anim.gif" alt="update_anim" width="50" height="31" border="0" onMouseDown="autoUpdateExtension()">

After saving "Set Server Timeout.htm" repackage the whole extension with the new autoupdate code and images we have just included. Copy the code from the autoupdates directory to our unzipped ServerTimeout_v1.0 directory ready for repackaging :)

Fire up your favorite text/html editor and load the "Set_ServerTimeout.mxi" file into it. The 3 new files we have to package are as follows:

autoupdate.js
Set Server Timeout.xml
update_anim.gif

Add them to your mxi file like so:

Notice that we are making the "autoupdate.js" and "update_anim.gif" shared files! Whilst we have the mxi file open you can also check the version number located on line 3.

Finally, we have to add the above 3 files to our "Set Server timeout.xml" code to ensure these are updated as well :) Open this file in your editor and add the following lines.

Before we repackage our extension lets just go back to our shared files location and remove the "autoupdates" directory that was created. We do this to make sure that all our extension code is installed properly :)

<your DW/UD install directory>\Configuration\Shared\Ultra-Dumb\

Lets open up the Extension Manager and repackage our extension then install it into DW or UD :) If we run the extension and click on the update icon we should see the following error. We have not set up our remote files on our server yet!

By using an FTP client log-on to our remote server and upload all the files for our extension to the location we specified earlier. In my example I am uploading all these file's:

To this full location: www.ultra-dumb.co.uk/tutorials/autoupdate/code/

They have to be put into one directory on the server!

If we now try to update our extension we will get a pop-up notifying us that we already have the latest version.

To simulate an update we will simply adjust our extensions version in the mxi file and our auto-update xml file. We won't actually alter the extension's functionality but just test that everything is working fine :)

Make a copy of "Set_ServerTimeout.mxi" and "Set Server Timeout.xml" files. Open up the mxi file first and alter line 3 to read as follows:

version="1.1"

Then open "Set Server Timeout.xml" and set the extension-version tag to:

<extension-version value="1.1" />

Now upload these 2 files to our remote server (over write the ones on the server!) and then activate the update procedure!

You'll be notified that a newer version of the extension is available and asked if you wish to update. If you agree you will then be asked to download the files.

Yippee!!! We now have a updateable extension. Any new code changes can be simply updated to the server giving the user the power to have the latest version always installed :)

Conclusion.
I think you have to admit that this can give developers some real power when creating extensions. New features requested include password protection and FTP transfers. If after playing with this and have some ideas, requests or questions then why not submit them to the forum on UDzone.

This was brought to you by a Web Chimp @ Ultra-Dumb [ you can download this tutorial and all related code here! ]