238 lines
5.7 KiB
JavaScript
238 lines
5.7 KiB
JavaScript
/**
|
|
* Fizzy UI utils v2.0.3
|
|
* MIT license
|
|
*/
|
|
|
|
/*jshint browser: true, undef: true, unused: true, strict: true */
|
|
|
|
( function( window, factory ) {
|
|
// universal module definition
|
|
/*jshint strict: false */ /*globals define, module, require */
|
|
|
|
if ( typeof define == 'function' && define.amd ) {
|
|
// AMD
|
|
define( [
|
|
'desandro-matches-selector/matches-selector'
|
|
], function( matchesSelector ) {
|
|
return factory( window, matchesSelector );
|
|
});
|
|
} else if ( typeof module == 'object' && module.exports ) {
|
|
// CommonJS
|
|
module.exports = factory(
|
|
window,
|
|
require('desandro-matches-selector')
|
|
);
|
|
} else {
|
|
// browser global
|
|
window.fizzyUIUtils = factory(
|
|
window,
|
|
window.matchesSelector
|
|
);
|
|
}
|
|
|
|
}( window, function factory( window, matchesSelector ) {
|
|
|
|
'use strict';
|
|
|
|
var utils = {};
|
|
|
|
// ----- extend ----- //
|
|
|
|
// extends objects
|
|
utils.extend = function( a, b ) {
|
|
for ( var prop in b ) {
|
|
a[ prop ] = b[ prop ];
|
|
}
|
|
return a;
|
|
};
|
|
|
|
// ----- modulo ----- //
|
|
|
|
utils.modulo = function( num, div ) {
|
|
return ( ( num % div ) + div ) % div;
|
|
};
|
|
|
|
// ----- makeArray ----- //
|
|
|
|
// turn element or nodeList into an array
|
|
utils.makeArray = function( obj ) {
|
|
var ary = [];
|
|
if ( Array.isArray( obj ) ) {
|
|
// use object if already an array
|
|
ary = obj;
|
|
} else if ( obj && typeof obj.length == 'number' ) {
|
|
// convert nodeList to array
|
|
for ( var i=0; i < obj.length; i++ ) {
|
|
ary.push( obj[i] );
|
|
}
|
|
} else {
|
|
// array of single index
|
|
ary.push( obj );
|
|
}
|
|
return ary;
|
|
};
|
|
|
|
// ----- removeFrom ----- //
|
|
|
|
utils.removeFrom = function( ary, obj ) {
|
|
var index = ary.indexOf( obj );
|
|
if ( index != -1 ) {
|
|
ary.splice( index, 1 );
|
|
}
|
|
};
|
|
|
|
// ----- getParent ----- //
|
|
|
|
utils.getParent = function( elem, selector ) {
|
|
while ( elem != document.body ) {
|
|
elem = elem.parentNode;
|
|
if ( matchesSelector( elem, selector ) ) {
|
|
return elem;
|
|
}
|
|
}
|
|
};
|
|
|
|
// ----- getQueryElement ----- //
|
|
|
|
// use element as selector string
|
|
utils.getQueryElement = function( elem ) {
|
|
if ( typeof elem == 'string' ) {
|
|
return document.querySelector( elem );
|
|
}
|
|
return elem;
|
|
};
|
|
|
|
// ----- handleEvent ----- //
|
|
|
|
// enable .ontype to trigger from .addEventListener( elem, 'type' )
|
|
utils.handleEvent = function( event ) {
|
|
var method = 'on' + event.type;
|
|
if ( this[ method ] ) {
|
|
this[ method ]( event );
|
|
}
|
|
};
|
|
|
|
// ----- filterFindElements ----- //
|
|
|
|
utils.filterFindElements = function( elems, selector ) {
|
|
// make array of elems
|
|
elems = utils.makeArray( elems );
|
|
var ffElems = [];
|
|
|
|
elems.forEach( function( elem ) {
|
|
// check that elem is an actual element
|
|
if ( !( elem instanceof HTMLElement ) ) {
|
|
return;
|
|
}
|
|
// add elem if no selector
|
|
if ( !selector ) {
|
|
ffElems.push( elem );
|
|
return;
|
|
}
|
|
// filter & find items if we have a selector
|
|
// filter
|
|
if ( matchesSelector( elem, selector ) ) {
|
|
ffElems.push( elem );
|
|
}
|
|
// find children
|
|
var childElems = elem.querySelectorAll( selector );
|
|
// concat childElems to filterFound array
|
|
for ( var i=0; i < childElems.length; i++ ) {
|
|
ffElems.push( childElems[i] );
|
|
}
|
|
});
|
|
|
|
return ffElems;
|
|
};
|
|
|
|
// ----- debounceMethod ----- //
|
|
|
|
utils.debounceMethod = function( _class, methodName, threshold ) {
|
|
// original method
|
|
var method = _class.prototype[ methodName ];
|
|
var timeoutName = methodName + 'Timeout';
|
|
|
|
_class.prototype[ methodName ] = function() {
|
|
var timeout = this[ timeoutName ];
|
|
if ( timeout ) {
|
|
clearTimeout( timeout );
|
|
}
|
|
var args = arguments;
|
|
|
|
var _this = this;
|
|
this[ timeoutName ] = setTimeout( function() {
|
|
method.apply( _this, args );
|
|
delete _this[ timeoutName ];
|
|
}, threshold || 100 );
|
|
};
|
|
};
|
|
|
|
// ----- docReady ----- //
|
|
|
|
utils.docReady = function( callback ) {
|
|
var readyState = document.readyState;
|
|
if ( readyState == 'complete' || readyState == 'interactive' ) {
|
|
// do async to allow for other scripts to run. metafizzy/flickity#441
|
|
setTimeout( callback );
|
|
} else {
|
|
document.addEventListener( 'DOMContentLoaded', callback );
|
|
}
|
|
};
|
|
|
|
// ----- htmlInit ----- //
|
|
|
|
// http://jamesroberts.name/blog/2010/02/22/string-functions-for-javascript-trim-to-camel-case-to-dashed-and-to-underscore/
|
|
utils.toDashed = function( str ) {
|
|
return str.replace( /(.)([A-Z])/g, function( match, $1, $2 ) {
|
|
return $1 + '-' + $2;
|
|
}).toLowerCase();
|
|
};
|
|
|
|
var console = window.console;
|
|
/**
|
|
* allow user to initialize classes via [data-namespace] or .js-namespace class
|
|
* htmlInit( Widget, 'widgetName' )
|
|
* options are parsed from data-namespace-options
|
|
*/
|
|
utils.htmlInit = function( WidgetClass, namespace ) {
|
|
utils.docReady( function() {
|
|
var dashedNamespace = utils.toDashed( namespace );
|
|
var dataAttr = 'data-' + dashedNamespace;
|
|
var dataAttrElems = document.querySelectorAll( '[' + dataAttr + ']' );
|
|
var jsDashElems = document.querySelectorAll( '.js-' + dashedNamespace );
|
|
var elems = utils.makeArray( dataAttrElems )
|
|
.concat( utils.makeArray( jsDashElems ) );
|
|
var dataOptionsAttr = dataAttr + '-options';
|
|
var jQuery = window.jQuery;
|
|
|
|
elems.forEach( function( elem ) {
|
|
var attr = elem.getAttribute( dataAttr ) ||
|
|
elem.getAttribute( dataOptionsAttr );
|
|
var options;
|
|
try {
|
|
options = attr && JSON.parse( attr );
|
|
} catch ( error ) {
|
|
// log error, do not initialize
|
|
if ( console ) {
|
|
console.error( 'Error parsing ' + dataAttr + ' on ' + elem.className +
|
|
': ' + error );
|
|
}
|
|
return;
|
|
}
|
|
// initialize
|
|
var instance = new WidgetClass( elem, options );
|
|
// make available via $().data('namespace')
|
|
if ( jQuery ) {
|
|
jQuery.data( elem, namespace, instance );
|
|
}
|
|
});
|
|
|
|
});
|
|
};
|
|
|
|
// ----- ----- //
|
|
|
|
return utils;
|
|
|
|
}));
|