Greasemonkey Greasemonkey

Transcription

1 Dive into Greasemonkey Mark Pilgrim

2 Greasemonkey Greasemonkey Hello World Javascript GM log DOM Inspector Javascript Greasemonkey HTML HTML HTML HTML

3 CSS Javascript XML : Gmail Secure : Blogline Autoload : Ain t It Readable : Offsite Blank : Dumb Quotes : Frownies : Zoom Textarea : Access Bar Greasemonkey API GM log GM getvalue

4 GM setvalue GM registermenucommand GM xmlhttprequest GNU Preamble Terms and conditions for copying, distribution, and modification

5 How to apply these terms to your new programs GNU GPL 2 GNU General Public License

6 1 1.1 Greasemonkey Greasemonkey Firefox Greasemonkey Greasemonkey Javascript Greasemonkey Javascript Greasemonkey Javascript Greasemonkey Greasemonkey Greasemonkey 1.2 Greasemonkey 5

7 Greasemonkey Aaron Boodman Jeremy Dunck 1.3 Greasemonkey 0.3 Greasemonkey 1. Greasemonkey 2. Install Greasemonkey 3. Firefox Greasemonke 1 OK 4. Install Greasemonkey Install User Script..., Manage User Scripts..., User Script Command Manage User Scripts... OK Greasemonkey 3 1

8 1.4 Greasemonkey Javascript Greasemonkey ;.user.js Butler Google 1. Butler Butler Greasemonkey 2. Download version... ( 0.3) Greasemonkey 2 3. Install Greasemonkey Success! Refresh page to see changes Google Try your search on: Yahoo, Ask Jeeves, AlltehWeb,... Enhanced by Butler Butler Greasemonkey 2

9 1.5 Greasemonkey Greasemonkey ( Butler ) 1. Manage User Scripts... Greasemonkey Manage User Scripts 2. Butler 3. Butler Enabled Butler 4. Ok Butler Google Enhanced by Butler Enabled Butler Butler Manage User Scripts 1. Manage User Scripts... Greasemonkey Manage User Scripts 2. Butler Uninstall 3. 3 Jeff Goldblum

