Site tour: Use driver.js

[trymebytes]

Problem

For more flexibilities and out of the box features, we are trying out the driver.js library.

Solution

Include the driver.js library to power the site tour.

Testing Instructions

• Checkout this branch in your local GlotPress
• Use this sample filter

add_filter( 'gp_tour', function( ) {
	return array(
		'ui-intro' => [
			[
				'title' => 'UI Introduction Tour',
				'color' => '#3939c7',
			],
			[
				'selector' => '.strings .original',
				'html' => 'This is the original string that needs translation'
			],
			[
				'selector' => 'textarea.foreign-text',
				'html' => 'Enter translation here',
			],
			[
				'selector' => '.sidebar-tabs',
				'html' => 'See meta tabs here',
			],
			[
				'selector' => '.button.ok',
				'html' => 'Click here to save translation',
			]
		],
		
	);
} );

Screenshots or screencast

[akirk]

Nice, I am surprised how easy it looks to swap it out!

[akirk]

It works well if I run it on the first string. But things no longer work if I start in the second one. Upon first sight it doesn't appear as if it supported a jQuery like :visible selector. Is there anything we can do about it?

[trymebytes]

Converting this to a draft while I work on the patch to driver.js in a forked repository for easy referencing.

[akirk]

Works well!

The suggested changes were applied.