Greasy Fork is available in English.

Forum HTML.it Toolset

Funzionalità aggiuntive e ottimizzazione layout per le pagine del Forum HTML.it

Auteur
OpenDec
Installations quotidiennes
0
Installations (total)
26
Notes
0 0 0
Version
1.3.0
Créé
22/09/2022
Mis à jour
10/03/2024
Licence
MIT
S'applique à

Grazie per il tuo supporto!

Se hai gradito questo script puoi offrirmi un caffè:
PayPal.me/opendec Ko-fi.com/opendec

Cos'è questo script?

Forum HTML.it Toolset (di seguito: Toolset) è uno script-utente che puoi installare ed eseguire attraverso un gestore di script sul tuo stesso browser.

…

Tale script agisce nelle pagine del relativo Forum HTML.it ed è proposto principalmente per migliorarne l'usabilità dell'interfaccia-utente.

Usando Toolset sono quindi aggiunte delle funzionalità utili, risolti vari bug dell'interfaccia e applicate delle migliorie per ottimizzare il layout grafico delle varie aree presenti nel Forum.

Lo script resta open-source sotto licenza MIT, riutilizzabile e modificabile liberamente.

Come funziona Toolset?

Una volta installato lo script puoi accedere a qualsiasi pagina del Forum, Toolset sarà già attivo e funzionante.

…

Sarà presente un pulsante Impostazioni Toolset, con icona a forma di ruota dentata, situato a destra della Barra Utility in alto alle pagine del Forum.

Puoi cliccare il pulsante Impostazioni Toolset per aprire il relativo pannello che permette di configurare Toolset.

Le impostazioni che applichi attraverso il pannello Impostazioni Toolset restano memorizzate a livello locale nel tuo browser.

Potrai disattivare e riattivare Toolset in qualsiasi momento attraverso il tuo gestore di script.

Panoramica

Basandosi sul layout originale del Forum, Toolset si propone di "aggiustare" opportunamente gli elementi grafici e funzionali delle varie pagine e dell'interfaccia principale per offrirti una migliore fruibilità dei contenuti e un uso più performante del Forum stesso.

…
  • Corretti vari difetti grafici e risolti diversi bug.
  • Abilitato indicatore utente online per tutte le aree del Forum. Un cerchietto verde appare a fianco ad un qualsiasi nome utente per indicare che è attualmente online. Ad esempio nella home, con un rapido sguardo, potrai sapere subito se l'autore dell'ultimo post di una discussione, a cui magari stai partecipando, è in quel momento online.
  • Ridefinito lo style di vari elementi del layout per ottenere un design più pulito e funzionale.
  • Possibilità di impostare i colori del layout secondo il tuo gusto personale e di applicare dei temi predefiniti o crearne di nuovi personalizzati.
  • Disponibili diversi strumenti utili per facilitare la fruizione dei contenuti e implementare le funzionalità del Forum.

Bug risolti

Toolset provvede alla risoluzione dei seguenti bug:

