dev.enekoalonso.com » console http://dev.enekoalonso.com having fun with code Wed, 12 Oct 2011 21:40:17 +0000 en hourly 1 Javascript console in the terminal (command line) http://dev.enekoalonso.com/2010/10/05/javascript-console-in-the-terminal-command-line/ http://dev.enekoalonso.com/2010/10/05/javascript-console-in-the-terminal-command-line/#comments Wed, 06 Oct 2010 04:15:19 +0000 Eneko Alonso http://dev.enekoalonso.com/?p=672 I’ve been looking for a command line Javascript console for a while. I have even thought of creating my own one, some hybrid between my fake Linux terminal and JSFiddle.net. Lately, I’ve been working with node.js lately on a little project just for fun. Never before I had done server side Javascript and it looks like it has serious potential. But still, I had no console other than Firebug or, my favorite, the one included in Webkit.

So I am very happy after coming across this article which shows how to use the JavaScriptCore.Framework included in Mac OS X on the command line. Doing some Google searches, looks like people have been talking about this for a long time. Even more! Here is how to compile javascript to .exe in Windows. Didn’t even thought that could be possible, being Javascript such a dynamic language.

One interesting thing about the jsc Javascript console is that you can load() javascript files from disk. Thus, one can get the Mootools core (Core + Function + Array + Number + String + Hash + Class + Class.Extras + JSON) and load it to start creating awesome classes, etc.

This is going to be a lot of fun :)

Related Posts:

]]> http://dev.enekoalonso.com/2010/10/05/javascript-console-in-the-terminal-command-line/feed/ 1 Highlighting elements with Firebug console http://dev.enekoalonso.com/2008/12/02/highlighting-elements-with-firebug-console/ http://dev.enekoalonso.com/2008/12/02/highlighting-elements-with-firebug-console/#comments Tue, 02 Dec 2008 19:24:27 +0000 Eneko Alonso http://dev.enekoalonso.com/?p=74 Today I had an issue with an element was breaking a page layout, making the page width wider than 960px. I tried to find it with Firebug, looking at the layout properties of some divs and elements, but I couldn’t find it. I knew it had to be there, so I decided to highlight all div elements in the page with a red border. And it worked! I found it right away.

Here is the code I used to highlight the fields (I had to do it in prototype only):

Prototype JS:

  1. <img src="http://l.wordpress.com/latex.php?latex=%28%27div%27%29.each%28function%28item%29%7B%20%20%24%28item%29.setStyle%28%7B%20border%3A%20%27solid%201px%20red%27%20%7D%29%3B%7D%29%3B%3C%2Fpre%3EjQuery%3A%3Cpre%20lang%3D%22javascript%22%3E%24%28%27div%27%29.css%28%27border%27%2C%20%27solid%201px%20red%27%29%3B%3C%2Fpre%3EMootools%3A%3Cpre%20lang%3D%22javascript%22%3E&bg=0D324F&fg=FFFFFF&s=1" title="('div').each(function(item){  $(item).setStyle({ border: 'solid 1px red' });});

jQuery: 

$('div').css('border', 'solid 1px red');

Mootools: 

" style="vertical-align:-20%;" class="tex" alt="('div').each(function(item){  $(item).setStyle({ border: 'solid 1px red' });});

jQuery: 

$('div').css('border', 'solid 1px red');

Mootools: 

" />('div').setStyle('border', 'solid 1px red');

PS: Note that by adding a 1px border to all divs in the page, the page layout will be affected and some items may display improperly. Of course, you can use other colors than red :)

Related Posts:

]]> http://dev.enekoalonso.com/2008/12/02/highlighting-elements-with-firebug-console/feed/ 0 Injecting javascript with Firebug http://dev.enekoalonso.com/2008/11/30/injecting-javascript-with-firebug/ http://dev.enekoalonso.com/2008/11/30/injecting-javascript-with-firebug/#comments Mon, 01 Dec 2008 05:29:22 +0000 Eneko Alonso http://dev.enekoalonso.com/?p=64 Sometimes you may want to include a Javascript file on a live web page to see how things will work or to try new things. Usually you would do this by editing the source code including the new file but there is a fastest way if you have Firefox with Firebug. Just run the following code in the Javascript console:

  1. var headID = document.getElementsByTagName("head")[0];
  2. var newScript = document.createElement('script');
  3. newScript.type = 'text/javascript';
  4. newScript.src = 'http://enekoalonso.com/lib/jquery-1.2.6.min.js';
  5. headID.appendChild(newScript);

Here I am loading the jQuery library from my own server, but I could load any Javascript from any server on the net. The best is this will work on any website, whenever you have access to the server or not. Once you have the Javascript loaded you can use it right away. For example, here on this blog I could use jQuery to check how the header will look if its height was only 100px by running the next command on the console:

  1. jQuery('#header').css('height',100);

Yep, it won’t look very good, right? Try it! You have to see it by yourself. Firefox is great. Firebug is awesome. And Firebug’s Javascript console is the best thing ever!
PS: In case you are wondering, the Javascript file injected will exist only on the current browser session.

Related Posts:

]]> http://dev.enekoalonso.com/2008/11/30/injecting-javascript-with-firebug/feed/ 0