10 Butler 2 Manage User Scripts Butler Froogle-Google - Google Butler 1. Manage User Scripts... Greasemonkey Manage User Scripts 2. Butler Butler ( ( ) 3. Excluded pages Add 4. Greasemonkey Add Page 2 URL OK 5. Manage User Scripts URLhttp://froogle.google.com/* Butler froogle.google.com URL ( /) URL 6. OK Manage User Scripts Froogle Butler Google

11 2 2.1 Hello World Greasemonkey Hello World 1: helloworld.user.js // Hello World! example user script // version 0.1 BETA! // // Copyright (c) 2005, Mark Pilgrim // Released under the GPL license // // // // // This is a Greasemonkey user script. // // To install, you need Greasemonkey: // Then restart Firefox and revisit this script. // Under Tools, there will be a new menu item to "Install User Script". // Accept the default configuration and install. // // To uninstall, go to Tools/Manage User Scripts, // select "Hello World", and click Uninstall. // // // // ==UserScript== Hello World example script to alert "Hello world!" on every page * // ==/UserScript== alert( Hello world! ); 10

12 Hello World diveintogreasemonkey.org Google Hello world! helloworld.user.js 2.2 2: Hello World // ==UserScript== Hello World example script to alert "Hello world!" on every page * // ==/UserScript== Gresemonkey 6 // ==UserScript== // // ==/UserScript== Gresemonkey Gresemonkey Helllo World

13 Manage User URL Greasemonkey example script to alert "Hello world!" on every page Manage User Manage User Scripts

14 3 * Gresemonkey URL * Greasemonkey *() URL URL * Greasemonkey URL tag: URIs 2.3 Hello World! 3: Hello World! alert( Hello world! ); Greasemonkey

15 window.settimeout onclick Javascript helloworld 4: function helloworld() { alert( Hello world! ); window.settimeout("helloworld()", 60); Javascript Erro: helloworld is not defined helloworld() helloworld window 5: window.helloworld = function() { alert( Hello world! ); window.settimeout("helloworld()", 60); Hello World! window window

16 window.settimeout 6: window.settimeout(function() { alert( Hello world! ), 60); window.settimeout window.settimeout, document.addeventlistener click submit Anonymous functions in Javascript Block Scope in Javascript 2.4 Manage user Script Edit 1. Manage User Scripts... Greasemonkey Manage User Scripts 2. Hello World Edit Hello World.js 3. Live editing! 4. Manage User Scripts Edit Firefox

17 Greasemonkey

18 3 3.1 Javascript Javascript 1. Firefox 2. Firefox Javascript Javascript Gresemoneky 3.2 GM log Greasemonkey GM log Javascript OK GM log Javascript 7: Javascript 17

19 if (/^ { GM_log( running on Dive Into Greasemonkey site w/o www prefix ); else { GM_log( running elsewhere ); GM_log( this line is always printed ); 2 Javascript Greasemonkey: Log: \ running on Dive Into Greasemonkey site w/o www prefix Greasemonkey: Log: this \ line is always printed GM log 2 Javascript Greasemonkey: Log: running elsewhere Greasemonkey: Log: this line is always printed 255 Javascript Javascript Mac Ctrl+ 3.3 DOM Inspector DOM Inspector (DOM) HTML CSS

20 DOM Inspector Firefox DOM Inspector Firefox (Dom Inspector ) 1. Firefox Developer Tools 1 4. Firefox Dom Inspector Dive into Greasemonkey DOM DOM Inspector DOM Inspector 3. DOM Inspector DOM DOM Nodes 4. HTML 3 HEAD #text BODY BODY diveintogreasemonkey-org id 5. BODY 5 #text, DIV id="intro",#text, DIV id="main", #text 6. DIV id="intro" #text DIV class="sectioninner" 2 7. DIV class="sectioninner" #text DIV class="sectioninner2" 2 8. DIV class="sectioninner2" #text, DIV class="s",#text, DIV class="s", #text 5 9. DIV class="s" #text, H1, #text, P, #text 5 1

21 10. H1 DOM Inspector H1 (H1) URI HTML application/xhtml+xml XML DOM Node, Box Model, XBL Binding, CSS Rules, Computed Style, Javascript Object Javascript Object H1 12. CSS Style Rules monkey.org/css/dig.css 14. font-variant normal (DOM Inspector ) Dive Into Greasemonkey 15. Mac Ctrl- New Property New Style Rule background-color OK red OK DOM Inspect Element DOM Inspector Inspect Element DOM Inspector Firefox Firefox firefox -safe-mode Firefox Inspect Element

22 (Inspect Element ) 1. Inspect Element Install Now 2. Firefox Mac Ctrl- 5. Inspect Element DOM Inspector H1 DOM Inspector DOM Inspector DOM Inspector [DOM Inspector ] DOM Inspector Introduction to DOM Inspector Inspect Element extension Inspector Widget extension Inspect Element 3.4 Javascript Javascript Javascript 1. Jesse 2. Shell 3. Shell Javascript Javascript DOM Inspector DOM

23 document.title Dive Into Greasemonkey document.title = Hello World Hello World var paragraphs = document.getelementsbytagname( p ) paragraphs [object HTMLCollection] paragraphs.length 5 paragraphs[0] [object HTMLParagraphElement] paragraphs[0].innerhtml Teaching an old web new tricks paragraphs[0].innerhtml = Live editing, baby! Live editing, baby! Enter Javascript props 8: var link = document.getelementsbytagname( a )[0] props(link) Methods of prototype: blur, focus Fields of prototype: id, title, lang, dir, classname, accesskey, charset, coords, href, hreflang, name, rel, rev, shape, tabindex, target, type, protocol, host, hostname, pathname, search, port, hash, text, offsettop, offsetleft, offsetwidth, offsetheight, offsetparent, innerhtml, scrolltop, scrollleft, scrollheight, scrollwidth, clientheight, clientwidth, style Methods of prototype of prototype of prototype: insertbefore, replacechild, removechild, appendchild, haschildnodes, clonenode, normalize, issupported, hasattributes, getattribute, setattribute, removeattribute, getattributenode, setattributenode, removeattributenode, getelementsbytagname, getattributens, setattributens, removeattributens, getattributenodens, setattributenodens, getelementsbytagnamens, hasattribute, hasattributens, addeventlistener, removeeventlistener, dispatchevent, comparedocumentposition, issamenode, lookupprefix, isdefaultnamespace, lookupnamespaceuri, isequalnode, getfeature, setuserdata, getuserdata Fields of prototype of prototype of prototype: tagname, nodename, nodevalue, nodetype, parentnode, childnodes, firstchild, lastchild,

24 previoussibling, nextsibling, attributes, ownerdocument, namespaceuri, prefix, localname, ELEMENT_NODE, ATTRIBUTE_NODE, TEXT_NODE, CDATA_SECTION_NODE, ENTITY_REFERENCE_NODE, ENTITY_NODE, PROCESSING_INSTRUCTION_NODE, COMMENT_NODE, DOCUMENT_NODE, DOCUMENT_TYPE_NODE, DOCUMENT_FRAGMENT_NODE, NOTATION_NODE, baseuri, textcontent, DOCUMENT_POSITION_DISCONNECTED, DOCUMENT_POSITION_PRECEDING, DOCUMENT_POSITION_FOLLOWING, DOCUMENT_POSITION_CONTAINS, DOCUMENT_POSITION_CONTAINED_BY, DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC Methods of prototype of prototype of prototype of prototype of prototype: \ tostring Javascript <a> DOM blur focus href hreflang insertbefore DOM Inspector DOM Inspector Javascript Javascript Javascript Javascript Javascript 3.5 Web Developer extension Aardvark id class Venkman Javascript Debugger Javascript 2 Web Development Bookmarklets JSUnit Javascript. 2

25 js-unit Javascript

26 4 4.1 www. 9: // ==UserScript== // ==/UserScript== Butler Salon Auto-Pass 4.2 Greasemonkey Greasemonkey Greasemonkey 10: Greasemonkey if (!GM_xmlhttpRequest) { alert( Please upgrade to the latest version of Greasemonkey. ); return; // more code here that uses GM_xmlhttpRequest 25

27 4.3 HTML getelementsbytagname HTML 11: <textarea> var textareas = document.getelementsbytagname( textarea ); if (textareas.length) { // there is at least one textarea on this page else { // there are no textareas on this page BetterDir Zoom Textarea 4.4 HTML HTML Firefox getelementsby Tagname( * ) 12: var allelements, thiselement; allelements = document.getelementsbytagname( * ); for (var i = 0; i < allelements.length; i++) { thiselement = allelements[i]; // do something with thiselement XPath Anti-Disabler

28 4.5 HTML HTML <textarea> getelementsbytagname( tagname ) 13: textarea var alltextareas, thistextarea; alltextareas = document.getelementsbytagname( textarea ); for (var i = 0; i < alltextareas.length; i++) { thistextarea = alltextareas[i]; // do something with thistextarea <a> Zoom Textarea 4.6 Greasemonkey evaluate XPath getelementsbytagname( a ) <a> href Firefox XPath href <a> var alllinks, thislink; alllinks = document.evaluate( //a[@href], document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); for (var i = 0; i < alllinks.snapshotlength; i++) {

29 thislink = alllinks.snapshotitem(i); // do something with thislink document.evaluate XPath XPath href <a> alllinks.snapshotitem(i) XPath title 14: title var allelements, thiselement; allelements = document.evaluate( //*[@title], document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); for (var i = 0; i < allelements.snapshotlength; i++) { thiselement = allelements.snapshotitem(i); switch (thiselement.nodename.touppercase()) { case A : // this is a link, do something break; case IMG : // this is an image, do something else break; default: // do something with other kinds of HTML elements thiselement thiselement.nodename HTML text/html application/xhtml+xml thiselement.nodename.touppercase() class <div> XPath 15: sponseredlink class div

30 var alldivs, thisdiv; alldivs = document.evaluate( "//div[@class= sponsoredlink ]", document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); for (var i = 0; i < alldivs.snapshotlength; i++) { thisdiv = alldivs.snapshotitem(i); // do something with thisdiv XPath document.evaluate document XPath document.getelementbyid document.getelementsbytagname 3 application/xhtml+xml Mozilla XPath Documentation 4 2 XPathResult.UNORDERED NODE SNAPSHOT TYPE XPathResult.ORDERED NODE SN APSHOT TYPE Mozilla XPath Documentation 5 2 XPath document.evaluate 2 null XPath XPath XPath XPath document.evaluate 16: xpath

31 function xpath(query) { return document.evaluate(query, document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); xpath( //a[@href] ) title xpath( //*[@title] ) snapshotitem Javascript Access Bar BetterDir Blogdex Display Title Butler Frownies Offsite Blank Rotten Reviews Stop The Presses Mozilla XPath documentation XPath tutorial by example XPathResult reference 4.7 insertbefore ID main 17: <hr>

32 var main, newelement; main = document.getelementbyid( main ); if (main) { newelement = document.createelement( hr ); main.parentnode.insertbefore(newelement, main); Butler Zoom Textarea 4.8 nextsibling insertbefore navbar ID 18: <hr> var navbar, newelement; navbar = document.getelementbyid( navbar ); if (navbar) { newelement = document.createelement( hr ); navbar.parentnode.insertbefore(newelement, navbar.nextsibling); someexistingelement 1 someexistingelement.nextsibling someexistingelement.nextsibling null insertbefore Blogdex Display Title Butler 1 sibling

33 4.9 Greasemonkey removechild ads ID 19: var adsidebar = document.getelementbyid( ads ); if (adsidebar) { adsidebar.parentnode.removechild(adsidebar); removechild <table> <td> AdBlock up-to-date filter list Butler 4.10 replacechild annoyingsmily ID 20: var theimage, alttext; theimage = document.getelementbyid( annoyingsmily ); if (theimage) { alttext = document.createtextnode(theimage.alt); theimage.parentnode.replacechild(alttext, theimage); HTML HTML innerhtml Frownies

34 4.11 HTML innerhtml HTML HMTL DOM 21: var logo = document.createelement("div"); logo.innerhtml = + YOUR TEXT HERE + ; document.body.insertbefore(logo, document.body.firstchild); 2 logo.innerhtml Firefox HTML logo <p> <div> <div> Access Bar Butler BetterDir 4.12 Firefox data:url URL data:url Internet Explorer 22: var logo = document.createelement( img ); logo.src = \ data:image/gif;base64,r0lgodlhdqaoajeaanno6wbmzgaaaaaaach5baaaaaaa + LAAAAAANAA4AQAIjjI8Iyw3GhACSQecutsFV3nzgNi7SVEbo06lZa66LRib2UQAAOw%3D%3D ; document.body.insertbefore(logo, document.body.firstchild);

35 <img> src data:url data:url data:url kitchen Butler Zoom Textarea data: URI kitchen 4.13 CSS CSS 23: function addglobalstyle(css) { var head, style; head = document.getelementsbytagname( head )[0]; if (!head) { return; style = document.createelement( style ); style.type = text/css ; style.innerhtml = css; head.appendchild(style); addglobalstyle( p { font-size: large! important; ); <style> <head> Firefox

36 addglobalstyle! important Access Bar Aint It Readable BetterDir Butler CDReadable LIP : Ain t It Readable 4.14 CSS sytle style="" getcomputedstyle <p> <p> style <html> <head> <title>style test page</title> <style type="text/css"> p { background-color: white; color: red; </style> </head> <body> <p id="p1">this line is red.</p> <p id="p2" style="color: blue">this line is blue.</p> </body> </html>

37 24: var p1elem, p2elem; p1elem = document.getelementbyid( p1 ); p2elem = document.getelementbyid( p2 ); alert(p1elem.style.color); // will display an empty string alert(p2elem.style.color); // will display "blue" element.style ; getcomputestyle() 25: var p1elem, p2elem, p1style, p2style; p1elem = document.getelementbyid( p1 ); p2elem = document.getelementbyid( p2 ); p1style = getcomputedstyle(p1elem, ); p2style = getcomputedstyle(p2elem, ); alert(p1style.color); // will display "rgb(255, 0, 0)" alert(p2style.color); // will display "rgb(0, 0, 255)" Butler Zoom Textarea 4.15 style logo ID 26: var logo = document.getelementbyid( logo ); logo.style.margintop = 2em ; logo.style.backgroundcolor = white ; logo.style.color = red ;

38 margin-top someelement.style.margintop float someelement.style.cssfloat float Javascript Access Bar BetterDir Blogdex Display Title Zoom Textarea CSS properties 4.16 Firefox DOM addeventlistner 27: var newbody = ; window.addeventlistener( load, function() { document.body.innerhtml = newbody;, true); window.addevent Listner newbody (closure)javascript

39 document.body.innerhtml CSS <head> Access Bar BetterDir 4.17 HTML XPath 28: POST post var postforms = document.evaluate( "//form[translate(@method, POST, post )= post ]", document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); XPath POST translate method XPath 2.0 lowercase translate post ForceGet 4.18 window.location.href

40 URL window.location.host 29: var href = window.location.host; Offsite Blank 4.19 href article ID 30: var a = document.getelementbyid( article ); if (a.href.match(/\?/i)) { // link already contains other parameters, so append "&printer=1" a.href += &printer=1 ; else { // link does not contain any parameters, so append "?printer=1" a.href +=?printer=1 ; Rotten Reviews Stop The Presses 4.20 Greasemonkey window.location.href 31: window.location.href = window.location.href.replace(/^ https: ); GMail Secure Salon Auto-Pass

41 4.21 addeventlister 32: document.addeventlistener( click, function(event) { // event.target is the element that was clicked // do whatever you want here // if you want to prevent the default click action // (such as following a link), use these two commands: event.stoppropagation(); event.preventdefault();, true); document.addeventlistener 4.22 Javascript prototype 33: function newsubmit(event) { var target = event? event.target : this; // do anything you like here alert( Submitting form to + target.action); // call real submit function this._submit(); // capture the onsubmit event on all forms window.addeventlistener( submit, newsubmit, true); // If a script calls someform.submit(), the onsubmit event does not fire,

42 // so we need to redefine the submit method of the HTMLFormElement class. HTMLFormElement.prototype._submit = HTMLFormElement.prototype.submit; HTMLFormElement.prototype.submit = newsubmit; 2 submit submit (submit) submit() submit HTMLFormElement submit 2 newsubmit submit event event.target submit event this newsubmit event null this 2 Enter submit aform.submit() submit 2 submit HTMLFormElement submit Javascript event compatibility tables Javascript-DOM prototypes in Mozilla Displaying Event object constants 4.23 XML Firefox DOM XML DOM 34: XML 2

43 var xmlstring = var parser = new DOMParser(); var xmldoc = parser.parsefromstring(xmlstring, "application/xml"); DOMParser parsefromstring parsefromstring 2 XML DOMParser parsefromstring 2 application/xml, application/xhtml+xml, text+html application/xml GM xmlhttprequest XML 35: XML M_xmlhttpRequest({ method: GET, url: headers: { User-agent : Mozilla/4.0 (compatible) Greasemonkey/0.3, Accept : application/atom+xml,application/xml,text/xml,, onload: function(responsedetails) { var parser = new DOMParser(); var dom = parser.parsefromstring(responsedetails.responsetext, "application/xml"); var entries = dom.getelementsbytagname( entry ); var title; for (var i = 0; i < entries.length; i++) { title = entries[i].getelementsbytagname( title )[0].textContent; alert(title); ); Atom DOM DOM DOM iterate-one-element.html

44 GM xmlhttprequest

45 5 5.1 : Gmail Secure GMail Secure GMail Google GMail ( ) ( ) GMail 36: GMail // ==UserScript== GMailSecure force GMail to use secure connection // ==/UserScript== window.location.href = window.location.href.replace(/^ https: GMail URL 44

46 window.location.href = window.location.href.replace(/^ https: ); 5.2 : Blogline Autoload Bloglines 2 Bloglines Bloglines 37: Bloglines // ==UserScript== Bloglines Autoloader Auto-display all new items in Bloglines // ==/UserScript== if (doloadall) { doloadall(); Bloglines doloadall() doloadall() if (doloadall) {

47 doloadall(); bloglines-autoload.user.js 5.3 : Ain t It Readable Ain t It Cool News 38: aintitreadable.user.js // ==UserScript== Ain t It Readable change style on aint-it-cool-news.com // ==/UserScript== function addglobalstyle(css) { var head, style; head = document.getelementsbytagname( head )[0]; if (!head) { return; style = document.createelement( style ); style.type = text/css ; style.innerhtml = css; head.appendchild(style); addglobalstyle( h1, h2, h3, h4 { + font-size: 12px! important; +

48 line-height: 14px! important; + font-weight: normal! important; + + h1:hover, h2:hover, h3:hover, h4:hover { + background-color: inherit! important; + color: inherit! important; + ); CSS CSS function addglobalstyle(css) { var head, style; head = document.getelementsbytagname( head )[0]; if (!head) { return; style = document.createelement( style ); style.type = text/css ; style.innerhtml = css; head.appendchild(style); CSS! important addglobalstyle( h1, h2, h3, h4 { + font-size: 12px! important; + line-height: 14px! important; + font-weight: normal! important; + + h1:hover, h2:hover, h3:hover, h4:hover { + background-color: inherit! important; + color: inherit! important; + );

49 aintitreadable.user.js CSS 5.4 : Offsite Blank Offsite Blank Gresemonkey Offsite Blank 39: offsiteblank.user.js // ==UserScript== Offsite Blank force offsite links to open in a new window // ==/UserScript== var a, thisdomain, links; thisdomain = window.location.host; links = document.getelementsbytagname( a ); for (var i = 0; i < links.length; i++) { a = links[i]; if (a.host && a.host!= thisdomain) { a.target = "_blank"; HTML 4

50 thisdomain = window.location.host; XPath document.getelementsbytagname( a ) links = document.getelementsbytagname( a ); <a> HTTP URL FTP a.host for (var i = 0; i < links.length; i++) { a = links[i]; if (a.host && a.host!= thisdomain) {... target " blank" a.target = "_blank"; offsiteblank.user.js HTML

51 5.5 : Dumb Quotes DumbQuotes (publishing software) ASCII 1 7 ASCII 40: dumbquotes.user.js // ==UserScript== DumbQuotes straighten curly quotes and apostrophes, simplify fancy \ dashes, etc. * // ==/UserScript== var replacements, regex, key, textnodes, node, s; replacements = { "\xa0": " ", "\xa9": "(c)", "\xae": "(r)", "\xb7": "*", "\u2018": " ", "\u2019": " ", "\u201c": ", "\u201d": ", "\u2026": "...", "\u2002": " ", "\u2003": " ", "\u2009": " ", "\u2013": "-", "\u2014": "--", "\u2122": "(tm)"; regex = {; for (key in replacements) { regex[key] = new RegExp(key, g ); 1

52 textnodes = document.evaluate( "//text()", document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); for (var i = 0; i <textnodes.snapshotlength; i++) { node = textnodes.snapshotitem(i); s = node.data; for (key in replacements) { s = s.replace(regex[key], replacements[key]); node.data = s; Javascript 8 7 replacements = { "\xa0": " ", "\xa9": "(c)", "\xae": "(r)", "\xb7": "*", "\u2018": " ", "\u2019": " ", "\u201c": ", "\u201d": ", "\u2026": "...", "\u2002": " ", "\u2003": " ", "\u2009": " ", "\u2013": "-", "\u2014": "--", "\u2122": "(tm)";

53 regex = {; for (key in replacements) { regex[key] = new RegExp(key, g ); { replacements["\xa0"] = " "; replacements["\xa9"] = "(c)"; replacements["\xae"] = "(r)"; // and so forth 8 16 \xa0 \u g document. body.innerhtml var tmp = document.body.innerhtml; // do a bunch of search/replace on tmp document.body.innerhtml = tmp; innerhtml HTML 8 innerhtml XPath textnodes = document.evaluate( "//text()", document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); 2

54 XPath text() <a> alt <img> DOM 3 //[@href] XPath for (var i = 0; i <textnodes.snapshotlength; i++) { node = textnodes.snapshotitem(i); s = node.data; // do replacements node.data = s; node s node s for (key in replacements) { s = s.replace(regex[key], replacements[key]); dumbquotes.user.js 5.6 : Frownies Frownies Gresemonkey :-) ASCII

55 20 <img> alt alt 41: fronies.user.js // ==UserScript== Frownies convert graphical smilies to their text equivalents * // ==/UserScript== var smilies, images, img, replacement; smilies = [":)", ":-)" ":-(", ":(", ";-)", ";)", ":-D", ":D", ":-/", ":/", ":X", ":-X", ":\">", ":P", ":-P", ":O", ":-O", "X-(", "X(", ":->", ":>", "B-)", "B)", ">:)", ":((", ":(((", ":-((", ":))", ":-))", ":- ", ": ", "O:-)", "O:)", ":-B", ":B", "=;", "I)", "I-)", " -)", " )", ":-&", ":&", ":-$", ":$", "[-(", ":O)", ":@)", "3:-O", ":( )", "@;-", "**==", "(~~)", "*-:)", "8-X", "8X", "=:)", "<):)", ";;)", ":*", ":-*", ":S", ":-S", "/:)", "/:-)", "8- ", "8 ", "8-", "8", "(: ", "=P~", ":-?", ":?", "#-O", "#O", "=D>", "~:>", "%%-", "~O)", ":-L", ":L", "[-O<", "[O<", "@-)", "@)", "$-)", "$)", ">-)", ":-\"", ":^O", "B-(", "B(", ":)>-", "[-X", "[X", "\\:D/", ">:D<", "(%)", "=((", "#:-S", "#:S", "=))", "L-)", "L)", "<:-P", "<:P", ":-SS", ":SS", ":-W", ":W", ":-<", ":<", ">:P", ">:-P", ">:/", ";))", ":-@", "^:)^", ":-J", "(*)", ":GRIN:", ":-)", ":SMILE:", ":SAD:", ":EEK:", ":SHOCK:", ":???:", "8)", "8-)", ":COOL:", ":LOL:", ":MAD:", ":RAZZ:", ":OOPS:", ":CRY:", ":EVIL:", ":TWISTED:", ":ROLL:", ":WINK:", ":!:", ":?:", ":IDEA:", ":ARROW:", ":NEUTRAL:", ":MRGREEN:"]; images = document.evaluate( //img[@alt], document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); for (var i = 0; i <images.snapshotlength; i++) { img = images.snapshotitem(i); alt = img.alt.touppercase(); for (var j in smilies) { if (alt == smilies[j]) { replacement = document.createtextnode(alt);

56 img.parentnode.replacechild(replacement, img); alt 3. alt ASCII 4. <img> ASCII Javascript [ ] smilies = [":)", ":-)" ":-(", ":(", ";-)", ";)", ":-D", ":D", ":-/", ":/", ":X", ":-X", ":\">", ":P", ":-P", ":O", ":-O", "X-(", "X(", ":->", ":>", "B-)", "B)", ">:)", ":((", ":(((", ":-((", ":))", ":-))", ":- ", ": ", "O:-)", "O:)", ":-B", ":B", "=;", "I)", "I-)", " -)", " )", ":-&", ":&", ":-$", ":$", "[-(", ":O)", ":@)", "3:-O", ":( )", "@;-", "**==", "(~~)", "*-:)", "8-X", "8X", "=:)", "<):)", ";;)", ":*", ":-*", ":S", ":-S", "/:)", "/:-)", "8- ", "8 ", "8-", "8", "(: ", "=P~", ":-?", ":?", "#-O", "#O", "=D>", "~:>", "%%-", "~O)", ":-L", ":L", "[-O<", "[O<", "@-)", "@)", "$-)", "$)", ">-)", ":-\"", ":^O", "B-(", "B(", ":)>-", "[-X", "[X", "\\:D/", ">:D<", "(%)", "=((", "#:-S", "#:S", "=))", "L-)", "L)", "<:-P", "<:P", ":-SS", ":SS", ":-W", ":W", ":-<", ":<", ">:P", ">:-P", ">:/", ";))", ":-@", "^:)^", ":-J", "(*)", ":GRIN:", ":-)", ":SMILE:", ":SAD:", ":EEK:", ":SHOCK:", ":???:", "8)", "8-)", ":COOL:", ":LOL:", ":MAD:", ":RAZZ:", ":OOPS:", ":CRY:", ":EVIL:", ":TWISTED:", ":ROLL:", ":WINK:", ":!:", ":?:", ":IDEA:", ":ARROW:", ":NEUTRAL:", ":MRGREEN:"]; XPath alt <img> XPath

57 images = document.evaluate( //img[@alt], document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); 3 <img> alt touppercase() alt for (var i = 0; i <images.snapshotlength; i++) { img = images.snapshotitem(i); alt = img.alt.touppercase()) for (var j in smilies) { if (alt == smilies[j]) { //... <img> replacement = document.createtextnode(alt); img.parentnode.replacechild(replacement, img); frownies.user.js 5.7 : Zoom Textarea Zoom Textarea <textarea> <textarea>

58 Enter 42: zoomtextarea.user.js // ==UserScript== Zoom Textarea add controls to zoom textareas * // ==/UserScript== var textareas, textarea; textareas = document.getelementsbytagname( textarea ); if (!textareas.length) { return; function textarea_zoom_in(event) { var link, textarea, s; link = event.currenttarget; textarea = link._target; s = getcomputedstyle(textarea, ""); textarea.style.width = (parsefloat(s.width) * 1.5) + "px"; textarea.style.height = (parsefloat(s.height) * 1.5) + "px"; textarea.style.fontsize = (parsefloat(s.fontsize) + 7.0) + px ; event.preventdefault(); function textarea_zoom_out(event) { var link, textarea, s; link = event.currenttarget; textarea = link._target; s = getcomputedstyle(textarea, ""); textarea.style.width = (parsefloat(s.width) * 2.0 / 3.0) + "px"; textarea.style.height = (parsefloat(s.height) * 2.0 / 3.0) + "px"; textarea.style.fontsize = (parsefloat(s.fontsize) - 7.0) + "px"; event.preventdefault(); function createbutton(target, func, title, width, height, src) { var img, button; img = document.createelement( img ); img.width = width; img.height = height; img.style.bordertop = img.style.borderleft = "1px solid #ccc"; img.style.borderright = img.style.borderbottom = "1px solid #888";

59 img.style.marginright = "2px"; img.src = src; button = document.createelement( a ); button._target = target; button.title = title; button.href = # ; button.onclick = func; button.appendchild(img); return button; for (var i = 0; i <textareas.length; i++) { textarea = textareas[i]; textarea.parentnode.insertbefore( createbutton( textarea, textarea_zoom_in, Increase textarea size, 20, 20, data:image/gif;base64, + R0lGODlhFAAUAOYAANPS1tva3uTj52NjY2JiY7KxtPf3%2BLOys6WkpmJiYvDw8fX19vb + 296Wlpre3uEZFR%2B%2Fv8aqpq9va3a6tr6Kho%2Bjo6bKytZqZml5eYMLBxNra21JSU3 + Jxc3RzdXl4emJhZOvq7KamppGQkr29vba2uGBgYdLR1dLS0lBPUVRTVYB%2Fgvj4%2BYK + Bg6SjptrZ3cPDxb69wG1tbsXFxsrJy29vccDAwfT09VJRU6uqrFlZW6moqo2Mj4yLjLKy + s%2fj4%2bk%2busu7t783nz3l4e19fx7u6vaalqnps1mjhylzvv318ftfw2uhhsg9uccv + KzfHw8qqqrNPS1eXk5tvb3K%2BvsHNydeLi40pKS2JhY2hnalpZWlVVVtDQ0URDRJmZm5 + mym11dxp2cnm9vcfxcxaojo0pjssc%2fwuxk6aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa + AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC + H5BAAAAAAALAAAAAAUABQAAAeagGaCg4SFhoeIiYqKTSQUFwgwi4JlB0pOCkEiRQKKRxM + gkwmgdfeqbypprj4gawwlckqsijwqbaqjcunsw1mksualnivvjzivsio7gruagzuoptpc + iguemyntiwmhgc2kal5hcbenydlcwc7gob1ldzrdwlzmazoejl83vpb3ggafundo5w%2f + AFRQxJPj7J4aMhYWCoPyASFFRIAA7 ), textarea); textarea.parentnode.insertbefore( createbutton( textarea, textarea_zoom_out, Decrease textarea size, 20, 20, data:image/gif;base64, + R0lGODlhFAAUAOYAANPS1uTj59va3vDw8bKxtGJiYrOys6Wkpvj4%2BPb29%2FX19mJiY + %2Ff3%2BKqqrLe3uLKytURDRFpZWqmoqllZW9va3aOjo6Kho4KBg729vWJhZK%2BuskZF + R4B%2FgsLBxHNydY2Mj%2Ff396amptLS0l9fX9fW2dDQ0W1tbpmZm8DAwfT09fHw8n18f + uli49lr1v5eyojo6vbpua6tr769wehhsnra20pjstps1kuqrnps1zmym%2b7t77kys8rj + y%2fj4%2basjpm9uca%2bvsmjhyqalqhrzdvjru8pdxvrtvcvkzc3nz0pks9rz3evq7mc + %2FwsXFxp2cnnl4e1VVVu%2Fv8ba2uM7Oz29vcbu6vZqZmnJxc9vb3PHx8uXk5mhnamJh + Y1xcXZGQklZVV29vcHl4eoyLjKqpq6Wlpl1dXuXk6AAAAAAAAAAAAAAAAAAAAAAAAAAAA +

60 AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA + AAACH5BAAAAAAALAAAAAAUABQAAAeZgGaCg4SFhoeIiYqKR1IWVgcyi4JMBiQqA0heQgG + KQTFLPQgMCVocBIoNNqMgCQoDVReKYlELCwUFI1glEYorOgopWSwiTUVfih8dLzRTKA47 + Ek%2BKBGE8GEAhFQYuPooBOWAHY2ROExBbSt83QzMbVCdQST8Ck4QtZUQe9faCABlGrvD + rb4aldbmu%2bvnruuobqke4ndycqcgqads%3d ), textarea); textarea.parentnode.insertbefore( document.createelement( br ), textarea); data:uri <textarea> HTML return textareas = document.getelementsbytagname( textarea ); if (!textareas.length) { return; Javascript 2 function createbutton(target, func, title, width, height, src) { createbutton 6 target <textarea> func Enter Javascript title width src height src

61 src URL data:uri 2 <img> <a> document.createelement <img> img = document.createelement( img ); img._target = target; img.width = width; img.height = height; img.style.bordertop = img.style.borderleft = "1px solid #ccc"; img.style.borderright = img.style.borderbottom = "1px solid #888"; img.style.marginright = "2px"; img.src = src; 2 2 img.style.bordertop = img.style.borderleft = "1px solid #ccc"; <a> <img> button = document.createelement( a ); button._target = target; button.title = title; button.href = # ; button.onclick = func; button.appendchild(img); 2 href Firefox target <textarea> Javascript onclick target onclick event

62 function textarea_zoom_in(event) event currenttarget link = event.currenttarget; Event target event.target Enter event.target event.target DOM event.currenttarget <textarea> target textarea = link._target; <textarea> textarea.style textarea.style.width, textarea.style.height, textarea.style.fontsize <textarea> getcomputedstyle s = getcomputedstyle(textarea, ""); textarea.style.width = (parsefloat(s.width) * 1.5) + "px"; textarea.style.height = (parsefloat(s.height) * 1.5) + "px"; textarea.style.fontsize = (parsefloat(s.fontsize) + 7.0) + px ; href? Firefox onclick Firefox onclick event.preventdefault()

63 event.preventdefault(); <textarea> onclick <textarea> data:uri for (var i = 0; i <textareas.length; i++) { textarea = textareas[i]; textarea.parentnode.insertbefore( createbutton( textarea, textarea_zoom_in, Increase textarea size, 20, 20, data:image/gif;base64, + R0lGODlhFAAUAOYAANPS1tva3uTj52NjY2JiY7KxtPf3%2BLOys6WkpmJiYvDw8fX19vb + 296Wlpre3uEZFR%2B%2Fv8aqpq9va3a6tr6Kho%2Bjo6bKytZqZml5eYMLBxNra21JSU3 + Jxc3RzdXl4emJhZOvq7KamppGQkr29vba2uGBgYdLR1dLS0lBPUVRTVYB%2Fgvj4%2BYK + Bg6SjptrZ3cPDxb69wG1tbsXFxsrJy29vccDAwfT09VJRU6uqrFlZW6moqo2Mj4yLjLKy + s%2fj4%2bk%2busu7t783nz3l4e19fx7u6vaalqnps1mjhylzvv318ftfw2uhhsg9uccv + KzfHw8qqqrNPS1eXk5tvb3K%2BvsHNydeLi40pKS2JhY2hnalpZWlVVVtDQ0URDRJmZm5 + mym11dxp2cnm9vcfxcxaojo0pjssc%2fwuxk6aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa + AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC + H5BAAAAAAALAAAAAAUABQAAAeagGaCg4SFhoeIiYqKTSQUFwgwi4JlB0pOCkEiRQKKRxM + gkwmgdfeqbypprj4gawwlckqsijwqbaqjcunsw1mksualnivvjzivsio7gruagzuoptpc + iguemyntiwmhgc2kal5hcbenydlcwc7gob1ldzrdwlzmazoejl83vpb3ggafundo5w%2f + AFRQxJPj7J4aMhYWCoPyASFFRIAA7 ), textarea); textarea.parentnode.insertbefore( createbutton( textarea, textarea_zoom_out, Decrease textarea size, 20, 20, data:image/gif;base64, + R0lGODlhFAAUAOYAANPS1uTj59va3vDw8bKxtGJiYrOys6Wkpvj4%2BPb29%2FX19mJiY + %2Ff3%2BKqqrLe3uLKytURDRFpZWqmoqllZW9va3aOjo6Kho4KBg729vWJhZK%2BuskZF + R4B%2FgsLBxHNydY2Mj%2Ff396amptLS0l9fX9fW2dDQ0W1tbpmZm8DAwfT09fHw8n18f + uli49lr1v5eyojo6vbpua6tr769wehhsnra20pjstps1kuqrnps1zmym%2b7t77kys8rj + y%2fj4%2basjpm9uca%2bvsmjhyqalqhrzdvjru8pdxvrtvcvkzc3nz0pks9rz3evq7mc + %2FwsXFxp2cnnl4e1VVVu%2Fv8ba2uM7Oz29vcbu6vZqZmnJxc9vb3PHx8uXk5mhnamJh + Y1xcXZGQklZVV29vcHl4eoyLjKqpq6Wlpl1dXuXk6AAAAAAAAAAAAAAAAAAAAAAAAAAAA + AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA +

64 AAACH5BAAAAAAALAAAAAAUABQAAAeZgGaCg4SFhoeIiYqKR1IWVgcyi4JMBiQqA0heQgG + KQTFLPQgMCVocBIoNNqMgCQoDVReKYlELCwUFI1glEYorOgopWSwiTUVfih8dLzRTKA47 + Ek%2BKBGE8GEAhFQYuPooBOWAHY2ROExBbSt83QzMbVCdQST8Ck4QtZUQe9faCABlGrvD + rb4aldbmu%2bvnruuobqke4ndycqcgqads%3d ), textarea); textarea.parentnode.insertbefore( document.createelement( br ), textarea); zoomtextarea.user.js Event documentation HTML 5.8 : Access Bar Access Bar Firefox Access Bar 43: accessbar.user.js // ==UserScript== Access Bar show accesskeys defined on page * // ==/UserScript== function addglobalstyle(css) {

65 var head, style; head = document.getelementsbytagname( head )[0]; if (!head) { return; style = document.createelement( style ); style.type = text/css ; style.innerhtml = css; head.appendchild(style); var akeys, descriptions, a, desc, label, div; akeys = document.evaluate( "//*[@accesskey]", document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); if (!akeys.snapshotlength) { return; descriptions = new Array(); desc = ; for (var i = 0; i <akeys.snapshotlength; i++) { a = akeys.snapshotitem(i); desctext = ; if (a.nodename == INPUT ) { label = document.evaluate("//label[@for= " + a.name + " ]", document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singlenodevalue; if (label) { desctext = label.title; if (!desctext) { desctext = label.textcontent; if (!desctext) { desctext = a.textcontent; if (!desctext) { desctext = a.title; if (!desctext) { desctext = a.name; if (!desctext) { desctext = a.id; if (!desctext) { desctext = a.href; if (!desctext) { desctext = a.value; desc = [ + a.getattribute( accesskey ).touppercase() + ] ; if (a.href) { desc += + desctext + ; else { desc += desctext; descriptions.push(desc); descriptions.sort();

66 div = document.createelement( div ); div.id = accessbar-div-0 ; desc = + descriptions[0] + + descriptions[i] + ; div.innerhtml = desc; document.body.style.paddingbottom = "4em"; window.addeventlistener( "load", function() { document.body.appendchild(div);, true); addglobalstyle( #accessbar-div-0 { + position: fixed; + left: 0; + right: 0; + bottom: 0; + top: auto; + border-top: 1px solid silver; + background: black; + color: white; + margin: 1em 0 0 0; + padding: 5px 0 0.4em 0; + width: 100%; + font-family: Verdana, sans-serif; + font-size: small; + line-height: 160%; + + #accessbar-div-0 a, + #accessbar-div-0 li, + #accessbar-div-0 span, + #accessbar-div-0 strong { + background-color: transparent; + color: white; + + #accessbar-div-0 div { + margin: 0 1em 0 1em; + + #accessbar-div-0 div ul { + margin-left: 0; + margin-bottom: 5px; + padding-left: 0; + display: inline; + + #accessbar-div-0 div ul li { + margin-left: 0; + padding: 3px 15px; + border-left: 1px solid silver; + list-style: none; +

67 display: inline; + + #accessbar-div-0 div ul li.first { + border-left: none; + padding-left: 0; + ); 6 1. addglobalstyle 2. accesskey accesskey 5. ul li 6. addglobalstyle 6 CSS CSS function addglobalstyle(css) { var head, style; head = document.getelementsbytagname( head )[0]; if (!head) { return; style = document.createelement( style ); style.type = text/css ; style.innerhtml = css; head.appendchild(style); 2 accesskey Firefox XPath XPath

68 var akeys, descriptions, a, i, desc, label, div; akeys = document.evaluate( "//*[@accesskey]", document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null); if (!akeys.snapshotlength) { return; 3 accesskey accesskey HTML input accesskey input input label label title input label input input value label input label accesskey label title title accesskey title title name id akeys XPathResult akeys.snapshotitem(i) akeys is an XPathResult object, so I need to get each result by calling \ akeys.snapshotitem(i). descriptions = new Array(); desc = ; for (var i = 0; i <akeys.snapshotlength; i++) { a = akeys.snapshotitem(i); desctext = ; if (a.nodename == INPUT ) { label = document.evaluate("//label[@for= " + a.name + " ]", document, null,

69 XPathResult.FIRST_ORDERED_NODE_TYPE, null).singlenodevalue; if (label) { desctext = label.title; if (!desctext) { desctext = label.textcontent; if (!desctext) { desctext = a.textcontent; if (!desctext) { desctext = a.title; if (!desctext) { desctext = a.name; if (!desctext) { desctext = a.id; if (!desctext) { desctext = a.href; if (!desctext) { desctext = a.value; desc = [ + a.getattribute( accesskey ).touppercase() + ] ; if (a.href) { desc += + desctext + ; else { desc += desctext; descriptions.push(desc); Javasript sort 4 descriptions.sort(); 5 HTML accesskey <div> HTML <div> innerhtml window.addeventlistener <div> onload innerhtml HTML window.addeventlistener div = document.createelement( div ); div.id = accessbar-div-0 ; desc = + descriptions[0] + + descriptions[i] + ; div.innerhtml = desc; document.body.style.paddingbottom = "4em"; window.addeventlistener( "load",

70 function() { document.body.appendchild(div);, true); 6 CSS HTML Firefox position: fixed CSS addglobalstyle( #accessbar-div-0 { + position: fixed; + left: 0; + right: 0; + bottom: 0; + top: auto; + border-top: 1px solid silver; + background: black; + color: white; + margin: 1em 0 0 0; + padding: 5px 0 0.4em 0; + width: 100%; + font-family: Verdana, sans-serif; + font-size: small; + line-height: 160%; + + #accessbar-div-0 a, + #accessbar-div-0 li, + #accessbar-div-0 span, + #accessbar-div-0 strong { + background-color: transparent; + color: white; + + #accessbar-div-0 div { + margin: 0 1em 0 1em; + + #accessbar-div-0 div ul { + margin-left: 0; + margin-bottom: 5px; + padding-left: 0; + display: inline; + + #accessbar-div-0 div ul li { + margin-left: 0; + padding: 3px 15px; +

71 border-left: 1px solid silver; + list-style: none; + display: inline; + + #accessbar-div-0 div ul li.first { + border-left: none; + padding-left: 0; + ); accessbar.user.js CSS HTML

72 6 6.1 Greasemonkey 2 GM setvalue GM getvalue GM setvalue GM getvalue Greasemonkey URL GM setvalue GM getvalue function GM_setValue(key, value); function GM_getValue(key, defaultvalue); key value GM getvalue defaultvalue key defaultvalue key GM getvalue undefined Gresemonkey 0.3 MyPIPsTag 71

73 POST Interceptor (GM registermenucommand ) MSDN Language Filter GM getvalue GM setvalue 6.2 Greasemonkey GM registermenucommand Firefox User Script Commands function GM_registerMenuCommand(menuText, callbackfunction); menutext callbackfunction callbackfunction Greasemonkey POST Interceptor GM registermenucommand 6.3 Greasemonkey GM xmlhttprequest URL GET URL POST GM xmlhttprequest Greasemonkey LibraryLookup Amazon.com

74 Annotate Google Google del.icio.us Bloglines Tweaks Expand Bloglines Expand Flick Batch Enhancer GM xmlhttprequest Flickr REST API Flickr Hide Google Redirects Google Personal Search History <a href="...">, URL GM xmlhttprequest. 6.4 Greasemonkey Javascript Firefox XPI Adrian Holovaty Greasemonkey Compiler 1. Butler 2. Greasemonkey compiler 3. Javascript Butler 4. Creator Mark Pilgrim 5. Version Butler GUID Generator GUID { GUID 7. Greasemonkey compiler GUID GUID Generator GUID 8. Homepage

75 9. Creater Firefox Extension Firefox Opening butler.xpi Save to disk Butler Butler Butler Google Greasemonkey Compiler butler.xpi Firefox.xpi ZIP ZIP Windows 7-zip Mac Stuffit Expander butler.xpi +-- install.rdf +-- chrome/ +-- butler/ +-- content/ +-- browser.xul +-- contents.rdf +-- javascript.js 4 RDF Firefox install.rdf URL contents.rdf Firefox javascript.js

76 Greasemonkey compiler Greasemonkey URL User Script Commands Extension Developer s Extension Firefox

77 7 Greasemonkey API 7.1 GM log GM log: Javascript function GM log(message ); GM log Javascript GM log Greasemonkey 0.3 GM log Javascript 7.2 GM getvalue GM getvalue: returntype GM getvalue(key, defaultvalue ); 76

78 7.2.3 GM getvalue key defaultvalue key defaultvalue key GM getvalue undefined Greasemonkey Greasemonkey URL about:config greasemonkey.scriptvals GM getvalue Greasemonkey 0.3 GM setvalue 7.3 GM setvalue GM setvalue: function GM setvalue(key, value ); GM setvalue key value Greasemonkey

79 Greasemonkey URL GM setvalue Greasemonkey 0.3 GM getvalue 7.4 GM registermenucommand GM registermenucommand: function GM registermenucommand(menutext,callbackfunction ); GM registermenucommand User Script Commands menutext callbackfunction function callbackfunction(e): e GM registermenucommand( Some &menu text, myfunction) Some &menu text 10090

80 7.4.5 GM registermenucommand Greasemonkey GM xmlhttprequest GM xmlhttprequest: HTTP GM xmlhttprequest(details ); GM xmlhttprequest HTTP details 7 method HTTP GET POST, PUT, DELETE HTTP url URL headers HTTP headers: { User-Agent : Mozilla/4.0 (compatible) Greasemonkey, Accept : application/atom+xml,application/xml,text/ xml data HTTP (method== POST ) headers application/x-www-form-urlencoded Content-type data URL onload onerror onreadystatechange

81 onload callback onload responsedetails function onloadcallback(responsedetails); responsedetails 5 status HTTP 200 statustext HTTP responseheaders HTTP responsetext readystate onerror callback onerror responsedetails function onerrorcallback(responsedetails); responsedetails 5 status HTTP 404 statustext HTTP responseheaders HTTP responsetext readystate

82 onreadystatechange callback onreadystatechange responsedetails function onreadystatechangecallback(responsedetails); responsedetails 5 responsedetails. readystate status HTTP responsedetails.readystate 4 0 statustext HTTP responsedetails.readystate 4 responseheaders HTTP responsedetails.r eadystate 4 responsetext responsedetails.readystate 4 readystate HTTP Atom GM_xmlhttpRequest({ method: GET, url: headers: { User-agent : Mozilla/4.0 (compatible) Greasemonkey,

83 Accept : application/atom+xml,application/xml,text/xml,, onload: function(responsedetails) { alert( Request for Atom feed returned + responsedetails.status + + responsedetails.statustext + \n\n + Feed data:\n + responsedetails.responsetext); ); onreadystatechange readystate < XMLHttpRequest GM xmlhttprequest GET POST GM xmlhttprequest Greasemonkey XMLHttpRequest support in Mozilla XMLHttpRequest support in Internet Explorer XMLHttpRequest support in Safari HTTP status codes RFC 2616

84 Added Case study: Zoom Textarea. Added Storing and retrieving persistent data. Added Adding items to the menubar. Added Integrating data from other sites. Added Compiling your user script into an extension Added Case study: Frownies. Changed void to function in Greasemonkey API Reference. ( You keep using that word. I do not think it means what you think it means. ) Added What is Greasemonkey?. Thanks, Dennis. Added Case study: Dumb Quotes. Added downloadable Palm OS database for reading on mobile devices Added Parsing XML. Added Case study: Offsite Blank. 83