…
  • Caratteri accentati compromessi

    Accade quando si tenta di pubblicare un post (contenente caratteri speciali e/o lettere accentate) dopo che la sessione risulta scaduta e si deve effettuare nuovamente il login attraverso l'apposito form per poter procedere con la pubblicazione.

    A questo punto il messaggio sarà pubblicato (se era stato fatto "invio") o si vedrà l'anteprima (se era stato fatto Anteprima messaggio o se si era passati alla modalità avanzata) ma risulterà compromesso. Ogni carattere speciale risulterà rimpiazzato da una sequenza di strani caratteri.

    Toolset ti permette di risolverlo attraverso lo strumento Mantieni attiva la sessione, presente nel pannello Impostazioni Toolset.

  • Digitazione bloccata nell'editor dopo un doppio clic

    Il problema si presenta su browser Chromium-based. Nell'editor messaggi, eseguendo un doppio clic (ad esempio per evidenziare un'intera parola), non è possibile digitare finché non si esegue un successivo singolo clic. In linea generale, questo accade per un conflitto nella gestione degli eventi tra diverse librerie JavaScript usate nel sistema.

    Toolset ripristina il funzionamento e risolve il problema.

  • Pulsante di ricerca non funzionante

    Nel Forum, alla destra della Top-bar è presente un'icona a forma di lente. Al clic sull'icona, al suo fianco dovrebbe comparire un campo di ricerca veloce ma, allo stato attuale, non compare nulla rendendo inutilizzabile questa modalità di ricerca.

    Con Toolset, al clic sull'icona, si aprirà semplicemente la pagina di ricerca del Forum.

  • Scorrimento Barra Utility non funzionante

    Nella Barra Utility dovrebbe essere possibile scorrere i contenuti che eccedono dal contenitore; tuttavia i pulsanti di scorrimento non sono funzionanti da diverso tempo.

    Con Toolset il funzionamento della barra è stato totalmente rielaborato. La funzione di scorrimento risulta quindi ripristinata ma non solo, è disponibile un sistema con cui puoi gestire molteplici barre utility personalizzate.

  • Faccine non funzionanti

    Nello smilie-box, presente a fianco all'editor messaggi in alcune pagine del Forum (ad es. messaggi privati o nuova risposta in modalità avanzata), facendo clic sulle faccine viene riportato automaticamente (nell'editor) il relativo shortcode che restituisce la faccina. Questo non avviene per le faccine il cui shortcode contiene normalmente dei caratteri accentati (es. :dottò:, :bhò:, :dhò:).

    Toolset ripristina il funzionamento e risolve il problema.

Pannello Impostazioni Toolset:

Attraverso questo pannello puoi configurare tutte le impostazioni del layout e le funzionalità disponibili con Toolset.

…
  • Come aprire il pannello Impostazioni Toolset

    Puoi aprirlo facendo clic sul pulsante Impostazioni Toolset presente a destra della Barra Utility.

    Il pulsante potrebbe risultare inattivo per qualche istante appena aperta la pagina, in attesa che sia completato il caricamento del sistema.

    Il pannello compare in sovrapposizione nella pagina corrente del Forum.

  • Come chiudere il pannello Impostazioni Toolset

    Puoi chiuderlo attraverso il pulsante [×] situato a destra nella barra del titolo del pannello, oppure cliccando in un punto qualsiasi all’esterno del pannello stesso.

  • Barra del titolo, in alto al pannello

    A sinistra, oltre al titolo Impostazioni, è indicata la versione aggiornata del Toolset attualmente utilizzato.

    A destra, a fianco al pulsante [×], è presente l’icona [❔] (Consulta documentazione) che riporta a questa stessa pagina guida.

  • Barra di stato, in basso al pannello

    A sinistra, i pulsanti Annulla e Ripristina consentono di annullare e ripristinare le ultime modifiche apportate nel pannello.

    Le modifiche effettuate nel pannello restano memorizzate nella cronologia delle modifiche a livello di sessione del browser fino ad un massimo di 30 ultime azioni.

    A destra, i pulsanti Importa Configurazione ed Esporta Configurazione ti permettono di caricare le impostazioni da un file JSON locale e di salvare quelle correnti (il file viene salvato tra i download come fht_usersettings.json).

    In questo modo è sempre possibile creare dei backup per poter ripristinare la tua configurazione Toolset in qualsiasi momento e su qualsiasi browser.

  • Sistema a schede

    Puoi mettere a punto tutte le impostazioni del Toolset attraverso due modalità, usando il modulo di configurazione (scheda Form) o applicandole attraverso l'editor JSON (scheda Prompt).

Scheda Form

Il modulo di configurazione contiene i controlli, raggruppati per sezioni, che ti permettono di regolare in modo semplice ciascuna impostazione.

…


Ogni modifica effettuata viene applicata e memorizzata istantaneamente.
Per ciascuna impostazione puoi ripristinare il valore di default attraverso il pulsante ↺ Ripristina default che compare a destra del relativo controllo quando ci passi sopra.
Il pulsante Ripristina default è disponibile solo quando il valore applicato non è quello di default; in tal caso il controllo risulta evidenziato in celeste.

Di seguito, la descrizione di ciascun controllo nelle rispettive sezioni.

