Utilisateur:Dr Brains/FlippingClocks.js

Une page de Wikipédia, l'encyclopédie libre.
Note : après avoir enregistré la page, vous devrez forcer le rechargement complet du cache de votre navigateur pour voir les changements.

Mozilla / Firefox / Konqueror / Safari : maintenez la touche Majuscule (Shift) en cliquant sur le bouton Actualiser (Reload) ou pressez Maj-Ctrl-R (Cmd-R sur Apple Mac) ;

Chrome / Internet Explorer / Opera : maintenez la touche Ctrl en cliquant sur le bouton Actualiser ou pressez Ctrl-F5.
/* 
// Modèle :

<div class="flippingclock flippingclockbig"></div>


<div class="flippingclock"></div>


<div class="flippingclock flippingclocksmall"></div>


<p id="controlElement"></p>

* [[Utilisateur:Dr Brains/FlippingClocks.js]]
* [[Utilisateur:Dr Brains/FlippingClocks.css]]

*/
//<source lang=javascript>

if(typeof(FlippingClocks)==="undefined"){ // DEBUT IF


mw.loader.load('//fr.wikipedia.org/w/index.php?title=Utilisateur:Dr Brains/FlippingClocks.css&action=raw&ctype=text/css', 'text/css', false);


var FlippingClocks = {}

FlippingClocks.initialValues = [];

FlippingClocks.init = function(){
  var clocks = $.makeArray( $(document).find('div.flippingclock') );
  for(var a=0,l=clocks.length;a<l;a++){
    var thisclock = clocks[a];
    thisclock.id = "flippingclock_"+a;
    while(thisclock.firstChild){ thisclock.removeChild(thisclock.firstChild);}
    var tenhour = document.createElement('div');
    tenhour.className = "flippingclockelement tenhours";
    var hour = document.createElement('div');
    hour.className = "flippingclockelement hours";
    var tenminut = document.createElement('div');
    tenminut.className = "flippingclockelement tenminuts";
    var minut = document.createElement('div');
    minut.className = "flippingclockelement minuts";
    var tensecond = document.createElement('div');
    tensecond.className = "flippingclockelement tenseconds";
    var second = document.createElement('div');
    second.className = "flippingclockelement seconds";
    thisclock.appendChild(tenhour);
    thisclock.appendChild(hour);
    thisclock.appendChild(document.createTextNode(' '));
    thisclock.appendChild(tenminut);
    thisclock.appendChild(minut);
    thisclock.appendChild(document.createTextNode(' '));
    thisclock.appendChild(tensecond);
    thisclock.appendChild(second);
    FlippingClocks.initialValues[a] = {TenHours:0,Hours:0,TenMinutes:0,Minutes:0,TenSeconds:0,Seconds:0};
    FlippingClocks.setClock(a);
  }
}

FlippingClocks.setClock = function(index){
  var thisclock = document.getElementById("flippingclock_"+index);
  if(!thisclock) return;
  var multiplicator = 1;
  if($(thisclock).hasClass( "flippingclockbig" )) multiplicator = 2;
  if($(thisclock).hasClass( "flippingclocksmall" )) multiplicator = 0.5;

  var Now = new Date();
  var Hours = Now.getHours();
  var Minutes = Now.getMinutes();
  var Seconds = Now.getSeconds();
  var TenHours =  Math.floor(Hours/10);
  Hours = Hours - (TenHours * 10);
  var TenMinutes =  Math.floor(Minutes/10);
  Minutes = Minutes - (TenMinutes * 10);
  var TenSeconds =  Math.floor(Seconds/10);
  Seconds = Seconds - (TenSeconds * 10);
  
  var tenhour = $.makeArray( $(thisclock).find("div.tenhours"))[0];
  var hour = $.makeArray( $(thisclock).find("div.hours"))[0];
  var tenminut = $.makeArray( $(thisclock).find("div.tenminuts"))[0];
  var minut = $.makeArray( $(thisclock).find("div.minuts"))[0];
  var tensecond = $.makeArray( $(thisclock).find("div.tenseconds"))[0];
  var second = $.makeArray( $(thisclock).find("div.seconds"))[0];

  var initaialvalues = FlippingClocks.initialValues[index];
  if(TenHours!= initaialvalues["TenHours"]){
    FlippingClocks.setClockElement(tenhour, TenHours, multiplicator);
    FlippingClocks.initialValues[index]["TenHours"] = TenHours;
  }
  if(Hours!= initaialvalues["Hours"]){
    FlippingClocks.setClockElement(hour, Hours, multiplicator);
    FlippingClocks.initialValues[index]["Hours"] = Hours;
  }
  if(TenMinutes!= initaialvalues["TenMinutes"]){
    FlippingClocks.setClockElement(tenminut, TenMinutes, multiplicator);
    FlippingClocks.initialValues[index]["TenMinutes"] = TenMinutes;
  }
  if(Minutes!= initaialvalues["Minutes"]){
    FlippingClocks.setClockElement(minut, Minutes, multiplicator);
    FlippingClocks.initialValues[index]["Minutes"] = Minutes;
  }
  if(TenSeconds!= initaialvalues["TenSeconds"]){
    FlippingClocks.setClockElement(tensecond, TenSeconds, multiplicator);
    FlippingClocks.initialValues[index]["TenSeconds"] = TenSeconds;
  }
  if(Seconds!= initaialvalues["Seconds"]){
    FlippingClocks.setClockElement(second, Seconds, multiplicator);
    FlippingClocks.initialValues[index]["Seconds"] = Seconds;
  }
  var controlElement = document.getElementById("controlElement");
  if(controlElement) controlElement.innerHTML = "time = " + TenHours + Hours +":" + TenMinutes +Minutes +":"+ TenSeconds + Seconds;
  setTimeout(function(){ FlippingClocks.setClock(index);}, 1000 );
}

FlippingClocks.setClockElement = function(el, val, multiplicator, count){
  if(!el) return;
  if(typeof(count)!="number") count = 14;
  if(count<0) return;
  var posX = Math.round((250 - Math.round(25 * (val-1))) * multiplicator);
  var posY = Math.round(32 * multiplicator * (count+1)); 
  el.style.backgroundPosition = posX+"px "+posY+"px";
  setTimeout(function(){ FlippingClocks.setClockElement(el, val, multiplicator, (count-1));}, 30 );
}

$(FlippingClocks.init);

} // FIN IF
//</source>
Ce document provient de « https://fr.wikipedia.org/w/index.php?title=Utilisateur:Dr_Brains/FlippingClocks.js&oldid=112573820 ».