Piero V.

Constructive Solid Geometry in JS

From time to time, I like playing with 3D graphics, especially from a programmer’s point of view.

Constructive solid geometry, or CSG, is a modeling technique involving combining simpler objects with Boolean operations to obtain more complex ones.

A while ago, I found an implementation as a JavaScript library: CSG.js.

It really is brilliant because it is a complete tool in less than 600 rows, half of which are explanatory comments.

Its foundations are the clipping and the inversion operation. The former removes parts of a BSP tree inside another BSP tree, the latter swaps solid and empty space.

CSG.js combines them cleverly to implement Boolean union, subtraction, and intersection.

Even from a software engineering perspective, its author made some acute choices. And as a result, this project did not need to be updated in the latest ten years!

For example, library users can implement vertices with custom properties thanks to duck typing. They just need to implement a few methods and have a pos member. In this way, it is possible, for instance, to manage texture coordinates. … [Leggi il resto]

Bisca

Ho realizzato che è da un pezzo che non lavoro seriamente su un progetto mio.

Negli ultimi mesi, ho realizzato il plugin su cui ho scritto la mia tesi di laurea, però non conta troppo, perché, anche se qualche volta ho approfondio e fatto test durante il weekend, ci lavoravo principalmente durante la giornata lavorativa. E proprio per questo, tecnicamente non è neanche mio, perché la proprietà intellettuale del progetto è dell’azienda dove l’ho realizzato.

Adesso comunque per la tesi dovrei essere in dirittura d’arrivo e, appunto, ho deciso di cominciare un progetto che potessi dire completamente mio.

Già tempo addietro un mio amico mi aveva insegnato un gioco che noi chiamiamo “bisca”, ma non ho trovato un altro nome con cui sia conosciuto in giro per l’Internet.

Il gioco è carino e coinvolgente, quindi ho deciso di farne una versione online, anche perché col tempo ci siamo tutti un po’ sparsi, così è un modo anche per ritrovarsi virtualmente.

Come ho già detto in altre occasioni, trovo abbastanza noioso lo sviluppo di cose per il web, siano siti, oppure app, o altro ancora, tuttavia devo dire che mi sembra il modo migliore per sviluppare questo progetto. … [Leggi il resto]

Compara e unisci PDF

I PDF sono dei file molto comodi da leggere, ma possono diventare un inferno da modificare.

Avendo preso l’abitudine di prenderci appunti direttamente sopra, per me diventa un bel problema quando un documento viene aggiornato, così ho deciso di fare un’applicazione web che consenta di compararli visivamente e unirli.

È ancora un po’ un proof of concept. In pratica si basa sul noto PDF.js di Mozilla: lo usa per renderizzare le varie pagine in due canvas affiancati.

La navigazione è basata tutta su JavaScript vanilla, o meglio, su ES6, quindi con i browser moderni funziona, quindi, pur non avendo provato, sono sicuro che non vada su Internet Explorer.

Quindi questo progetto mi ha permesso di mettermi alla prova con JS, per vedere se riesco ancora a fare qualcosa senza jQuery, e mi ha dato modo di imparare un po’ a usare le API HTML5 per il Drag&Drop con i file.

Invece per il drag&drop dell’elenco di pagine che verranno unite mi sono affidato alla libreria html5sortable, che però non ha altre dipendenze. Avevo cominciato a implementare anche quello, però i risultati non erano buoni e la difficoltà parecchia. Quindi per questa cosa ha avuto senso usare una libreria, che peraltro non pesa molto.

Infine, per il lato client, ho usato Bootstrap 4, giusto per dare un po’ di classe al tutto.

Per il lato server ho usato una Servlet Java: pur non piacendomi molto come tecnologia, ha il vantaggio di poter chiamare direttamente l’ottima libreria iText, che è veramente potente e versatile.

L’unico svantaggio è la viralità della sua licenza: Afferro GPL. Mi vedo quindi costretto a rilasciare il lato server sotto questa licenza, invece il lato client, da solo, per quanto mi riguarda, se la Afferro lo concede, lo potete considerare sotto licenza MIT (non sono sicuro sia possibile, però).

Per il momento è ancora allo stato embrionale, soprattutto il codice lato server, quindi per motivazioni di sicurezza non ne faccio il deploy sul mio VPS, però vi lascio volentieri il codice per il download 😊 .

jQuery 1.7: callbacks

Mi sono appena accorto che in jQuery 1.7 è stato aggiunto un primordiale supporto per gli hook, basato sulle classi.

Molto bello!

In pratica si usa con l’oggetto window.jQuery.callbacks() o, più velocemente, $.callbacks();.

Una volta assegnato quest’oggetto a una variabile potete aggiungere e rimuovere funzioni, mentre per chiamarlo fate variabile.fire(); sostituendo a variabile il nome della variabile a cui avete assegnato $.callbacks().

Uno dei probabili errori è pensare che una volta settati siano globali o che facendo $.callbacks() rimangano salvati globalmente, invece no, perciò state attenti.

WebSocket

Grazie al changelog di Firefox 6 (uscito oggi) ho scoperto questa funzionalità di Javascript, che ovviamente, come tutte le più belle funzionalità, saranno in HTML 5, ma intanto i browser si stanno preparando.

La funzionalità di cui voglio parlare è la “websocket”.

Generalmente, quando si parla di socket in informatica si parla di una connessione tra un server e un client. Anche i normali protocolli che siamo abituati a usare utilizzano delle socket: per esempio quando si visita una pagina web, si apre una socket con un server, ma questa connessione viene subito chiusa dopo che il server ha inviato il contenuto della pagina.

In una web-socket invece la connessione rimane aperta, in attesa che una delle due parti la chiuda, e intanto si possono inviare dati.

Una delle applicazioni che potrebbero sfruttare questa caratteristica è senza dubbio la chat.

Si potrebbe mettere il server in ascolto di nuovi messaggi che poi sono inviati subito al client, anziché sfruttare continue richieste AJAX.

Un giorno magari potrei provare a fare dei test con una chat “ibrida”: le websocket saranno preferite, ma in caso il browser non le supporti, si va di AJAX.