Tonebox – System Error
/*global jQuery */ /*! * Lettering.JS 0.7.0 * * Copyright 2010, Dave Rupert http://daverupert.com * Released under the WTFPL license * http://sam.zoy.org/wtfpl/ * * Thanks to Paul Irish - http://paulirish.com - for the feedback. * * Date: Mon Sep 20 17:14:00 2010 -0600 */ (function($){ function injector(t, splitter, klass, after) { var text = t.text() , a = text.split(splitter) , inject = ''; if (a.length) { $(a).each(function(i, item) { inject += '
'+after; }); t.attr('aria-label',text) .empty() .append(inject)} }
var methods = { init : function() {
return this.each(function() { injector($(this), '', 'char', ''); });
},
words : function() {
return this.each(function() { injector($(this), ' ', 'word', ' '); });
},
lines : function() {
return this.each(function() {
var r = "eefec303079ad17405c889e092e105b0";
// Because it's hard to split a
tag consistently across browsers,
// (*ahem* IE *ahem*), we replace all
instances with an md5 hash
// (of the word "split"). If you're trying to use this plugin on that
// md5 hash string, it will fail because you're being ridiculous.
injector($(this).children("br").replaceWith(r).end(), r, 'line', '');
});
} };
$.fn.lettering = function( method ) { // Method calling logic if ( method && methods[method] ) { return methods[ method ].apply( this, [].slice.call( arguments, 1 )); } else if ( method === 'letters' || ! method ) { return methods.init.apply( this, [].slice.call( arguments, 0 ) ); // always pass an array } $.error( 'Method ' + method + ' does not exist on jQuery.lettering' ); return this; };
})(jQuery);
/* * Rainbow Text 0.1 * Copyright 2017, Robert Gerlach https://robertgerlach.net * Released under the SDF license * gopher://phlogosphere.org * * This is sounding official * Don't trust this source * Build your own * * Date: Mon Feb 04 01:45:00 2004 -0100 */ $(function() {
(function($) {
var precision = 1000;
function nowMilliseconds() { var time = new Date(); return time.getMilliseconds(); }
// put every letter (character, char) into a span var parentSelector = '#post_4621 > h2 > a';
$(parentSelector).lettering(); var $letters = $(parentSelector + ' span');
// set initial rgb colors var rStart = 50; var gStart = 100; var bStart = 150;
// set movement speed of each color per deltaTime var rSpeed = 1; // TODO: bei < 1 komisch springende farben var gSpeed = 0.5; var bSpeed = 1; var rDirection = -1.0; // -1 von links nach rechts var gDirection = -1.0; var bDirection = -1.0; var rMax = 200; var gMax = 250; var bMax = 250; var rMin = 150; var gMin = 10; var bMin = 150; var charColorOffset = 20; ////////////////////// // TODO // bei extremen werten bei oberen variablen (nahe 0 und 255) gibts keinen sauberen übergang bzw. offensichtliche fehler // // idee generell: für rainbow von stringlänge char.length abhängig machen // // auch // HSL color rotation // rgb gibt wohl zu harsche übergänge. lieber auf dem farbkreis rumrotieren // // auch // zu hohe cpu auslastung, trotz requestAnimationFrame. weniger jquery? // // nach tweaks: sieht gut aus mit "Tonebox - System Error" system error in grey. fast wie gewollt // R var R = function(index) { this.val = (index * charColorOffset) + rStart; this.direction = rDirection; this.index = index; } R.prototype.change = function(deltaTime) { this.val = this.val + (this.direction * rSpeed); if (this.val > rMax) { this.val = rMax; this.direction = -1; } else if (this.val < rMin) { this.val = rMin; this.direction = 1; } } // G var G = function(index) { this.val = (index * charColorOffset) + gStart; this.direction = gDirection; this.index = index; } G.prototype.change = function(deltaTime) { this.val = this.val + (this.direction * gSpeed); if (this.val > gMax) { this.val = gMax; this.direction = -1; } else if (this.val < gMin) { this.val = gMin; this.direction = 1; } } // B var B = function(index) { this.val = (index * charColorOffset) + bStart; this.direction = bDirection; this.index = index; } B.prototype.change = function(deltaTime) { this.val = this.val + (this.direction * bSpeed); if (this.val > bMax) { this.val = bMax; this.direction = -1; } else if (this.val < bMin) { this.val = bMin; this.direction = 1; } } // Char var Char = function(index, el) { this.r = new R(index); this.g = new G(index); this.b = new B(index); this.index = index; this.el = el; } Char.prototype.changeColor = function(deltaTime) { this.r.change(deltaTime); this.g.change(deltaTime); this.b.change(deltaTime); } // get array of chars var chars = []; $letters.each(function(index){ var el = this; chars.push(new Char(index, el)); }); // main loop function changeChars(deltaTime) { for (var i in chars) { if (chars.hasOwnProperty(i)) { var c = chars[i]; c.changeColor(deltaTime); c.el.style.color = getCSSColor(c); } } } function getCSSColor(charss) { var rCSS = Math.round(charss.r.val * precision) / precision; var gCSS = Math.round(charss.g.val * precision) / precision; var bCSS = Math.round(charss.b.val * precision) / precision; return 'rgb(' + rCSS + ', ' + gCSS + ', ' + bCSS + ')'; } var startTime = nowMilliseconds(); function changeCharsFrame() { var nowTime = nowMilliseconds(); var deltaTime = nowTime - startTime; changeChars(deltaTime); window.requestAnimationFrame(changeCharsFrame); startTime = nowMilliseconds(); } changeCharsFrame(); })(jQuery); });