Squelette hyperspace et Firefox, problème javascript (?)

Perline · Novembre 6, 2019, 1:30

Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).

Le squelette n'est pas donné compatible avec 3.2.5, j'ai testé et c'était OK, jusqu'à ce que je m'aperçoive d'un petit bémol, qui n’apparaît que dans Firefox (pas dans chrome ni dans Opera).

La page charge, on la voit très vite, puis on ne voit plus le texte.
Après recherches, j’en conclus que le problème se trouve dans le fichier

hyperspace_theme_responsive_pour_spip-master/assets/js/main.js

Plus exactement la fonction

// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');

      $window.on('load', function() {
        window.setTimeout(function() {
          $body.removeClass('is-loading');
        }, 100);
      });

le style is-loading ne se remove pas.

Par ailleurs, dans

hyperspace_theme_responsive_pour_spip-master/assets/sass/base/_page.scss

On a aussi cette action

body {
background: _palette(bg);

    // Prevents animation/transition "flicker" on page load.
    // Automatically added/removed by js/main.js.
      &.is-loading {
        *, *:before, *:after {
          @include vendor('animation', 'none !important');
          @include vendor('transition', 'none !important');
        }
      }

Mais je ne comprend pas le & avant le « is-loading », ni ce qu’il faut faire ou pas.

Le js c’est pas mon fort, et on ne peut pas agir sur les css perso.
Mais d'ailleurs comme ce n'est que dans FF que ça me fait, est-ce que ce n'est pas un truc à changer dans FF ?
Quelqu’un a-t-il une piste et peut-il donner un coup de main ?
Merci beaucoup.

--
****Fin du message end - Signature****
Perline

spip@perline.org – http://perline.org/

Ce message est couvert par le secret de la correspondance
(art. 226-15 et 432-9 du Code pénal)
********************************************

Perline · Novembre 27, 2019, 4:46

Up ?

-------- Message transféré --------
Sujet : Squelette hyperspace et Firefox, problème javascript (?)
Date : Wed, 6 Nov 2019 14:30:16 +0100
De : Perline-Spip <spip@perline.org>
Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).

Le squelette n'est pas donné compatible avec 3.2.5, j'ai testé et c'était OK, jusqu'à ce que je m'aperçoive d'un petit bémol, qui n’apparaît que dans Firefox (pas dans chrome ni dans Opera).

La page charge, on la voit très vite, puis on ne voit plus le texte.
Après recherches, j’en conclus que le problème se trouve dans le fichier

hyperspace_theme_responsive_pour_spip-master/assets/js/main.js

Plus exactement la fonction

// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');

      $window.on('load', function() {
        window.setTimeout(function() {
          $body.removeClass('is-loading');
        }, 100);
      });

le style is-loading ne se remove pas.

Par ailleurs, dans

hyperspace_theme_responsive_pour_spip-master/assets/sass/base/_page.scss

On a aussi cette action

body {
background: _palette(bg);

    // Prevents animation/transition "flicker" on page load.
    // Automatically added/removed by js/main.js.
      &.is-loading {
        *, *:before, *:after {
          @include vendor('animation', 'none !important');
          @include vendor('transition', 'none !important');
        }
      }

Mais je ne comprend pas le & avant le « is-loading », ni ce qu’il faut faire ou pas.

Le js c’est pas mon fort, et on ne peut pas agir sur les css perso.
Mais d'ailleurs comme ce n'est que dans FF que ça me fait, est-ce que ce n'est pas un truc à changer dans FF ?
Quelqu’un a-t-il une piste et peut-il donner un coup de main ?
Merci beaucoup.

--
****Fin du message end - Signature****
Perline

spip@perline.org – http://perline.org/

Ce message est couvert par le secret de la correspondance
(art. 226-15 et 432-9 du Code pénal)
********************************************

marcimat · Novembre 27, 2019, 4:55

Le 06/11/2019 à 14:30, Perline-Spip a écrit :

Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).

// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');
         $window\.on$&#39;load&#39;, function\($ \{
             window\.setTimeout$function\($ \{
                 $body\.removeClass$&#39;is\-loading&#39;$;
             \}, 100\);
         \}\);
le style is-loading ne se remove pas.

C’est un truc typique des vieux javascripts de html5up.

Regarde par exemple :
https://zone.spip.net/trac/spip-zone/changeset/107487
Puis https://zone.spip.net/trac/spip-zone/changeset/107489

MM.

Perline · Décembre 2, 2019, 9:50

Merci, j'ai pas encore eu le temps de m'y mettre vu que javscript/ajax c'est pas mon rayon, faut que je me plonge dans tout ça...
Merci pour tes pistes.

Matthieu Marcillaud a écrit le 27/11/2019 à 17:55 :

