Annotateur d'images - Permet d'annoter des images dans l'aperçu

Bonjour à tous,

Avec mon coéquipier @vliboolean1010, nous sommes ravis de vous présenter le nouveau composant de thème Discourse : Image Annotator.

Dès que vous cliquez sur une image dans l’éditeur, les fonctionnalités suivantes sont activées :

  • Ajouter des cadres, des formes, des flèches et du texte
  • Surligner ou censurer des parties de l’image
  • Sélectionner et modifier la couleur des annotations
  • Les images annotées sont mises à jour automatiquement après avoir cliqué sur Enregistrer.
  • Prise en charge des navigateurs Safari, Firefox, Chrome et iOS Safari
  • (La fonction de recadrage d’image est en cours de développement)

Écran d’installation

Dépôt : GitHub - discourse/discourse-image-annotator: image annotation theme component · GitHub

Vidéo de démonstration

46 « J'aime »

Bien joué ! Cela a-t-il été testé avec des images hébergées sur S3 ? Je rencontre une erreur de requête inter-domaines lorsque S3 est activé.

9 « J'aime »

Merci beaucoup. C’est génial.

7 « J'aime »

Bonjour @davidkingham,

Merci pour le signalement détaillé du problème. Alors que nous cherchons à résoudre ce problème, une solution alternative consisterait à télécharger l’image depuis vos appareils locaux, plutôt que depuis des sources en ligne. :slight_smile:

4 « J'aime »

Merci, Chun, mais ce n’est pas la même chose. Je télécharge depuis un appareil local, mais l’image est envoyée vers un point de terminaison S3, et c’est là que le problème se pose.

8 « J'aime »

Je pense que cela pourrait être utilisé pour filigraner automatiquement les photos avec le nom d’utilisateur, mais je ne suis pas sûr de la marche à suivre. Peut-être un autre bouton qui imprime [nom d’utilisateur]@[domaine du site] ?

3 « J'aime »

Existe-t-il une fonctionnalité permettant d’écrire sur une photo ?

4 « J'aime »

Voici mon problème. Lorsque j’upload une grande image (par exemple, une capture d’écran de notre forum pour un tutoriel), elle est automatiquement restreinte en affichage selon mes paramètres d’image maximale. C’est un problème car, si l’image est grande, elle est redimensionnée à une taille dérisoire, et je ne peux pas éditer la version plus grande.

En résumé, cela la rend utile uniquement pour les images plus petites que les paramètres « oneboxed » ; les nôtres sont par exemple fixés à 400 x 400.

Sur cette image, on voit les deux mêmes images, l’une étant modifiée avec ce composant. Le composant la rend illisible.

Si vous pouviez le configurer pour qu’il permette d’éditer l’image originale et non la version « oneboxed », ce serait absolument formidable.

Bonne base néanmoins, et je vois clairement son utilité !

4 « J'aime »

Est-il possible de modifier les annotations après que le message a été enregistré ?

3 « J'aime »

Ça ne semble pas le faire. Il réenregistre l’image une fois que vous avez terminé l’édition.

4 « J'aime »

Actuellement, il n’existe pas de fonctionnalités de ce type.

4 « J'aime »

Erreur d’écriture des images

ftOaYJktEr

2 « J'aime »

J’ai déplacé cela vers #theme:broken-theme et ajouté le tag pr-welcome.

Je pense qu’il a besoin d’un travail et d’un soutien considérables pour devenir un composant de thème recommandé à part entière.

6 « J'aime »

J’ai résolu certains problèmes liés à l’annotation des images.
Voici le lien vers la PR :

6 « J'aime »

Super, merci Nam. Plus d’erreur et l’image est bien enregistrée, c’est cool

En créant le chef-d’œuvre ci-dessus, j’ai remarqué plusieurs petites choses agaçantes dans l’utilisation de cet outil. À plusieurs reprises, l’annotation s’est initialisée au mauvais endroit. La barre d’outils, mais aussi la zone d’édition, étaient décalées de moitié vers le bas de la page. Penses-tu pouvoir identifier la cause de ce problème ?

6 « J'aime »

Voici le lien vers la PR pour la suppression de jQuery :

7 « J'aime »

Je me demande si on peut ajouter des contrôles de « recadrage » et de « rotation » au composant, cela semble être quelque chose de super utile.

9 « J'aime »

Je vais m’en occuper dès que possible !

6 « J'aime »

Pas de précipitation du tout, très enthousiaste de voir ce composant recevoir de l’attention, il a un énorme potentiel.

9 « J'aime »

En travaillant avec @markvanlan, nous avons réalisé qu’une nouvelle version de markerjs est disponible.
Les images peuvent être éditées dans la fenêtre contextuelle. Cela résoudra de nombreux problèmes.
Je travaille actuellement sur une PR.

9 « J'aime »