SPIP-Contrib

SPIP-Contrib

عربي | Deutsch | English | Español | français | italiano | Nederlands

289 Plugins, 197 contribs sur SPIP-Zone, 142 visiteurs en ce moment

Accueil > Améliorations de l’espace privé > Rang : ordonner par Drag & Drop > Rang : ordonner une liste par Drag&Drop

Rang : ordonner une liste par Drag&Drop

9 octobre 2017 – par nicod_, Peetdu – commentaires

10 votes

Cette contribution ou ce plugin est en phase de test. Des bugs peuvent subsister. N’hésitez pas à les signaler dans le forum ci-dessous.

Cette contribution surcharge des fichiers et/ou des fonctions de SPIP : il n’est donc pas garanti qu’elle fonctionne avec d’autres contributions surchargeant lesdits fichiers et/ou fonctions. Sa compatibilité avec les versions de SPIP est donc assez restreinte.

Dans l’espace privé, pouvoir ordonner une liste par glisser-déposer. Par exemple la liste des articles d’une rubrique.

Il devient possible d’utiliser le critère {par rang} dans vos squelettes.

Ce plugin est un POC : Proof of concept, permettant de démontrer la faisabilité d’une idée.

Ce qu’il fait déjà

Il gère l’ordonnancement par drag&drop de

  • la liste des articles dans une rubrique ;
  • la liste des mot-clés dans un groupe de mots-clés.

et hop...

Installation et configuration

Il s’installe comme n’importe quel plugin.

Configuration

Choisir les objets
…pour lesquels vous voulez activer le drag&drop.
Ici vous pouvez activer

  • les Articles ;
  • les Mots-clés ;
  • Autres [1].

Ranger les objets
Il s’agit ici de mettre automatiquement une nouvelle instance d’un objet à la fin de la liste.
C’est le cas lorsque l’on publie un article ou lorsque l’on crée un mot-clé (le mot-clé n’ayant pas de statut).

Dans vos squelettes

Il est possible d’utiliser le critère par rang pour les objets activés dans la configuration.

  1. <BOUCLE_articles_ordonnes(ARTICLES){id_rubrique}{par rang}>
  2. <h2>#TITRE</h2>
  3. <div>#TEXTE</div>
  4. </BOUCLE_articles_ordonnes>

Télécharger

Désinstallation

La désinstallation supprime les champs ’rang’ de tous les objets activés et les choix fait dans la configuration.

Petites notes techniques

a/ Ce plugin se base sur la balise #RANG du core de SPIP [2]

b/ Ce plugin se base aussi sur la notion de « Définir la relation à l‘objet parent dans la déclaration de l‘objet ». Notion introduite dans le ticket https://core.spip.net/issues/3844

c/ Lorsque vous activez un objet dans la config, le plugin va créer un champ ’rang’ dans la table de l’objet sélectionné ;

Je veux utiliser ce plugin pour faire du drag&drop sur mon objet éditorial

Pré-requis
Que votre objet soit un enfant direct d’un parent.

  • un article est l’enfant d’une rubrique ;
  • un mot-clé est l’enfant d’un groupe de mot-clés.

Marche à suivre
Vous allez devoir modifier le fichier /objets/liste/objets.html.
Vous pouvez vous inspirer du travail fait dans le fichier rang/prive//objets/liste/articles.html

En résumé, il s’agit d’ajouter les points suivants :

  • activer la fonction drag&drop simplement en ajoutant l’id_objet sur la ligne correspondante du tableau ;
  • ajouter le critère par rang pour le classement du tableau ;
  • afficher le picto drag&drop  ;
  • afficher le rang de l’objet dans le tableau.

…avec comme contrainte de ne rien activer si

  • on est pas dans une page rubrique ;
  • l’objet n’est pas sélectionné dans la configuration du plugin.