Le 06/11/2019 à 14:30, Perline-Spip a écrit :

Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).
// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');
         $window\.on$&#39;load&#39;, function\($ \{
             window\.setTimeout$function\($ \{
                 $body\.removeClass$&#39;is\-loading&#39;$;
             \}, 100\);
         \}\);
le style is-loading ne se remove pas.
C’est un truc typique des vieux javascripts de html5up.

Regarde par exemple :
https://zone.spip.net/trac/spip-zone/changeset/107487
Puis https://zone.spip.net/trac/spip-zone/changeset/107489

MM.

--
****Fin du message end - Signature****
Perline

spip@perline.org – http://perline.org/

Ce message est couvert par le secret de la correspondance
(art. 226-15 et 432-9 du Code pénal)
********************************************

Perline · Février 15, 2020, 9:04

J'ai enfin réussi à me plonger dans cette histoire, j'ai pas plongé profond, c'était pas compliqué à transposer !
Je m'en faisais tout un pataquès

Le résumé est dans contrib/hyperspace (https://contrib.spip.net/Hyperspace-squelette-responsive#comment504048).
Merci Matthieu

Matthieu Marcillaud a écrit le 27/11/2019 à 17:55 :

Le 06/11/2019 à 14:30, Perline-Spip a écrit :

Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).
// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');
         $window\.on$&#39;load&#39;, function\($ \{
             window\.setTimeout$function\($ \{
                 $body\.removeClass$&#39;is\-loading&#39;$;
             \}, 100\);
         \}\);
le style is-loading ne se remove pas.

Le 27/11/2019 à 17:55 Matthieu Marcillaud
C’est un truc typique des vieux javascripts de html5up.

Regarde par exemple :
https://zone.spip.net/trac/spip-zone/changeset/107487
Puis https://zone.spip.net/trac/spip-zone/changeset/107489

MM.

--
****Fin du message end - Signature****
Perline

spip@perline.org – http://perline.org/

Ce message est couvert par le secret de la correspondance
(art. 226-15 et 432-9 du Code pénal)
********************************************

jeanmarie · Février 16, 2020, 11:52

Pour info le dépôt vient d'être intégré sur la forge https://git.spip.net/spip-contrib-squelettes/html5up_hyperspace

Il y a une version "dev" compatible 3.2 (et qui intègre le patch de Matthieu) sur laquelle je vais travailler mais que je vais passer en structure ZCore. Ça sera donc une version 3 incompatible avec avec l'actuelle version 2.

             jean marie

Le 15/02/2020 à 22:04, Perline-Spip a écrit :

J'ai enfin réussi à me plonger dans cette histoire, j'ai pas plongé profond, c'était pas compliqué à transposer !
Je m'en faisais tout un pataquès

Le résumé est dans contrib/hyperspace (https://contrib.spip.net/Hyperspace-squelette-responsive#comment504048).
Merci Matthieu

Matthieu Marcillaud a écrit le 27/11/2019 à 17:55 :
Le 06/11/2019 à 14:30, Perline-Spip a écrit :

Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).
// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');
         $window\.on$&#39;load&#39;, function\($ \{
             window\.setTimeout$function\($ \{
                 $body\.removeClass$&#39;is\-loading&#39;$;
             \}, 100\);
         \}\);
le style is-loading ne se remove pas.
Le 27/11/2019 à 17:55 Matthieu Marcillaud
C’est un truc typique des vieux javascripts de html5up.

Regarde par exemple :
https://zone.spip.net/trac/spip-zone/changeset/107487
Puis https://zone.spip.net/trac/spip-zone/changeset/107489

MM.

JLuc · Février 16, 2020, 2:07

Le 16/02/2020 à 12:52, Jean Marie Grall a écrit :

Pour info le dépôt vient d'être intégré sur la forge spip-contrib-squelettes / html5up_hyperspace · GitLab

Ok j'ai mis à jour la doc sur contrib
- url du source dans la liste des plugins html5up : Des squelettes SPIP pour les thèmes HTML5UP - SPIP-Contrib
- url du zip dans la doc du plugin HTML5UP Hyperspace V2 - SPIP-Contrib
Ya autre chose à faire ?

Il y a une version "dev" compatible 3.2 (et qui intègre le patch de Matthieu) sur laquelle je vais travailler mais que je vais passer en structure ZCore. Ça sera donc une version 3 incompatible avec avec l'actuelle version 2.

gogogo et viva zcore !

JL

Perline · Février 16, 2020, 10:28

Et donc je peux enlever mon js et mettre à jour avec cette version dev ?

Jean Marie Grall a écrit le 16/02/2020 à 12:52 :

