Calendario 2.0 di Maurizio Mauri

 
iFrame 1
iFrame 2
iFrame 3
 
Ed ecco un interessante calendario che ancora una volta mi ha segnalato l' amico Rizzi Renato. Il colpo di genio di questo calendario è la possibilità di inserire promemoria visualizzabili al passaggio del mouse. Vista questa interessantissima funzione ho pensato di potenziarlo al massimo inserendovi tutte le risposte che ognuno di noi vorrebbe avere da un calendario. Curiosamente, ma evidentemente per una scelta precisa, Maurizo ha  deciso di visualizzare i promemoria personali solo nell'anno in corso, ma questo ci impedisce, arrivati a Novembre-Dicembre, di sapere quali sono i nostri appuntamenti nell'anno successivo. Quindi ho innanzitutto reso i promemoria visibili sempre e ho pure introdotto quelli a cadenza annuale di fondamentale importanza. Poi la navigazione di anno in anno e, per la ricerca di date dal 1 Gennaio 1583 al 31 Dicembre 2499, due caselle di testo
 
per l' inserimento immediato del mese e dell' anno richiesti. Ovviamente non poteva mancare un link per il ritorno immediato alla data attuale. Infine, data la particolarità di questo calendario, un Help per riassumere le funzioni principali non guasta mai. Considerando che l' originale fa riferimento a pagine internet e consta di più  files separati,  ho pensato di ridurlo ad un unico file, per una più semplice portabilità, togliendo pure ogni riferimento alla Rete. In secondo luogo il mio è pensato per essere utilizzato all' interno di un iframe, anzi due, perchè nel primo visualizzo il mese corrente, e nel secondo il mese successivo, visto che questo calendario lo può fare. Oltre alle modifiche che ho già spiegato, l' originale aveva anche il fastidioso allungarsi e accorciarsi a seconda che siano presenti cinque o sei righe, e così ho provveduto ad evitare che ciò avvenga. Qui sopra sono riportati,
 
perfettamente funzionanti, i tre calendari. E ora passo alle spiegazioni. Tutte le date sottolineate con un trattino verde contengono note che si visualizzano, al passaggio del mouse, mediante un Modal Box, (Finestra di dialogo Popup) contenente le informazioni che vi abbiamo registrato. In particolare se la data è di colore nero la nota è del tipo con data specifica, quindi vale solo per quel giorno, mentre se la data è di colore grigio la nota è del tipo annuale, quindi si ripete automaticamente ogni anno. Anche le feste, con la data in rosso, possono contenere note, con minore priorità rispetto alle note non festive di tipo annuale, e sono sempre del tipo annuale. Se aprite con il Blocco Note di Windows i calendari che scaricate in "calendarioenzomauri.zip" e seguite le istruzioni sotto riportate, capirete subito la semplicità di compilazione delle nostre note personalizzate.

