Get Started With Chickenfoot

Revision as of 20:58, 6 June 2008 (edit) Sancho (contribs) (�Activating Triggers) � Previous diff		Revision as of 20:59, 6 June 2008 (edit) (undo) Sancho (contribs) (�Activating Triggers) Next diff �
Line 86:		Line 86:
	[[Image:080606-chickenfoot-triggers.png]]		[[Image:080606-chickenfoot-triggers.png]]
-	Notably, the last option on the right of the Trigger tab gives you the ability to package your triggers as a stand-alone firefox extension. Packaged Chickenfoot Firefox extensions can be sent to friends, even if they don't have Chickenfoot installed.	+	Notably, the last option on the right of the Trigger tab gives you the ability to package your triggers as a stand-alone firefox extension. Packaged extensions can be sent to, and installed by, friends who use Firefox -- even if they don't have Chickenfoot installed.
	== Alternate methods ==		== Alternate methods ==

---

Revision as of 20:59, 6 June 2008

Chickenfoot is a scripting wrapper allowing you to manipulate websites on-the-fly and to your liking using only your browser and some light scripting.

Contents 1 Introduction 2 What you'll need 3 Steps 3.1 Basic Page Navigation 3.2 Pattern Matching 3.3 Page Modification 3.4 Activating Triggers 4 Alternate methods 4.1 JavaScript Integration 4.2 Greasemonkey 5 Suggested readings

Introduction

As every budding developer knows, sometimes when the internet fails to give you exactly what you want, you have to hack it yourself. The ability is made easy (and legal) with " tools like Chickenfoot, a firefox plug-in. Chickenfox adds a scripting layer over your browser and allows you to manipulate your experience through some easy to learn JavaScript-based coding.

Chickenfoot is similar to Greasemonkey, another Firefox add-on providing page scripting, but goes a step beyond Greasemonkey by manipulating the browser's Document Object Model (DOM). The DOM represents the interactive abilities of the web -- things like links, text boxes, radio buttons, and check boxes. The ability to manipulate the DOM is powerful. It allows you to change site code, interactions, and submissions based on preference or whimsy.

Sample applications of Chickenfoot:

• Change page colors. Add photos
• Automatically fill forms
• Automatically navigate around through a web site
• Change text box sizes
• Find the number of links on a page

Scripts can save and load on demand. It allows you to write code while browsing and run, or "triggered," at any time. Triggers can be set for page actions or whenever it matches pattern criteria you set. For example, scripts can be triggered when pages are loaded or when it sees particular links.

Chickenfoot's interface is a sidebar running parallel to the browsing window. It includes a text box for on-the-fly scripting, and an area allowing you to see the output and error messages of your scripts. There are a couple tabs at the top of the area that allow you to browse pattern matches and tweak preferences controlling when your scripts are triggered.

Bundled with Chickenfoot are some sample scripts including an "icon search" useful for filtering Google image search results for icons, a script which highlights and defines SAT words, and one allowing text boxes to resize by dragging a small image on the corner.

Chickenfoot offers some functionality Greasemonkey lacks. Scripting in Chickenfoot has an easier learning curve. Easy script commands include functions like "click("This Link"). Manipulating the same command in Greasemonkey involves an intermediate level of JavaScript knowledge, a text editor, and a page refresh.

What you'll need

You'll need Firefox and the Chickenfoot plug in, a general understanding of scripting, and a good idea.

You can get Firefox at Mozilla's Firefox site.

You can get Chickenfoot at Chickenfoot's home page

Steps

Basic Page Navigation

Basic page navigation is probably the most most unique feature of Chickenfoot. For example, all it takes to open a page, enter a query and press a button is:

go("webmonkey.com")
enter("search","chickenfoot")
click("second button")

Let's take it a step further. Say I want to set up a script to open my Gmail (I'm already logged in) and search my messages for any unread messages. In Chickenfoot, the script would look like.

go("http://www.gmail.com")
enter("search","is:unread")
click("Search Mail")

Chickenfoot will find the best match for the arguments given. However, say there are multiple search forms on a page? With a little JavaScript know-how you can specify exactly the right textbox, image, or button. For example, you can specify the DOM using something like.

click(new XPath("/HTML[1]/BODY[1]/DIV[1]/DIV[1]/DIV[2]/UL[1]/LI[7]/FORM[1]/INPUT[2]"))

If DOM's and JavaScript is a little over your head, Chickenfoot makes it easy to find it for you by allowing you to "Record actions" you can copy and paste into a script.

Other forms are supported as well. For example, you can use pick("my selection") to select from a drop-down and check("my choice") to choose from a checkbox.

Pattern Matching

Chickenfoot allows you to load and search for strings on a page for whatever kind of page manipulation.

Let's say we want to find how many times the word "chickenfoot" appears in this article. We'd write something like this:

m=find("chickenfoot")
m.count

The answer would appear in the output field.

Page Modification

Chickenfoot allows you to change page source on the fly. For example, let's say we want to customize a logo on a page. This is just one way:

replace("http:www.webmonkey.com/logo.gif", "http://myserver/mylogo.gif")

Activating Triggers

Up until this point, we focused writing code impromptly from the sidebar. Let's say we wrote a script we liked and wanted to apply it every time it matched a criteria.

On the bottom of the sidebar is a tab called "Triggers." Triggers can be set to activate whenever it meets the criteria you set. You may have to expand the size of the sidebar to see the options provided for adding, editing, and removing triggers.

Notably, the last option on the right of the Trigger tab gives you the ability to package your triggers as a stand-alone firefox extension. Packaged extensions can be sent to, and installed by, friends who use Firefox -- even if they don't have Chickenfoot installed.

Alternate methods

JavaScript Integration

Chickenfoot scripting is heavily based on JavaScript. If you know JavaScript, you can bypass the easy-to-use Chickenfoot commands and write your functions completely in JavaScript. Scripts written in JavaScript are easily portable across browsers, extensions, and platforms.

Greasemonkey

As mentioned above, Greasemonkey is an alternative to Chickenfoot for scripting your browser. You can find Greasemonkey at the Mozilla add-on site.

As mentioned above, you can write your scripts directly in JavaScript and port them over to Greasemonkey. Chickenfoot also allows you to port over your Greasemonkey scripts by inserting include("greasemonkey.js"); at the top of your script. You can also start a new Greasemonkey script in Chickenfoot by clicking the arrow next to the "New" button and selecting "Greasemonkey template."

Suggested readings

Chickenfoot's Quick Start guide is a great place to get started. It also offers a great command library.

There's a Chickenfoot Scripts wiki -- a great place to download scripts and learn by example.

Webmonkey has a load of JavaScript tutorials to get you started on the portable scripting language.