[Bug] Carousel "ultimi contenuti pubblicati" malfunzionante

[hashcat]

La funzione "nascondi" del carousel non sembra sortire alcun effetto.

Inoltre:

la barra di scorrimento degli articoli non funziona più in automatico e orizzontale, ma solo in verticale.

Bug https://bug.turbolab.it/turbolabit/issues/132

[[Claudio]]

inoltre, confermo .... la funzione NASCONDI non funziona

[Zane]

Ok, mostra/nascondi funzionante.

Per il resto, chiedo l'aiuto di Andy94

Andy: contestualmente alla migrazione, ho dovuto fare alcune modifiche:

1. ho aggiornato i componenti dal Carousel (jquery.easing, jquery.touchSwipe) alle rispettive ultime versioni attualmente disponibili
2. tali componenti vengono caricati da sito esterno
3. l'override che avevi fatto in liquid-slider.css è stato messo in un CSS a parte

Non ho fatto invece alcuna modifica all'HTML.

Queste tutte le risorse in gioco (cerca "Carousel" nel sorgente per vedere dove stanno)

https://turbolab.it/css/animate.css
https://cdn.phporn.net/js/liquidslider/ ... slider.css
https://turbolab.it/css/forum-carousel.css

https://cdn.phporn.net/js/jquery.easing ... .easing.js
https://cdn.phporn.net/js/jquery.touchs ... ipe.min.js
https://cdn.phporn.net/js/liquidslider/ ... der.min.js
https://turbolab.it/js/forum-carousel.js

Puoi dare un'occhiata e farmi sapere?

[magopenguin]

La funzione "nascondi" del carousel non sembra sortire alcun effetto.

Inoltre:

la barra di scorrimento degli articoli non funziona più in automatico e orizzontale, ma solo in verticale.

Bug https://bug.turbolab.it/turbolabit/issues/132

Ci risiamo però

[Andy94]

Ci guardo appena torno in possesso di un PC, ora dall'alta montagna mentre attendo la funivia mi è difficile.

[Andy94]

Ci ho sbattuto la testa per qualche ora ma sinceramente mi sembra tutto in ordine e ho difficoltà a capire che problema potrebbe esserci...

Ho replicato in locale la situazione (prendendo i file esatti dal nostro CDN) e mi dà lo stesso problema, allo stesso modo, con i file scaricati dal suo archivio e i contenuti di default, non riesco a farlo partire (il problema è che non dà errori in console).

Mi viene quasi una mezza voglia di cambiare componente.

[gidan80]

Credo (almeno spero che sia così) di aver trovato una soluzione.

Le modifiche da apportare sono:
1. Togliere max-width da "main-slider-wrapper"
2. Settare tutti i "main-slider-panel" con width:14.3% (valore derivato dalla divisione di 1/7 ossia lo spazio che occupa un pannello dato che ce ne sono sette)
3. variare i parametri che ho indicato nel css allegato => https://www.dropbox.com/s/kykw9o8wslct0 ... l.css?dl=0

Ditemi come vi sembra.

[Zane]

grazie gidan,
lascio a Andy l'ultima parola dato che quel componente l'ha fatto lui. Se mi conferma, io procedo e vengo personalmente a casa tua (se abiti fra Ferrara-Copparo-Santa Maria Maddalena ) ad offrirti una birra!

[Andy94]

Ci stavo dando un'occhiata ieri sera, ma non mi sembra risolutivo in quanto trattasi di modifiche al foglio di stile. Qui secondo me abbiamo un problema sul codice javascript, che non fa funzionare l'intera animazione. Anche se venissero variati quei dati, il tutto sarebbe sempre statico.

Non ho guardato il file in Dropbox perché non mi si apriva ieri, oggi magari riprovo.

[gidan80]

Giusto, hai provato ad aggiungere a forum-carousel.js oltre ai parametri:
autoSlideInterval:10000,
pauseOnHover: true

anche:
autoSlide:true

Potrebbe essere quello l'inghippo.

[gidan80]

Una soluzione temporanea potrebbe essere quella di aggiungere questa riga di codice (non tanto carina):

Codice: Seleziona tutto

setInterval(function(){document.getElementById('idDellaFreccia').click();},10000);

In questo modo, dando un id alla freccia di destra si può simulare il click su di essa e far si che i pannelli scorrano ma, ripeto, la soluzione è solo temporanea e non ottimale.

[Andy94]

@TUTTI:

Ho cambiato componente con uno più semplice e ha ripreso a funzionare...
Mi date un feedback?
http://andy94.no-ip.org/phpBB3/

@GZZ: le modifiche da fare non sono molte.

[gidan80]

Funziona bene e sembra anche piu' fluido (effetto diverso?), magari, se è possibile, sarebbe bello aumentare un po' la distanza tra una miniatura e l'altra.

