[Google Sheets] Afficher une horloge littérale en sidebar

Bonjour,

Une horloge design comme on peut en voir en Suisse ...

Copiez le lien et mettez un déclencheur sur la fonction horloge à l'ouverture.

function horloge() {
  const html = HtmlService.createHtmlOutputFromFile('horloge').setTitle(' W O R D C L O C K ');
  SpreadsheetApp.getUi().showSidebar(html);
}
<!DOCTYPE html>

<html>
<head>
<title>Qlocktwo selon Biegert & Funk</title>
<style>
    body{background-color:#808080;}
    td{text-align:center;font-family:"Verdana",sans-serif;font-size:5vmin;width:7vmin;height:7vmin;}
    td.on{color:#EEEEEE;}
    td.off{color:909090;}
</style>
<script type="text/javascript">
var TabHeure = [
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M1|I1|N1|U1|I1|T1|O0|N0|Z0|E0|R0|H0|E0|U0|R0|E0|S0",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U1|N1|E1|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S0",
"I1|L1|N0|E1|S1|T1|O0|D1|E1|U1|X1|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T1|R1|O1|I1|S1|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q1|U1|A1|T1|R1|E1|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C1|I1|N1|Q1|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S1|I1|X1|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S1|E1|P1|T1|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H1|U1|I1|T1|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N1|E1|U1|F1|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D1|I1|X1|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O1|N1|Z1|E1|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M1|I1|D1|I1|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H0|E0|U0|R0|E0|S0",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U1|N1|E1|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S0",
"I1|L1|N0|E1|S1|T1|O0|D1|E1|U1|X1|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T1|R1|O1|I1|S1|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q1|U1|A1|T1|R1|E1|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C1|I1|N1|Q1|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S1|I1|X1|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S1|E1|P1|T1|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H1|U1|I1|T1|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N1|E1|U1|F1|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D1|I1|X1|M0|I0|N0|U0|I0|T0|O0|N0|Z0|E0|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M0|I0|N0|U0|I0|T0|O1|N1|Z1|E1|R0|H1|E1|U1|R1|E1|S1",
"I1|L1|N0|E1|S1|T1|O0|D0|E0|U0|X0|Q0|U0|A0|T0|R0|E0|T0|R0|O0|I0|S0|N0|E0|U0|F0|U0|N0|E0|S0|E0|P0|T0|H0|U0|I0|T0|S0|I0|X0|C0|I0|N0|Q0|M0|I0|D0|I0|X0|M1|I1|N1|U1|I1|T1|O0|N0|Z0|E0|R0|H0|E0|U0|R0|E0|S0"
];
var TabMinute = [
"M0|O0|I0|N0|S0|O0|L0|E0|D0|I0|X0|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V0|I0|N0|G0|T0|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M0|O0|I0|N0|S0|O0|L0|E0|D0|I0|X0|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V0|I0|N0|G0|T0|-0|C1|I1|N1|Q1|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M0|O0|I0|N0|S0|O0|L0|E0|D1|I1|X1|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V0|I0|N0|G0|T0|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M0|O0|I0|N0|S0|O0|L0|E0|D0|I0|X0|E1|T1|R0|Q1|U1|A1|R1|T1|P0|M0|D0|V0|I0|N0|G0|T0|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M0|O0|I0|N0|S0|O0|L0|E0|D0|I0|X0|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V1|I1|N1|G1|T1|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M0|O0|I0|N0|S0|O0|L0|E0|D0|I0|X0|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V1|I1|N1|G1|T1|-1|C1|I1|N1|Q1|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M0|O0|I0|N0|S0|O0|L0|E0|D0|I0|X0|E1|T1|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V0|I0|N0|G0|T0|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D1|E1|M1|I1|E1|P0|A0|M0",
"M1|O1|I1|N1|S1|O0|L0|E0|D0|I0|X0|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V1|I1|N1|G1|T1|-1|C1|I1|N1|Q1|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M1|O1|I1|N1|S1|O0|L0|E0|D0|I0|X0|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V1|I1|N1|G1|T1|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M1|O1|I1|N1|S1|O0|L1|E1|D0|I0|X0|E0|T0|R0|Q1|U1|A1|R1|T1|P0|M0|D0|V0|I0|N0|G0|T0|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M1|O1|I1|N1|S1|O0|L0|E0|D1|I1|X1|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V0|I0|N0|G0|T0|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M1|O1|I1|N1|S1|O0|L0|E0|D0|I0|X0|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V0|I0|N0|G0|T0|-0|C1|I1|N1|Q1|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M0|O0|I0|N0|S0|O0|L0|E0|D0|I0|X0|E0|T0|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V0|I0|N0|G0|T0|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D0|E0|M0|I0|E0|P0|A0|M0",
"M0|O0|I0|N0|S0|O0|L0|E0|D0|I0|X0|E1|T1|R0|Q0|U0|A0|R0|T0|P0|M0|D0|V0|I0|N0|G0|T0|-0|C0|I0|N0|Q0|U0|E0|T0|S0|D1|E1|M1|I1|E0|P0|A0|M0"
];

function startTime(){
var today=new Date();
var h=today.getHours();
var m=today.getMinutes();
m = Math.floor(m/5)
if (m > 6) {h++;}
var txt = '<table><tr>'
var itemsh = TabHeure[h].split("|");
for (var i = 0; i < itemsh.length; i++) {
    if (itemsh[i][1] == 0) {txt += ("<td class='off'>" + itemsh[i][0] + "</td>");}
    if (itemsh[i][1] == 1) {txt += ("<td class='on'>" + itemsh[i][0] + "</td>");}
    if ((i+1) % 11 == 0) {txt += ("</tr><tr>");}
}
var itemsm = TabMinute[m].split("|");
for (var i = 0; i < itemsm.length; i++) {
    if (itemsm[i][1] == 0) {txt += ("<td class='off'>" + itemsm[i][0] + "</td>");}
    if (itemsm[i][1] == 1) {txt += ("<td class='on'>" + itemsm[i][0] + "</td>");}
    if ((i+1) % 11 == 0) {txt += ("</tr><tr>");}
}
txt += '</tr></table>'
document.getElementById('horloge').innerHTML=txt;
t=setTimeout('startTime()',5000);
}
</script>
</head>
<body onload="startTime()">
<center><div id="horloge"></div></center>
</body>
</html>

https://docs.google.com/spreadsheets/d/1bl8vqxGl7QlbxxbNq-DQPAsKxtvuoomtmwCS5kAT76s/edit?usp=sharing

image

Il faudra que tu me racontes ta nouvelle vie sous Sheets, ça a l'air sympa comme tout

edit : ça ne ferait pas un peu plus d'une page A4 tout ça ?

Il faudra que tu me racontes ta nouvelle vie sous Sheets, ça a l'air sympa comme tout

edit : ça ne ferait pas un peu plus d'une page A4 tout ça ?

oui et non, je ne déroge pas vraiment de mes principes, il s'agit ici d'une page html,

mais c'est vrai que c'est quand même du code javascript et que les tableaux prennent de la place, je vais aller à confesse

en font 7, je suis sur une page (mais pas lisible) et le tableau prend 95%

ils ont été faits avec ... excel ! j'aurais pu les mettre dans une feuille mais je perds en portabilité

Pour la petite histoire, c'est un sujet traité en arduino suite à un défi lancé par ma suissesse de fille et son mari !

photo verso

Tu m'étonnes ! Ils savent bien qu'un défi lancé à Steelson est un défi réussi ^^.

Chouette travail en tout cas.

Si Sheets continue de s'améliorer, et l'évolution du monde allant vers la gratuité de plus en plus de produits, je ne serais pas étonné que de plus en plus de structures passent dessus. Le souci, c'est ce langage de programmation. Bon sang, à peine on commence à comprendre le VBA qu'il faut déjà changer :(

Bon après avec 20 ans de délai le temps que les gens soient à peu près formés, ça laisse le temps. Mais quand même !

Il faudra que tu me racontes ta nouvelle vie sous Sheets, ça a l'air sympa comme tout

Le paradis je te dis.

Si Sheets continue de s'améliorer, et l'évolution du monde allant vers la gratuité de plus en plus de produits, je ne serais pas étonné que de plus en plus de structures passent dessus. Le souci, c'est ce langage de programmation. Bon sang, à peine on commence à comprendre le VBA qu'il faut déjà changer :(

Pour moi, le seul problème est la confidentialité, car on travaille sur le serveur google.

Pour la programmation ...

  1. ce qui est génial, c'est que dans bon nombre de cas, une formule suffit ! il faudrait que j'en fasse un florilège
    1. même pour consolider des onglets et des fichiers = pas de macro script !
    2. même pour aller chercher sur le web (là c'est le pied).
  2. Reste que la programmation est basée sur des outils plus largement diffusés comme le javascript, ou XPath (plus confidentiel encore)
Rechercher des sujets similaires à "google sheets afficher horloge litterale sidebar"