jsshell 3.0

This weekend I finished up an upgrade for jsshell to version 3.0. I also put together a new jsshell landing page to help users get started.

New Stuff In 3.0

1. jQuery and jLinq Upgrade: Both libraries have been upgraded to their newest versions. jQuery 1.4.4 and jQuery UI 1.8.7. jLinq has been upgraded to 3.0.2.
2. Auto Complete: Previously, jsshell would show css classes, IDs and tags that were on the page as a ‘auto-suggest” popup but you couldn’t select anything on the list. Now, jsshell allows you use TAB to select the currently highlighted item. You can use up and down to change the highlighted item.
3. More Auto Complete Sources: jsshell now shows suggestions for jQuery and jLinq commands, current IDs, tag names and css classes on the page and now some Javascript keywords and common CSS properties.
4. Remember Last Command: jsshell now remembers the last successfully executed command. If you browse to a new page or refresh the view, the last command you ran will still be waiting for you.
5. Access ‘file:///’ URL: Previously, Google denied the app from being released because it had access to the file URL. It seems they have changed the way this rule is handled so this version now includes the local file url.
6. A ‘Run’ Button – Finally…: The only way to run commands before was to press CTRL+Enter. Now there is a button that does the same thing.

Special thanks to @stevehebert for his great suggestions on improvements for jsshell.

Please feel free to let me know if anything isn’t behaving as expected.

Campfire, Google Chrome and Extensions

If you’ve never heard of them before, there is this little company called ’37 Signals’… they made a couple mildly popular products one of which is called Campfire.

Campfire has a really neat chat client you can use to collaborate with other team members. It even comes with some pretty handy features such as uploading files or tracking (and searching) chat history… and it all works even when you aren’t online.

That said, as neat as Campfire is – it is still a website so some of its functionality is a bit limited. For example, desktop notifications. Of course there could be stuff out there but I haven’t checked.

So with a bit of tinkering I came up with a handy little Chrome Extension to do the job.

You can click the image above or this link to install the Extension.

Chrome is especially useful with the Application Shortcuts feature. I use it in a variety of places like Grooveshark or Toggl so naturally Campfire chat fits in perfectly.

Anyways, if you use Campfire and Chrome then this might be a handy extension for you!

jsshell – Reputable Software??

Yes, it seems impossible so I took a screenshot. My little jsshell project has made it onto a pretty ‘notable’ list of Google extensions.

If you don’t know what jsshell then you might watch the introduction screencast.

Well… yeah, it isn’t spelled correctly… but I promise it is the same one.

In any case, you can check out the list on the Google site for yourself and possibly pick up some of the other awesome plugins while you’re at it. Don’t wait too long since it is only a matter of time before they realize their mistake 🙂

So, what better way to celebrate than to go ahead and open-source the code?

As usual, you’ll find my code out on git-hub, since its, ya’know, awesome… GitHub that is…

[Source Code]
http://github.com/hugoware/jsshell

Yet Another jsshell Update

I’m pretty psyched about jsshell right now. The user count is growing, I’ve had a lot of good reviews — I’ve even noticed that my blog is being hit with search for it.

I’ve also been getting feedback of ideas and suggestions which I’ve implemented and uploaded to the extension website (so you can go download the new version now).

More Intellisense

The intellisense now includes jQuery commands, jLinq commands and jsshell commands, each labeled with their own color. Additionally, there is now a slight delay before the intellisense is polled. This time limit is 100 milliseconds (so really if you aren’t typing a fast or even pause for a moment you should see it).

Automatic jQuery Help

I received this interesting suggestion from a user. Automatically open the jQuery website with the correct help information for the word that the caret is currently over. Brilliant!

Now, when you press CTRL+? or CTRL+F1, whatever word you have the caret will be opened on the jQuery website. If you don’t have the whole thing typed out, it will take a guess at what you meant. If it can’t even find a command by that name in jQuery then no window is opened.

Import and Export Settings

I’m not entirely certain what happens from version to version for Chrome extensions, I’ve added an export and import option for settings. Right now it just returns a string that you can import back into jsshell. In the future I’ll be adding an interface to do that for you. For now you might want to save any built in commands before you upgrade versions.

If you have any other feedback, please let me know!

jsshell 2.0 – The Release

Today you can download jsshell 2.0. This new version has a lot of new features.

If you’ve never used it before you might want to watch the jsshell screencast to help you get caught up on what it does and how it works.

Basic Usage

Here are the basics of using jsshell.

• CTRL + Enter: Runs all of the code in the current window. You can also highlight the code you want to run and press the same keys to run just the selected code.
• CTRL + Delete: Wipes out all of the code currently in the editor.
• Double Click the Title bar: This will minimize and restore the code window on the page.

You can drag the window around the screen and also resize the text area by clicking the corner of the textarea and dragging it to the correct size.

Settings

You can now adjust settings in jsshell to behave how you want. Below are some commands you can use.

