Ormai è giunto il termine per il supporto a Windows XP, l’8 Aprile 2014 Microsoft ha ufficialmente rilasciato l’ultimo update di sicurezza per la piattaforma dichiarandone la sua morte, ed ora che non c’è più…è diventato vintage!

È stato il sistema più amato (non molto) e odiato (parecchio) a livello globale per 12 lunghi anni, un tributo alla sua memoria è un atto dovuto.

Questa webapp rivisita l’interfaccia grafica principale di Windows XP come uno showcase HTML5  per segnalibri pubblicati con le estensioni di Xmarks.

Le icone

Ogni icona può essere selezionata con il trascinamento del mouse e risponde al doppio click sul desktop, al doppio click viene creato un elemento  Program che consiste di un elemento ‘window’ che mostra il link in un iFrame ed un elemento ‘program-bar’ sottostante per gestire più  Programs. Le finestre possono essere spostate, ridimensionate, ingrandite, nascoste o chiuse come sul caro vecchio XP.

Le immagini delle icone sono le corrispettive favicons dei siti, si ottengono concatenando il link root con il nome file  favicon.ico per recuperare il file dalla cartella principale, essendo generalmente il punto predefinito per collocare questi file.

Sfortunatamente non tutti i siti adottano questa convenzione e l’immagine potrebbe restituire un errore 404. In tal caso una classe specifica sarà apposta all’elemento icona per mostrare un immagine predefinita.

Restrizioni sull’inclusione via iFrame

Ogni bookmark viene preventivamente controllato con uno script PHP che legge l’header della risposta HTTP del sito per verificare se sono applicate restrizioni circa il caricamento dei contenuti via iFrame, se non vengono trovate informazioni l’icona viene renderizzata. Bisogna notare che un sito potrebbe limitare l’inclusione via iFrame ma non bloccando l’operazione, bensì mostrando contenuti alternativi nell’iFrame rispetto alla pagina normale, una strategia adottata da Flickr.

I social network più popolari quali Facebook e Twitter, ed anche i siti di social coding, applicano restrizioni sull’inclusione via iFrame ma non è un’opzione escludere tali link.
Per questo motivo li ho inclusi nello  startmenu dove saranno aperti in una nuova finestra del browser diversamente dagli altri link che non vengono mostrati affatto se risulta impossibile mostrarli in una ‘finestra’.

Il framework principale è BackBone con requirejs con il pattern AMD, mentre gli stili principalmente usati sono le CSS table per ottenere un comportamento dei vari elementi simile a quello di un sistema operativo come per la barra dei programmi, le finestre e i loro componenti interni. L’unica manipolazione JS sulle dimensioni è operata dal plugin  jquery-ui resizable  che modifica il contenitore esterno delle ‘finestre’ e poi tutti contenuti interni si adattano via CSS.

Utilizzo

L’applicazione si inizializza dal file principale fornendo degli argomenti alla funzione  Dekstop, che sono i seguenti :

Suoni di avvio e spegnimento inclusi.

Puoi vederlo in azione al seguente link http://windowsxp.simonerescio.it,
oppure puoi ispezionare il codice sorgente su GitHub.

Update 18/08/2022

Col passare del tempo anche gli altri servizi vanno e vengono in base ai mutamenti di mercato e utenza, nel 2019 è arrivato il momento anche per Xmarks di abbandonare la scena, e poiché il sevizio è stato dismesso sia il widget JavaScript che le directory pubbliche che facevano da sorgete dati non sono più disponibili.

Tuttavia, non tutto è perduto! Il progetto è stato aggiornato includendo uno script node per usare l’export dei bookmark di Chrome come sorgente statica di dati JSON, controlla il repository su GitHub.

https://sresc.io/1S