Changes

Jump to: navigation, search

CSS Checker JetPack Extension

1,730 bytes added, 13:31, 16 December 2010
How to Launch Add-on
* [[User:David.humphrey|Dave Humphrey]]
== Project Details How to Launch Add-on ==* main# Get [https://jetpack.js mozillalabs.com/ Add- executed upon launch; connects UI, pagemods and utility functions togetheron SDK]# Get [https://github.com/manoutoftime/cssChecker/ the code]# Populates UIPut the code under <code>jetpack_folder/packages/</code># Attaches Pagemod Execute <code>cfx run -b /path/to loading web pages/minefield/firefox.exe</code> under <code>jetpack_folder/packages/css-checker/</code> folder# Downloads external filesTry it out with on the examples in <code>css-checker/example/</code> folder
* funcs.js - a library with utility functions.# <code>parseCSS(css)</code> - parses CSS:* Arguments: CSS Style Sheet in String format:* Returns: Array of Objects with selector, property and value properties# <code>cssToXPath(rule)</code> - converts CSS Selector to XPath:* Arguments: CSS Selector in String format:* Returns: CSS Selector in XPath format== Project Details ==
'''Add-on SDK Code''' * [https://github.com/manoutoftime/cssChecker/blob/master/lib/main.js main.js] - executed upon launch; connects UI, pagemods and utility functions together.:* Populates UI:* Attaches pagemod.js to loading web pages:* Downloads external files * [https://github.com/manoutoftime/cssChecker/blob/master/lib/funcs.js funcs.js] - a library with utility functions.:* <code>parseCSS(css)</code> - parses CSS::* Arguments: CSS Style Sheet in String format::* Returns: Array of Objects with selector, property and value properties:* <code>cssToXPath(rule)</code> - converts CSS Selector to XPath::* Arguments: CSS Selector in String format::* Returns: CSS Selector in XPath format::* Note: stolen from Firebug project * [https://github.com/manoutoftime/cssChecker/blob/master/lib/ui.js ui.js] - a library that deals with User Interface.# :* <code>populateUI()</code> - populates widget::* Arguments: None::* Returns: None# ::* Dependencies: panel.html, panel.js:* <code>getStatus()</code> - returns status of whether or not to modify web pages::* Arguments: None::* Returns: Stringstatus, possible values: "Enabled", "Disabled". '''Content Scripts''' * [https://github.com/manoutoftime/cssChecker/blob/master/data/pagemod.js pagemod.js] - a script that is attached to all loading webpages.:* Sends CSS either as clear text or as a link to the add-on.:* Receives a list of styles to be applied and XPath to apply styles to. * [https://github.com/manoutoftime/cssChecker/blob/master/data/panel.js panel.js] - a script that modifies and sends status information to the add-on. '''UI Component'''* [https://github.com/manoutoftime/cssChecker/blob/master/data/panel.html panel.html] - UI elements that is displayed on widget click. == Releases == {| class="wikitable" border="1"! Release !! Notes !! Status|-| 0.1 || rewritten as of 0.3 || Done|-| 0.2 || rewritten as of 0.3 || Done|-| 0.3 || Added UI, Page-mods, content scripts, XMLHttpRequest. Removed: a lot of useless code. || Done|-| 0.4 || Write tests for funcs.parseCss and funcs.cssToXPath. Fix bugs if any come up. Release add-on on AMO. || In progress|}
== Project News ==

Navigation menu