Layout

  • Rimuovi Top-bar

    Ti permette di recuperare spazio nascondendo la Top-bar dove sono presenti alcuni link al portale HTML.it e altre funzioni poco utilizzate.

  • Barra Utility sempre visibile

    Blocca in alto la Barra Utility così che resti sempre visibile e accessibile anche quando scorri la pagina verso il basso.

  • Visualizzazione compatta

    Riduce gli ingombri e lo spazio tra gli elementi del layout per avere una impaginazione più uniforme e meno dispersiva.

  • Max-width body

    Ti permette di impostare la larghezza massima per il corpo del Forum in modo da ottenere una impaginazione più ottimale, che meglio si adegui all'area visibile del tuo schermo.

  • Font-size codice

    Ti permette di impostare la dimensione carattere (con un valore tra 7pt e 16pt) per i blocchi di codice presenti nelle discussioni così da poter avere una migliore leggibilità degli stessi.

  • Font-size Utility

    Ti permette di impostare la dimensione carattere (come auto oppure con un valore tra 7pt e 16pt) per la Barra Utility. Il valore auto (default) definisce in modo automatico la dimensione del font basandosi su altre eventuali impostazioni (ad es. Visualizzazione compatta).

Strumenti

  • Tooltip "Riporta quotato"

    Abilita la visualizzazione del tooltip cliccabile per lo strumento Riporta quotato quando selezioni del contenuto nei post. Questo ti permette di riportare, nell'editor, il testo selezionato, inserendolo automaticamente dentro un tag [QUOTE].

  • Pulsante "Copia codice"

    Visualizza un pulsante, posizionato in alto a destra di ciascun blocco di codice nelle discussioni, che ti permette di copiare facilmente negli appunti il relativo codice in formato testuale.

  • Icona mostra/nascondi password

    Applica, per ciascun campo password presente nel Forum, una piccola icona cliccabile a forma di occhio. Questa permette di commutare il contenuto del campo mostrando la password in chiaro (come testo leggibile) o in modo offuscato (come serie di pallini o asterischi). Tale strumento permette di facilitare la compilazione dei relativi campi potendone verificare visivamente l'esattezza durante la digitazione, ad esempio quando effettui il login.

  • Mostrine staff

    Visualizza delle piccole icone a fianco ai nickname di amministratori e moderatori per identificarli ed evidenziarli nella pagina.

  • Mantieni attiva la sessione

    Normalmente la sessione utente scade dopo circa 20 minuti di inattività sulla pagina se l'opzione Ricordami non è stata spuntata al momento del login.

    Il mantenimento della sessione consente invece di tenere viva la sessione finché resta aperta una qualsiasi pagina del Forum anche se l'utente non compie alcuna attività. Questa funzionalità può prevenire il noto bug caratteri accentati compromessi, vedi dettagli sotto Bug risolti.

    Chiaramente la sessione scade comunque quando si effettua il logout o quando, non avendo spuntato l'opzione Ricordami, si chiude il browser o le pagine del Forum.

Colori

  • "Tinta base" e "Evidenziato"

    Ti permettono di personalizzare l'aspetto del Forum applicando dei colori a tua scelta

  • Modalità

    Ti permette di scegliere la modalità colore che preferisci tra Chiaro e Scuro oppure mantenere la modalità di default Come da sistema operativo che si basa su quella relativa impostata nel tuo sistema operativo.

    Questa impostazione agisce principalmente sullo sfondo del contenitore più esterno del Forum e su vari elementi del sistema, mentre gli elementi che costituiscono il corpo e i contenuti del Forum stesso si baseranno sul design originale, cioè fondo chiaro e testo scuro.

  • Temi predefiniti

    Puoi applicare un tema preimpostato scegliendolo tra quelli elencati nella collezione. Puoi sceglierlo dal menu a discesa oppure dalle relative tavolozze.

    Puoi notare che la tavolozza, relativa al tema applicato, risulta evidenziata.

    Il tema è costituito da una combinazione di valori relativi alle opzioni sopraindicate, le quali saranno automaticamente impostate quando questo viene applicato.

  • Temi utente

    Attraverso un semplice form puoi creare e gestire una collezione personale di tuoi temi.

    • Per creare un nuovo tema utente, digita un nuovo nome nel campo nome tema e fai clic su 📌 (Salva/modifica)
    • Per rinominare un tema utente esistente, selezionalo quindi digita un nuovo nome e fai clic su 📌 (Salva/modifica)
    • Per modificare i colori di un tema utente esistente, selezionalo quindi scegli la nuova combinazione di colori e fai clic su 📌 ("Salva/modifica")
    • Per rimuovere un tema esistente, selezionalo e fai clic su 🗑️ (Rimuovi tema utente)

    I temi salvati saranno elencati nella tua collezione, potrai quindi sceglierli dal menu a discesa o dalle tavolozze per variare l'aspetto del Forum in qualunque momento.

