Shortcode Admin Médias

Bonjour à tous,
En tant que dev et fainéant par défaut, je n'avais pas compris encore compris qu'il me fallait valider le changement de répertoire dans les médias.

Aussi pour rester dans ma philosophie, j'ai modifié le fichier medias.js et je voulais vous partager ça.

const folderSelect = document.getElementById('folder'),
    validDirButton = document.querySelector('input[type=submit][name=btn_changefolder]');
    folderSelect.addEventListener('change', ()=>{
        /* validDirButton.dispatchEvent(new MouseEvent('click', {
            bubbles: true,
            cancelable: false,
            view: window
        })); */
        validDirButton.click();
    });

Ce bout de code, me permet de déclencher un click sur le bouton ok, au changement de répertoire de la liste déroulante, ainsi le contenu de ce dernier nous est directement afficher. Plus besoins de martyriser le bouton OK.

Réponses

  • bazooka07bazooka07 PluXml Lead Developer, Moderator

    Bonjour,
    Bonne idée mais on peut simplifier puisque l'élément <select> a un attribut form.

    document.getElementById('folder').addEventListener('change', (ev)=>(ev.target.form.submit()));
    

    A voir si on doit ajouter cette fonctionnalité à la prochaine version de PluXml.

  • MoadeepMoadeep Member

    Merci @bazooka07 pour la simplification, là je viens d'en faire un plugin, histoire d'éviter de perdre le code après mise à jour du projet.

  • bazooka07bazooka07 PluXml Lead Developer, Moderator

    On peut encore faire plus simple avec l'attribut onchange de <select> :

    <select onchange="this.form.submit()>
        <option value="">Value1</option>
        ............
    </select>
    

    Mais il faut modifier la fonction suivante dans le fichier core/lib/class.plx.utils.php :

        public static function printSelectDir($name, $currentValue, $root, $class='', $modeDir=true, $id=true) {
           $value = ($modeDir) ? '.' : '';
            $selected = ($value == $currentValue) ? ' selected': '';
            $disabled = (!$modeDir) ? ' disabled': '';
            $class = (!empty($class) ? $class . ' ' : '') . 'scan-folders fold';
            if(!$modeDir) {
                $class .= ' data-files';
            }    
    ?>     
    <select id="<?= ($id === true) ? 'id_' . $name : $id ?>" name="<?= $name ?>" class="<?= $class ?>" onchange="this.form.submit();">
        <option <?= $disabled ?> value="<?= $value ?>" <?= $selected ?>><?= L_PLXMEDIAS_ROOT ?>/</option>
    <?php
            if(substr($root, -1) != '/') {
                $root .= '/'; 
            }    
            plxUtils::_printSelectDir($root, 0, str_repeat(' ', 3), $currentValue, $modeDir);
    ?>                   
    </select>
    <?php
        }
    

    Le bouton "OK" dans medias.php devient inutile.

  • MoadeepMoadeep Member

    Hello @bazooka07, effectivement c'est beaucoup plus simple d'opérer directement sur l'élément HTML.
    Mais là, tu touches à des éléments du cœur de PluXml, je ne prends pas part au projet via GITLAB, j'ai juste pris le zip. L'idée de ce bout de code était d'améliorer mes conditions d'utilisations (j'ai pris du temps à comprendre qu'il me fallait valider le bouton OK pour afficher le contenu du répertoire, au bout de la 5ieme fois j'en ai eu marre lol) sans affecter le projet. D'où le développement en plugin d'ailleurs, c'est à cette occasion que j'ai appris à mieux appréhender la conception de plugins. Ce dernier te permet d'activer ou non la fonctionnalité sans avoir à toucher au cœur. Effectivement à automatiser le rafraichissement de médias.php, son bouton ok devient inutile. Comme tu le disais dans ta première réponse à voir si ça ne vaut pas le coup, de le passer dans une prochaine mise à jour du projet de manière native.

    Bon courage.

  • FrancisFrancis Member

    Effectivement, ce comportement mériterait d'être intégré directement dans PluXml, c'est assez perturbant d'avoir à cliquer sur OK après chaque changement de répertoire.
    @Moadeep Bonne idée que ce plugin, l'as-tu partagé quelque part stp ?

  • MoadeepMoadeep Member

    Bonjour @Francis,
    Non je ne l'ai pas partagé, où puis-je le faire ? Je peux vous envoyer un zip par email ou autre ?

  • FrancisFrancis Member

    @Moadeep Si possible un lien sur ce post, ce serait déjà pas mal, tout le monde pourrait en profiter.
    En attendant une mise à jour de PluXml avec ce comportement, si les développeurs sont d'accord pour ce fonctionnement de la liste déroulante.

  • MoadeepMoadeep Member

    @Francis, ok ça marche dès que possible, je mettrais un lien à disposition.

  • FrancisFrancis Member

    Merci @Moadeep j'attends le lien !

  • MoadeepMoadeep Member

    Ca devrait être bon ainsi : https://drive.google.com/file/d/1OoeWhbRwfKnxSaV2XKHpJir3ZlSW5YcE/view?usp=sharing.
    @Francis, reviens vers moi si tu ne parviens pas à télécharger le zip.
    Bonne réception.

  • FrancisFrancis Member

    Super ! Je l'ai téléchargé, merci bien @Moadeep :)

  • MoadeepMoadeep Member

    Avec plaisir @Francis.

  • bazooka07bazooka07 PluXml Lead Developer, Moderator

    Dans un plugin les fichiers config.php et admin.php ne sont pas obligatoires.
    La gestion des traductions pour la dizaine de langues reconnues par PluXml est toujours compliquée.
    Pour les plugins, dans la mesure du possible, utiliser les constantes existantes :

    <?php
    echo L_YES;
    echo L_NO;
    

    Comme le script js est assez court, on peut l'insérer dans la page HTML :

    <?php
    /**
     * Plugin plxMediaSwitchFolder
     *
     * @authors MENDER Géraud - @moadeep
     * Copyright 2026
     **/
    class plxMediaSwitchFolder extends plxPlugin {
    
        public function __construct($default_lang) {
    
            # appel du constructeur de la classe plxPlugin (obligatoire)
            parent::__construct($default_lang);
            $this->addHook('AdminMediasFoot', 'AdminMediasFoot');
    
        }
    
        public function AdminMediasFoot() {
    ?>
    <script>
    (function () {
        'use strict';
        const folderSelect = document.getElementById('folder');
    
        if (folderSelect) {
            folderSelect.addEventListener('change', (ev) => {ev.target.form.submit();});
        }
    })();
    </script>
    <?php
        }
    }
    

    Pas besoin de fermer la balise PHP en fin de fichier.

  • MoadeepMoadeep Member

    @bazooka07, merci pour tous ces conseilles je verrais comment optimiser.

Connectez-vous ou Inscrivez-vous pour répondre.