Discussion Gestion:Tâches/Liste/119

À propos de ce flux de discussion

Non modifiable

Antoine Mercier-Linteau (discussioncontributions)
Michaël St-Gelais (discussioncontributions)

Merci pour la publication. C'est effectivement quelque chose à souligner. On a eu quand même pas mal d'engagement pour cette publication :)

Résumé par Antoine Mercier-Linteau

Loader implémenté.

Antoine Mercier-Linteau (discussioncontributions)

@Charles-Éric Noël Laflamme, j'ai terminé la première version du Loader (MediaWiki:Gadget-tour-loader.js).

L'objectif du module est de charger automatiquement les tours et de les proposer à l'utilisateur selon plusieurs conditions (documentées dans mw.guidedTour.loader).

Pour charger le loader, il suffit d'exécuter mw.guidedTour.loader.launch() dans ta console javascript.

Pour le moment, le loader n'est pas appelé automatiquement afin qu'on se laisse le temps de débogger.

Charles-Éric Noël Laflamme (discussioncontributions)

J'ai regardé le code du Gadget-tour-loader et j'ai corrigé quelques bug.

  • Afin de retrouver le nom du tour tourName, le code utilisait l'id, mais ce dernier était parfois erroné car guidedTour semble ajouter à l'id l'étape actuelle (e.g. basic_navigation à l'étape forum donne basic_navigation-forum) ce qui rendait les noms des cookies erronés. L'utilisation de la class permet de contourner le problème.
  • Le code n'entrait pas dans les for loops pour vérifier les conditions requires et excludePages.
  • Lors de la vérification de la condition requires, le cookie désignant un tour complété était recherché sous le suffix "-done" alors qu.il était enregistré sous "-completed".
  • Lors de la vérification de la condition excludePages, la méthode .test() était utilisé sur un string et non une expression regex, ce qui générait une erreur.

Après avoir corrigé ces petits bugs, j'ai tenté de lancer les tours basic_navigation et visual_edition selon différentes conditions et le module fonctionnait à merveille! Par contre, pour une raison que j'ignore, il faut un peu de temps aux modifications faites dans Gadget-tour-loader avant qu'elles soient effectives sur une page, même après avoir essayé de purger celle-ci.

Antoine Mercier-Linteau (discussioncontributions)

Vraiment merci! Les mises à jour prennent du temps à se propager en raison de la mise en cache. Quand je vais Maj+F5 sur mon navigateur les scripts sont correctement rechargés. La purge des pages c'est surtout pour le contenu et non les scripts.

Antoine Mercier-Linteau (discussioncontributions)

@Vanessa Desjardins, @Michaël St-Gelais, @Charles-Éric Noël Laflamme, il est temps de tester le chargement automatique des tours. Voici ce que vous devrez constater:

  • les tours ne se chargeront pas si vous n'êtes pas connectés;
  • le tour de base sur la navigation devrait se lancer automatiquement;
  • le tour sur l'édition avec l'éditeur visuel devrait se lancer 10 minutes une fois que le tour de base a été complété (ou abandonné);
  • si vous sautez un tour (le remettez à plus tard), il devrait réapparaître 24 heures plus tard.

Je vous informe quand c'est prêt.

Tour pour les visiteurs anonymes

4
Antoine Mercier-Linteau (discussioncontributions)

@Michaël St-Gelais, @Charles-Éric Noël Laflamme, croyez-vous qu'il serait pertinent de faire un tour super court pour les visiteurs anonymes?

  • Présentation très courte du projet
  • Modifications récentes
  • Recherche
  • Historique
  • Se créer un compte (en dernier, sinon les utilisateurs risquent de quitter le tour prématurément)
Michaël St-Gelais (discussioncontributions)

Assurément que ce serait une bonne idée !!

Antoine Mercier-Linteau (discussioncontributions)
Michaël St-Gelais (discussioncontributions)

@MaudeLD, voici les tours guidés en question.

Déplacement des tours vers des sous-tâches

1
Antoine Mercier-Linteau (discussioncontributions)

@Charles-Éric Noël Laflamme, j'ai déplacé la gestion de la conception des tours sur des sous-tâches. Sinon, cette page va devenir beaucoup trop volumineuse.

Antoine Mercier-Linteau (discussioncontributions)

@Charles-Éric Noël Laflamme, voici un exemple de code pour générer des tours (source):