Voici quelques explications

  1. <thead>
  2. <tr class='first_row'>
  3. [(#ENV{id_rubrique}|et{#VAL{mon_objet}|rang_objet_dans_config}|oui)<th class="picto" scope="col"></th>]
  4. <th class='statut' scope='col'>[(#TRI{statut,<span title="<:lien_trier_statut|attribut_html:>">#</span>,ajax})]</th>,
  5. [(#ENV{id_rubrique}|et{#VAL{mon_objet}|rang_objet_dans_config}|oui)<th class="rang" scope="col">[(#TRI{rang,<span title="<:rang:lien_trier_rang|attribut_html:>"><:rang:info_rang_abbr:></span>,ajax})]</th>]
  6. <th class='id' scope='col'>[(#TRI{id_mon_objet,<:rang:info_id:>,ajax})]</th>
  7. </tr>
  8. </thead>
  9. <tbody>
  10. <BOUCLE_liste_mon_objet(MON_OBJET){…}>
  11. <tr id="id_#ID_MON_OBJET" class="[(#COMPTEUR_BOUCLE|alterner{row_odd,row_even})]">
  12. [(#ENV{id_rubrique}|et{#VAL{mon_objet}|rang_objet_dans_config}|oui)<td class="picto">[(#CHEMIN_IMAGE{draggable-16.png}|balise_img)]</td>]
  13. <td class='statut'>[(#STATUT|puce_statut{article,#ID_MON_OBJET,#ID_RUBRIQUE})]</td>
  14. [(#ENV{id_rubrique}|et{#VAL{mon_objet}|rang_objet_dans_config}|oui)<td class="rang" scope="col">[(#RANG).]</td>]
  15. </tr>
  16. </BOUCLE_liste_mon_objet>
  17. </tbody>

Télécharger

N.B. : toutes les occurences de ’mon_objet’ doivent être remplacé par le type de votre objet.

Dans le head du tableau (thead)
Ligne 3 : ajout de l’entête de colonne pour afficher le picto drag&drop
ligne 5 : ajout de l’entête de colonne pour afficher le rang de l’occurence de l’objet
ligne 7 : on change juste l’intitulé de la colonne présentant l’id. On passe de ’N°’ à ’ID’. Ceci pour éviter une confusion avec le N° de rang

Dans le corps du tableau (tbody)
ligne 12 : ajoute d’un identifiant ’id=« id_#ID_MON_OBJET »’ indispensable pour le fonctionnement du drag&drop
ligne 13 : ajout de la colonne pour afficher afficher le picto drag&drop
Ligne 15 : ajout de la colonne pour afficher le rang de l’occurence de l’objet

Voir en ligne : https://plugins.spip.net/rang

P.-S.

Merci à Nicod et Marcimat pour leur aide technique.

ATTENTION, si vous utilisez le plugin TAA (Traduction d’Articles Autrement), désactiver l’affichage compact des articles, sinon le drag & drop ne fonctionne pas. La version 1.4.1 du plugin TAA est maintenant entièrement compatible avec rang

Notes

[1les « Autres » ce sont des objets éditoriaux non historiques, issues de plugins.
Cette option est laissée ouverte pour les développeurs qui font des plugins ’maison’ et qui souhaitent tester la fonction Rang.

Dernière modification de cette page le 31 décembre 2017

Retour en haut de la page

Vos commentaires

  • Le 10 janvier à 14:56, par DD En réponse à : Rang : ordonner une liste par Drag&Drop

    Est-il possible d’utiliser par_rang avec le plugin « sélection d’articles » ?

    Celui-ci autorise la sélection d’articles à la racine du site :

    <BOUCLE_art(ARTICLES){id_rubrique=0}{par rang}>
    ....

    mais sur ma page sommaire le critère « par rang » n’est alors pas reconnu.

    Cela oblige à utiliser en parallèle sur un site les 2 plugins « sélection d’articles » et « rang » pour ranger à la fois le sommaire et ailleurs (si j’ai bien compris).

    Merci

    • Le 11 janvier à 12:45, par Peetdu En réponse à : Rang : ordonner une liste par Drag&Drop

      Bonjour DD,

      je ne comprend pas pourquoi tu as besoin du plugin Rang ici. Le plugin « Selection d’article » fait déjà le boulot (classer ta sélection avec Drag&Drop)

    • Le 11 janvier à 17:37, par DD En réponse à : Rang : ordonner une liste par Drag&Drop

      C’est parce qu’avec « sélection d’articles » il faut manuellement sélectionner les objets pour les ranger alors que « rang » le fait tout seul (mais pas partout).
      Et pour les utilisateurs c’est perturbant d’avoir 2 fonctionnements différents pour un résultat similaire (ou à peu près).

    Répondre à ce message

  • Le 13 octobre 2017 à 14:57, par ivandps En réponse à : Rang : ordonner une liste par Drag&Drop

    Canon, je suis fan de drag and drop. Merci

    Répondre à ce message

Répondre à cet article

Qui êtes-vous ?

Pour afficher votre trombine avec votre message, enregistrez-la d’abord sur gravatar.com (gratuit et indolore) et n’oubliez pas d’indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici Les choses à faire avant de poser une question (Prolégomènes aux rapports de bugs. )
Ajouter un document

Retour en haut de la page

Ça discute par ici

  • Escal-V3 et Escal-V4

    16 février 2012 – 307 commentaires

    Un jeu de squelettes proposant un affichage en 2 ou 3 colonnes avec un large choix de noisettes à insérer ou pas, fortement paramétrable depuis l’espace privé. Présentation A l’instar de sa petite soeur plugin Escal-V2 dont elle reprend toutes les (...)

  • Plugin Modèles media

    25 avril 2011 – 183 commentaires

    Les modèles , et produisent chacun un résultat différent et ce résultat, pour les images, dépend du fait qu’elle soit dans le portfolio ou non. Ce plugin propose une nouvelle série de modèles ayant un comportement unifié et indépendant du mode des (...)

  • LESS pour SPIP : Less-CSS (anciennement LESSpip)

    5 novembre 2010 – 50 commentaires

    Less-CSS (Anciennement LESSpip) est un plugin intégrant facilement le logiciel LESS dans SPIP. LESS est une extension de CSS ajoutant les variables, les classes, les opérations, les imbrications au langage. Facilitant ainsi l’écriture de feuilles (...)

  • GIS 4

    11 août 2012 – 1446 commentaires

    Présentation et nouveautés La version 4 de GIS abandonne la libraire Mapstraction au profit de Leaflet. Cette librairie permet de s’affranchir des librairies propriétaires tout en gardant les mêmes fonctionnalités, elle propose même de nouvelles (...)

  • Newsletters

    16 janvier 2013 – 442 commentaires

    Ce plugin permet de composer des Info-lettres. Par info-lettre, on désigne ici le contenu éditorial qui va être composé et envoyé par courriel à une liste d’inscrits. Le plugin permet de composer une info-lettre à partir d’un modèle pré-composé, (...)