pokemoncentral / wiki-project

Coordinamento dello sviluppo tecnico di Pokémon Central Wiki
https://wiki.pokemoncentral.it
1 stars 0 forks source link

Genitori movelist/breed #22

Closed davla closed 6 years ago

davla commented 6 years ago

Descrizione

Nella issue #20 sono emersi problemi per il nuovo tt mobile-friendly, riguardo il genitori nel movelist/breed, che possono essere molti, facendo esplodere le dimensioni del popup. Credo che questo problema meriti una issue a sé stante.

Screenshot

breed E sono su un 4K 27''.

Pagine affette

Tanto per citarne una

Risoluzione del problema

Vedere da qui in poi per le proposte correnti.

lucas992x commented 6 years ago

Non potendo comprimere automaticamente le cose da mobile, secondo me la scelta migliore è un tooltip grosso quasi come lo schermo e scorribile che contenga i soli MiniSprite, senza nomi.

flavio-a commented 6 years ago

@lucas992 Ma supponendo di poter comprimere le cose da mobile, preferiresti questa opzione al tooltip? (Non sto dicendo che sia fattibile, voglio solo capire se è una possibile alternativa)

lucas992x commented 6 years ago

Ci ho pensato un po' e penso che comunque resti meglio il tooltip. Con le cose compresse, questi box decompressati da mobile sarebbero esageratamente lunghi dovendo stare su una colonna sola, mentre nel tooltip potrebbero essere disposti su una griglia che sforerebbe sì per varie mosse, ma comunque ottimizzerebbe meglio gli spazi.

flavio-a commented 6 years ago

@lucas992 Questo è un punto molto interessante. Inizio a ricredermi, anche se la possibilità di un popup invasivo continua ad inteigarmi. Potrei fare qualche prova per vedere cosa succede nei vari casi con i due metodi. E poi bisogna sentire @mejicat se gli vanno bene estensioni un po' pesanti

flavio-a commented 6 years ago

Ho creato un paio di esempi con le due alternative: tooltip e popup invasivo. Non so quale mi convinca di più al momento, anche se devo ammettere che se i possibili genitori sono 2 forse il popup non è il massimo. https://uz.sns.it/~Flavio_a/

PS: è sorprendente come passare da bordo nero squadrato a sfondo solid color + roundy (due righe di css) faccia saltare dagli anni 90 agli anni 10.

lucas992x commented 6 years ago

@flavio-a Per me molto meglio la seconda (cioè il tooltip).

davla commented 6 years ago

Su schermi piccoli il popup invasivo e il tooltip non cambiano molto. Più di uno alla volta non si apre.

flavio-a commented 6 years ago

Dai commenti precedenti sembra che il pubblico preferisca il tooltip. Io l'ho realizzato con Popper.js (perché era quello linkato da Gika e non avevo sbatta di cercane un altro). Se nessuno ha altri pareri e @mexicat ci autorizza a caricarlo sul Wiki poss(iam)o iniziare a lavorare più nel dettaglio.

mexicat commented 6 years ago

Mi sembra meglio il popup perché così non siamo costretti dal layout del punto in cui andrebbe visualizzato il tooltip: se ci sono dei link con tooltip grossi ai margini della pagina, c'è da fare un sacco di calcoli per evitare che il contenuto esca fuori. La soluzione popup (tecnicamente è un modale) è molto più libera anche dal punto di vista di ciò che ci può essere inserito dentro e funziona meglio su mobile. Sono 5k di script poi, quindi per me non è un problema (tenete la licenza quando lo copiate però).

flavio-a commented 6 years ago

@mexicat Il posizionamento del tooltip viene gestito completamente dalla libreria qundi non ci sono problemi neanche se il link e laterale con un tooltip grosso. Di contro il tooltip usa Popper, che sono 20k minifizato. C'è anche da considerare che ci serve comunque un plugin per i tooltip per fare il tt, è vero che avrebbe contenuto solo testuale ma bisogna comunque che faccia un minimo di posizionamento (il testo può essere relativamente lungo)

CiaobyDany commented 6 years ago

Quantomeno da mobile il popup è molto più comodo perché può essere chiuso toccando qualsiasi parte dello schermo che non abbia il popup, mentre il tooltip deve essere chiuso toccando di nuovo la targhetta in modo preciso. Considerando che le nostre pagine sono piene di link la probabilità di aprire qualcos'altro anziché chiudere il tooltip non è esattamente nulla. Poi, certo, se il popup ha problemi di ottimizzazione amen, ma considerando la sola funzionalità mobile io lo preferisco.

flavio-a commented 6 years ago

@CiaobyDany il fatto che il tooltip non si chiuda toccando fuori è un "bug" della prova, in teoria si dovrebbe poter sistemare (sento Maze) per farlo sparire toccando ovunque fuori dal tooltip. Per il fatto di far sparire il popup toccando fuori dallo stesso il problema è che per popup grossi non esiste davvero un fuori, c'è solo un bordino ridicolo. Che è un problema che in realtà si pone anche con tooltip grossi, ma non ci si può fare niente perché se lo schermo è piccolo e il contenuto è tanto per forza lo occupa tutto.

CiaobyDany commented 6 years ago

@flavio-a Allora, ok per il bug del tooltip, mentre per entrambi quanto sarebbe infattibile fare in modo che la dimensione massima del box sia più piccola della dimensione dello schermo?