Codice: Seleziona tutto

.art {
    display: inline-block; margin: 0 1.8%; width: 130px; height: 120px;
}

Altrimenti se crea problemi va beneissimo anche così.

[Zane]

Bella Andy! Per me va benissimo anche così! Se il suggerimento di gidan ci sta, mettiamo pure anche quello (vi ricordo che deve vedersi bene, senza barre di scorrimento, già alla risoluzione di 1024px orizzontali).

Non appena sei pronto, attendo qui di seguito istruzioni per implementare

[Andy94]

@gidan: Il margine non si può toccare, spiacente... Se lo facciamo viene meno la richiesta di @GZZ di supportare senza problemi i 1024px.

@GZZ A seguire istruzioni...

[Andy94]

Togliere tutto questo blocco relativo al vecchio slider

Codice: Seleziona tutto

<!-- START Carousel con i contenuti -->
<link href="https://turbolab.it/css/animate.css" rel="stylesheet" type="text/css" media="screen, projection" />
<link href="//cdn.phporn.net/js/liquidslider/css/liquid-slider.css" rel="stylesheet" type="text/css" media="screen, projection" />
<link href="https://turbolab.it/css/forum-carousel.css" rel="stylesheet" type="text/css" media="screen, projection" />

<script src="//cdn.phporn.net/js/jquery.easing/jquery.easing.js"></script>
<script src="//cdn.phporn.net/js/jquery.touchswipe/jquery.touchSwipe.min.js"></script>
<script src="//cdn.phporn.net/js/liquidslider/js/jquery.liquid-slider.min.js"></script>
<script src="https://turbolab.it/js/forum-carousel.js"></script>
<!-- END Carousel con i contenuti -->

Inserire questi due file nel CDN ed incorporarli
http://andy94.no-ip.org/phpBB3/jquery.bxslider.min.js
http://andy94.no-ip.org/phpBB3/jquery.bxslider.css

Annotazioni:
- Il file CSS ha delle regole aggiuntive in alto
- Il file CSS presenta i percorsi a delle immagini che devono essere adeguati di conseguenza

Prelevare queste due immagini e referenziarle nel CSS in tutte le loro istanze (CTRL+F per cercare i nomi file) (vedi punto sopra)
http://andy94.no-ip.org/images/bx_loader.gif
http://andy94.no-ip.org/images/controls.png

Istanziare lo slider con questo codice

Codice: Seleziona tutto

<script type="text/javascript">
    $(document).ready(function(){
        $('#main-slider').bxSlider({
            auto: true,
            autoControls: true,
            pager: false,
            controls: true,
            autoHover: true
        });
    });
</script>

Fare le seguenti modifiche alla struttura del carousel stampata dal tuo controller
Questo (con la relativa chiusura)

Codice: Seleziona tutto

<div class="liquid-slider" id="main-slider">

Diventa questo

Codice: Seleziona tutto

<ul class="bxslider no-js" id="main-slider">

Ogni "Inizio contenitore di sei" si trasforma in LI (e relativa chiusura):

Codice: Seleziona tutto

<div><!-- Inizio contenitore di sei -->

Diventa

Codice: Seleziona tutto

<li><!-- Inizio contenitore di sei -->

[Al3x]

Per la cronaca, provato su Note 2 con 4.4.2 sia browser stock che chrome. Funziona perfettamente anche se lo slinding è piuttosto veloce.

[Andy94]

@GZZ: esiste il parametro speed che accetta un intero indicante il tempo di permanenza di ciascuna slide.

[Zane]

Grazie Andy per il bel lavoro e per le ottime istruzioni!

Ho iniziato (ma non ancora finito) a montare il tutto. Domani spero di riuscire a finire, poi facciamo qualche prova.

Frattanto, ti chiedo una conferma: css/animate.css serve ancora oppure lo posso eliminare?

[Andy94]

Butta via

[Andy94]

@GZZ: ti segnalo che la classe no-js va sul UL e non dov'è ora, così risolvi anche il problema delle scrollbar persistenti.

[The Doctor]

Mi pare egregiamente risolto

[Zane]

Ok, ho caricato anche gli ultimi file e corretto il no-js.

@Andy: direi di aver completato le istruzioni che mi hai dato, ma fai un giro anche tu per verificare che non abbia dimenticato niente

Ti segnalo questo problemino: a me il "Nascondi" funziona, ma poi, se cambio pagina, il "Mostra" non funziona bene (apre solo di pochi px).

[The Doctor]

Ti segnalo questo problemino: a me il "Nascondi" funziona, ma poi, se cambio pagina, il "Mostra" non funziona bene (apre solo di pochi px).

Confermo

[hashcat]

Confermo

Quoto.