Il problema
Ho trovato questa variante di selezione in risposta a una domanda su UX.SE:
link
Tuttavia, capire come implementarlo mi ha fatto impazzire da quando ho scritto quel post.
Quello che ho provato
Inizialmente ho pensato che sarebbe stato abbastanza facile da fare.
La strategia che avrei preso sarebbe quella di modellare tutte le opzioni in un oggetto javascript, con il loro nome e le proprietà selezionate, e quindi scrivere una funzione di visualizzazione per visualizzarle come un elenco non ordinato o qualcosa del genere.
Potrei quindi creare il pulsante come un altro oggetto javascript, modellandone il proprio stato e avere una funzione di visualizzazione che ne sputa una rappresentazione nel widget. Magari inserisci un codice di evento per la transizione tra gli stati dei pulsanti e ho finito.
Dove sono bloccato
Più pensavo a questo approccio, più mi rendevo conto che avere tutto lo stato seduto in oggetti javascript era una pessima idea. Ho pensato che probabilmente dovrei memorizzare lo stato nel dom e mutarlo con javascript.
Tuttavia non ho idea chiara di come sarebbe il tipo di architettura o di come dovrei codificarlo.
Puoi aiutarmi a capire quale sia la migliore strategia di implementazione di alto livello per questo tipo di widget?