[Httpd Wiki] Update of "ScratchPad" by thumbs

[Apache Wiki <wi...@apache.org>]

Dear Wiki user,

You have subscribed to a wiki page or wiki category on "Httpd Wiki" for change notification.

The "ScratchPad" page has been changed by thumbs:
http://wiki.apache.org/httpd/ScratchPad?action=diff&rev1=2&rev2=3

Comment:
-- Revert from spam

+ = Writing space for new content =
- = ScratchPad =
- The latest Firefox release includes a new tool for web developers:  Scratchpad. The idea behind Scratchpad is simple: the browser is a  fantastic place to experiment with JavaScript. Most JavaScript  developers already know this and they use tools like the Web Console or  Firebug’s command line to take advantage of the one environment that  knows ''everything'' about their web page.
  
- Tools like the Web Console are optimized for entering a single line  of code. (ProTip: you can use shift-enter to put multiple lines of code  into the Web Console.) Firebug has a button you can click to get into a  multi-line input mode. Even with that multi-line input, the workflow is  still centered around performing operations step-by-step and linearly.
- 
- Interaction with Scratchpad is quite different. It throws away the  “one line of input gives you a line of output” interaction in favor of a  text editor that knows how to run JavaScript.
- 
- == Using Scratchpad ==
- To use Scratchpad, go to the “Web Developer” menu (hint for Mac  users: look for the “Web Developer” menu under “Tools”). Select  “Scratchpad” from that menu, and you’ll get a text editor window. The  window starts out with a helpful hint about using Scratchpad[[http://www.utalkmarketing.com/Hubs/HubHome.aspx?HubID=100366|.]]
- 
- The basic flow with Scratchpad could hardly be simpler:
- 
-  1. Enter some code
-  1. Select a portion of the code
-  1. Choose one of the three commands from the Execute or right-click context menu
- 
- The three ways to run code with Scratchpad are:
- 
-  * Run
-  * Inspect
-  * Display
- 
- They all have keyboard shortcuts, because you don’t want to have to reach for your mouse when you’re writing code.
- 
- ''Run'' just executes the selected code. This is what you’d use  if you’re defining a function or running some code that manipulates your  page.
- 
- [[http://blog.mozilla.com/devtools/files/2011/08/scratchpadAlert.png|{{http://blog.mozilla.com/devtools/files/2011/08/scratchpadAlert.png|Code in Scratchpad that creates an alert|height="282",width="600",class="size-full wp-image-129"}}]]JavaScript being run in the Scratchpad
- 
- ''Inspect'' executes the code as ''Run'' does, but it also opens up an object inspector on the value returned. For example, if you select window and choose ''Inspect'', you will have an object inspector that lets you drill into the window object[[http://www.diigo.com/user/martiniperes|.]]
- 
- Finally, ''Display'' executes the selected code and puts the  result right into your editor. This could be handy for using Scratchpad  as a calculator. Or, more likely, it’s handy for keeping track of  results while you’re testing something your page is supposed to do for  you.
- 
- Interesting historical aside: Scratchpad was heavily inspired by the  Workspaces feature of Smalltalk environments. Thirty years in, we’re  still reinventing Smalltalk {{http://blog.mozilla.com/devtools/wp-includes/images/smilies/icon_wink.gif|;)|class="wp-smiley"}}
- 
- To really get a feel for Scratchpad, you need to see it in action. Fire it up yourself, or [[http://antennasoft.net/robcee/2011/06/08/scratchpad-canvas-demo/|watch Rob Campbell’s video]] which steps through experimentation with Scratchpad.
- 
- == Trying New Code with Scratchpad ==
- Scratchpad is a great way to try out code in a live browser environment. For example, imagine you have a function called calculatePosition,  and it’s just not working quite right. Load up your page, copy the  function into Scratchpad and type out a couple lines of code that make  use of calculatePosition. You very quickly get into a flow of tweaking the function and re-running the code.
- 
- Once you have the result you want, just copy the code back into your  main file. This whole time, you didn’t have to reload the page even  once.
- 
- == Using Common Snippets ==
- Scratchpad also has a way to save its contents or load a JavaScript  file. Using this feature, you could save Scratchpads with collections of  commonly used functions. For example, maybe you have a site that you  work on that has various bits of data that get loaded via Ajax requests.  Save a file with a handful of those calls and you can always get the  data you want when you’re working on that app[[http://blekko.com/userfeed/tomcruise|.]]
- 
- == A Word about Scopes ==
- When you run code in Scratchpad, it runs in a sandbox that has access  to everything on your page, but keeps you from accidentally leaking  variables onto your page. This is very similar to how the Web Console  works. If you ''want'' to put a variable onto your page, just set it on window. window.foo=1 will give your page a variable foo that is accessible to scripts on the page[[http://www.clipboard.com/RobertPattinson|.]]
- 
- Scratchpad, unlike Web Console, follows you around as you switch  tabs. When you execute code, it runs against the current tab in your  browser. This makes it easy to try the same code against your  development and staging servers, for example.
- 
- Finally, if you’re doing development work on Firefox itself or on  Firefox add-ons, you can set Scratchpad up so that it has access to all  of the browser’s internals. Go to about:config and set the preference devtools.chrome.enabled  to true. This will allow you to change the “Environment” from “Content”  to “Browser”. Just don’t blame me if you enter some code that forces  your browser to send cat pictures to Google+[[http://snip.it/collections/16604-iPhone-4-cases--iPhone-4S-cases--iPad-2-Cases-Collections|.]]
- 
- == More to Come ==
- Scratchpad is a simple tool, and we want it to stay that way. We’re  planning a handful of improvements to Scratchpad that will show up in  Firefox over the coming months, but the simple “text editor that runs  JavaScript” core will remain.
- 
- We’d love your feedback on Scratchpad! Tell us on the [[https://lists.mozilla.org/listinfo/dev-apps-firefox|dev-apps-firefox mailing list]] what you think. You can also [[https://wiki.mozilla.org/DevTools/GetInvolved|get involved]] and make Scratchpad and other developer tools even better.
- 
- – ''Mevin Sangoor, Developer [[http://www.scoop.it/t/designer-mobile-phone-case-covers-2012|Snoop.it]]''
- 

---------------------------------------------------------------------
To unsubscribe, e-mail: docs-unsubscribe@httpd.apache.org
For additional commands, e-mail: docs-help@httpd.apache.org