Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 20
  1. #1
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How can I create a fake shell command line that looks like this?

    I really love the thought of having a JavaScript shell command line but I only know php, mysql, html, and css. I've never really liked JS cause it differs from browser to browser.

    But anyways how can I create a very simple basic fake shell command line like this real one located here: TermShell

  • #2
    Regular Coder
    Join Date
    May 2012
    Location
    France
    Posts
    224
    Thanks
    0
    Thanked 32 Times in 30 Posts
    You prefer probably to write javascript with PHP to insert malicious addresses !
    Last edited by 007julien; 12-01-2012 at 03:49 PM.

  • #3
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Can you give an example of how to create a simple shell demo like the one in the link I provided?

  • #4
    New Coder donna1's Avatar
    Join Date
    Nov 2012
    Location
    london
    Posts
    99
    Thanks
    9
    Thanked 4 Times in 4 Posts
    i only know javascript. i can make a fake shell just like that using canvas and context.text command in html5.
    Why do you want a Fake shell? to trick someone into entering a password?

  • #5
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by donna1 View Post
    i only know javascript. i can make a fake shell just like that using canvas and context.text command in html5.
    Why do you want a Fake shell? to trick someone into entering a password?
    Well I want you to do it in JavaScript, and no I'm not a bad person wanting to steal someones stuff.

    I'm wanting to make my website to be a shell terminal where the user has to type in commands to go to different pages or to submit stuff so it will make it seem like they are on a computer terminal.

  • #6
    New Coder donna1's Avatar
    Join Date
    Nov 2012
    Location
    london
    Posts
    99
    Thanks
    9
    Thanked 4 Times in 4 Posts
    Try this as a start
    Code:
    <!DOCTYPE HTML>
    <html>
    <body>
    <canvas id="myCanvas" width="800" height="600">>Your browser does not support the canvas tag.</canvas>
    <script>
    var canvas = document.getElementById('myCanvas');
    var ctx = canvas.getContext('2d');
    var cursorOn=1,cursX=10, cursY=30;
    var textColor ="lawngreen";
    
    function displayTerm(){
     ctx.fillStyle  = "black";
     ctx.fillRect(0,0,500,500);
     ctx.fillStyle = textColor;
     ctx.font = "12px Courier New";
     type("JESTER/UIX 1.9.4  starting up ...");
     newline(2);
     type("Login: "); 
    }
    
    function newline(n){
     cursX=10; cursY+=15*n;
    }
    
    function type(string){
     ctx.fillText(string,cursX,cursY);
     cursX+=string.length*8;
    }
    
    function flashCursor(){
     if(cursorOn==1) {ctx.fillStyle = textColor; ctx.fillRect(cursX,cursY-11,7,14);}
     else {cursorOff();}
     cursorOn=-cursorOn;
    }
    
    function cursorOff(){
     ctx.fillStyle = "black";
     ctx.fillRect(cursX,cursY-11,7,14);
    }
    
    
    function doKeyDown(evt){
     cursorOff();
     if(evt.keyCode==13){ newline(1); return;}
     ctx.fillStyle = textColor;
     ctx.fillText(evt.keyCode,cursX,cursY);
     cursX+=8;
     if(cursX>480) {newline(1);}
    }
    
    displayTerm();
    window.addEventListener('keydown',doKeyDown,true);
    setInterval('flashCursor()',500);
    
    </script>
    </body>
    </html>
    Last edited by donna1; 12-03-2012 at 04:43 PM.

  • #7
    New Coder donna1's Avatar
    Join Date
    Nov 2012
    Location
    london
    Posts
    99
    Thanks
    9
    Thanked 4 Times in 4 Posts
    Help!
    The above code seems to print the Ascii value of the keystrokes rather than the character, can anybody tell me where I went wrong?
    Ta

    Try the demo here
    http://donoi.hostoi.com/term.html
    Last edited by donna1; 12-03-2012 at 10:10 AM.

  • #8
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,343
    Thanks
    11
    Thanked 589 Times in 570 Posts
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    	<title>terminal</title>
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    	<meta name="description" content="" />
    	<meta name="keywords" content="" />
    	<meta name="author" content="dandavis" />
    <style type='text/css'>
    	:Focus { outline: none; }
    	body, html { margin: 0px; padding: 0px; color: #fff; background-color: #111; font-family: georgia;}
    	textarea, input { color: #bfb; background: #111; font-family: 'Lucida Console', monospace;  padding: 0;
    				width: 98%;  margin: 1em; border: 1px solid #000; overflow: hidden; }
    	
    </style>	
    </head>
    	<body>
      
    
    
    
    
    <textarea rows='40' cols='110' id='view' ></textarea>	
      
    
    <form onsubmit="render(line.value); return false;">
      
    	<datalist id='hist'></datalist>
    
      <input value='Object.keys(window)' type='text'  id='line'  autofocus tabindex=1 list='hist' />	
    </form>
    
    
    
    <script type='text/javascript'>
    
    commands={
    
     cls: 	function cls(){ setTimeout("view.value='';",0); },
     date:	function(){return new Date().toISOString(); }
     
    }
    
    
    commands.ls=Object.keys.bind(Object, commands);
    
    
    
    function propToMethod(){
    
    
    }
    
    
    function render(code){
    	hist.appendChild(new Option(code));
    	var rez="";
    	try{ 
    			rez=eval("with(commands){"+(code||'')+"}");
    		
    	}catch(y){
    		rez=y;
    	}
    		
    	if(typeof rez==='function'){ rez=rez();}
    	view.value+="\n\n JS:>"+ code+"\n" +  JSON.stringify(rez, null, "\t")+"\n";
    	if(view.value.length>5000){ view.value=view.value.slice(-5000); }
    	view.scrollTop=9e9;
    	line.select();
    	line.focus();
    }
    
    
    
    window.onload=render(render+"; 'ready!' ");
    
    </script>
    </body>
    </html>
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #9
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by rnd me View Post
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    	<title>terminal</title>
    	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    	<meta name="description" content="" />
    	<meta name="keywords" content="" />
    	<meta name="author" content="dandavis" />
    <style type='text/css'>
    	:Focus { outline: none; }
    	body, html { margin: 0px; padding: 0px; color: #fff; background-color: #111; font-family: georgia;}
    	textarea, input { color: #bfb; background: #111; font-family: 'Lucida Console', monospace;  padding: 0;
    				width: 98%;  margin: 1em; border: 1px solid #000; overflow: hidden; }
    	
    </style>	
    </head>
    	<body>
      
    
    
    
    
    <textarea rows='40' cols='110' id='view' ></textarea>	
      
    
    <form onsubmit="render(line.value); return false;">
      
    	<datalist id='hist'></datalist>
    
      <input value='Object.keys(window)' type='text'  id='line'  autofocus tabindex=1 list='hist' />	
    </form>
    
    
    
    <script type='text/javascript'>
    
    commands={
    
     cls: 	function cls(){ setTimeout("view.value='';",0); },
     date:	function(){return new Date().toISOString(); }
     
    }
    
    
    commands.ls=Object.keys.bind(Object, commands);
    
    
    
    function propToMethod(){
    
    
    }
    
    
    function render(code){
    	hist.appendChild(new Option(code));
    	var rez="";
    	try{ 
    			rez=eval("with(commands){"+(code||'')+"}");
    		
    	}catch(y){
    		rez=y;
    	}
    		
    	if(typeof rez==='function'){ rez=rez();}
    	view.value+="\n\n JS:>"+ code+"\n" +  JSON.stringify(rez, null, "\t")+"\n";
    	if(view.value.length>5000){ view.value=view.value.slice(-5000); }
    	view.scrollTop=9e9;
    	line.select();
    	line.focus();
    }
    
    
    
    window.onload=render(render+"; 'ready!' ");
    
    </script>
    </body>
    </html>
    That didn't do anything for me, just displayed a box with javascript code in it.

  • #10
    Senior Coder jmrker's Avatar
    Join Date
    Aug 2006
    Location
    FL
    Posts
    3,084
    Thanks
    38
    Thanked 498 Times in 492 Posts

    Question

    Quote Originally Posted by subless View Post
    That didn't do anything for me, just displayed a box with javascript code in it.
    What is it that you expected it to do?
    Did you click on the window and type something?

  • #11
    New Coder donna1's Avatar
    Join Date
    Nov 2012
    Location
    london
    Posts
    99
    Thanks
    9
    Thanked 4 Times in 4 Posts
    @Woodstock Im trying rnd-me's terminal and doesnt work for me either. Code looks as if it should return a date, or clear screen if I type either date: or CLS: but it doesnt work?

    Anyway can someone look at my version please and tell me how to convert the keycode into a character for output because mine has a bug too
    Last edited by donna1; 12-04-2012 at 11:19 PM.

  • #12
    New Coder donna1's Avatar
    Join Date
    Nov 2012
    Location
    london
    Posts
    99
    Thanks
    9
    Thanked 4 Times in 4 Posts
    OP Subless didn't thank me for my brilliant effort, nor has anyone helped with the small issue of converting the keypress code back to a character which is the only bit that doesnt work in my demo - which I have ASKED ABOUT TWICE.

    VIPStephen was quick enough to tell me I cant have an avatar yet but when I put some effort in I dont get any acknowledgement
    Last edited by donna1; 12-04-2012 at 11:39 PM.

  • #13
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    @donna1

    Code:
    String.fromCharCode(x)
    is probably what you are looking for. It is not 100% reliable, though, as there is not a direct correspondence between the key-codes returned by JS and the unicode character-codes that fromCharCode() expects. (It can also depend on which key-event is used.)

    BTW You will discover that you cannot expect an acknowledgement every time, even if you provide a full and correct answer to someone's question

    which I have ASKED ABOUT TWICE
    ..you also cannot demand an answer.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS

  • Users who have thanked AndrewGSW for this post:

    donna1 (12-04-2012)

  • #14
    New Coder donna1's Avatar
    Join Date
    Nov 2012
    Location
    london
    Posts
    99
    Thanks
    9
    Thanked 4 Times in 4 Posts
    hey String.fromCharCode(evt.keyCode) works, well sort of - except I get capital letters all the time and a few funny characters. Why do little letters not show even when Im not pressing shift?

    updated demo
    http://donoi.hostoi.com/term.html

    The only other problem is I tried to add a line to catch the backspace to allow deletion of characters
    Code:
    if(evt.keyCode==8){ cursX-=8; return;}
    but it just exits the browser!!
    That seems to be a quirk of GoogleChrome, dont know why they picked the delete key to also go back, is there an easy way to stop that?
    Last edited by donna1; 12-04-2012 at 11:07 PM.

  • #15
    Senior Coder
    Join Date
    Apr 2011
    Location
    London, England
    Posts
    2,120
    Thanks
    15
    Thanked 354 Times in 353 Posts
    event.shiftKey may enable you to distinguish between capital and lowercase - depending on the key event you use (I haven't clarified this fully but believe this applies to keydown). You then could use toLowerCase() to output the correct character, or add 32 to the key-code.

    a few funny characters
    ..depends on what key was pressed..

    I always use Backspace to return to the previous page (Back) - on all browsers. To prevent this action you either need to return false from your event (which should work on its own) or event.preventDefault() as well.
    "I'm here to save your life. But if I'm going to do that, I'll need total uninanonynymity." Me Myself & Irene.
    Validate your HTML and CSS


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •