☰

Clock figuccio

clock ore minuti secondi

当前为 2019-03-23 提交的版本，查看 最新版本。

// ==UserScript==
// @name        Clock figuccio
// @description clock ore minuti secondi
// @version     1.0.7
// @include     *
// @author      figuccio
// @grant       GM_setValue
// @grant       GM_getValue
// @grant       GM_registerMenuCommand
// @icon        data:image/gif;base64,R0lGODlhEAAQAKECABEREe7u7v///////yH5BAEKAAIALAAAAAAQABAAAAIplI+py30Bo5wB2IvzrXDvaoFcCIBeeXaeSY4tibqxSWt2RuWRw/e+UQAAOw==

// @namespace https://greasyfork.org/users/237458
// ==/UserScript==
const clockSettings = {
opacity: '', // Opacity value da 0 a 1

  }

function setStyles(styles) {
  styles.forEach(style => node.style.setProperty(style.name, style.value));
}

function changeOpacity(newOpacity){
  node.style.setProperty('opacity', newOpacity);
}
function updateClock() {
  let date = new Date();
// parametri per la lingua:
 //   'ITA'   'ING'   'FRA'    'TED'    'SPA'     'POR'
 // ITALIANO INGLESE FRANCESE TEDESCO  SPAGNOLO PORTOGHESE
  let time = date.toLocaleString('ita', {
      hour:'numeric',
    minute:'numeric',
    second:'numeric',
       day:'numeric',
     month:'long',
      year:'numeric',
   weekday:'long',
    hour12: false

  });
  node.innerHTML = time;
}

function isFullscreen() {
  return (window.fullScreen ||
    (window.innerWidth == screen.width && window.innerHeight == screen.height) ||
    (window.innerWidth >= screen.width && window.innerHeight >= screen.height) ||
    (!window.screenTop && !window.screenY))
}

let node = document.createElement('div');
setStyles([
  { name: 'position', value: 'fixed'},
  { name: 'bottom', value: '0' },
  { name: 'background-color', value: 'red' },
  { name: 'color', value: 'white' },
  { name: 'z-index', value: '99999' },
  { name: 'font-size', value: '16px',},//dimensioni
  { name: 'padding', value: '2px 2px 2px 2px' },//piccolo miglioramento rispetto ha prima su alcuni siti
  { name: 'border-radius', value: '10px' },/* bordi arrotondati */
  { name: 'border', value: '2px solid blue' },/* colore bordo */
  { name:  'margin',value: ' 595px 9cm' }, /* 595pxaltezza 300pxlarghezza in cm  15cm 9cm */
  { name:'font',value:'Arial'},
  { name: 'cursor', value: 'move' },
]);
document.body.appendChild(node);

setInterval(() => updateClock(), 1000);
window.addEventListener('resize', () => changeOpacity((isFullscreen())? clockSettings.opacity : '0'));
node.addEventListener('mouseout', () => changeOpacity(clockSettings.opacity));
node.addEventListener('mouseover',() => changeOpacity(''));

node.addEventListener("mouseover", function( event ) {
    // evidenzia il bersaglio del mouseover
    event.target.style.color = "orange";
// ripristinare il colore dopo un breve ritardo
    setTimeout(function() {
      event.target.style.color = "white";
    }, 5000);
  }, false);


          //effetti speciali
node.addEventListener("mouseover", function( event ) {
event.target.style.background = "green";
 setTimeout(function() {
      event.target.style.background = "red";
    }, 6000);
  }, false);

             //effetti speciali bordo
node.addEventListener("mouseover", function( event ) {
event.target.style.border= "solid black";
setTimeout(function() {
      event.target.style.border = "solid blue";
    }, 7000);
  }, false);

          //nasconde orario al passaggio mouse per 2secondi
node.addEventListener("mouseover", function( event ) {
event.target.style.visibility= "hidden";
 setTimeout(function() {
      event.target.style.visibility = "";
    }, 2000);
  }, false);