<script type="text/javascript" language="JavaScript">
/*
=== C A L E N D A R I O ===
Versione 2.0
(c) 2016 by Maurizio Mauri - 2017 variante di Enzo Coassin
*/
// feste fisse stabilite dalla legge (mese + giorno)
var feste = [
0, "Pasqua",
0, "Pasquetta",
101, "Capodanno dai<br>tempi dei tempi",
106, "Epifania dai<br>tempi dei tempi",
425, "Festa della<br>liberazione<br>dal 1946",
501, "Festa del<br>lavoro dal 1890",
602, "Festa della<br>Repubblica",
815, "Ferragosto dai<br>tempi di Augusto",
908, "Festa della<br>Madonna a<br>Maniago e<br>Pordenone<br>dal 1655",
1101, "Tutti i Santi<br>dal 1949",
1208, "Festa della<br>Immacolata<br>Concezione<br>dal 1854",
1225, "Natale dai<br>tempi dei tempi",
1226, "Santo Stefano dai<br>tempi dei tempi"
 
// ricorrenze annuali (mese + giorno)
var annuali = [
116, "Imposta comunale<br>sulle pubbliche<br>affissioni",
616, "Pagare prima rata<br>tassa comunale<br>IMU/TASI",
623, "Pagine web di<br>Coassin Enzo$http://enzo.panificiocoassin.it/",
...................................
1229, "Pagare IVA"
];

A circa un terzo della pagina c'è il codice sopra riportato, e più avanti verrà spiegato il significato delle righe evidenziate in giallo e verde. All' inizio ci sono le feste previste per legge in Italia. Potete saltare Pasqua e Pasquetta che saranno calcolate dal programma, ma soffermatevi sulla riga: "Festa della<br>Madonna a<br>Maniago e<br>Pordenone<br>dal 1655" che è la festa del Santo Patrono a Maniago e Pordenone. Potete sostituirla con il riferimento al santo patrono della vostra città, oppure cancellarla semplicemente. Il tag, o etichetta, <br> manda a capo
 
la riga. Un unico avvertimento: il numero che si trova davanti al nome (908) rappresenta il mese e il giorno (Settembre, 08). I milanesi dovranno scrivere, ad esempio: 1207 (Dicembre 07), "Sant' Ambrogio". Di seguito alle feste compaiono le ricorrenze annuali, che hanno le stesse regole delle feste, ma differiscono da queste perchè il giorno viene visualizzato in colore grigio. Come si vede le feste, che sono ricorrenze annuali, e le comuni ricorrenze annuali, sono indicate da tre o quattro cifre, sempre due per il giorno ed una o due per il mese (da 1 a 12).
 
Proseguendo nella lettura del codice, che vediamo qui sotto, troviamo le ricorrenze con data specifica, che avranno i numeri di colore nero e il cui formato è il seguente: "aammgg". Si nota subito che Maurizio ha scelto per l' anno la notazione a due cifre perchè il suo calendario non era pensato per i secoli. La compilazione del mese rispetta la grammatica di Javascript, quando la data comprende anche l' anno, e quindi va scalato di una unità. In pratica Gennaio=00, Febbraio=01 fino a Dicembre=11. I giorni seguono la normale numerazione da 1 a 31.

// ricorrenze con data specifica [anno + (mese-1) + giorno]
var note = [
"180215", "Link per il sito di<br> Rizzi Renato$http://www.renatoweb.it",
"180511-180515", "Vacanze",
"180913", ["16.00<br>17.00", "Riunione<br>Aziendale"],
//Feste e Ricorrenze annuali o specifiche nella prima decade di ogni secolo
"000502,010502,020502,030502,...,070502,080502,090502", "Festa della<br>Repubblica", // Festa con cadenza annuale
"010505", "Portare l' auto<br>dal meccanico", // Ricorrenza con data specifica
"000516,010516,020516,...,080516,090516", "Pagare prima rata<br>tassa comunale<br>IMU/TASI", // Ricorrenza annuale
"010520", ["16.00<br>17.00", "Riunione<br>Aziendale"], // Ricorrenza con data specifica
"000523,010523,...,080523,090523", "Pagine web di<br>Coassin Enzo$http://enzo.panificiocoassin.it/", // Ricorrenza annuale

Le feste, le ricorrenze annuali e le ricorrenze con data specifica saranno sempre visualizzate come la variabile note. Ogni riga è occupata da una nota. Una nota prevede un campo data (fra virgolette) e un campo per la descrizione dell' evento (ugualmente fra virgolette) e termina sempre con la
 
virgola. Il campo data può essere una semplice data o un insieme di date. Per le note con data specifica, ad esempio "180215" vuol dire 15 Marzo 2018 nel calendario di Maurizio Mauri, ma nella mia variante che prevede anche i secoli, è anche il 15 Marzo 1618, 1718, 1818, 1918, 2118, 2218, 2318 e 2418.
 
Ovviamente una ricorrenza con data specifica di un secolo prima o di un secolo dopo non fa parte della nostra esistenza. Il campo data può essere composto da una o più date separate dalla virgola, oppure da due date separate da un trattino, come negli esempi sotto riportati.

Ad esempio:
"180330, 180422, 180514", "Partita di calcio",
(tre partite di calcio in tre date diverse), che è un modo abbreviato per scrivere:
"180330", "Partita di calcio",
"180422", "Partita di calcio",
"180514", "Partita di calcio",
Oppure:
"180330-180403,", "Gita sulle Dolomiti",
 
Il questo caso l'evento è previsto per tutti i giorni compresi dal 30 Aprile al 3 Maggio 2018. Da notare che questa seconda notazione  sostituisce, a  tutti gli effetti, le vacanze di Maurizio. Il campo descrizione di solito è una semplice stringa (compresa fra le virgolette). Può anche essere un insieme di n coppie di stringhe comprese fra parentesi quadre che verranno visualizzate in una tabella sulla falsa riga di quella riportata sotto. Nel caso citato la riunione aziendale si svolgerà dalle ore 16 alle 17, ogni 9 ottobre, negli anni 2017, 2018, 2019 e 2020. Potete verificare quanto asserito nei calendari pubblicati. Anche in questo caso la riunione aziendale sarà visualizzata nei secoli precedenti e sucessivi. Se nelle parentesi quadre vi sono più coppie di stringhe, separate da
 
virgola, saranno visualizzate più righe dello stesso tipo, come si può vedere per la ricorrenza annuale del 22 Dicembre. La seconda stringa può anche essere linkata, aggiungendo alla stringa il segno di $ seguito dal link. Il codice relativo, sempre per la ricorrenza anuuale del 22 Dicembre, è anche esso qui sotto riportato in due righe separate, ma come indicato, la riga deve essere necessariamente una sola, anche se lunghissima. Cliccando sul link sarà aperta un' altra finestra. Un link esterno deve iniziare obbligatoriamente con "http://" o "https://. A proposito di link, si può pensare che questo non sia cliccabile perchè ho posto il Modal Box in alto a sinistra nell' iframe, per evitare che le informazioni "escano" dall' iframe stesso. Ma non è così, infatti prima di tutto, per evitare
 
cattive interpretazioni, il link è la classica parola blù sottolineata, e poi per accedervi si possono seguire due strade, a seconda del browser che si stà usando. Il primo metodo consiste nel fare click destro sul giorno, poi, rilasciando il tasto che ha aperto il menù contestuale, ci si porta sopra il link e premendo il tasto Esc appare la manina del mouse, che indica lo stato attivo del link. Con il secondo metodo si clicca sinistro sul giorno e poi si preme il tasto TAB. Fatte queste operazioni il link diviene selezionato (appare all' interno di un rettangolo tratteggiato) e premendo il tasto Invio si apre la pagina linkata. Da tenere presente che con Google Chrome e Mozilla Firefox basta premere il tasto TAB una sola volta,  mentre con Microsoft Edge il tasto TAB va premuto ben  nove volte!

Esempio:
"170913,180913,190913,200913", ["16.00-17.00", "Riunione Aziendale"],
16.00-17.00Riunione Aziendale

"1222", ["16.00<br>17.00", "Regali<br>per<br>dipendenti", "17.00<br>19.00", (continua sotto) "Cinema<br>Corazzata<br>Kotiomkin$https://it.wikipedia.org/wiki/Il_secondo_tragico_Fantozzi"],

E' interessante notare anche che l'argomento della nota contiene il tag <br> e questo non è l'unico che possiamo usare all' interno di essa. Infatti utilizzando questa possibilità ho scoperto, come prima cosa, che i link a pagine web si possono relaizzare anche usando la semplice notazione HTML. Ma non mi sono fermato qui e ho scritto link che avviano programmi javascript, che visualizzano immagini, che avviano un filmato o un file audio e addirittura, con il solo browser Microsoft Edge e in locale, programmi o qual si voglia applicazione. Tutti questi esempi si possono provare nei mesi

 
di giugno dell' anno '99. Qui sotto sono riportati i cinque codici di cui sopra, che ognuno può inserire nel proprio calendario per renderlo più efficace. Come si vede nel giorno 8 Giugno '99 troviamo il link al mio sito di programmi gratuiti secondo il metodo di Maurizio Mauri, mentre il giorno 9 Giugno del '99 abbiamo lo stesso link ottenuto con i soli tag HTML. I quattro tag che seguono, il giorno 12, 19, 23 e 26 Giugno '99, sono link fittizi perchè in realtà rimandano alle funzioni javascript verifica(), foto(), vedi(), suona() che avviano i programmi per confrontare due numeri o riprodurre foto, video e suoni. Il sesto tag,
 
il giorno 29 Giugno '99, è un link che punta direttamente all' eseguibile Q-Dir.exe, in questo caso contenuto nella stessa cartella del calendario, che è un Esplora File senza installazione, composto da un unico file di soli 708 Kb. In realtà Q-Dir utilizza tutte le funzioni dell' Esplora File di Windows in una nuova grafica che può visualizzare fino a quattro finestre con l' aggiunta di comandi particolari. Anche gli altri files di questi esempi sono contenuti nella cartella del calendario, ma nulla vieta che si trovino in qualunque punto del nostro disco rigido, scrivendo, ovviamente, i percorsi giusti.
// esempi di Modal Box che attivano funzioni speciali
"990508", "Pagine web di<br>Coassin Enzo<br>Metodo Maurizio$http://enzo.panificiocoassin.it/",
"990509", "<a href='http://enzo.panificiocoassin.it'><div class='linkx'>Pagine web di<br>Coassin Enzo<br>con Tag HTML</div></a>",
"990512", "<a href='javascript:verifica()'><div class='linkx'>Modulo di verifica<br>pagamenti on-line</div></a>",
"990519", "<a href='javascript:foto()'><div class='linkx'>Fare vaccino<br><img src='blacky.jpg' width=80 height=60 vspace=7>......",
"990523", "<a href='javascript:vedi()'><div class='linkx'>Esempio<br>di video</div></a>",
"990526", "<a href='javascript:suona()'><div class='linkx'>Esempio di<br>file audio>/div<</a>",
"990529", "Ora prova<br>l' Esplora File</div><div class='linkx'><a href='Q-Dir.exe'>Q-Dir Portable</div></a><(funziona solo con.....",

Le vacanze,  indicate con il colore grigio nel calendario originale di Maurizio Mauri, sono state eliminate nella mia variante perchè, come detto sopra, sono agevolmente sostituite con la notazione a due date separate da un trattino. Le vacanze sono definite dalla variabile vacanza, che è la variabile successiva
 
nello script, come si vede sotto. Ho lasciato il codice css e la prima riga sotto riportata con feste dal 04/02/2099 al 06/02/2099 e dal 08/08/2099 al 27/08/2099 perchè in questi giorni non saranno visualizzate, avendo reso le  vacanze opache, di colore nero  e con  sfondo  uguale a quello
 
del calendario, diventando così indistinguibili dagli altri giorni. Esse si presentano come le quattro righe successive nel calendario originale e in pratica non sono altro che una serie di date. Da notare che alle vacanze non è possibile associare un Modal Box, motivo in più per averle eliminate.

var vacanza = ["990104-990106", "990708-990727",
"-160006", "160104-160106",
"160224-160229", "160416-160419", "160527-160528",
"160708-160727", "160919-160922",
"160807-160809", "161123-"];

Nel calendario di Maurizio Mauri è possibile modificare la larghezza del calendario, ma non l' altezza, andando in fondo pagina, precisamente all' inizio del ‹body›, dove vediamo lo script sottostante. Il numero 290 è la larghezza in pixel, mentre i valori null e null fanno aprire il calendario nel mese e nell' anno corrente. Nella mia variante del calendario l' altezza si può stabilire nel foglio di stile alla voce ".calend". Modificando sia la larghezza che l' altezza il calendario assume un aspetto grafico sgradevole, e per evitare che questo accada è necessario modificare anche altri diversi parametri. Per questo motivo ho fatto due versioni del calendario di Maurizio, una piccola per essere usata all' interno di un iFrame ed una più grande, pensata per gli Smartphone, come del resto avevo fatto anche per il
 
calendario americano. Da considerare che con alcuni sistemi operativi per cellulari il calendario non sempre funziona perfettamente. Se invece, ad esempio, sostituiamo ai null i numeri 8 e 2020 il calendario si aprirà nel mese di agosto del 2020. Molto interessante è l' ultima riga dello script, che in parte mi ha fornito personalmente Maurizio. Attivando quest' ultima, al posto della seconda, il calendario si aprirà sempre nel mese successivo a quello in corso, e, se vogliamo, questo calendario può essere affiancato al primo, proprio come ho fatto in questa pagina. In questo script ho aggiunto la variabile tipo=2 che ha lo scopo di trasformare il link "oggi" in "oggi+" perchè nel mese successivo non esiste, ovviamente, una data attuale. Se non si vogliono usare due calendari distinti si possono attivare contemporaneamente
 
i due script, che apriranno i due calendari in colonna, senza spazio intermedio. Fate attenzione a chiamare i due calendari con nomi diversi, ad esempio "mio1" e "mio2". Si può aggiungere lo spazio, con una istruzione che può essere del tipo document.write("<div> spazio </div>"); tra i due script, ma affiancare i due calendari non credo sia fattibile, e comunque è una impresa alla quale ho rinunciato, perchè ho già fatto anche troppo. Tra l' altro in questa modalità scompare pure "Oggi+". Anche in questo calendario, trattandosi sempre della versione per il commerciante, ho aggiunto tutti gli Alert javascript del calendario americano. E infatti, aprendo questa pagina, viene subito attivato l' Alert dimostrativo. La loro complilazione è così semplice che basta guardarli per capire come funzionano.

‹scrip type="text/javascript"t›
// Script per il calendario del mese attuale
var tipo=1; calend(null, null, "mio1", 290); document.cambio.piu.className="nascondi";
// Script per il calendario del mese successivo a quello attuale
// var mmm = new Date().getMonth(); var tipo=2; calend(mmm + 2, null, "mio1", 290); (continua sotto)
document.cambio.piu.value="+"; document.cambio.piu.className="vedi";
‹/script›

I promemoria del commerciante sono in gran parte a cadenza annuale, tranne alcuni con date particolari. I due calendari presenti sono posizionati in alto a sinistra dello schermo, perchè pensati per essere utilizzati all' interno degli iframe, ma se vogliamo spostarli altrove dobbiamo solo modificare i valori dei margini nella riga del ‹body› sotto riportata. E nella stessa riga, come si vede, possiamo anche cambiare il colore dello sfondo della pagina. Ed ora è giunto il momento di spiegare il significato della casella di testo "Pasqua" che mi ha fatto perdere più di un mese per sincronizzarla con il resto del calendario. Quando si scrive un anno
 
nella casella di testo omonima, in quella della Pasqua apparirà un numero di tre cifre. Poichè Pasqua cade sempre in Marzo o Aprile, la prima cifra è quella del mese, e le seconde due quelle del giorno. Il calendario di Maurizio Mauri non è fatto per viaggiare nei secoli e quindi lui non ha tenuto conto delle eccezioni nel calcolo del giorno pasquale che io invece ho considerato, e che appaiono di colore rosso quando si presentano. Potevo anche evitare questa precisazione, visto che come per il calendario americano, anche in quello di Maurizio ho aggiunto le eccezioni, cosicchè non vi sono errori nelle date calcolate. Possiamo verificare che per
 
l' annno 1954 appare il numero 418 in rosso, che significa 18 Aprile, mentre per l' anno 2018 compare il numero 401 in nero, che significa 1 Aprile. Giusto per completezza faccio notare che i Modal Box di Pasqua e Pasquetta non appaiono più per gli anni sucessivi al 2099, e solo Maurizio potrebbe darne spiegazione, ma ciò è di poco conto perchè la casella Pasqua dà il risultato esatto. Purtroppo Maurizio Mauri non è più rintracciabile perchè il suo contatto mail non dà più risposte, e quindi non sono in grado di richiedergli una modifica agli script per ottenere la visualizzazione dei Modal Box nella prima decade di ogni secolo, che con il suo codice non avviene.

<body topmargin="5" leftmargin="10" style="background-color: #f2f9ff;">

Ovviamente quasi nessuno di noi ci sarà nel XXII secolo, e forse non esisterà neppure più il Web, ma non ho mai lasciato incompiuto un lavoro, così dopo aver tentato, per lunghissimo tempo, di decifrare il criptico codice di Maurizio, ho optato per un efficace artificio, anche se i programmatori potrebbero inorridire di fronte a questa soluzione. In pratica ho scoperto che se si registrano festività e ricorrenze annuali sia come ricorrenze annuali che come ricorrenze con data specifica, negli anni a due cifre da 00 a 09, verranno visualizzate correttamente con i relativi Modal Box.
 
Infatti, se confrontiamo il primo e il secondo script di questa pagina, osserviamo che la Festa della Repubblica del 2 Giugno, evidenziata in giallo, è registrata due volte, come indicato sopra. Lo stesso vale per la scadenza del 16 Giugno, "Pagare prima rata <br> tassa comunale <br> IMU/TASI", e del 23 Giugno "Pagine web di <br> Coassin Enzo$http://enzo.panificiocoassin.it/", evidenziate in verde. In entrambi i casi si è utilizzata la notazione abbreviata per tutti gli anni a due cifre da 00 a 09, ottenendo così la prima decade di ogni secolo. E in effetti si nota
 
che la notazione abbreviata rende la compilazione degli eventi a cadenza annuale, per la prima decade dei secoli, semplice e rapida. Nel caso citato si può verificare che le ricorrenze di Giugno appaiono tutti gli anni dal 1583 al 2499, senza escluderne alcuno. Il file che si scarica pesa 2.2 Mb e contiene questa pagina e tutto quello che in essa è descritto. Sono sicuro che questi calendari saranno ad apprezzarli, come, immagino, siano stati apprezzati anche i "Calendari americani". Il calendario originale di Maurizio Mauri, invece, pesa 34 Kb, comprese due immagini.

Nome del file " calendarioenzomauri.zip ", Pagine web e allegati, Dimensione ,2.2 Mb , Voto = 10, Data : 15/01/2018

calendarioenzomauri-enzocoassin.zip