• 0

JS-DOS: JavaScript Fake HTML DOS window


Question

Can someone help me with some JavaScript?

I'm working on a fake MS-DOS console. I've made most of the design so far but I need help with programming the prompts. Here's how I would like it to work:

post-15711-1247902882.gif

I've managed to restore the <blink> tag ;-) so that will help with an authentic look but ideally, I want the the user to be able to type anything in and his enter. When they do, a new line appears saying "Bad command or filename." and below that, the C:\> appears again and the user is able to continue to type stuff in. I would like to add commands like: "ver" or "dir" which shows some text as in the example above.

Here's the code so far, please copy/paste and try it out:

&lt;html&gt;
	&lt;head&gt;
		&lt;title&gt;JS-DOS&lt;/title&gt;
		&lt;meta http-equiv="Page-Enter" content="BlendTrans(Duration=0.25)" /&gt;
		&lt;meta http-equiv="Page-Exit" content="BlendTrans(Duration=0.25)" /&gt;
		&lt;link rel="shortcut icon" href="/dos/favicon.ico" /&gt;
		&lt;meta name="robots" content="noindex" /&gt;
		&lt;style type="text/css" media="all"&gt;
			BODY{
				BackGround:			Black;
				Color:				LightGrey;
				Font-Family:		Courier New, Courier;
				Font-Size:			12pt;
				Font-Weight:		Bold;
				Padding:			10px;
				Overflow:			Auto;
			}
			BLINK{
				Color:				LightGrey;
				Font-Size:			13pt;
			}
		&lt;/style&gt;
		&lt;script type="text/javascript"&gt;
		function Blink() {
		   for(i=0;i&lt;document.all.tags('blink').length;i  s=document.all.tags('blink];
			  s.style.visibility=(s.style.visibility=='visible')?'hidden':'visible';
		   }
		}
		setInterval('Blink()',500);
		&lt;/script&gt;
	&lt;/head&gt;
	&lt;body bgcolor="Black" scroll="Auto"&gt;
		C:\&gt;&lt;span id="Prompt"&gt;&lt;blink&gt;_&lt;/blink&gt;&lt;/span&gt;
	&lt;/body&gt;
&lt;/html&gt;

I've experimented with the following JS code but I've had litle success getting my dead around it:

		function ProcessKey(){
			var KeyID = event.keyCode;
			var Key = String.fromCharCode(KeyID);
			//document.getElementById("Prompt").innerText += Key;
			var _body = document.getElementsByTagName('body') [0];
			var _div = document.createElement('span');
			var _text = document.createTextNode(Key)
			_div.appendChild(_text);
			_body.appendChild(_div);
		}
		document.onkeyup = ProcessKey;

I'd appreciate any help. Thank you so much.

14 answers to this question

Recommended Posts

  • 0
  XgD said:
Forgot to say... I've only developed/tested in firefox. Others probably won't work.

Implemented commands:

ver

win

eval [javascript code]

Works on IE8, however eval comes back as undefined. Also comes back as undefined on Firefox 3.5.1.

I used to have a code that I found back in the '90s, that I modified that would end up using up so much memory that it would freeze your browser and most often crash your computer, it was all done through JavaScript; you had to press a button on a web page to activate it. Would love to find that code again and see what it would do on modern browsers and OSes.

  • 0

That's fantastic! Thank you :)

Can I ask how to make it so it's not limited to 24 lines? I know I was looking for authenticity but it would look cool if it just when all the way to the bottom on of the screen.

I've made the following mods:

<body bgcolor="Black" onload="init()" onKeyPress="return processKey(event)" scroll="no" style="OverFlow:Hidden">

<textarea readonly id="cmd" style="overflow:hidden; width:100%; height:100%; background-color: #000; color: white; font-family: Courier New; border: none;" onFocus="this.blur()"></textarea

Also, is it possible to add the BACKSPACE function in there to delete typed characters?

  • 0
  TonyLock said:
That's fantastic! Thank you :)

Can I ask how to make it so it's not limited to 24 lines? I know I was looking for authenticity but it would look cool if it just when all the way to the bottom on of the screen.

I've removed the line-limiting code

  Quote
I've made the following mods:

<body bgcolor="Black" onload="init()" onKeyPress="return processKey(event)" scroll="no" style="OverFlow:Hidden">

<textarea readonly id="cmd" style="overflow:hidden; width:100%; height:100%; background-color: #000; color: white; font-family: Courier New; border: none;" onFocus="this.blur()"></textarea

Added these changes

  Quote
Also, is it possible to add the BACKSPACE function in there to delete typed characters?

That code was already there (in Firefox). I've written some IE specific code to make sure that it actually works this time. Command history wasn't working either, but should be now.

XgD

  • 0

Nice job :)

I added these lines in BTW:

case "del": return processDel(parameters[0]);

and

function processDel(FileParam){

if(FileParam == undefined){

return "Please specify a file to delete.\n\n";

}else if(FileParam == "*.*"){

return "Yeah, right! You wish.\n\n";

}else{

return "Unable to delete that file.\n\n";

}

}

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • Not to sound ungrateful for your continued presence on Neowin (which I prefer) 😛  But would you consider a subscription to just have all the third party ads turned off by us? It's $2.33 per month for the ad-free subscription, but it is also there for assistance and support with all the running costs. Like everything, it is becoming increasingly harder to do this, we even try to offset it with Amazon affiliate commissions (if we could finance totally through that instead of ads, I would) 😛 
    • Honestly, I don't remember accepting or refusing cookies following a prompt, because I've accepted or refused cookies on several other sites. On the other hand, I remember seeing  ads, before the start of the available articles (on the home page), and on the right. If the trackers I've mentioned are part of the cookies I have to accept (as well as those below), trackers that are detected by my antivirus as adware during the weekly scan, they'll remain where they are. The vast majority of cookies blocked by the Host file were added by Unchecky. I'd say so, but are Doubleclick, Scorecardresearch, Opencandy, file2desktop, etc. among those that should be accepted? If not, then I'd say no.  
    • Are you suggesting Vivaldi isn't Chromium-based or that it isn't fast? In any case, Skyfrog seems more focused on customizability.
    • "They fear that this collaboration could significantly bolster China's AI capabilities" how long is this supposed to stop china?, 5 years and then become an AI giant?, china is gonna be as big as the US in AI in no time
    • yeah... I'm gonna say this aint tech news either, don't turn this site into the verge......
  • Recent Achievements

    • Week One Done
      jbatch earned a badge
      Week One Done
    • First Post
      Yianis earned a badge
      First Post
    • Rookie
      GTRoberts went up a rank
      Rookie
    • First Post
      James courage Tabla earned a badge
      First Post
    • Reacting Well
      James courage Tabla earned a badge
      Reacting Well
  • Popular Contributors

    1. 1
      +primortal
      403
    2. 2
      +FloatingFatMan
      179
    3. 3
      snowy owl
      172
    4. 4
      ATLien_0
      170
    5. 5
      Xenon
      135
  • Tell a friend

    Love Neowin? Tell a friend!