Pour info le dépôt vient d'être intégré sur la forge https://git.spip.net/spip-contrib-squelettes/html5up_hyperspace

Il y a une version "dev" compatible 3.2 (et qui intègre le patch de Matthieu) sur laquelle je vais travailler mais que je vais passer en structure ZCore. Ça sera donc une version 3 incompatible avec avec l'actuelle version 2.
             jean marie
Le 15/02/2020 à 22:04, Perline-Spip a écrit :
J'ai enfin réussi à me plonger dans cette histoire, j'ai pas plongé profond, c'était pas compliqué à transposer !
Je m'en faisais tout un pataquès

Le résumé est dans contrib/hyperspace (https://contrib.spip.net/Hyperspace-squelette-responsive#comment504048).
Merci Matthieu

Matthieu Marcillaud a écrit le 27/11/2019 à 17:55 :
Le 06/11/2019 à 14:30, Perline-Spip a écrit :

Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).
// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');
         $window\.on$&#39;load&#39;, function\($ \{
             window\.setTimeout$function\($ \{
                 $body\.removeClass$&#39;is\-loading&#39;$;
             \}, 100\);
         \}\);
le style is-loading ne se remove pas.
Le 27/11/2019 à 17:55 Matthieu Marcillaud
C’est un truc typique des vieux javascripts de html5up.

Regarde par exemple :
https://zone.spip.net/trac/spip-zone/changeset/107487
Puis https://zone.spip.net/trac/spip-zone/changeset/107489

MM.

--
****Fin du message end - Signature****
Perline

spip@perline.org – http://perline.org/

Ce message est couvert par le secret de la correspondance
(art. 226-15 et 432-9 du Code pénal)
********************************************

jeanmarie · Février 17, 2020, 8:13

Non, car elle n'est pas destinée à rester compatible (en fait, elle ne l'ai déjà plus car j'ai avancé dessus depuis).
C'était pour info, dans l'idée que tu saches qu'il va y avoir une nouvelle version que tu pourras tester/utiliser.

                     jean marie

Le 16/02/2020 à 23:28, Perline-Spip a écrit :

Et donc je peux enlever mon js et mettre à jour avec cette version dev ?

Jean Marie Grall a écrit le 16/02/2020 à 12:52 :
Pour info le dépôt vient d'être intégré sur la forge https://git.spip.net/spip-contrib-squelettes/html5up_hyperspace

Il y a une version "dev" compatible 3.2 (et qui intègre le patch de Matthieu) sur laquelle je vais travailler mais que je vais passer en structure ZCore. Ça sera donc une version 3 incompatible avec avec l'actuelle version 2.
             jean marie
Le 15/02/2020 à 22:04, Perline-Spip a écrit :
J'ai enfin réussi à me plonger dans cette histoire, j'ai pas plongé profond, c'était pas compliqué à transposer !
Je m'en faisais tout un pataquès

Le résumé est dans contrib/hyperspace (https://contrib.spip.net/Hyperspace-squelette-responsive#comment504048).
Merci Matthieu

Matthieu Marcillaud a écrit le 27/11/2019 à 17:55 :
Le 06/11/2019 à 14:30, Perline-Spip a écrit :

Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).
// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');
         $window\.on$&#39;load&#39;, function\($ \{
             window\.setTimeout$function\($ \{
                 $body\.removeClass$&#39;is\-loading&#39;$;
             \}, 100\);
         \}\);
le style is-loading ne se remove pas.
Le 27/11/2019 à 17:55 Matthieu Marcillaud
C’est un truc typique des vieux javascripts de html5up.

Regarde par exemple :
https://zone.spip.net/trac/spip-zone/changeset/107487
Puis https://zone.spip.net/trac/spip-zone/changeset/107489

MM.

jeanmarie · Février 17, 2020, 8:14

Le 16/02/2020 à 15:07, JLuc a écrit :

Le 16/02/2020 à 12:52, Jean Marie Grall a écrit :

Pour info le dépôt vient d'être intégré sur la forge spip-contrib-squelettes / html5up_hyperspace · GitLab

Ok j'ai mis à jour la doc sur contrib
- url du source dans la liste des plugins html5up : Des squelettes SPIP pour les thèmes HTML5UP - SPIP-Contrib
- url du zip dans la doc du plugin HTML5UP Hyperspace V2 - SPIP-Contrib

Il vaut peut-être mieux passer le zip sur le tag 2.0.8 ?
Ça semble parti pour être la dernière version 2 et, à terme, on passera la version 3 en master, non ?

             jean amrie

JLuc · Février 17, 2020, 8:31

Le 17/02/2020 à 09:14, Jean Marie Grall a écrit :

Le 16/02/2020 à 15:07, JLuc a écrit :