Utility

La Barra Utility, presente nel Forum, è stata implementata per offrire uno strumento più utile e funzionale.
Puoi utilizzare una barra preimpostata o crearne di personalizzate.

  • Usa barra

    Da questo menu a discesa puoi scegliere la barra che vuoi sia visualizzata nel Forum. Sono disponibili da subito due barre preimpostate ma tu puoi crearne delle altre personalizzate.

    In qualsiasi momento puoi scegliere una qualsiasi barra disponibile nell'elenco, sia attraverso il menu a discesa presente nel pannello Impostazioni Toolset sia attraverso quello disponibile nella Barra Utility del Forum (facendo clic sull'etichetta UTILITY a sinistra della barra stessa).

  • Nuova barra

    Fai clic su questo pulsante per creare una nuova barra personalizzata che potrai definire attraverso il relativo datagrid.

  • Come usare i datagrid
    • Attraverso i datagrid puoi gestire tutti i dati delle barre utility.
    • Per estendere o ridurre ciascun datagrid puoi fare doppio clic al centro della relativa barra del titolo o usare il pulsante Estendi/riduci.
    • Le barre preimpostate non possono essere modificate; in questo caso i datagrid hanno la barra del titolo di colore grigio, mentre è blu per le barre personalizzate.
    • Quando crei una nuova barra viene predisposto inizialmente un relativo datagrid a cui è applicato un nome generico e che possiede un elemento Link vuoto.
    • Puoi rinominare la barra attraverso il campo presente nella barra del titolo del relativo datagrid. Il nome è univoco.
    • Puoi rimuovere ciascuna barra personalizzata attraverso il relativo pulsante 🗑️ Rimuovi questa Barra Utility, presente nella barra del titolo del relativo datagrid.
    • Puoi compilare i campi della tabella per definire ciascun elemento Link.
    • Il pulsante ➕ (Aggiungi nuovo elemento Link), presente nella barra del titolo, ti permette di aggiungere nuovi elementi Link nella relativa barra.
    • Puoi rimuovere ciascun elemento Link attraverso il relativo pulsante ✖, che viene mostrato a destra per ogni riga della tabella.
    • Per ridefinire l'ordine degli elementi Link all'interno della relativa barra personalizzata, puoi trascinare ciascuna riga della tabella agendo sulla maniglia che viene mostrata a sinistra della riga.
    • Puoi anche trascinare le righe tra tabelle diverse per spostare gli elementi Link da una barra all'altra.
    • Per ridefinire l'ordine delle barre personalizzate puoi trascinare i relativi datagrid agendo sulla maniglia presente al centro della relativa barra del titolo.

Scheda Prompt

Tutte le impostazioni definite da utente sono memorizzate come stringa di dati in formato JSON.
Il Prompt è uno strumento complementare al Form che ti permette di agire in modo diretto sul JSON per effettuare delle modifiche alle impostazioni e ridefinirle in parte o totalmente.

…

Editor impostazioni (JSON)

L'Editor ti permette di formulare un JSON che abbia proprietà e valori applicabili per poter definire le corrispettive impostazioni.

Il contenuto da inserire nell'area di testo deve essere un JSON valido. Quando l'area di testo risulta bordata in rosso, significa che il contenuto non è un JSON valido; dovrai quindi correggerlo per poterlo applicare.

Il JSON deve essere composto da un oggetto principale (rappresentato da una coppia di parentesi graffe {}) in cui puoi includere delle proprietà (espresse come "nome": valore) che rappresentano le singole impostazioni.

Di seguito l'elenco delle proprietà supportate, suddivise per sezioni, con relativa descrizione dei valori consentiti.

