HTA – HTML Application with Basic!

Posted on Posted in Else - Just Tricks Tagged with , , , ,

Today I found out that there is a possibility to build nice applications with Visual Basic, using HTML and CSS in them. The technology is called HTA – HTML Application and it looks pretty much as an exe file with HTML, CSS and VB in it. Quite satisfactory.

In stead of JavaScript, you may use VBScript and have a really nice looking desktop application. A worthy one, if you know what you want to build. As far as I did not know, I have built a simple calculator, which sums numbers. To make it more interesting and being able to click the button more times with changing values, I have made the calculator to calculate an exponential function. This is the result before the first click:

calculate1

And after the second click:

calculate2

Pretty much how does it work? You should think that you are making a web app, the HTML and the CSS are there, just instead of JavaScript you have a VBScript.

And that is all. Here comes the code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<HTA:APPLICATION ID="VitoshAcademyExample" BORDER="thin" BORDERSTYLE="complex" maximizeButton="no" minimizeButton="no" />
		<title>Simple Strange Calculator for VitoshAcademy.Com</title>
	</head>
	<style>
		body {
			background-color: #b0c4de;
		}
		input{
			background-color: #aabbcc;
		}
		.btn {
		  background: #3498db;
		}

		.btn:hover {
		  background: #3cb0fd;
		}
	</style>
	<script language ="VBScript">
	Option Explicit
	dim multiply
	
	Public Sub Main()
		On Error Resume Next
			result.Value = cdbl(cdbl(number1.value)+cdbl(number2.value)+50)*multiply+1
			multiply = multiply*2+1
		if Err Then Msgbox ("Do not try to bug it!")
		On Error GoTo 0
	End Sub
	</script>
	<body>
		<table>
			<tr>
				<td>
					<input type="text" name="number1" size="20" value="5">
				</td>
				<td>
					<input type="text" name="number2" size="20" value="6">
				</td>
			</tr>
			<tr>
				<td >
				<input name="Button" class="btn" id="ButtonCalculate"  type="button" value="Calculate" onclick="Main()">
				</td>
			</tr>
			<tr>
				<td>
					<input type="text" name="result" value="Push The Button" size="20">
				</td>
			</tr>
		</table>
	</body>
</html>

Available in one of my repositories in GitHub as well.

Enjoy it!