/*
 * Guided Tour to test guided tour features.
 */
( function ( gt ) {
	// XXX (mattflaschen, 2012-01-02): See GuidedTourHooks.php
	var tour, launchTourButtons,
		pageName = mw.config.get( 'wgGuidedTourHelpGuiderUrl' );

	// Should match shouldShowForPage from firstedit.js
	function shouldShowFirstEdit() {
		return ( mw.config.get( 'wgCanonicalNamespace' ) === '' && mw.config.get( 'wgIsProbablyEditable' ) );
	}

	tour = new gt.TourBuilder( {
		/*
		 * This is the name of the tour.  It must be lowercase, without any hyphen (-) or
		 * period (.) characters.
		 *
		 * If this is an on-wiki tour, it should match the MediaWiki page.  For instance,
		 * if this were on-wiki, it would be MediaWiki:Guidedtour-tour-test.js
		 */
		name: 'test'
	} );

	tour.firstStep( {
		name: 'overlay',
		titlemsg: 'guidedtour-tour-test-testing',
		descriptionmsg: 'guidedtour-tour-test-test-description',
		overlay: true
	} )
		.next( 'callout' );

	tour.step( {
		/*
		 * Callout of left menu
		 */
		name: 'callout',
		titlemsg: 'guidedtour-tour-test-callouts',
		descriptionmsg: 'guidedtour-tour-test-portal-description',
		// attachment
		attachTo: '#n-portal a',
		position: '3'
	} )
		.next( 'descriptionwikitext' )
		.back( 'overlay' );

	tour.step( {
		name: 'descriptionwikitext',
		titlemsg: 'guidedtour-tour-test-mediawiki-parse',
		// This deliberately does not use descriptionmsg in order to demonstrate
		// API-based parsing as used by some on-wiki tours.
		// Normal Extension tours should use descriptionmsg.
		description: new gt.WikitextDescription( mw.message( 'guidedtour-tour-test-wikitext-description' ).plain() ),
		attachTo: '#searchInput',
		// try descriptive position (5'oclock) and use skin-specific value
		position: {
			fallback: 'bottomRight',
			monobook: 'right'
		}
	} )
		.next( pageName ? 'descriptionpage' : 'launchtour' )
		.back( 'callout' );

	if ( pageName ) {
		tour.step( {
			/*
			 * Test out mediawiki description pages
			 */
			name: 'descriptionpage',
			titlemsg: 'guidedtour-tour-test-description-page',
			description: new mw.Title( pageName ),

			overlay: true,

			buttons: [ {
				action: 'wikiLink',
				page: pageName,
				namemsg: 'guidedtour-tour-test-go-description-page',
				type: 'progressive'
			} ]
		} )
			.next( 'launchtour' )
			.back( 'descriptionwikitext' );
	}

	launchTourButtons = [ {
		action: 'end'
	} ];

	if ( shouldShowFirstEdit() ) {
		launchTourButtons.unshift( {
			namemsg: 'guidedtour-tour-test-launch-editing',
			onclick: function () {
				gt.endTour();
				gt.launchTour( 'firstedit' );
			}
		} );
	}

	/*
	 * Test out tour launching
	 */
	tour.step( {
		name: 'launchtour',
		titlemsg: 'guidedtour-tour-test-launch-tour',
		descriptionmsg: 'guidedtour-tour-test-launch-tour-description',

		// attachment
		overlay: true,

		buttons: launchTourButtons
	} )
		.back( pageName ? 'descriptionpage' : 'descriptionwikitext' );
}( mw.guidedTour ) );

Tu peux également voir un autre exemple ici à même Wikipedia.

Charles-Éric Noël Laflamme (discussioncontributions)

Si je souhaite par exemple ajouter et exécuter cet exemple de code sur une page quelconque, comment dois-je m'y prendre?

Antoine Mercier-Linteau (discussioncontributions)

Je n'ai pas encore lu la documentation alors vite comme ça je ne sais pas trop. Je te reviens là-dessus.

Entre-temps on peut travailler sur nos cas d'utilisation et les différentes étapes du tour guidé en lien. J'en ai inscrit trois en mode brouillon dans la description de la tâche, mais il y en certainement plus.

As-tu des idées? Comme nouveau contributeur tu sais beaucoup plus que moi ce qu'un utilisateur novice veut apprendre, ses questions, etc.

