I. Menu principal▲
L'extension se manifeste par la présence de l'icône (1) en haut à droite du navigateur, et qui se déplie comme suit :
Chacun des éléments avec une flèche à gauche est dépliable et vous donne accès aux éléments présentés dans les chapitres qui suivent.
La notification de nouveaux éléments est faite avec l'apparition du nombre de nouveaux éléments dans l'icône et la coloration orange des menus avec le nombre entre parenthèses :
À l'exception des options, vous pouvez choisir d'afficher ou non chacun de ces boutons dans le premier onglet des options.
Si vous faites un clic droit sur l'icône , vous pouvez facilement accéder aux forum et site et mettre à jour l'ensemble des éléments :

II. Discussions suivies▲
Ce sont toutes les discussions auxquelles vous êtes abonné, rassemblées au sein des différents dossiers que vous pouvez gérer dans cette page (accessible par le bouton ) à l'exception du premier nommé « Tous » en première position qui fait la synthèse de tous les dossiers.(2)
Vous pouvez ouvrir la page forum de chaque dossier en le sélectionnant dans la liste de droite et cliquant sur .
Vous pouvez mettre à jour manuellement l'ensemble des dossiers avec le bouton ou avec un clic droit sur le bouton principal, ou individuellement en sélectionnant le dossier et cliquant sur le bouton
ou directement avec un clic droit sur le nom du dossier.
Similairement, vous pouvez ouvrir les discussions avec nouveau(x) message(s) de tous les dossiers avec le bouton ou d'un dossier en particulier avec
.
Le bouton permet de marquer toutes les discussions du dossier sélectionné comme lues.
Quant aux boutons devant chaque discussion, ils permettent :
/
 : de vous abonner/désabonner rapidement de la discussion (voir chapitre qui suit) ;
 : de modifier l'abonnement à la discussion ;
/
 : d'accéder directement au premier nouveau / dernier message de la discussion.
II-A. (Dés)Abonnement rapide▲
Les boutons /
présents devant les discussions listées ainsi que sur le bouton principal
lorsque vous naviguez sur une discussion ou un billet de blog DVP vous permettent de vous abonner ou désabonner de la discussion ou billet sans aucun besoin de recharger la page où vous vous situez. Après un temps de chargement, vous serez notifié que l'action a bien été effectuée.

Lors de l'abonnement, vous êtes invité à sélectionner les éléments suivants tel que vous les auriez eus sur la page qui se serait chargée :

puis confirmer l'action, suite à quoi, l'extension se charge du reste.
III. Forums suivis▲
Le panneau des forums suivis est sensiblement le même, avec la liste des forums à la place des dossiers. La seule différence notable est la présence de la liste des sous-forums directs au-dessus des discussions (un sous-forum avec nouveaux messages étant comptabilisé comme 1).
Également le bouton qui ouvre directement le panneau des options à l'onglet « Forums suivis » permettant de rechercher et sélectionner les forums que vous souhaitez suivre.
III-A. Définir les forums suivis▲
Vous avez à votre gauche la liste complète des forums avec devant chaque nom une case à cocher, et une zone de recherche permettant de descendre rapidement sur le forum de votre choix.
Cette liste est, lors de la première installation, faite à partir d'une liste par défaut ; pour la mettre à jour lors de l'ajout de nouveaux forums (ou pour les étoiles rouges, avoir les forums privés), il vous suffit d'appuyer sur le bouton de mise à jour du bas.
Dès que vous cochez l'une de ces cases, le forum est recopié dans la liste de droite des forums suivis. Si vous souhaitez également lister les discussions de ses sous-forums, survolez l'élément dans la liste de droite et cochez la case « Tous » qui apparaît. Si vous ne souhaitez plus suivre un forum, cliquez sur le bouton associé à ce dernier ou décochez la case dans la liste de gauche. Vous pouvez dans cette liste comme celle du panneau réordonner les forums suivis comme bon vous semble par un cliquer-glisser.
IV. Blogs suivis▲
En plus des discussions et forums, vous avez également la possibilité de suivre les flux de n'importe quel blog. Vous restez ainsi informé en temps réel des nouveaux billets ou commentaires postés. Vous pouvez de plus choisir de « cumuler » les billets, ce qui permet de garder en mémoire les éléments là où le flux ne garde qu'un certain nombre d'éléments récents.
L'extension propose par défaut le suivi cumulé du flux des blogs sur Developpez.com, vous pouvez ajouter les vôtres avec le bouton qui ouvre la popup suivante :

