META tags: What they are and how they work
Stop! Is Your HTML Document Valid?
HTML #5 - Using feedback forms
HTML #4 - Advanced Page Layout
You are here: irt.org | Articles | HTML | Internet Explorer As A Development Platform? [ previous next ]
Published on: Sunday 7th November 1999 By: Ryan Detert
Windows now features a full line of Development Systems and Studios to make life easier for the Windows Programmer. These studios rely on and take advantage of the same Dynamic Link Libraries(DLL's) and Microsoft Foundation Classes(MFC's) that Windows uses. This adds efficiency and saves on hard-disk space. Visual C++ is one such Windows Development System. Ironically, newer versions of Windows are coded using Visual C++. How interesting this is, Windows uses itself to re-create itself. It's almost like a new breed of organisms! Actually, this is a sign of a very good, complete operating system. Many systems (i.e. programming langauges) are able to use themselves to generate newer versions.
Internet Explorer has evolved a significant amount since its version 3.0 was introduced a few years back. Dynamic HTML is equipped with its own hierarchy, programming languages, you name it. You can almost run your computer with it. Now what if we took the DHTML in IE and used it to re-create IE. Is this possible? Of course it is, using the new HTML Applications (HTA's) that Internet Explorer 5.0 now supports.
The HTML Application (HTA) is just like any ordinary HTML document that you would use in a web page, it can use the exact same code. The only difference is that an HTML Application runs just like an executable (.exe) file and does not need the browser open to run! Crazy isn't it? You can now create Windows Applications using HTML and scripting code!
HTA's can do anything a web page can do plus it has added functionality. The user can re-configure how the window looks and HTA's are viewed by the operating system just as any regular executable file (.exe). With this, HTA's are trusted formats that are not subject to security issues that you will find in web pages. You have the option of ditching the complicated antics of Visual C++ and instead use DHTML to code an executable file.
HTA's will only read what is specified within the Explorer's native DOM. In other words, you cannot use the external property to access foreign heirarchies like you can with an HTML document viewed in Explorer.
All that you have to do to make an HTML Application is simply change the extension on an HTML file to that of .HTA. You may add some special syntax in the <HEAD>, which we will discuss, but HTA's are very forgiving and all you really need is text. For example, look at the code for the following two HTA files, they are both valid HTA's:
This is an HTML Application, just text, that's it!
<html> <body> This is an HTML Application, just text, that's it! </body> </html>
In good practice, you should use the <HTA:Application> element in the <HEAD> of each HTML Application. This new element contains attributes that will allow you to customize the appearance of the HTA window. These attributes may be written using inline HTML and read (and sometimes written as well) with scripting. Though we will cover the attributes of this new element in detail, a general HTML schematic with all attributes and possible values attained from Microsoft's site looks like this:
<HTA:APPLICATION
ID=value
APPLICATIONNAME=value
BORDER=thick | dialog | none | thin
BORDERSTYLE=normal | complex | raised | static | sunken
CAPTION=YES | NO
ICON=path
MAXIMIZEBUTTON=YES | NO
MINIMIZEBUTTON=YES | NO
SHOWINTASKBAR=YES | NO
SINGLEINSTANCE=YES | NO
SYSMENU=YES | NO
VERSION=value
WINDOWSTATE=normal | maximize | minimize
>Allows you to name the <HTA:Application> element so that you may read or write its attributes via JScript.
Names the HTML Application. The value entered here is NOT the one that will display in the title bar. When numerous HTA's are open at the same time the operating system refers to each instance based on this attribute. Read-only Scripting Syntax: [sApplicationName] = appId.applicationName
Defines the type of border around your application. Possible string values using inline HTML are:
Read-Only Scripting Syntax: [sBorder] = appId.border
Sets the appearance of the window border. Possible string values using inline HTML are:
Read-Only Scripting Syntax: [sBorderStyle] = appId.borderStyle
Defines whether or not the application will have a title bar. If there is no caption the minimize/maximize buttons, title, and icon will not appear. Possible string values using inline HTML are:
Read-Only Scripting Syntax: [sCaption] = appId.caption
Specifies a path to a .ico file (32 x 32 pixel bitmap file) to be used as an icon to appear in the upper left-hand corner of the application. If no path is specified, or the path is not valid, then a default system icon of some sort will be displayed. To make a Windows icon file (.ico) you may either download an editor of some sort like IfranView32 or simply create a bitmap file (.bmp) that is 32x32 pixels and then change the .bmp extension to .ico.
Read-Only Scripting Syntax: [sPath] = appId.icon
Defines whether or not a maximize button will be diplayed in the caption (title bar). Possible string values using inline HTML are:
Read-Only Scripting Syntax: [sMaximizePresent] = appId.maximizeButton
Defines whether or not a maximize button will be displayed in the caption (title bar). Possible string values using inline HTML are:
Read-Only Scripting Syntax: [sMinimizePresent] = appId.minimizeButton
Defines whether or not the HTML Application will appear in the Windows taskbar alongside the START button. No matter what, the HTML Application will still be visible after pressing ALT+TAB. Possible string values using inline HTML are:
Read-Only Scripting Syntax: [sShow] = appId.showInTaskBar
Defines whether multiple instances of the HTML Application will be allowed. Possible string values using inline HTML are:
Read-Only Scripting Syntax: [sSingleInstance] = appId.singleInstance
Defines whether a standard Windows system menu will be present. Possible string values using inline HTML are:
If this value is set to yes, click the HTA's icon to display the system menu. It will include such listings as Restore | Move | Size | Minimize ...etc.
Read-Only Scripting Syntax: [sSysMenuPresent] = appId.sysMenu
Defines the version number of your HTML Application. The default value is an empty string.
Read-Only Scripting Syntax: [sVersion] = appId.version
A read-or-write property that sets/retrieves the current state of the window. Possible string values using inline HTML or JScript are:
Read-or-Write Scripting Syntax: [sWindowState] = appId.windowState = [sWindowState]
Retrieves the string used to launch the HTML Application. An empty string will be returned if the HTA is launched via an HTTP protocol.
Read-Only Scripting Syntax: [sPath] = appId.commandLine
HTML Applications may also be defined within the FRAME and IFRAME elements of an HTML document viewed within Explorer. Within the framesets simply add the APPLICATION attribute and assign it a string value of either yes or no (default). For example, <IFRAME APPLICATION="yes" SRC="myPage.html">.
If set to yes the frame will be treated as an HTA within the browser and will not be subject to security restrictions, and vice versa. If you want nested frames to be treated as applications as well, each nested frame and parent frame must contain an APPLICATION attribute set to yes.
As a security precaution, FRAMES and IFRAMES that are not-trusted (APPLICATION="no") are forbidden from interacting with the trusted frames through scripting.
Making a web browser using C++ has taken thousands of experts years to try and perfect. However, in the next example, we will make a fully-functional web browser in minutes using DHTML and JScript.
<html>
<head>
<title>Web Rover</title>
<style>
.clsButton {font-family: Arial;
font-size: 10pt;
background-color: #E0EDFF;
color: #0000FF;
}
</style>
<HTA:APPLICATION
ID = "myRover"
APPLICATIONNAME = "Web Rover"
BORDER= "thick"
BORDERSTYLE = "complex"
CAPTION = "YES"
ICON = "rover.ico"
MAXIMIZEBUTTON = "YES"
MINIMIZEBUTTON = "YES"
SHOWINTASKBAR = "YES"
SINGLEINSTANCE = "NO"
SYSMENU = "YES"
VERSION = "1.095"
WINDOWSTATE = "maximize"
>
<script language="JScript">
var historyLoc = 0;
var blank = new Array(" ");
var theHistory = new Array("http://www.irt.org");
function goBack(){
if(historyLoc == 0) return false;
document.all.webDoc.src = theHistory[--historyLoc];
theURL.value = theHistory[historyLoc];
}
function goForward(){
if(historyLoc == theHistory.length - 1) return false;
document.all.webDoc.src = theHistory[++historyLoc];
theURL.value = theHistory[historyLoc];
}
function goThere(){
if(theURL.value.indexOf("://") == -1)
theURL.value = "http://" + theURL.value;
if(historyLoc == theHistory.length - 1)
theHistory = theHistory.concat(blank);
document.all.webDoc.src = theHistory[++historyLoc] = theURL.value;
}
</script>
</head>
<body>
<table border="0" width="100%"><tr>
<td><input type="button" id="BB" class="clsButton" value="Back" onClick="goBack()">
<input type="button" id="FB" class="clsButton" value="Forward" onClick="goForward()">
<font color="blue">url:</font> <input type="text" id="theURL" value="http://www.irt.org/" style="width: expression(document.body.clientWidth - BB.offsetWidth - FB.offsetWidth - 150)" onKeyPress="if(window.event.keyCode == 13) goThere();">
<input type="button" class="clsButton" style="font-Weight: bold" VALUE=" Go! " onClick="goThere();"></td>
</tr></table>
<iframe src="http://www.irt.org/" id="webDoc" style="height: 95%; width: 100%; border-style: 1 inset black"></iframe>
</body>
</html>With the introduction of Internet Explorer 5.0, it is now possible to use HTML code and scripting languages to create an independent Windows application that does not need the browser to run. The HTA format is a trusted format that is not subject to security restrictions that web pages have. The same elements used in web pages via HTML can now be implemented and converted into full-fledged Windows application.
A plethora of information on HTA's can be obtained from Microsoft's site. All specifications in this article were taken directly from the following site:
META tags: What they are and how they work
Stop! Is Your HTML Document Valid?
HTML #5 - Using feedback forms
HTML #4 - Advanced Page Layout
HTML #3 - Making your Web pages more exciting