Charles-Éric Noël Laflamme (discussioncontributions)

J'ai visionné les vidéos présentes dans la section aide et je crois qu'un bon point de départ serait de reproduire intégralement les apprentissages ciblés dans les vidéos sous-forme de GuidedTour. Je pense aussi que la page Brouillon des utilisateurs pourrait être utilisée pour pratiquer les exercices d'édition comme l'ajout d'une image, d'un tableau, d'une référence, etc. Il en est de même pour la création de flashcards.

Par cotnre, une des lacunes des vidéos est à mon avis l'absence d'explication des pages à structure pré-définie, comme le cas d'une page de maladie par exemple. J'imagine que c'est le point qui était soulevé par "ontologie"? Dans tous les cas, je pense qu'il serait éventuellement également pertinent d'offrir des GuidedTours ou vidéos qui présente les conventions et les modèles à utiliser pour ce genre de page ayant une structure pré-définie.

J'ai également pensé que si un utilisateur explore un environnement particulier pour la première fois (par exemple la création de flashcards), un GuidedTour ou vidéo approprié lui soit d'emblée proposé. Je m'y connais pas du tout en cookies, mais j'imagine que ce serait possible de les utiliser pour accomplir cette tâche.

Pour ce qui est de ma première question, j'ai cru comprendre en lisant cette page (https://www.mediawiki.org/wiki/Extension:GuidedTour) qu'il était possible de créer un GuidedTour de 2 manières.

  1- En ajoutant le fichier javascript du GuidedTour au namespace de mediawiki
  2- En passant par une extension GuidedTour dans laquelle le fichier javascript est enregistré. Je n'ai pas vu cette extension sur wikimedica, alors j'imagine qu'il est nécessaire de l'installer avant.

Le code du GuidedTour en tant que tel semble lui assez straigh forward. Je vais continuer à explorer l'environnement du wiki et j'aurai alors probablement d'autres idées.

Antoine Mercier-Linteau (discussioncontributions)

Excellent réflexe d'avoir visionné les vidéos. Je dois te confier par contre qu'ils ont été créés dans les premiers mois de Wikimedica alors que l'ontologie n'existait pas encore et que les visées du projet se limitaient essentiellement au pré-clinique. C'est une excellent idée de cibler les apprentissages des vidéos, ça nous permettra de les remplacer avec quelque chose de plus interactif.

Effectivement, il faudra que le tour se déclenche alors qu'un utilisateur explorer un environnement pour la première fois. À cet effet, je vais ajouter une section à cette tâche qui nous permettra de mieux définir les cas d'usage, les conditions pour qu'un tour se déclenche (ex: on ne déclenchera pas un tour qui montre comment éditer une page si l'utilisateur n'en a pas l'autorisation), les points d'entrée pour le tour, etc.

J'ai aussi trouvé ce tutoriel (https://www.mediawiki.org/wiki/Extension:GuidedTour/Write_an_on-wiki_tour) qui détaille les étapes de création d'un tour.

Antoine Mercier-Linteau (discussioncontributions)

L'extension a été installé et j'ai codé un début de tour en guise de démo, toute l'information se trouve dans la section Tours.

Charles-Éric Noël Laflamme (discussioncontributions)

J'ai consulté la section Tours , j'ai testé le tour qui a été créé et il marche très bien. Par contre, je ne suis par certain de savoir comment je peux moi-même écrire d'autres Tours. J'ai tenté de modifier la page MediaWiki:Guidedtour-tour-basic navigation.js, mais hélas le message suivant est affiché:

Vous ne pouvez pas modifier cette page, pour la raison suivante : Cette page fournit du texte d’interface pour le logiciel sur ce wiki et est protégée pour éviter les abus. Pour ajouter ou modifier des traductions sur tous les wikis, veuillez utiliser translatewiki.net, le projet de régionalisation de MediaWiki.

J'ai ensuite essayé de créer moi-même une page similaire, par exemple MediaWiki:Guidedtour-tour-basic navigation-2.js, mais encore une fois je semble être bloqué:

Il n'y a pour l'instant aucun texte sur cette page. Vous pouvez faire une recherche sur ce titre dans les autres pages, ou rechercher dans les journaux associés, mais vous n'avez pas la permission de créer cette page.

J'imagine que je dois probablement effectuer une autre étape au préalable. J'avoue toutefois être un peu perdu présentement.