Nous aurions eu par exemple pour DVPÂ :
- Nom : Developpez.com ;
- Adresse du flux : https://www.developpez.net/forums/blogs/rss/ ;
- Cumuler ? : coché.
Attention de bien rentrer l'adresse du flux et non l'adresse du blog. Vous l'obtiendrez dans la plupart des cas par un clic droit « Copier l'adresse du lien » sur une icône ou un lien mentionnant « RSS » présents dans la page du blog.
Vous avez la possibilité de mettre en avant (font rouge) certains éléments en effectuant un clic dessus avec la molette.
V. Notifications▲
Les notifications se décomposent en deux parties :
- une barre de progression permettant de suivre le remplissage de votre boîte de réception. Si celle-ci arrive à moins de 10 %, le bouton principal passe en fond orange ;
- les notifications de nouveaux messages privés/messages visiteurs/messages dans les rapports auxquels vous êtes abonné/requêtes d'amis/accusés de réception.
VI. Marque-pages▲
Sur la base de cette demande de fonctionnalité, cette partie permet de retenir n'importe quelle page (ou une de ses ancres), et de lui attacher un éventuel commentaire (pouvant contenir des liens cliquables). Chaque élément a un tag différent selon sa nature (message, discussion, Q/R de FAQ, etc.). Éléments comme dossiers, vous pouvez les déplacer par un cliquer-glisser.
Contrairement aux différents éléments qui s'enfoncent au fil du temps, ceux-ci restent et permettent de cibler un message ou une page en particulier. L'idéal pour se constituer facilement une TODO et la faire évoluer.
Vous pouvez, dans les options, choisir d'ajouter systématiquement les éléments en début (défaut) ou en fin de liste.
Enfin, selon la page visitée, il apparaîtra sur les boutons principaux les icônes :
/
si vous avez marqué la page courante ;
/
si un élément proche de cette page a été marqué (autre message d'une même discussion, autre page d'un même article, etc.) ;
/
sinon.
Ces éléments sont mis en évidence respectivement par un fond rouge et un fond bleu et vous êtes automatiquement amené au premier élément correspondant lorsque vous ouvrez le menu.
Enfin, le bouton permet d'exporter dans le presse-papier les éléments du dossier courant sous la forme d'une [LIST] BBCODE du forum.
VII. Liens rapides▲
Vous avez à disposition une liste de liens rapides vous permettant d'accéder rapidement aux différentes pages du forum et du site :
La première barre de recherche vous permet de facilement accéder à un forum. Lors de votre saisie, une liste des forums correspondants s'affiche :
Vous pouvez dès lors
- cliquer sur l'icône
pour l'ajouter à votre liste de forums favoris ;
- cliquer sur l'icône
pour accéder à une page de recherche listant tous les nouveaux messages ;
- cliquer sur l'icône
pour accéder à une page de recherche listant tous les messages ;
- cliquer sur le reste pour aller sur la page de ce forum.
La deuxième barre de recherche vous permet d'effectuer une recherche Internet à l'aide du moteur sélectionné soit sur Internet, soit spécifiquement sur le site ou le forum.
La recherche Internet peut également être effectuée sur un forum en particulier : dès que vous saisissez des termes à rechercher, les deux boutons et
se transforment en
et
, permettant leur recherche par message ou par discussion.
Enfin, la troisième barre de recherche vous permet de rapidement trouver un membre et accéder à son profil à partir de son pseudo.
VIII. Chat : ouverture/conservation des discussions▲
Relatif au chat Developpez.com, le bouton principal permet :
- lorsque vous êtes sur n'importe quelle page, d'ouvrir un nouvel onglet à l'adresse du chat ;
- si vous êtes connecté, de conserver dans un fichier .html local toutes vos conversations en sélectionnant les onglets que vous souhaitez sauver. Chaque fichier sauvé aura par défaut le nom yyyymmdd.html et sera obtenu comme lorsque vous téléchargez un fichier.
IX. Ouverture des nouveaux▲
Selon la page où vous vous trouvez, il permet des choses distinctes :
- dans le tableau de bord, forum ou une page de recherche : il ouvre toutes les discussions non lues ainsi que les éventuels sous-forums qui en possèdent (si ces sous-forums ont eux-mêmes des « nouveaux » sous-forums, c'est une page de recherche qui s'ouvre pour avoir directement leurs nouvelles discussions et ce même bouton pourra les ouvrir en un clic) ;
- dans une page de cours ou FAQ : il déplie entièrement les sections ;
- dans les pages du bugtracker : il ouvre les rapports non lus.
Cette fonctionnalité est également disponible avec le raccourci Alt+O.
X. Options▲
Les options se décomposent en quatre onglets :
les « Éléments suivis » permettant de sélectionner les boutons du menu principal à afficher et fixer les différents délais de mises à jour automatiques (l'image présente les paramètres par défaut), ainsi que le moyen d'ouverture des pages sur un clic gauche (le clic droit faisant automatiquement l'inverse de ce qui est sélectionné) ;
- les « Forums suivis » que nous avons déjà vus chapitre III-ADéfinir les forums suivis ;
-
les « Suppléments » permettant l'activation ou non des éléments présentés dans le chapitre suivant. (Hormis le CSS personnalisé, ils sont tous activés par défaut.)
- « Extension » qui donne les liens utiles.
XI. Suppléments▲
XI-A. Forum/Chat : ajout des boutons et raccourcis aux éditeurs▲
Pour faciliter l'écriture des messages, ainsi que satisfaire la demande souvent faite des boutons manquants sur l'éditeur, l'extension ajoute les neuf boutons suivants :
Avec :
pour ajouter les balises [C] (code dit « inline » au sein d'un paragraphe), aussi disponible avec le raccourci ALT+I ;
pour ajouter les balises [LATEX] (formule LaTeX), aussi disponible avec le raccourci ALT+LÂ ;
pour ajouter les balises [PRE] (cadre respectant l'indentation), aussi disponible avec le raccourci ALT+PÂ ;
pour ajouter les balises [SPOILER] (permet de montrer/cacher une partie du message), aussi disponible avec le raccourci CTRL+SHIFT+SÂ ;
pour ajouter les mêmes zones avec ces images que vous pouvez croiser dans les cours et FAQ ;
pour ajouter le modèle d'actualité de LittleWhite.
Ainsi que les raccourcis suivants :
-
sur le forum :
Raccourci Balise correspondante Description ALT+C CODE Insertion de code ALT+Q QUOTE Citation d'un texte CTRL+ALT+L URL Ajout d'un lien (si vous avez un lien dans le presse-papier, il est inséré automatiquement) CTRL+ALT+R * COLOR (rouge) Texte de couleur rouge ALT+V COLOR (vert) Texte de couleur verte ALT+B COLOR (bleu) Texte de couleur bleue CTRL+ALT+S * S Texte barré CTRL+ALT+I IMG Insertion d'une image par son URL CTRL+BAS SUB Texte en indice CTRL+HAUT SUP Texte en exposant ALT+N NOPARSE Texte non interprété ALT+DROITE INDENT Décalage à droite du texte CTRL+ALT+H HIGHLIGHT Texte mis en évidence CTRL+ALT+P POST Ajout d'un lien vers un message (si vous avez le lien entier ou juste l'identifiant dans le presse-papier, il est automatiquement inséré) ALT+T THREAD Ajout d'un lien vers une discussion (si vous avez le lien entier ou juste l'identifiant dans le presse-papier, il est automatiquement inséré) ALT+E [nbsp][/nbsp] Espace insécable (les vraies étant remplacées par des étoiles, il a été mis en place ces balises) ALT+G «[nbsp][/nbsp]…[nbsp][/nbsp]» Insertion de guillemets ALT+L - La formule sélectionnée dans l'éditeur ou contenue dans le presse-papier est modifiée pour être affichée sous forme d'image par le biais du site codecogs.com. -
sur le chat :
Raccourci Balise correspondante Description CTRL+ALT+L URL Ajout d'un lien (si vous avez un lien dans le presse-papier, il est inséré automatiquement) ALT+C CODE Insertion de code ALT+Q QUOTE Citation d'un texte CTRL+ALT+R * COLOR (rouge) Texte de couleur rouge ALT+V COLOR (vert) Texte de couleur verte ALT+B COLOR (bleu) Texte de couleur bleue ALT+K COLOR (noir) Texte de couleur noire CTRL+M SMALL Texte rétréci ALT+G « … » Insertion de guillemets ALT+L - La formule sélectionnée dans l'éditeur ou copiée dans le presse-papier est modifiée pour être affichée sous forme d'image par le biais du site codecogs.com.
(*) Diffèrent de FireDVP : ALT+S et ALT+R provoquent un rechargement de la page sous Chrome.
Tous ces raccourcis fonctionnent si vous avez du texte sélectionné ou non et le cas échéant, insèrent les balises autour.
Et dans le mode standard où la touche tabulation ne permet pas de basculer sur les boutons, vous pouvez à tout moment :
- valider votre message/MP/rapport/billet avec CTRL+Entrée ;
- le prévisualiser avec ALT+Entrée.
XI-B. Forum : quota des MP▲
Depuis le nouveau forum, il n'y a plus la notification lorsque l'on descend en dessous des 10 % de quota et la barre de progression située en bas de la page n'est pas forcément immédiatement visible dans la boîte de réception… ce qui entraîne quelques « surprises ». C'est pourquoi en plus de la présence de la barre de progression dans le panneau des notifications, l'extension remonte automatiquement cette barre au début de la page.
XI-C. Forum : rétrécissement des images en pièces jointes▲
Depuis le nouveau forum, les images en pièces jointes ont leur taille d'origine et lorsque celles-ci sont géantes et qu'il y en a plusieurs, la lecture et navigation des messages devient fastidieuse. L'extension propose alors de les rétrécir automatiquement tout en les mettant en lien cliquable (réglable dans l'onglet « Suppléments sur le forum » des options).
XI-D. Forum : CSS personnalisé▲
Je propose un CSS personnalisé qui colore les différents éléments des pages du forum sur un thème bleuté, mettant entre autres en avant les liens dans les messages et corrigeant quelques artefacts visuels.
XI-E. Forum : répondre à tous▲
Lorsque vous visualisez un message privé qui a été envoyé à plusieurs personnes, un bouton « Répondre à tous » s'ajoute pour recopier cette même liste dans les destinataires de votre message.
XI-F. Forum : sauvegarde des MP au format HTML▲
Lorsque vous êtes dans votre boîte de réception, de messages envoyés ou tout autre dossier similaire, cochez les messages que vous souhaitez garder et dans le menu du bas, cliquez sur le bouton « Télécharger au format HTML » :
Après un temps de chargement, vous obtiendrez le fichier .html comme lorsque vous téléchargez un fichier.
XI-G. Forums / blogs : bouton « Étendre/Réduire » sur les codes▲
Afin de faciliter la lecture de longs codes, l'extension ajoute un bouton « Étendre/Réduire » au-dessus de chaque code :
qui permet de supprimer/remettre la limitation en hauteur du code correspondant et le visualiser dans son ensemble sans avoir besoin de cliquer sur « Visualiser dans une fenêtre à part ».
Et si lors du clic, vous maintenez le bouton CTRL, ceci s'applique à tous les codes appartenant au message.
XI-H. Chat : sélection rapide de code▲
Pour faciliter la copie de code ou citation dans les nouveaux onglets ouverts par le chat, un lien cliquable est ajouté au début des pages et permet, comme sur le forum, de sélectionner l'ensemble.
Nouveauté version 2.6 : ce lien est supprimé au profit de l'interception du raccourci Ctrl+A pour le même comportement.
XI-I. Chat : ajout d'un thème nuit et de sons▲
Récemment demandé dans ce billet, vous pouvez dorénavant être averti par un son sur :
- les messages privés ;
- les messages personnels dans le salon ;
- l'arrivée d'un membre ;
- la sortie d'un membre ;
- tout autre message du salon,
et avez en plus la possibilité d'inverser les couleurs du chat, tout cela grâce aux deux boutons :
Pour ceux qui ne souhaitent pas installer l'extension, mais souhaitent tout de même bénéficier de cet élément, vous pouvez ajouter ce script en ouvrant la console (F12 puis onglet « Console » sous Chrome) et tapant :
$.getScript
(
'https://winjerome.developpez.com/chat/chat-lightNsounds.js'
);
XI-J. Chat : ajout de langages▲
Je travaille depuis un certain temps à l'ajout de la coloration syntaxique sur le forum, mais forum comme chat cela tarde à être mis en place. C'est ainsi que je prends les devants sur le chat en modifiant la boîte de dialogue pour permettre la coloration syntaxique de tous ces langages :
Pour ceux qui ne souhaitent pas utiliser l'extension, vous pouvez utiliser cette page.
Pour ceux qui ne souhaitent pas installer l'extension, mais souhaitent tout de même bénéficier de cet élément, vous pouvez ajouter ce script en ouvrant la console (F12 puis onglet « Console » sous Chrome) et tapant :
$.getScript
(
'https://winjerome.developpez.com/chat/chat-codes.js'
);
Prenez soin d'avoir « top » de sélectionné et non quelque chose comme « chrome-extension[…] » :
Vous avez également à disposition cette page en ligne aussi accessible par le lien « Nouveau code » situé dans chaque page de code générée à partir de ces éléments.
XI-K. Copie rapide de liens▲
Sur le forum, il n'est pas rare de devoir diriger un membre vers un sujet de FAQ particulier ou tout autre lien, il s'ensuit alors deux copies du titre puis de l'adresse pour créer le lien dans votre message.
L'extension ajoute un élément dans le menu contextuel des pages et liens vous permettant de copier directement dans le presse-papier la balise [URL] correspondante.
XII. Téléchargement▲
Vous trouverez l'extension à installer sur le Chrome Web Store : ChroDVP. (Une version « Modération » est disponible à la demande.)
Un bogue, une amélioration, n'hésitez pas à m'en faire part par MP ou dans la discussion associée.
Bonne utilisation !
Version actuelle 2.6.0
- Nouveau langage pour le chat : CMakeLists.
- Forums/blogs : bouton « Étendre/Réduire » à côté des « Sélectionner tout » des codes pour supprimer le scroll sur la page même.
- Chat : menu contextuel sur les images pour faciliter leur ajout à la liste des smileys personnalisés.
- Chat : interception du raccourci Ctrl+A pour ne sélectionner que le code sans les numéros de ligne, venant remplacer le bouton « Sélectionner tout » (merci -Nikopol-).
- Interface : amélioration de la recherche de forums avec prise en compte et affichage au survol de leur description.
- Interface : ajout du bouton « Envoyer un MP » dans la partie notifications.
- Interface des options : lors de la mise à jour des forums, la liste des forums ajoutés est affichée.
XIII. Remerciements▲
Je remercie chaleureusement ClaudeLELOUP pour ses relectures orthographiques au fil des versions et Sehnsucht pour son aide au développement des nouvelles fonctionnalités du chat !
Également beekeep, Kropernic, Malick, Mickaël Baron et -Nikopol- pour leurs retours/suggestions.