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

 
(8 intermediate revisions by the same user not shown)
Line 1: Line 1:
== JEP Shell - Example JEP ==
== JEP XXX - Shell JEP ==


* Champion: Testy McTest - mctest@mozilla.com
* Champion: Testy McTest - mctest@mozilla.com
* Status: Accepted/Pre-production
* Status: [Accepted, Under Review, Info Needed, Declined] / [In-Production, Pre-Production, Not-Started, Later Release]
**Status field can be Proposed or Accepted
* Bug Ticket: someTicket#
***Accepted detail flags are: Blocked, In-Queue, Pre-production, Production, Active, Deprecated
* Type: API
***Proposed detail flags are: Needs Review, Under Review, Needs Revision, Declined
* Difficulty: 4
* Type: Core
**Type field can be Core or API
 


=== Proposal ===
=== Proposal ===
* What will it do?
What does this JEP do in 1 sentence, additionally Who, What, When, Where, and Why is this JEP important.
* What does it enable internally/externally?
* How hard is it to implement?


=== Key Issues ===
What are the key issues to be considered within the context of this proposal?


=== Dependencies & Requirements ===
=== Dependencies & Requirements ===
* Are there any Firefox platform bugs blocking it?
* A list of all known dependencies and requirements for this JEP
* Does other Jetpack platform code need to be modified or added?
 
* Does its implementation affect any other projects or code?
== Capabilities Required (if applicable) ==
 
* Describe the capabilities that must be in-place for this JEP to function
 
== API Methods (if applicable) ==
 
//THIS IS EXAMPLE CONTENT!!!
 
==== Page Mods <i>Initialization</i> ====
 
<pre class="brush:js;">
var myMods = new pageMod({
  'matches': ['*.google.com', 'jetpack.mozillalabs.com'],
  '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']
  },
  'styles': {
      'body': {
          'background': '#ffffff',
          'font-family': 'Trebuchet MS'
      }
  },
  'script': function(){
      $('container').addEvents({
          'click:relay(ul li)': function(){ this.setStyles('background','#000') },
          'mousenter:relay(ul li)': function(){ this.tween('background','#000') },
          'mouseleave:relay(ul li)': function(){ this.tween('background','#fff') }
      });
  }
});
</pre>
 
==== Page Mods Method: <i>add</i> ====
 
<b>Arguments:</b>
 
#<b>type</b> - (<i>string</i>) The type of modifier being added. Can be 'matches', 'includes', 'styles', or 'script'. If the only argument passed in 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
#* styles: (<i>object</i>) an object whose keys are CSS selectors and whose values are objects composed of CSS property keys and values
#* script: (<i>function</i>) a function that will be injected into the page and called. By default, the function is bound with the target document's window object
 
<b>Returns:</b>
 
The Page Mods instance
 
<b>Notes:</b>
 
Modifications passed to the Page Mods instance with this method will be added, and persist, on open and future documents matching all of the URL(s) currently on the 'matches' white-list.
 
<b>Examples:</b>
 
<pre class="brush:js;">
myMods.add('matches', ['*.digg.com']);
 
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 remove method below for more info.
 
myMods.add('script', pageLog);
</pre>
 
== Use Cases ==


=== Internal Methods ===
# A list of add-ons and applications that would utilize this JEP
* What methods, mechanisms, or resources does this provide internally within the Jetpack platform code.


=== Common Actions ===


=== API Methods ===
* Common actions within add-ons or applications that would be reliant on such functionality?
* What are the pretty API wrapped methods externally exposed to Jetpack developers?
1,273

edits