• @unagi
    unagi CC BY-NC
    2
    @philippe_de_jonckheere
    @gastlag
    2

    Des conférences de cinema mises en ligne par la FEMIS - Le mag cinéma
    ▻https://lemagcinema.fr/non-classe-fr/des-conferences-de-cinema-mises-en-ligne-par-la-femis

    https://lemagcinema.fr/wp/wp-content/uploads/2014/12/Jean-Luc-Godard-300x276.jpeg

    La Femis ouvre son patrimoine vidéo et met à disposition des vidéos de conférences sur le thème du cinéma assez exceptionnelles.

    Depuis plus de trente ans, La Fémis est un lieu de rencontres entre artistes et étudiants.
    La Fémis a ainsi décidé de mettre en valeur au sein de ses archives une première sélection de tables rondes, master class, conférences et débats qui se sont tenus à La Fémis ou dans d’autres lieux – tel que le Festival de Cannes – qui illustrent la parole des cinéastes, images filmées par les étudiants eux-mêmes depuis 1986.
    Grâce au soutien de l’Université Paris Sciences et Lettres, à laquelle La Fémis est associée, et grâce au travail de monteurs image et son, les interventions choisies de nombreux cinéastes seront désormais accessibles sur deux plateformes, celle de l’école et celle de la bibliothèque numérique de « PSL Explore », et ce, à des fins culturelles, scientifiques et pédagogiques

    Conférences
    ▻http://www.femis.fr/conferences

    http://www.femis.fr/local/cache-vignettes/L800xH420/73a529d31f1e2e0ccd08bdd2121a14-ee610.jpg?1551092753

    Depuis plus de trente ans, La Fémis est un lieu de rencontres entre artistes et étudiants.
    La Fémis a ainsi décidé de mettre en valeur au sein de ses archives une première sélection de tables rondes, master class, conférences et débats qui se sont tenus à La Fémis ou dans d’autres lieux

    Conférence de Jean Rouch, Johan Van der Keuken et Frederick Wiseman dans le cadre des Rencontres de la Fémis (1987)
    ↓ Conférence d’Alain Tanner dans le cadre des Rencontres de la Fémis (1987)
    ↓ Conférence de Jean-Marie Straub et Danièle Huillet (1988)
    ↓ Conférence de Jean-Luc Godard dans le cadre des Mardis de La Fémis (1988)
    ↓ Conférence de David Cronenberg dans le cadre des Rencontres de la Fémis (2000)
    ↓ Conférence d’Éric Rohmer dans le cadre des Rencontres de la Fémis (2005)
    ↓ Conférence de Guy Maddin dans le cadre des Rencontres de la Fémis (2012)
    ↓ Conférence de Francis Ford Coppola dans le cadre des Rencontres de la Fémis (2012)
    ↓ Conférence de Luc et Jean-Pierre Dardenne dans le cadre des Rencontres de la Fémis (2012)
    ↓ Conférence de Thomas Vinterberg dans le cadre des Rencontres de la Fémis (2012)
    ↓ Conférence de Bruno Dumont dans le cadre des Rencontres de la Fémis (2014)
    ↓ Conférence d’Agnès Varda dans le cadre des Rencontres de la Fémis (2014)
    ↓ Conférence de Patricio Guzman dans le cadre des Rencontres de la Fémis (2015)
    ↓ Conférence de Jean-Gabriel Périot dans le cadre des Rencontres de la Fémis (2016)
    ↓ Conférence de Frederick Wiseman dans le cadre des Rencontres de la Fémis (2016)
    ↓ Conférence de Raymond Depardon et Claudine Nougaret dans le cadre des Rencontres de la Fémis (2017)
    ↓ Conférence de Cédric Klapisch dans le cadre des Rencontres de la Fémis (2017)
    ↓ Conférence de Damien Manivel dans le cadre des Rencontres de la Fémis (2017)
    ↓ Conférence de Frederick Wiseman dans le cadre des Rencontres de la Fémis (2017)
    ↓ Conférence de Vincent Macaigne dans le cadre des Rencontres de la Fémis (2017)
    ↓ Conférence de Tony Gatlif dans le cadre des Rencontres de la Fémis (2018)

    unagi CC BY-NC
    Écrire un commentaire
  • @arno
    ARNO* ART LIBRE
    4
    @baroug
    @habbon
    @rastapopoulos
    4

    Un petit #shameless_autopromo : je viens d’ouvrir les formulaires des inscriptions aux concours de la Fémis :
    ▻http://www.femis.fr/concours-general-25

    C’est évidemment, comme le reste du site, du #SPIP #HTML5.

    Tu vas me dire : ben c’est des formulaires… Oui, c’est des formulaires, donc le CVT de SPIP, et le #plugin #SAISIES que tu peux pas vivre sans si tu fais des formulaires.

    Les choses rigolotes ici (parce que sinon, hein, « formulaires Web » et « rigolo », ça ne va pas ensemble dans la même phrase)…

    – c’est un formulaire à onglets ; pour le coup, le passage en affichage à onglets et le passage d’un onglet à l’autre se fait directement en Javascript, et pas via le serveur (je l’ai fait une fois, il y a longtemps, avec déjà CVT, mais c’est super-relou à gérer ; en javascript, c’est tout de même beaucoup plus simple – normalement si pas javascript on se retrouve avec un formulaire sans onglets).

    – l’aspect le plus sympa, c’est l’utilisation de Polyfiller.js (webshim) pour gérer les formulaires HTML5 directement du côté client :
    ▻http://afarkas.github.io/webshim/demos

    Mais pas que : ici je valide chaque champ au fur et à mesure de la saisie, avec des codes couleur (vert c’est OK…). C’est pas bien compliqué à faire, mais je ne crois pas que ce soit un fonctionnement de base de webshims, et ça rend bien.

    Ce qui ajoute un peu de complexité, évidemment, ce sont les onglets : je colorie la onglets également au fur et à mesure mais, surtout, au moment de la validation finale, je dois détecter le champ de la première erreur bloquante et activer l’onglet qui le contient.

    Encore une fois, le code n’est pas compliqué (le javascript qui fait ça est directement dans la page HTML, alors tu peux aller regarder). La seule astuce, réellement, c’est de faire remonter le statut du champ (input, select en statut "error" ou "ok") dans une classe appliquée au <li> qui contient le truc.

    – petites difficultés avec #SAISIES : je n’arrive pas à faire passer les valeurs max et min (pour les champs de type number), ça semble se perdre en route. Pour ceux-là, j’ai dû faire le HTML à la main. Et surtout, pas de "required" quand obligatoire=oui ; je corrige donc en javascript au chargement (j’ajoute « required » dans le <input> quand il est enfant de <li.obligatoire>).

    À la fin de la saisie, on arrive sur une page qui fabrique un PDF récapitulatif, expédie un email, et (super-important) affiche un bouton de paiement en ligne vers la banque.

    Alors du côté du paiement en ligne, un bug détecté ce matin : je balance le #NOM (enregistré dans la base de données) pour fabriquer le formulaire qui va vers la banque et – si si, c’est possible – le plugin « orthotypo » le corrige. Le cas qui a planté : ces gens qui saisissent leur nom en majuscules, du coup Orthotype ajoute un <span> pour signaler que c’est tout en majuscules. Évidemment, le système de la banque refuse de répondre quand il y a du HTML dans le champ « nom du client ». (Solution facile : une étoile et |textebrut)

    ARNO* ART LIBRE
    • @rastapopoulos
      RastaPopoulos CC BY-NC
      @arno

      @arno, il n’y a pas de saisie de type « number », donc je suppute que tu utilises la saisie « input » à laquelle tu passes le type « number » ? Chaque saisie a son HTML/squelette qui lui est propre et qui ne continent que les attributs qui lui sont dédiés. Or « input » ne gère que les attributs basiques, pas les ajouts des nouveaux types.

      ▻http://zone.spip.org/trac/spip-zone/browser/_plugins_/saisies/saisies/input.html

      Deux solutions :
      – Soit tu ajoutes les trucs non prévus dans le paramètre « attributs », en chaîne de caractères complète (attributs=’truc="machin" bidule="chouette"’) qui va s’ajouter avant la fermeture de balise.
      – Soit, plus propre sûrement, il faudrait ajouter (toi ?) une nouvelle saisie « saisies/number.html » qui gère les attributs propres à ce nouveau type. Peut-être en faisant une inclusion de la saisie « input » mais avec le paramètre « attributs » modifié en amont, un truc comme ça, pour ne pas doublonner du code (comme ça toute amélioration à « input » est prise en compte par les autres).

      Pour le « required », il est présent dans « input » déjà. Il faut avoir HTML5 d’activé dans la configuration de SPIP.

      [(#ENV{obligatoire}|et{#ENV{obligatoire} !={non}}|et{#HTML5}|oui) required="required"]

      RastaPopoulos CC BY-NC
    Écrire un commentaire
  • @arno
    ARNO* ART LIBRE
    2
    @habbon
    @monolecte
    2

    Avec Mosquito, on vient de livrer le nouveau site de la Fémis :
    ▻http://www.femis.fr

    C’est du #SPIP_3, #responsive, #HTML5 (et du #shameless_autopromo évidemment).

    Parmi les points originaux…

    – Le menu de navigation principal avec son animation « gauche-droite » au survol. Le javascript est très simple, et l’animation est directement en transition CSS. Dans chaque menu, les colonnes des rubriques/sous-rubriques sont aussi équilibrées que possible, et c’est fait directement avec Masonry.

    – Les images passent par mon plugin « image_responsive », ce qui permet de gérer différentes tailles, ainsi que le chargement d’images deux fois plus grandes pour les écrans haute définition.

    – Il y a réellement très peu d’images pour réaliser l’interface graphique. C’est essentiellement des CSS avec des dégradés discrets, des ombres portées… Comme d’habitude, mon plugin « CSS imbriqués » est très utile pour faciliter le codage (CSS avec gestion des préfixes et des variantes de navigateurs, code hiérarchisé, inversion des #media_queries…).

    – La moteur de recherche (c’est du pur SPIP/Fulltext) bénéficie de petites améliorations dans les squelettes. (C’est accessible via la loupe en haut à gauche de la page.) La première consiste à faire des suggestions lorsqu’on commence à taper un mot. Tu tapes « réali », et ça te déplie des suggestions : « réalisation, réalisateurs, réalisateur, réalisé, réaliser… » classées en fonction de la présence de ces mots dans le site. Une fois que tu as validé ta recherche, la page de résultats est classique, mais avec un détail : le texte « descriptif » de chaque article est calculé pour afficher le terme recherché, surligné dans son contexte (habituellement on affiche simplement le début du texte comme partout dans le site ; là il y a un calcul amusant).

    – Une grosse partie du boulot a consisté à refondre la base de donnée des anciens élèves. D’abord créer des moulinettes pour réorganiser l’ancienne base de données dans ma nouvelle structure. Ensuite évidemment gérer l’affichage sur le site (avec SPIP, cette partie, c’est assez finger in ze noze). Et surtout : des formulaires pour que chaque ancien étudiant gère lui-même sa fiche, ses infos personnelles, sa filmographie, son CV structuré… Le tout en essayant de proposer des interfaces aussi intuitives que possible, ce qui est toujours une gageure quand on a des formulaires un peu complexes.

    – Ça faisait carrément longtemps : on utilise les brèves de SPIP ! (Pour l’« Actualité des diplômés »).

    – Comme à mon habitude, la page d’accueil et le footer sont construits avec une « rubrique technique » invisible, laquelle contient des sous-rubriques pour structurer, et il faut donc publier des « articles virtuels » qui redirigent vers ce qu’on veut. C’est un peu plus contraignant que d’autres techniques, mais c’est ce qui donne la plus grande souplesse (on peut « référencer » des articles, des rubriques, des pages distantes…, forcer le classement qu’on veut en page d’accueil, utiliser des titres et des descriptifs plus adaptés…).

    ARNO* ART LIBRE
    • @rastapopoulos
      RastaPopoulos CC BY-NC

      Comme à mon habitude, la page d’accueil et le rooter sont construits avec une « rubrique technique » invisible, laquelle contient des sous-rubriques pour structurer, et il faut donc publier des « articles virtuels » qui redirigent vers ce qu’on veut. C’est un peu plus contraignant que d’autres techniques, mais c’est ce qui donne la plus grande souplesse (on peut « référencer » des articles, des rubriques, des pages distantes…, forcer le classement qu’on veut en page d’accueil, utiliser des titres et des descriptifs plus adaptés…).

      Héhé, par deux fois déjà, j’ai opté pour exactement la même technique, afin de sélectionner les contenus listés dans un carrousel d’accueil. Cela permet d’avoir une image différente, pas forcément intégrée au contenu final qui est lié, pareil pour le titre et le descriptif, qui peuvent être propres à l’accroche, et ça permet effectivement aussi de rediriger vers un autre contenu externe.

      Pour ne pas faire de bidouille, ça pourrait mériter un plugin dédié, du genre « Sélections de contenus », où on pourrait en créer autant qu’on veut, avec un identifiant textuel non lié à la base (ce qui permet de l’utiliser dans les squelettes génériquement), et qui permettrait alors de sortir :
      <BOUCLE_news_accueil(SELECTIONS){identifiant=news_accueil}>
      LOGO_SELECTION
      TITRE
      DESCRIPTIF
      LIEN (celui ci pouvant gérer à la fois une URL classique, ou un identifiant de contenu SPIP du genre : « evenement1234 »)
      </BOUCLE_news_accueil>

      Avec une interface bien fichue pour les administrer. Ça sera plus facile et plus facilement compréhensible (car pas un détournement).

      RastaPopoulos CC BY-NC
    • @rastapopoulos
      RastaPopoulos CC BY-NC
      @arno

      Salut @arno,
      j’ai enfin pris le temps de commencer ce plugin de sélections éditoriales.

      Voici le premier commit :
      ▻http://zone.spip.org/trac/spip-zone/changeset/83884

      Tu peux donc te faire une sélection « accueil », une autre « footer », etc. Et les récupérer facilement dans tes squelettes :

      <BOUCLE_une(SELECTIONS){identifiant=accueil}>
         <BOUCLE_contenus(SELECTIONS_CONTENUS){id_selection}>
             <a href="#URL">
             #LOGO_SELECTIONS_CONTENU
             #TITRE
             #DESCRIPTIF
             </a>
         </BOUCLE_contenus>
      </BOUCLE_une>

      Et dans le champ « url », tu peux y mettre :
      – soit un URL complet quelconque
      – soit un objet SPIP sous la forme « article123 », « evenement456 », « rubrique789 ».

      Dis moi ce que tu en penses.

      (Et comme le dit le commit, viendra ensuite l’ajout de sélections en-dessous d’un objet SPIP. Lorsqu’on le veut.)

      RastaPopoulos CC BY-NC
    • @rastapopoulos
      RastaPopoulos CC BY-NC

      Oublié de le dire :
      1) j’ai ajouté la création d’une sélection sous un contenu SPIP (un article par exemple), et
      2) j’ai modifié le formulaire d’ajout d’un contenu sélectionné pour le rendre plus pratique : seule l’URL est obligatoire, et si on ne met que ça, la magie va chercher le titre du contenu SPIP (si on a mis « article1234 » par exemple) ou le titre de la page HTML (si on a mis un URL http).

      RastaPopoulos CC BY-NC
    Écrire un commentaire