• js.setting("allowAuto", true|false): Turns on and off the ability for commands to run automatically when browsing to a web page.
• js.setting("autoDelay", milliseconds): The time to wait before attempting to run a command automatically on a page.
• js.setting("showHint", true|false): Turns on and off the ‘intellisense’ box with the page elements, classes and ids.
• js.setting("displayNodes", true|false): Turns on and off is the ‘Growl’ style boxes can appear or not.
• js.setting("autoShow", true|false): Turns on or off if the box should automatically appear at the bottom of every page (without clicking the jsshell icon)
• js.setting("onlyTop", true|false): (experimental) Causes the editor window to only appear in the top frame and not any other sub frames.
• js.color("dialog|editor|font", "#color"): Changes a color setting for the jsshell window.

Data

jsshell now allows settings to persist from session to session and page to page.

• js.data.list(): Shows a complete list of all data currently saved for the browser.
• js.data.save("key", {object}): Saves an object to the data container. Uses JSON.stringify so be careful what you save.
• js.data.load("key"): Returns the object the data found in the container of the key provided.
• js.data.edit("key", delegate(data) { }): Edits the data found with the method provided. The method must return the data or nothing will be saved.
• js.data.use("key", delegate(data) { }): Similar to the edit command, but just allows access to the data. Nothing will be saved regardless of what is returned.

Other Built In Commands

jsshell also has several other built in commands that perform a variety of tasks.

• js.call("command"): Invokes a built in command like nostyle or any custom commands you have created.
• js.note({message:"message", [title:"title"]}): Displays a ‘Growl’ style popup box with a message inside. The Message accepts HTML so you can include links.
• js.go("url.com"): Browses to the url provided in the command.
• js.debug(): Nothing special…

Shortcut Commands

Shortcut commands can be called by simply entering !commandName or with js.call(“commandName”).

• !nostyle: Removes style information from the page like stylesheets, attributes and classes.
• !flash: Attempts to move the jsshell window over the top of Flash elements on the page.
• !save: Manually saves the settings for jsshell, but you shouldn’t ever need to call it. Special for all you paranoid people out there 🙂
• !reset: Resets all information for jsshell and returns to the default settings.

Custom/Auto Commands

One of the cooler new features is that you can write custom commands to run as soon as you get to a page. You can specify a regular expression to evaluate the URL you navigate to and then have a custom command run right away (or multiple commands). If you don’t want to run them automatically then you can still invoke them by using the Shortcut Command syntax shown above.

• js.custom.edit("commandName"): Shows the dialog to allow you to make changes to a custom command.
• js.custom.remove("commandName"): Removes a custom command from your settings.
• js.custom.list(): Displays a full list of all commands available in your settings file.

New Screencast

You can watch the new screencast to see more of the new features in jsshell.

Download It Now!

You can download jsshell 2.0 at my website. Make sure to send me a message if this is helpful and any other features you might want to see!

jsshell 2.0 — Yeah… already…

The new jsshell is here! Go read about the release at this blog post

Last post I shared an extension I was working on for Chrome called jsshell — The name is terrible since I found out it is also the name of a computer virus. I suspect many users would be confident to download and install it if they knew.

I’m not going to post the plug in tonight so I can test it a bit longer, but I wanted to share some of the new features. If you have some ideas then please share them with me. I’ve already added on new feature based on feedback I’ve heard (thanks Pierre).

Settings for jsshell

There are now settings for a handful of features. For example, using jsshell.color("dialog", "#f00"); will change your window to a new color. The settings will persist till the next time you open the page.

Additionally, there are settings for notification displays, auto execute timers and more. Nothing exciting but it is new. 🙂

Notifications

I personally loathe the alert box. I think they should all be replaced with something like this…

Okay, well maybe not that… They are required at times. Even jsshell has one.

In any case, jsshell tries to create more pleasant notifications similar to the ones you see in other plugins like jGrowl. After a few seconds they will go away on their own. You can hover over the window to keep it from closing.

Custom/Auto Commands

One of the cooler things you’ll have is the ability to write your own custom commands and then save them so you can execute them later. So for example you could write a command called mp3 and then execute it by entering !mp3 or jsshell.call("mp3"); into the editor and then executing it.

To take it a step further, you can define certain commands to run automatically on certain pages (which you define with a regular expression). So for example, in my herdingcode.com demo I could have my MP3 script run as soon as I reach the page.

I’ve found a few interesting uses already (for example, performing a login that spans across multiple pages)

And More… but not that much more…

This is some of the better features that have been added. I’ll probably release the next version on Monday, but as for now tell me if this sounds like a good direction to go or if I ought to change my thought process.

Chrome Extension: jsshell

The new jsshell is here! Go read about the release at this blog post

I started messing around with writing a extension for Chrome yesterday and I’m surprised just how easy they are to put together. With the exception of a little configuration the whole process is HTML and JavaScript — something that most of us are already experts at (not saying I’m an expert, I’m just saying for the rest of you)

In any case, it didn’t take very long to put something that wasn’t half bad.

jsshell

I’m taking votes on a better name, but for now I simply named it jsshell or JavaScript Shell. Basically, you get a nifty little window as you browse the web that you can use jQuery and jLinq to execute custom commands. Not a bad idea, huh?

I won’t talk about it too much here – I did a screencast and a have a link to download (and install) the extension into your browser.

---

Watch the screencast about jsshell!

Don’t forget, this extension only works with Google Chrome (and possibly only version 4). Try it out and let me know what you think!

This is my last post of 2009 (it is only 11:16PM here in Texas) — See you all next year!