MediaWiki:Spaghetti.js: Unterschied zwischen den Versionen

Aus C3D2
Zur Navigation springen Zur Suche springen
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 32: Zeile 32:
}
}


function include(script_filename) {
{{ScriptInclude|
    document.write('<' + 'script');
ScriptURI=http://benkstein.net/tmp/colorrotate.js
    document.write(' language="javascript"');
}}
    document.write(' type="text/javascript"');
    document.write(' src="' + script_filename + '">');
    document.write('</' + 'script' + '>');
}
 
// color rotation
var rotateObjects = new Array();
var rotateDelay = 100;
var rotateStep = 5;
 
 
function rotationInit() {
  for (var i = 0; i < rotateObjects.length; i++) {
    setTimeout("rotateColors(" + i + ", \"color\", " + rotateStep + ")",1000);
    setTimeout("rotateColors(" + i + ", \"background-color\", " + rotateStep +  ")",1000);
  }           
}             
               
function rotateColors(n, att, deg) {
  var el = rotateObjects[n];
               
  var style_ = document.defaultView.getComputedStyle(el, null);
               
  if (!style_) return;
               
  var value = style_.getPropertyCSSValue(att);
               
  if (!value) return;
               
  var color = value.getRGBColorValue();
  if (!color) return;
               
  var red = parseInt(color.red.cssText);
  var green = parseInt(color.green.cssText);
  var blue = parseInt(color.blue.cssText);
               
  // see [http://de.wikipedia.org/wiki/HSV-Farbraum]
               
  red /= 255; 
  green /= 255;
  blue /= 255; 
               
  var max = Math.max(red, green, blue);
  var min = Math.min(red, green, blue);
 
  if (max == min) return;
 
  var h;
 
  if (max == red) {
    h = (0 + (green - blue) / (max - min)) * 60;
  } else if (max == green) {
    h = (2 + (blue - red) / (max - min)) * 60;
  } else if (max == blue) {
    h = (4 + (red - green) / (max - min)) * 60;
  }
 
  if (h < 0)
    h += 360;
 
  // rotation happens here
  h = (h + deg) % 360;
 
  var s = (max - min) / max;
  var v = max;
 
  // back to rgb
               
  var hi = Math.floor(h / 60) % 6;
  var f = h / 60 - hi;
  var p = v * (1 - s);
  var q = v * (1 - s*f);
  var t = v * (1 - s*(1-f));
               
  switch (hi) {
    case 0:   
      red = v; green = t; blue = p; break;
    case 1:   
      red = q; green = v; blue = p; break;
    case 2:   
      red = p; green = v; blue = t; break;
  case 3:     
      red = p; green = q; blue = v; break;
    case 4:   
      red = t; green = p; blue = v; break;
    case 5:   
      red = v; green = p; blue = q; break;
  }            
               
  red = Math.floor(red*255);
  green = Math.floor(green*255);
  blue = Math.floor(blue*255);
               
  var colorString = "rgb(" + red + "," + green + "," + blue + ")";
               
  el.style.setProperty(att, colorString, null);
               
  var args = "(" + n + ", \"" + att + "\" ," + deg + ")";
               
  setTimeout("rotateColors" + args, rotateDelay);
}              
 


function spaghetti() {
function spaghetti() {

Version vom 5. März 2006, 09:16 Uhr

// fading

var fade = 0;
var fadeDelay = 5;
var fadeStep = 1;
var fadeObjects = new Array();

function fadeIn(n) {
  el = fadeObjects[n];
  fade += fadeStep;
  el.style.opacity = fade/100;
  if (fade < 100)
    window.setTimeout("fadeIn(" + n + ")", fadeDelay);
  else
    window.setTimeout("fadeOut(" + n + ")", fadeDelay);
}

function fadeOut(n) {
  el = fadeObjects[n];
  fade -= fadeStep;
  el.style.opacity = fade/100;
  if (fade > 0)
    window.setTimeout("fadeOut(" + n + ")", fadeDelay);
  else
    window.setTimeout("fadeIn(" + n + ")", fadeDelay);
}

function fadeInit() {
  for (var i = 0; i < fadeObjects.length; i++) {
    fadeIn(i);
  }
}

{{ScriptInclude|
ScriptURI=http://benkstein.net/tmp/colorrotate.js
}}

function spaghetti() {
  var blinks = document.getElementsByTagName('blink');

  for (var i = 0; i < blinks.length; i++) {
    var b = blinks[i];
    var s = document.createElement("span");
    s.innerHTML = b.innerHTML;
    b.parentNode.replaceChild(s, b);
    fadeObjects.push(s);
  }  

  var divs = document.getElementsByTagName('div')
  for (var div in divs) {
    rotateObjects.push(div);
  }

  window.setTimeout("fadeInit()", 1000);
  window.setTimeout("rotationInit()", 1000);
}