― Layout ―

  • "rimuoviTopBar": valore numerico 0 o 1. Default 0
  • "visualizzazioneCompatta": valore numerico 0 o 1. Default 1
  • "stickyBarraUtility": valore numerico 0 o 1. Default 1
  • "larghezzaMassima": valore numerico compreso tra 768 e 1800. Indica una dimensione espressa in px. Default 996
  • "fontSizeCodice": valore numerico compreso tra 7 e 16. Indica una dimensione espressa in pt Default 10
  • "fontSizeUtility": valore numerico compreso tra 6 e 16. Indica una dimensione espressa in pt, tuttavia il valore 6 rappresenta il valore "auto". Default 6

― Colori ―

  • "schemaColore": un valore testuale fra i tre, "A" (auto), "C" (chiaro), "S" (scuro). Default "A"
  • "coloreBase": stringa esadecimale a 6 caratteri nel formato RRGGBB. Default "212954"
  • "coloreEvidenziato": stringa esadecimale a 6 caratteri nel formato RRGGBB. Default "29a4e5"
  • "temiUtente": array di elementi (array) con questa struttura, [nome (stringa), schemaColore ("A", "C" o "S"), coloreBase (stringa esadecimale "RRGGBB"), coloreEvidenziato (stringa esadecimale "RRGGBB")]

― Strumenti ―

  • "copiaCodice": valore numerico 0 o 1. Default 1
  • "riportaQuotato": valore numerico 0 o 1. Default 1
  • "mantieniSessione": valore numerico 0 o 1. Default 1
  • "identificaStaff": valore numerico 0 o 1. Default 1
  • "togglePassword": valore numerico 0 o 1. Default 1

― Utility ―

  • "barraUtility": valore testuale che specifica il nome della barra selezionata, da usare nel Forum. Default "Emoji (predefinita)"
  • "barreUtilityUtente": array di oggetti con questa struttura, {nome: (stringa), elementi: (array [testo (stringa), href (stringa), title(stringa), _blank (0 o 1), nascosto (0 o 1)]), [aperto]: (0 o 1)}
  • "statoBarrePredefinite": stringa di valori 0 e 1 che indica lo stato (chiuso, aperto) per ciascun datagrid relativo alle barre predefinite. Default "" (stringa vuota)

La barra degli strumenti nell'Editor include le seguenti funzionalità:

  • Nuovo JSON predispone l'Editor per inserire un nuovo oggetto impostazioni.
  • Applica questa configurazione convalida il JSON inserito nell'Editor e lo applica al posto della configurazione corrente, cioè sovrascrive tutte le impostazioni correnti.
  • Unisci a impostazioni correnti convalida il JSON inserito nell'Editor e aggiunge o sovrascrive, alla configurazione corrente, soltanto i valori delle proprietà specificate, mantenendo inalterate le eventuali altre impostazioni correnti.
  • Formatta e convalida JSON convalida il JSON inserito nell'Editor e applica una indentazione leggibile al codice.
  • Minimizza e convalida JSON convalida il JSON inserito nell'Editor e minimizza il codice rimuovendo tutte le interruzioni di riga e gli spazi aggiuntivi.
  • Copia JSON negli appunti ti permette di copiare automaticamente l'intero contenuto dell'area di testo per poterlo poi incollare dove ti serve (ad esempio per condividerlo facilmente nel Forum).

Configurazione corrente

In quest'area è riportato il codice JSON relativo alla configurazione corrente. Sono quindi riportate tutte le impostazioni definite con un valore che non è quello di default.

Cliccando il pulsante Riporta nell'Editor la configurazione corrente il corrispettivo codice JSON sarà automaticamente riportato nell'Editor dove potrai apportare le eventuali modifiche.

Il pulsante Copia JSON negli appunti ti permette di copiare automaticamente l'intero JSON della configurazione corrente per poterlo poi incollare dove ti serve (ad esempio per condividerlo facilmente nel Forum).

Toolset può progredire

Toolset potrà essere aggiornato e implementato per offrire altre utili funzionalità. Segui la relativa discussione nel Forum HTML.it per saperne di più e partecipare agli sviluppi.