Skip to content
Permalink
Browse files

Style: jQuery style guide fixes

  • Loading branch information...
patheard committed Oct 1, 2013
1 parent 412476b commit 71492ead6da3ec53b5ee558e9e6fa3fe9d891adb
Showing with 44 additions and 58 deletions.
  1. +17 −24 src/plugins/data-picture/data-picture.js
  2. +27 −34 src/plugins/toggle/toggle.js
@@ -12,25 +12,20 @@
var plugin = {
selector: "[data-picture]",


//Initialize the [data-picture] elements
init: function ( ) {
init: function() {
window._timer.remove( plugin.selector );
$( this )
.trigger( "picturefill.wb-data-picture" );
$( this ).trigger( "picturefill.wb-data-picture" );
},


//Handles window resize so images can be updated as new media queries match
resize: function () {
$( plugin.selector )
.trigger( "picturefill.wb-data-picture" );
resize: function() {
$( plugin.selector ).trigger( "picturefill.wb-data-picture" );
},


//Updates the image displayed according to media queries. This is the logic
//ported from Picturefill.
picturefill: function () {
picturefill: function() {
var i, len, matchedElm, media,
matches = [ ],
img = this.getElementsByTagName( "img" )[ 0 ],
@@ -54,26 +49,24 @@ var plugin = {
img.src = matchedElm.getAttribute( "data-src" );
matchedElm.appendChild( img );

// No match and an image exists: delete it
}
else if ( img !== undefined ) {
// No match and an image exists: delete it
} else if ( img !== undefined ) {
img.parentNode.removeChild( img );
}
}
};

// Bind the plugin's events
vapour.doc.on( "timerpoke.wb picturefill.wb-data-picture", plugin.selector,
function ( event ) {
switch ( event.type ) {
case "timerpoke":
plugin.init.apply( this, arguments );
break;
case "picturefill":
plugin.picturefill.apply( this, arguments );
break;
}
} );
vapour.doc.on( "timerpoke.wb picturefill.wb-data-picture", plugin.selector, function( event ) {
switch ( event.type ) {
case "timerpoke":
plugin.init.apply( this, arguments );
break;
case "picturefill":
plugin.picturefill.apply( this, arguments );
break;
}
});

vapour.win.on( "resize", plugin.resize );

@@ -6,7 +6,7 @@ notes : Plugin that allows a link to toggle elements between on and off states.
licence : wet-boew.github.io/wet-boew/License-en.html /
wet-boew.github.io/wet-boew/Licence-fr.html
*/
( function ( $, window, vapour ) {
(function ( $, window, vapour ) {

"use strict";

@@ -19,7 +19,7 @@ var $document = vapour.doc,


//Initialize the plugin
init: function ( ) {
init: function() {
var link = $( this );
window._timer.remove( plugin.selector );

@@ -28,9 +28,8 @@ var $document = vapour.doc,
link.trigger( "ariaControls.wb-toggle", {
selector: link.data( "selector" ),
parent: link.data( "parent" )
} );
}
else {
});
} else {
$.error(
".wb-toggle: you must specify a [data-selector] attribute with the CSS selector of the element(s) the toggle link controls."
);
@@ -42,7 +41,7 @@ var $document = vapour.doc,
* @param {jQuery Event} event The event that triggered this invocation
* @param {Object} data Simple key/value data object passed when the event was triggered
*/
setAriaControls: function ( event, data ) {
setAriaControls: function( event, data ) {
var elm, i, len,
elms = data.parent !== undefined ? $( data.parent ).find( data.selector ) : $( data.selector ),
ariaControls = "",
@@ -51,29 +50,26 @@ var $document = vapour.doc,
// Find the elements this link controls
for ( i = 0, len = elms.length; i < len; i++ ) {
elm = elms.eq( i );

if ( elm.attr( "id" ) === undefined ) {
elm.attr( "id", "wb-toggle_" + i );
}

ariaControls += elm.attr( "id" ) + " ";
}

link.attr( "aria-controls", ariaControls.slice( 0, -1 ) );
},

/**
* Click handler for the toggle links
* @param {jQuery Event} event The event that triggered this invocation
*/
click: function ( event ) {
click: function( event ) {
var link = $( this );

link.trigger( "toggle.wb-toggle", {
selector: link.data( "selector" ),
parent: link.data( "parent" ),
type: link.data( "type" )
} );
});

event.preventDefault( );
event.target.focus( );
@@ -84,7 +80,7 @@ var $document = vapour.doc,
* @param {jQuery Event} event The event that triggered this invocation
* @param {Object} data Simple key/value data object passed when the event was triggered
*/
toggle: function ( event, data ) {
toggle: function( event, data ) {
var elms = data.parent !== undefined ? $( data.parent ).find( data.selector ) : $( data.selector ),

stateFrom = plugin.getState( data.selector, data.parent, data.type ), // Current state of elements
@@ -101,7 +97,7 @@ var $document = vapour.doc,
* @param {String} parent CSS selector of the parent DOM element the link is restricted to.
* @param {String} type The type of link: undefined (toggle), "on" or "off"
*/
getState: function ( selector, parent, type ) {
getState: function( selector, parent, type ) {

// No toggle type: get the current on/off state of the elements specified by the selector and parent
if ( type === undefined ) {
@@ -123,7 +119,7 @@ var $document = vapour.doc,
* @param {String} parent CSS selector of the parent DOM element the link is restricted to.
* @param {String} state Current state of the elements: "on" or "off"
*/
setState: function ( selector, parent, state ) {
setState: function( selector, parent, state ) {
var prop;

// Check the selector object has been created
@@ -140,8 +136,7 @@ var $document = vapour.doc,
// No parent means set all states for the given selector. This is
// because toggle links that apply to the entire DOM also affect
// links that are restricted by parent.
}
else {
} else {
for ( prop in plugin.state[ selector ] ) {
if ( plugin.state[ selector ].hasOwnProperty( prop ) ) {
plugin.state[ selector ][ prop ] = state;
@@ -152,24 +147,22 @@ var $document = vapour.doc,
};

// Bind the plugin's events
$document.on( "timerpoke.wb ariaControls.wb-toggle toggle.wb-toggle click",
plugin.selector, function ( event ) {
switch ( event.type ) {
case "click":
plugin.click.apply( this, arguments );
break;
case "toggle":
plugin.toggle.apply( this, arguments );
break;
case "ariaControls":
plugin.setAriaControls.apply( this, arguments );
break;
case "timerpoke":
plugin.init.apply( this, arguments );
break;
}
} );

$document.on( "timerpoke.wb ariaControls.wb-toggle toggle.wb-toggle click", plugin.selector, function ( event ) {
switch ( event.type ) {
case "click":
plugin.click.apply( this, arguments );
break;
case "toggle":
plugin.toggle.apply( this, arguments );
break;
case "ariaControls":
plugin.setAriaControls.apply( this, arguments );
break;
case "timerpoke":
plugin.init.apply( this, arguments );
break;
}
});

// Add the timer poke to initialize the plugin
window._timer.add( plugin.selector );

0 comments on commit 71492ea

Please sign in to comment.
You can’t perform that action at this time.