Web Command Line
It is a secret for nobody that I am fond of neat DOM scripting and Javascript widgets, especially those that try to bring the Web to the level of User Interaction present in desktop applications. Well, one of the user interfaces that examplify the desktop applications is the command line.
The tiny javascript function I’m writing down here brings any of your html form input lines into life… well, that is to say, into command-line-style history behavior. Just type anything into the input below and press enter. You can then retrieve your previous entries by pressing the up and down arrows, like in a desktop interface.
Like it? Here’s the code:
var cmdHistory = [];
function cmdExec(){
var cmd = $F("cmdline");
cmdHistory.unshift(cmd);
$("cmdline").value='';
cmdPos=-1;
}
function keypr(e){
var code;
if (!e) var e = window.event;
if (e.keyCode) code = e.keyCode;
else if (e.which) code = e.which;
if (code==38 && cmdPos
cmdPos++;
$(”cmdline”).value = cmdHistory[cmdPos];
}
if (code==40 && cmdPos==0){
cmdPos–;
$(”cmdline”).value=”;
}
if (code==40 && cmdPos>0){
cmdPos–;
$(”cmdline”).value = cmdHistory[cmdPos];
}
}
var cmdPos=-1;
and here’s the Html:
<form id="command" name="command" action="#" onsubmit="cmdExec(); return false">
<input id="cmdline" style="font-family: monospace; width: 400px"
onkeypress="keypr(event);" type="text" />
</form>
The key point is to use Javascript’s unshift() method, which is the equivalent of push(), but inserting at the beginning of the array. Hope you’ll find this snippet useful.
February 22nd, 2008 at 8:48 pm
This is pretty nice, except for the fact that it’s stand-alone and hard to see how to integrate it with a real page.
I couldn’t quite make out what you were doing until I read on some other site about the prototype script library. You might want to mention that you’re using it, so the syntax makes sense to people.
February 23rd, 2008 at 3:09 am
I do use $() and $F() functions, which are, as far as I know, pretty standard across Javascript frameworks such as Prototype, Mootools, jQuery, etc. (They can have slightly different meanings, though).
And yeah, it is stand-alone, but you could integrate it with a real page very easily. The restriction is that the page needs to be Ajax (no POST form, for example). In that case you would just add the Ajax-related function to the form’s onsubmit, right after cmdExec().
January 13th, 2011 at 9:35 am
Wow, thats a very informative blog entry for me. I like your wordpress blog. Maybe you should write more articles of these type.
January 27th, 2011 at 10:04 pm
:`’ I am really thankful to this topic because it really gives up to date information :.`
January 30th, 2011 at 5:34 am
Wow! what an notion ! What a idea ! Lovely .. Remarkable …
July 11th, 2011 at 10:36 am
The next time I read a blog, I hope that It doesnt disappoint me the maximum amount as this one. I mean, i do know it absolutely was my choice to browse, but I truly thought youd have one thing fascinating to mention. All I hear may be a bunch of whining concerning one thing that you simply could fix if you werent too busy craving for attention.
July 12th, 2011 at 8:23 pm
Blueair 402 Filter…
Blueair 402 Replacement filter …
July 15th, 2011 at 2:26 am
I enjoy reading your writing but unfortunately this time you may have been too tired while writing because the post it seems rushed.
July 18th, 2011 at 5:31 pm
Thanks for the outstanding stuff in your post. I will be sure to keep reading more of your blog when I get home. Added to favorites!
August 2nd, 2011 at 12:26 pm
An impressive share, I just given this onto a colleague who was doing a little analysis on this. And he in fact bought me breakfast because I found it for him.. smile. So let me reword that: Thnx for the treat! But yeah Thnkx for spending the time to discuss this, I feel strongly about it and love reading more on this topic. If possible, as you become expertise, would you mind updating your blog with more details? It is highly helpful for me. Big thumb up for this blog post!
August 3rd, 2011 at 2:02 pm
Undeniably believe that which you stated. Your favorite justification appeared to be on the internet the simplest thing to be aware of. I say to you, I certainly get irked while people think about worries that they plainly don’t know about. You managed to hit the nail upon the top as well as defined out the whole thing without having side effect , people could take a signal. Will probably be back to get more. Thanks
August 7th, 2011 at 6:21 pm
I have learn some excellent stuff here. Definitely value bookmarking for revisiting. I surprise how much effort you place to create the sort of wonderful informative website.
August 8th, 2011 at 1:03 pm
Hello! I just would like to give a huge thumbs up for the great info you have here on this post. I will be coming back to your blog for more soon.
August 10th, 2011 at 8:55 pm
This page appears to get a good ammount of visitors. How do you advertise it? It offers a nice individual twist on things. I guess having something authentic or substantial to talk about is the most important thing.
August 12th, 2011 at 4:31 pm
Web Command Line | Blog - MapMyGlobe
August 19th, 2011 at 8:14 pm
I discovered your blog website on google and check a few of your early posts. Proceed to keep up the excellent operate. I simply additional up your RSS feed to my MSN Information Reader. Searching for ahead to studying extra from you in a while …some tips here mayonnaise calories
August 27th, 2011 at 5:51 pm
Hey,
You want some fast Cash?? Check out this:
http://mobilemoneymachines.biz/
It rocks !!
Cheers
August 28th, 2011 at 11:29 pm
You can teach yourself right out of a connection with God.
September 9th, 2011 at 4:33 am
Thank you a lot for sharing this with all folks you really recognise what you are speaking approximately! Bookmarked. Please additionally talk over with my internet site =). We could have a link alternate agreement among us!
September 10th, 2011 at 5:27 am
You actually make it appear truly easy together with your presentation but I in finding this topic to be actually something that I really feel I might by no indicates understand. It sort of feels too complicated and extremely large for me. I am taking a appear forward on your next put up, I will attempt to obtain the dangle of it!
September 12th, 2011 at 3:48 am
Does your site have a contact page? I’m having trouble locating it but, I’d like to shoot you an e-mail. I’ve got some creative ideas for your blog you might be interested in hearing. Either way, great blog and I look forward to seeing it improve over time.
September 12th, 2011 at 3:18 pm
Greetings from Los angeles! I’m bored to death at work so I decided to check out your blog on my iphone during lunch break. I really like the info you present here and can’t wait to take a look when I get home. I’m amazed at how quick your blog loaded on my cell phone .. I’m not even using WIFI, just 3G .. Anyways, superb blog!
September 13th, 2011 at 6:05 pm
It’s a pity you don’t have a donate button! I’d definitely donate to this brilliant blog! I suppose for now i’ll settle for book-marking and adding your RSS feed to my Google account. I look forward to brand new updates and will talk about this website with my Facebook group. Talk soon!
September 15th, 2011 at 5:55 am
I was more than happy to search out this internet-site.I wanted to thanks in your time for this excellent learn I definitely having fun with each little bit of it and I have you bookmarked to check out new stuff you blog post.more tips i found onmoney for blogs
October 28th, 2011 at 5:30 pm
Thanks for this great. I’m wondering in case you were planning of publishing comparable articles to this 1. .Keep up the exceptional posts!
October 29th, 2011 at 6:15 am
I do trust all of the concepts you’ve presented for your post. They are really convincing and can surely function. Nonetheless, the posts are too brief for newbies. May possibly just you please lengthen them a little from next time? Thanks for the post.
October 30th, 2011 at 2:18 pm
I’ve just been promoted to Level 162 in #MobsterWorld. Beat me in the game! http://t.co/DL3UwuhH
December 10th, 2011 at 9:52 am
Hello! I’ve been reading your weblog for a long time now and finally got the courage to go ahead and give you a shout out from New Caney Texas! Just wanted to say keep up the excellent work!