Le 16/02/2020 à 12:52, Jean Marie Grall a écrit :

Pour info le dépôt vient d'être intégré sur la forge spip-contrib-squelettes / html5up_hyperspace · GitLab

Ok j'ai mis à jour la doc sur contrib
- url du source dans la liste des plugins html5up : Des squelettes SPIP pour les thèmes HTML5UP - SPIP-Contrib
- url du zip dans la doc du plugin HTML5UP Hyperspace V2 - SPIP-Contrib

Il vaut peut-être mieux passer le zip sur le tag 2.0.8 ?
Ça semble parti pour être la dernière version 2 et, à terme, on passera la version 3 en master, non ?

Et alors ?
J'en sais rien.

Mais hyperspace n'est pas disponible sur plugins.spip.net ?
Faudrait commencer par là.
Il est pas déclaré dans l'archivelist.txt ?

JL

jeanmarie · Février 17, 2020, 8:48

Le 17/02/2020 à 09:31, JLuc a écrit :

Le 17/02/2020 à 09:14, Jean Marie Grall a écrit :

Il vaut peut-être mieux passer le zip sur le tag 2.0.8 ?
Ça semble parti pour être la dernière version 2 et, à terme, on passera la version 3 en master, non ?

Et alors ?
J'en sais rien.

Mais hyperspace n'est pas disponible sur plugins.spip.net ?
Faudrait commencer par là.
Il est pas déclaré dans l'archivelist.txt ?

Il n'est pas sur la zone svn, non et la doc actuelle étant pour la version 2, je ferai donc une nouvelle doc pour cette V3.

J'imagine donc que la doc de cette v2 doit pointer vers le zip v2 pour archive, sachant qu'elle n'est plus maintenue, pas compatible en l'état avec SPIP 3.2 (à moins d'ajouter avec le patch js de marcimat + changer les bornes à la main) et qu'elle risque de ne plus bouger. Ou alors on récupère un zip en dur pour cette doc.
(je viens d'ajouter les versions SPIP sur la doc, c'est déjà ça de fait)

Bref, à décider ensemble comment ça passe pour ce genre de cas...

             jean marie

Perline · Février 17, 2020, 9:28

Super, merci.

Jean Marie Grall a écrit le 17/02/2020 à 09:13 :

Non, car elle n'est pas destinée à rester compatible (en fait, elle ne l'ai déjà plus car j'ai avancé dessus depuis).
C'était pour info, dans l'idée que tu saches qu'il va y avoir une nouvelle version que tu pourras tester/utiliser.
                     jean marie
Le 16/02/2020 à 23:28, Perline-Spip a écrit :
Et donc je peux enlever mon js et mettre à jour avec cette version dev ?

Jean Marie Grall a écrit le 16/02/2020 à 12:52 :
Pour info le dépôt vient d'être intégré sur la forge https://git.spip.net/spip-contrib-squelettes/html5up_hyperspace

Il y a une version "dev" compatible 3.2 (et qui intègre le patch de Matthieu) sur laquelle je vais travailler mais que je vais passer en structure ZCore. Ça sera donc une version 3 incompatible avec avec l'actuelle version 2.
             jean marie
Le 15/02/2020 à 22:04, Perline-Spip a écrit :
J'ai enfin réussi à me plonger dans cette histoire, j'ai pas plongé profond, c'était pas compliqué à transposer !
Je m'en faisais tout un pataquès

Le résumé est dans contrib/hyperspace (https://contrib.spip.net/Hyperspace-squelette-responsive#comment504048).
Merci Matthieu

Matthieu Marcillaud a écrit le 27/11/2019 à 17:55 :
Le 06/11/2019 à 14:30, Perline-Spip a écrit :

Bonjour,

SPIP 3.2.5, squelettes Hyperspace thème responsive 2.0.8 (https://contrib.spip.net/Hyperspace-squelette-responsive).
// Disable animations/transitions until the page has loaded.
if (skel.canUse('transition'))
$body.addClass('is-loading');
         $window\.on$&#39;load&#39;, function\($ \{
             window\.setTimeout$function\($ \{
                 $body\.removeClass$&#39;is\-loading&#39;$;
             \}, 100\);
         \}\);
le style is-loading ne se remove pas.
Le 27/11/2019 à 17:55 Matthieu Marcillaud
C’est un truc typique des vieux javascripts de html5up.

Regarde par exemple :
https://zone.spip.net/trac/spip-zone/changeset/107487
Puis https://zone.spip.net/trac/spip-zone/changeset/107489

--
****Fin du message end - Signature****
Perline

spip@perline.org – http://perline.org/

Ce message est couvert par le secret de la correspondance
(art. 226-15 et 432-9 du Code pénal)
********************************************