JSFiddle - React, Tailwind, and code Playground
by JamesKyle
HTML
<link rel="stylesheet" href="http://cdn.thejameskyle.com/bootstrap.css">
<link rel="stylesheet" href="http://cdn.thejameskyle.com/bootstrap-responsive.css">
JavaScript
(function($) {
function shuffle(array) {
var tmp, current, top = array.length;
if (top) {
while (--top) {
current = Math.floor(Math.random() * (top + 1));
tmp = array[current];
array[current] = array[top];
array[top] = tmp;
}
}
return array;
}
$.fn.query = function(params) {
// Parameters //
var options = $.extend({
'shuffle': false,
'limit': undefined
}, params),
output = this;
// Shuffle //
if (options.shuffle) {
output = shuffle(this);
}
// Limit //
if (options.limit !== undefined) {
output = output.slice(0, options.limit);
}
return output;
};
$.fn.build = function(params) {
// Parameters //
var options = $.extend({
'wrapAll': undefined,
'splitBy': undefined,
'wrapRow': undefined,
'wrapEach': '<div />'
}, params),
build = [];
// Build Array //
for (var i = this.length - 1; i >= 0; i -= 1) {
var tmp = document.createElement('div'),
tmp2 = document.createTextNode(this[i]);
build.push(tmp.appendChild(tmp2));
}
// Wrap with jQuery //
build = $(build);
// Wrap Each //
if (options.wrapEach !== undefined) {
build = build.wrap(options.wrapEach).parent();
}
console.log(build);
//********
// Split into Rows //
if (options.splitBy !== undefined && options.wrapRow !== undefined) {
var tmp = [];
for (var i = build.length; i > 0; i -= options.splitBy) {
$(tmp).add(function() {
$(build.splice(i, i + options.splitBy)).wrapAll(options.wrapRow).parent();
});
...