Web Programming for Radio Amateurs

The idea of writing this article occured to me on reading in RadCom of the difficulties one amateur was having with either converting his old BASIC programs to run in a current computing environment or rewriting then in a more modern language.

He is not the only person wth such a problem; the engineering industries have many so-called `legacy' programs which cannot easily be run on present day hardware, and whose authors have long since departed. While it is possible to find ways to make such programs run, it may be worth while spending the time to recode them in a more modern language, taking advantage of the better interaction and graphics facilites which these offer, and also taking the opportunity to generally improve the program.

Many people would choose to rewrite an older program as a spreadsheet. There are a number of reasons why I personally would not normally do this. One is that the spreadsheet concept was invented to replace the book-keeper's financial account book. This is not a good model for the `scientific' program which is more typical of what most engineers and radio amateurs wish to create. Another is that for any non-trivial computation spreadsheets are easy to get wrong and almost impossible to check or correct. If you would like to know more about this, see this link.

Furthermore, every computer now comes with a Web browser, and all browsers come with a very sophisticated programming language called JavaScript. This is a modern langauge which can do everything that can be done by the earlier scientific programming langauges, of which BASIC was the simplest example, and a great deal more.

In what follows I am assuming general familiarity with some of these earlier languages, and where I make comparisons I shall use BASIC as an example. If you are completely unfamiliar with any programming language, read this.

I shall also assume that you are using Windows, although it is not a very good programming environment. If you want to know why, see this. I would however suggest that if you are going to develop your own Web programs you do not use Windows Internet Explorer but obtain Mozilla or Netscape. All programs will run in Internet Explorer, but you will find it less than helful in telling you what went wrong if your program contains errors.

Getting Started

You will be looking at this page in a Web browser. First of all make the window about half the size of your screen. Make sure that your browser has `scripts enabled' - if you don't know what this means then they probably already are.

Now click this link.

A new window should have popped up with a message in it. You have just run a JavaScript program!

To do your own programming effectively you need to set one or two things up. First of all create a new folder to hold your work. You can do this on your Desktop, Give it a suitable name like `javascript'. Good programming hint: organise your workspace from the start.

Now download the example program from the link above by doing a right mouse button and `Save As' to put the program into your new folder which will be somewhere like C:\Windows\Desktop\javascript\. It will by default be given the name hello.htm.

Look into your directory. You should see the icon for the file you have just saved. If you see its full name including the .htm then you can skip the next step as you already have the appropriate option set. If the only part of the name you see is hello then you need to tell Windows to display full file names.

On the folder window top bar select:
View..Folder Options..
On the new pop-up window select View.
A few lines from the top you will see an option:
Hide extensions for known file types.
Make the box beside it blank.
Click OK

Editing your Program

You are now going to change this program. To do this you need to get it into Notepad.

If you are using Internet Explorer (OK for simple programs) all you need to do is to go to the View menu and select Source. In this case skip the next two paragraphs for the time being.

More generally you will want to open the file from the file manager window. You may be able to do this with a right button on the file icon and selecting Edit, or if you get an `Open with' choice (e.g. in Windows XP) choosing Notepad. However, Edit is likely to open the file in Word which is not suitable for editing programs.

One method that always works is to use the New option from the Folder background and create a New Text Document. Double clicking on this will open it in Notepad. Don't type anything into it but drag-and-drop the icon for hello.htm into it.

You will see that the program is as follows:

document.write("Hello world!")
I shall explain it all shortly, but just to show how convenient it is to change and rerun JavaScript in a browser, I suggest you alter the message, making sure that you only change things within the "..."s. (And also don't try to include a newline symbol.)

Now save the modified program using "Save As" and giving it a new name. Good programming tip: never change a working program. Make a new version. Now run the new program either by double clicking on the icon or by drag-and-dropping it into a browser window.

A JavaScript Program Explained

I suggest that for the future you resize both the main browser window and the Notepad window so that you can see both of then on the screen at once. Hint: make all windows as small as you conveniently can. Then you can see more different kinds of information at the same time. You can iconise the Folder window when it's not in use. It will be helpful to have a second browser window available (any demonstration program links will pop one up) but keep it iconised too when not in use. Close any other windows. Hint: Keep your workspace tidy and uncluttered,

Look at the program in the Notepad window. Just to make things initially a bit confusing, you are seeing two computer languages. Most of this file is in fact written in HTML. This is because it is a Web page and this is what is used to write Web pages. HTML is easily recognised because it uses things in <...>s. For the time being we can forget about HTML except to note that anything between the HTML instructions

<script> and </script> 
is not HTML but is our JavaScript program.

So we have a one line, one instruction program. The instruction is typical of what programmers sometimes refer to as a `procedure call'. This type of instruction causes a predefined and predetermined action to be carried out, but the program using the instruction can change how and/or what with the action is performed.

In this case:

This is obviously similar in many ways to BASIC where the word PRINT tells the program what to do and is followed by whatever is to be printed. BASIC also has the facility to write to different places, e.g. into files. The convention of putting the `where' before the action is perhaps an unfamiliar one. There are a number of reasons why JavaScript does this, but I won't go into them now.

Go on to learn more...