Je pense à une nouvelle fonctionnalité pour supprimer facilement une image de l’éditeur. Il arrive souvent qu’un utilisateur télécharge plusieurs images et ne souhaite en supprimer qu’une seule, ce qui est très compliqué s’il n’est pas familier avec le markdown. Bien sûr, il essaie, mais le résultat est généralement des liens brisés, etc…
Il y a eu une modification du texte alternatif des images qui fonctionne très bien et est conviviale. Elle ajoute la possibilité de modifier le texte alternatif du côté de l’aperçu.
Ce serait formidable de placer un bouton de suppression sur l’image dans l’aperçu. Peut-être une icône ou un X dans le coin de l’image, et en cliquant sur ce bouton, il pourrait cibler et supprimer le code markdown de l’image réelle.
Merci Don, cela semble être un bouton utile et il ne sera probablement pas trop difficile à ajouter. Je vais marquer ceci comme pr-welcome, heureux de voir ceci ajouté.
Je travaille à la résolution de ce problème ; j’ai presque une preuve de concept fonctionnelle.
J’ai juste une confusion entre ces deux composants d-editor.js et composer-editor,js. Ma solution jusqu’à présent est basée sur l’écoute du contenu preview/html lorsqu’il est mis à jour à l’intérieur du composant d-editor.js…etc.
Suis-je dans la bonne direction ?
L’endroit le plus approprié pour supprimer une image serait à côté des boutons que nous affichons au survol pour redimensionner les images et ajouter du texte alternatif dans l’aperçu du compositeur.
Le hook pour supprimer le balisage de l’image devrait être très similaire aux boutons 100%/75%/50%. Vous pouvez voir ici comment le redimensionnement de l’image est effectué.
Déplacer le bouton d’édition vers la gauche (bonus : distance de la souris plus courte de l’entrée du compositeur), puis placer le bouton de suppression à droite… nous avons donc une certaine distance entre les actions inoffensives et dangereuses.
Autres améliorations souhaitables :
rendre l’icône d’édition bleue comme les 50 %, 75 %
garder le texte noir, mais le rendre cliquable pour accéder également à l’entrée
lorsque l’éditeur de titre est ouvert, pouvons-nous le positionner pour qu’il corresponde à la ligne de base du texte d’aperçu (donc une couche z au-dessus) ? Cela rend les choses moins instables au clic :
Ils ont donc leur bouton avec un tas d’options, la mise à l’échelle est un clic et un glisser-déposer sur les poignées…
Un petit détail agréable est que si vous ajoutez une image trop petite pour la superposition du bouton, ils forcent l’image à une échelle qui contient le bouton une fois que vous essayez d’interagir avec elle. Cela évite d’avoir un bouton au survol qui superpose le contenu environnant.
@awesomerobot Merci pour votre retour. J’ai une autre question pour m’assurer que nous sommes sur la même longueur d’onde. Concernant ce point :
Étant donné qu’il existe deux scénarios pour l’apparition du conteneur des “boutons d’échelle” avec le “bouton d’édition alternatif”
Normalement, ceux-ci apparaissent sur la même ligne ; cependant, lorsque le texte alternatif est long, le conteneur alternatif débordera sur la ligne suivante :
Revenons maintenant à vos points ci-dessus ; cela aurait du sens en supposant que vous souhaitez que le comportement de débordement soit le comportement par défaut. Sinon, pour un texte alternatif court, le bouton de suppression ne serait qu’un bouton de fermeture de l’édition du texte alternatif.
Une autre alternative consiste simplement à afficher le conteneur de texte alternatif avant les boutons d’échelle, par exemple :
Il est donc clair que le bouton de suppression vient après 50%, mais on ne sait pas bien comment cela fonctionnerait dans les deux scénarios ci-dessus.