flavio-a commented 6 years ago

Aggiungere dello spazio lateralmente è facile, sopra è molto più impegnativo ma penso che basti quello di fianco.

CiaobyDany commented 6 years ago

@flavio-a Ah, be', sì, forse è anche più comodo. L'importante è avere una safe zone con cui chiuderlo

flavio-a commented 6 years ago

@CiaobyDany per chiarire, la tua preferenza è tooltip modulo risolvere quei due problemi? O sei del #teamPopup?

flavio-a commented 6 years ago

Dopo aver raccolto un po' di preferenze, direi che serve un sondaggio.

#teamPopup (o #teamModale)

#teamTooltip

Poi aggiungo un commento per far cambiare idea a Luca, così siamo tutti felici: non sono per niente sicuro che si riesca ad evitare che due tooltip aperti insieme si sovrappongano.

Personalmente per la sola versione desktop preferisco il tooltip, ma se c'è rischio di sovrapposizione non c'è nessun vantaggio rispetto al popup dato che la possibilità di esaminare due contenuti insieme viene persa quasi sempre. Ovviamente resta il lato estetico, ma quello è un altro discorso.

davla commented 6 years ago

IoStoConFlavìo

Il Tooltip da mobile proprio non funziona. Per il desktop possiamo parlarne, ma la sovrapposizione ci sarà sempre. Se è necessaria la visione di contenuti conteporaneamente, allora si possono anche lasciare i collapsible. E a tal punto, il modal è la versione mobile del collapsible, che non sarebbe malissimo.

lucas992x commented 6 years ago

Il popup da mobile non riesco proprio a chiuderlo se non dopo diversi tentativi, quindi continuo a preferire il tooltip se non si trova un'altra soluzione (tipo rimpicciolirlo).

flavio-a commented 6 years ago

A me non sembrava difficile premere di fianco, comunque ci metto 2 secondi a restringerlo (cambio nel css da 90% a 85 o 80 o quello che vi piace di più). Se quello è l'unico problema si risolve in 1 secondo. Anzi, si potrebbe anche pensare di spostarlo da un lato (con un po' di margine dal bordo dello schermo) e lasciare tutto lo spazio dall'altra parte per rendere più facile la chiusura senza rimpicciolirlo troppo. In ogni caso a questo si può trovare una soluzione (magari anche mettere la x in alto a destra). Il punto è che se ci spostiamo sul modale/popup inizio a lavorare solo in tal senso e a guardare la libreria ultralightweight di Gika per il tt.

lucas992x commented 6 years ago

@flavio-a Se è così va bene, perché è l'unico difetto rilevante che riscontro

CiaobyDany commented 6 years ago

@flavio-a Ah, sicuramente, io davo per scontato che nella versione definitiva ci sarebbe stato spazio a sufficienza per schiaffare con sicurezza il mio pollicione sullo schermo e chiudere il cazzillo, non deludetemi.

flavio-a commented 6 years ago

Essendo scaduta la deadline per votare, direi che il modale vince. A questo punto si sblocca anche #20 visto che possiamo andare con la libreria lightweight di Gika (o equivalenti).

CiaobyDany commented 6 years ago

Non voglio assolutamente pressare nessuno perché a livello di priorità credo sia successivo alla questione ndex, ma ora siamo fermi per mancanza di tempo o perché c'è da fare/decidere qualcosa prima di modificare? Cioè, in teoria è da fare un tt contenente i MS che adesso sono nascosti con testo "espandi" o una parola simile, giusto?

flavio-a commented 6 years ago

@CiaobyDany Si era scelto il modale, mi pare. Comunque no, è fermo solo perché nessuno ha tempo al momento

CiaobyDany commented 6 years ago

@flavio-a Ah, vero, che scemo, avevo confuso le due cose. Perfetto, era giusto per capire meglio la situazione.

flavio-a commented 6 years ago

https://wiki.pokemoncentral.it/Utente:Ff300/sandbox Questo è più o meno come dovrebbe venire. Il motivo per cui scrivo qui è che vorrei un consiglio su come evidenziare meglio il fatto che si può premere sui ✔ per far aprire il modale. Per il momento lo sto scrivendo nel footer, ma tanto nessuno lo legge quindi non mi sembra minimamente sufficiente. Stavo pensando anche alla sottolineatura con punti stile tt, solo che non vorrei che questo confondesse gli utenti desktop (dato che in un caso devono metterci sopra il mouse e nell'altro premere). Se poi nessuno ha idee migliori, ci accontenteremo. Ovviamente qualsiasi altra critica (costruttiva) è ben accetta.

davla commented 6 years ago

Sottolineatura, con trasformazione del cursore nella classica manina.

lucas992x commented 6 years ago

Concordo con Dedalo, sottolineatura da tt e cursore a manina mi sembra la cosa migliore.

flavio-a commented 6 years ago

Ottimo, se nessuno ha altro da dire stasera carico e chiudo.

davla commented 6 years ago

Io ho da ridire. Come hai implementato? Dov'è l'implementazione? Eh? Dov'è?

flavio-a commented 6 years ago

@davla in un commit sul mio pc che pusherò quando caricherò sul wiki per chiudere quest'issue

davla commented 6 years ago

Hai usato id unici o lo snippet che ti sugerii io qualche tempo fa?

Va be', tanto se voglio cambiare un paio di cose posso farlo tranquillamente più tardi.

Approvato.