{"id":88,"date":"2009-07-17T13:53:30","date_gmt":"2009-07-17T17:53:30","guid":{"rendered":"http:\/\/www.northatlantawebdesign.com\/?p=88"},"modified":"2009-07-27T10:05:59","modified_gmt":"2009-07-27T14:05:59","slug":"hta-progress-bar-using-vbscript-and-javascript","status":"publish","type":"post","link":"https:\/\/www.northatlantawebdesign.com\/index.php\/2009\/07\/17\/hta-progress-bar-using-vbscript-and-javascript\/","title":{"rendered":"HTA Progress Bar using VBScript and JavaScript"},"content":{"rendered":"

I was informed after my last post<\/a> that using HTA<\/a> (HTML Applications) to display a progress bar in VBScript<\/a> is much more efficient than using InternetExplorer.Application within a VBScript. Having never used HTA before, I immediately set out to learn a bit and see what I could come up with.<\/p>\n

My initial thoughts are mixed, as you can not run and interact with an HTA from a VBScript file<\/strong>.\u00a0 This requires you to wrap your VBScript code in whatever HTML Application you are writing. This greatly limits re-usability, enough so that the increase in performance may not warrant using an HTA for a progress bar in most cases.
\n
\nI would like to note that this is a first draft of this script, and I may update it in the future, if I deem HTML Applications the way to go.\u00a0 As for now, I am not convinced.<\/p>\n

\r\n<html>\r\n<head>\r\n\t<title>HTA Progress Bar<\/title>\r\n<script language="vbscript">\r\n'This script resizes and moves the window to the center of the screen.\r\n'The placement of this code above the HTA definition, moves the window\r\n'before the script is visible. \r\nheight = screen.height\r\nwidth = screen.width\r\nmoveto width\/2 - 335\/2,height\/2 - 200\/2\r\nresizeto 335,200\r\n<\/script>\r\n\t<HTA:APPLICATION ID="oMyApp"\r\n\t\tAPPLICATIONNAME="monster"\r\n\t\tSINGLEINSTANCE="yes"\r\n\t\tBORDER="thin"\r\n\t\tMAXIMIZEBUTTON="no"\r\n>\r\n\r\n<script language="VBScript" type="text\/vbscript">\r\n'This is where your VBScript logic should go.\r\n' Call OpenProgressBar to open the progressbar\r\n' Call UpdateLog to update the logging window\r\n' Call UpdateProgressBar to move the bar\r\n' Call CloseProgressBar to return to your main UI window\r\nSub BeginImportingFiles()\r\n\tDim i\r\n\tOpenProgressBar()\r\n\tUpdateLog "Step 1 of 2", ""\r\n\tFor i = 1 to 10\r\n\t\tSleep 100\r\n\t\tUpdateLog "Next Step", "" & Time()\r\n\t\tUpdateProgressBar i*10, "Step 1 of 2"\r\n\tNext\r\n\tUpdateLog "Step 1 of 2", "Complete"\r\n\tSleep 2000\r\n\tCloseProgressBar()\r\nEnd Sub\r\n\r\nSub Sleep(MSecs) \r\n\tSet fso = CreateObject("Scripting.FileSystemObject")\r\n\tIf Fso.FileExists("sleeper.vbs")=False Then\r\n\tSet objOutputFile = fso.CreateTextFile("sleeper.vbs", True)\r\n\tobjOutputFile.Write "wscript.sleep WScript.Arguments(0)"\r\n\tobjOutputFile.Close\r\n\tEnd If\r\n\tCreateObject("WScript.Shell").Run "sleeper.vbs " & MSecs,1 , True\r\nEnd Sub\r\n\r\n<\/script>\r\n<script language="JavaScript" type="text\/javascript">\r\nfunction OpenProgressBar()\r\n{\r\n\tdocument.getElementById("gui").style.display="none";\r\n\tdocument.getElementById("progressbargui").style.display="block";\r\n}\r\n\r\nfunction UpdateLog(text, status)\r\n{\r\n\tvar log = document.getElementById("log");\r\n\tif(status && status != "")\r\n\t{\r\n\t\tvar maxLength = 33;\r\n\t\tvar dotlength = maxLength - (text.length + status.length);\r\n\t\tvar dots = "";\r\n\t\tfor(i = 0;i<dotlength;i++)\r\n\t\t\tdots += ".";\r\n\t\tlog.value += text + dots + "[" + status + "]\\n";\r\n\t}\r\n\telse\r\n\t\tlog.value += "[" + text + "]" + "\\n";\r\n\tlog.scrollTop = log.scrollHeight;\r\n}\r\n\r\nfunction UpdateProgressBar(percentComplete, title, status)\r\n{\r\n\tfor(i = 1; i <= 100; i++)\r\n\t{\r\n\t\tif((percentComplete) >= i)\r\n\t\t\tdocument.getElementById("pbar"+i).className = "pbarcomplete";\r\n\t\telse\r\n\t\t\tdocument.getElementById("pbar"+i).className = "pbar";\r\n\t\tdocument.title = title && title != "" ? title : percentComplete + "% Complete";\r\n\t\tdocument.getElementById("progresstitle").innerText = status && status != "" ? status : percentComplete + "% Complete";\r\n\t}\r\n}\r\n\r\nfunction CloseProgressBar()\r\n{\r\n\tdocument.getElementById("gui").style.display="block";\r\n\tdocument.getElementById("progressbargui").style.display="none";\r\n\tUpdateProgressBar(0,"","");\r\n\tdocument.getElementById("log").value = "";\r\n}\r\n<\/script>\r\n<script language="VBScript" type="text\/vbscript">\r\n'Progress Bar Logic\r\n<\/script>\r\n<style type="text\/css">\r\nbody,html {\r\n\tmargin:auto;\r\n}\r\ndiv#progressbar{\r\nborder:1px solid #ccc;\r\nmargin:0px;padding:0px;\r\n}\r\nspan.pbar{\r\n\twidth:3px;\r\n\tmargin:0px;\r\n\tpadding:0px;\r\n\tborder-left:1px solid #fff;\r\n\tbackground:#fff;\r\n\tline-height:5px;\r\n\theight:16px;\r\n\tfont-size:2px;\r\n}\r\nspan.pbarcomplete{\r\n\twidth:3px;\r\n\tmargin:0px;\r\n\tpadding:0px;\r\n\tborder-right:1px solid #ccc;\r\n\tbackground:green;\r\n\tline-height:5px;\r\n\theight:16px;\r\n\tfont-size:2px;\r\n\t\r\n}\r\ntable {\r\n\twidth:100%;\r\n\theight:100%;\r\n}\r\ntable td {\r\n\ttext-align:center;\r\n\tvertical-align:center;\r\n}\r\ntable td.progressbargui {\r\n\tdisplay:none;\r\n\tvertical-align:top;\r\n}\r\ntextarea#log{\r\n\twidth:100%;\r\n\theight:100px;\r\n\tborder:1px solid #aaa;\r\n}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n<table>\r\n<tr>\r\n\t<td id="gui"><input type="button" onclick="BeginImportingFiles()" value="Begin File Import"\/><\/td>\r\n\t<td id="progressbargui" class="progressbargui">\r\n\t\t<div id="progresstitle">&nbsp;<\/div>\r\n\t\t<div id="progressbar">\r\n\t\t<script type="text\/javascript">\r\n\t\tfor(i = 1; i <= 100; i++)\r\n\t\t\tdocument.write("<span id=\\"pbar" + i + "\\" class=\\"pbar\\"><\/span>");\r\n\t\t<\/script>\r\n\t\t<\/div>\r\n\t\t<textarea id="log"><\/textarea>\r\n\t<\/td>\r\n<\/tr>\r\n<\/table>\r\n\r\n<\/body>\r\n<\/html>\r\n\r\n<\/pre>\n
Some potentially useful links dealing with HTA:<\/p>\n