Charles-Éric Noël Laflamme (discussioncontributions)

J'essayais de créer un tour pour pratiquer quelques techniques d'édition. Pour se faire, le Guided Tour doit détecter lorsque l'utilisateur passe en mode Visual Editor afin de continuer le tour. Cela est normalement fait en utilisant la méthode 'transition'. L'extension Guided Tour a d'ailleurs déjà des fonctions qui regardent si l'utilisateur est en mode édition, que ce soit avec le wikitext ou l'éditeur visuel. Ces fonctions sont gt.isEditing, gt.isEditingWithWikitext et gt.isEditingWithVisualEditor (gt.isEditing étant l'amalgamme des deux précédentes). Or, pour une raison que j'ignore, la fonction isEditingWithVisualEditor ne semble pas fonctionner correctement. Le code source de ces fonctions est ici. https://doc.wikimedia.org/GuidedTour/master/js/source/ext.guidedTour.lib.main.html#mw-guidedTour-method-isEditing

J'ai d'ailleur également essayer de tester le guided Tour fait spécialement pour le Visual Editor ci-dessous, mais ce dernier ne semble pas fonctionner non plus. Je suspecte que ce guided Tour ne fonctionne pas car celui-ci ne détecte pas non plus le passage en mode édition. https://phabricator.wikimedia.org/diffusion/EGTO/browse/master/modules/tours/firsteditve.js

J'imagine qu'il existe probablement une autre manière simple de déterminer si une page est en train d'utiliser le Visual Editor, mais je suis peu familier avec la manière dont les variables et données sont enregistrés dans une page et qu'elles peuvent être récupérées (j'ai tenté d'ouvrir l'outil développeur de Chrome avec F12, mais c'est assez confus).

Sinon, ce pourrait-il que le Visual Editor ait été installé d'une manière différente pour Wikimedica, ce qui crée ce bogue?

Antoine Mercier-Linteau (discussioncontributions)

Je vais regarder ça, cependant l'éditeur visuel n'a pas été installé d'une manière différente sur Wikimedica. Il est possible que ce soit un bogue de leur côté, mais ça pourra être contourné sans trop de problèmes je pense. En ce moment je suis en train de migrer MediaWiki, alors je vais attendre que ce soit fait avant d'investiguer (au cas où le code ait changé).

Entre-temps, peut-être pouvons nous prioriser la création des tours qui ne dépendent pas de l'éditeur visuel?

Antoine Mercier-Linteau (discussioncontributions)

J'ai fait un peu de déboggage sur le code et je l'ai converti pour l'utilisation de l'éditeur visuel. Tout semble bien fonctionner.

On aura éventuellement besoin d'un tour sur l'édition en wikicode, mais c'est loin d'être prioritaire vu que c'est une fonction avancée.

Antoine Mercier-Linteau (discussioncontributions)

@MaudeLD, regarde ce qu'on est en train de développer ici (démo). Ce genre de tour guidés permettra de complémenter l'aide avec de l'interactif. Ça n'enseignera pas aux éditeurs les bonnes pratiques en recherche de source, mais ça va leur montrer ou cliquer pour aller voir l'historique :)

Je me suis dit que ça allait t'intéresser pour d'autres wikis sur lesquels tu travaille.

MaudeLD (discussioncontributions)

Super intéressant! Avec quoi ou comment avez-vous créé cela? Est-ce que nous serions en mesure d'en créer nous même?

Antoine Mercier-Linteau (discussioncontributions)

C'est avec une extension de MediaWiki. Malheureusement, ça passe entièrement par de la programmation, mais ce n'est pas très difficile et ça va nous faire plaisir de vous programmer des tours si vous le désirez.

Je vous recontacterai une fois les tours terminés pour récolter vos avis.

MaudeLD (discussioncontributions)

Ok, je comprends, merci! Mais j'aimerais bien connaître le nom de l'extension, au cas où j'aimerais l'expérimenter dans d'autres projets!

Antoine Mercier-Linteau (discussioncontributions)

Oui désolé, l'extension se nomme GuidedTour. Il y a aussi GettingStarted, qui permet de grouper les tours ensemble dans un objectif d'intégration et de formation des utilisateurs et qui pourrait t'intéresser.

Michaël St-Gelais (discussioncontributions)
Antoine Mercier-Linteau (discussioncontributions)
Il n’y a aucun sujet plus ancien