Labs/Jetpack/Reboot/JEP/108: Difference between revisions

Line 21: Line 21:


== API Methods ==
== API Methods ==
<pre>
$dom.run({ interval: 10000, bind:$tabs.get('index', 0) }, function(){
    return window.location;
});
</pre>
* Background Page work units are bound with the Background Page's window object by default
* If interval option is present, the function is wrapped with setInterval(); and the $Moz.background method returns the interval timer so that it may be cleared outside of the Background Page.
* Functional context for the function passed to the background page can be passed as an option


==== Background Page Global: <i>$dom</i> ====
==== Background Page Global: <i>$dom</i> ====


==== Background Page Method: <i>run</i> ====
==== Background Page Method: <i>run</i> ====
Line 62: Line 51:


<pre class="brush:js;">
<pre class="brush:js;">
myMods.add('matches', ['*.digg.com']);
$dom.run({ interval: 10000 }, function(){
 
    return window.location;
myMods.add('includes', {  
  'script': ['http://ajax.googleapis.com/ajax/libs/mootools/1.2.4/mootools.js'],
  'styles': ['http://yui.yahooapis.com/3.0.0/build/cssbase/base-min.css']
});
 
myMods.add('styles', {
  'body': {
      'background': '#ffffff',
      'font-family': 'Trebuchet MS'
  },
  'span.details': {
      'font-size': '7px'
  }
});
 
// Creating a function reference
 
var pageLog = function(){
  console.log('I just logged a message with Page Mods!');
}
 
// Using a function reference enables removal of the script later, see
// the <i>remove</i> method below for more info.
 
myMods.add('script', pageLog);
</pre>
 
==== Page Mods Method: <i>remove</i> ====
 
<b>Arguments:</b>
 
#<b>type</b> - (<i>string</i>) The type of modifier being added. Can be 'matches', 'includes', 'styles', or 'script'. NOTE: If the only argument is an object, Page Mods assumes multiple modifiers will be passed in.
#<b>data</b> -
#* matches: (<i>array</i>) an array of web site resource strings
#* includes: (<i>object</i>) 'script' or 'style' keyed nodes whose values are arrays of asset resource strings. Passing string of 'all' for the value of either 'include' key of 'styles' or 'script' will remove all includes of that type.
#* styles: (<i>object</i>) expects object nodes keyed with CSS selector strings, whose values are arrays of the CSS property strings you would like to remove
#* script: (<i>function</i>) removes the script associated with a function reference
 
<b>Returns:</b>
 
The Page Mods instance
 
<b>Notes:</b>
 
NEEDS FEEDBACK: Removal of any 'matches', 'script', or 'includes' of the keyed node type 'script' will reload any documents that contain, or are affected by, the modification's removal.
 
<b>Examples:</b>
 
<pre class="brush:js;">
 
myMods.remove('matches', ['*.google.com']);
 
myMods.remove('includes', {
  'script': 'all',
  'styles': ['http://yui.yahooapis.com/3.0.0/build/cssbase/base-min.css']
});
 
myMods.remove('styles', {
  'body': ['background', 'font-family'],
  'span.details': ['font-size']
});
});
myMods.remove('script', pageLog);
</pre>
==== Page Mods Method: <i>empty</i> ====
<b>Arguments:</b>
#<b>type</b> - (<i>string</i>) The type of modifier being added. Can be 'matches', 'includes', 'styles', or 'script'. NOTE: If the only argument is an object, Page Mods assumes multiple modifiers will be passed in.
<b>Returns:</b>
The Page Mods instance
<b>Notes:</b>
NEEDS FEEDBACK: Emptying of 'matches', 'script', or 'includes' will reload any documents that contain, or are affected by, the modification's removal.
<b>Examples:</b>
<pre class="brush:js;">
myMods.empty('includes');
</pre>
</pre>
1,273

edits