Merge "Add about link to disable/enable dialog"

MultimediaViewer.php

@@ -776,6 +776,7 @@ $wgResourceModules += array(
 		),
 
 		'messages' => array(
+			'multimediaviewer-options-learn-more',
 			'multimediaviewer-options-dialog-header',
 			'multimediaviewer-option-header-viewer',
 			'multimediaviewer-option-header-filepage',
@@ -1013,7 +1014,7 @@ $wgResourceModules += array(
 
 $wgHooks['EventLoggingRegisterSchemas'][] = function( array &$schemas ) {
 	$schemas += array(
-		'MediaViewer' => 10277480,
+		'MediaViewer' => 10308479,
 		'MultimediaViewerNetworkPerformance' => 7917896,
 		'MultimediaViewerDuration' => 8572641,
 		'MultimediaViewerAttribution' => 9758179,

resources/mmv/logging/mmv.logging.ActionLogger.js

@@ -111,7 +111,9 @@
 		'download-open': 'User opened the dialog to download this file.',
 		'download-close': 'User closed the dialog to download this file.',
 		'options-open': 'User opened the enable/disable dialog.',
-		'options-close': 'User either canceled an enable/disable action or closed a confirmation window.'
+		'options-close': 'User either canceled an enable/disable action or closed a confirmation window.',
+		'disable-about-link': 'User clicked on the "Learn more" link in the disable window.',
+		'enable-about-link': 'User clicked on the "Learn more" link in the enable window.'
 	};
 
 	/**

resources/mmv/ui/mmv.ui.viewingOptions.js

@@ -67,7 +67,6 @@
 				mw.message( 'multimediaviewer-enable-confirmation-header' ).text(),
 				mw.message( 'multimediaviewer-enable-confirmation-text', mw.config.get( 'wgSiteName' ) ).text()
 			] );
-
 	};
 
 	/**
@@ -233,6 +232,7 @@
 			.appendTo( $div );
 
 		this.addText( $div, msgs );
+		this.addInfoLink( $div, ( enabled ? 'enable' : 'disable' ) + '-about-link' );
 		this.makeButtons( $div, smsg, enabled );
 
 		this[propName] = $div;
@@ -349,6 +349,21 @@
 		}
 	};
 
+	/**
+	 * Adds the info link to the panel.
+	 * @param {jQuery} $div The panel to which we're adding the link.
+	 */
+	ODP.addInfoLink = function ( $div, eventName ) {
+		var self = this;
+
+		$( '<a>' )
+			.addClass( 'mw-mmv-project-info-link' )
+			.prop( 'href', mw.config.get( 'wgMultimediaViewer' ).helpLink )
+			.text( mw.message( 'multimediaviewer-options-learn-more' ) )
+			.click( function ( e ) { self.trackLinkClick.call( this, eventName, e ); } )
+			.appendTo( $div.find( '.mw-mmv-options-text' ) );
+	};
+
 	/**
 	 * Checks the preference.
 	 */

resources/mmv/ui/mmv.ui.viewingOptions.less

@@ -45,11 +45,11 @@
 	}
 
 	.mw-mmv-options-enable {
-		height: 170px;
+		height: 180px;
 	}
 
 	.mw-mmv-options-disable {
-		height: 150px;
+		height: 160px;
 	}
 
 	.mw-mmv-enable-confirmation,

tests/qunit/mmv/ui/mmv.ui.viewingOptions.test.js

@@ -27,9 +27,9 @@
 		assert.ok( dialog.$enableConfirmation, 'Enable confirmation is created.' );
 	} );
 
-	QUnit.test( 'Disable', 17, function ( assert ) {
+	QUnit.test( 'Disable', 20, function ( assert ) {
 		var $header, $icon, $text, $textHeader, $textBody,
-			$submitButton, $cancelButton,
+			$submitButton, $cancelButton, $aboutLink,
 			dialog = makeDialog(),
 			deferred = $.Deferred();
 
@@ -45,6 +45,7 @@
 		$text = dialog.$disableDiv.find( 'div.mw-mmv-options-text' );
 		$textHeader = $text.find( 'p.mw-mmv-options-text-header' );
 		$textBody = $text.find( 'p.mw-mmv-options-text-body' );
+		$aboutLink = $text.find( 'a.mw-mmv-project-info-link' );
 		$submitButton = dialog.$disableDiv.find( 'button.mw-mmv-options-submit-button' );
 		$cancelButton = dialog.$disableDiv.find( 'button.mw-mmv-options-cancel-button' );
 
@@ -61,6 +62,10 @@
 		assert.strictEqual( $textBody.length, 1, 'Text body created successfully.' );
 		assert.strictEqual( $textBody.text(), 'You can enable it later through the file details page.', 'Text body has correct text (if this fails, it may be due to i18n differences)' );
 
+		assert.strictEqual( $aboutLink.length, 1, 'About link created successfully.' );
+		assert.strictEqual( $aboutLink.text(), 'Learn more', 'About link has correct text (if this fails, it may be due to i18n differences)' );
+		assert.strictEqual( $aboutLink.prop( 'href' ), 'http://mediawiki.org/wiki/Special:MyLanguage/Help:Extension:Media_Viewer', 'About link has correct href (depends on your current protocol, so if you are on https, this will fail).' );
+
 		assert.strictEqual( $submitButton.length, 1, 'Disable button created successfully.' );
 		assert.strictEqual( $submitButton.text(), 'Disable Media Viewer', 'Disable button has correct text (if this fails, it may be due to i18n differences)' );
 
@@ -80,8 +85,8 @@
 		assert.ok( dialog.$dialog.hasClass( 'mw-mmv-disable-confirmation-shown' ), 'Disable confirmation shown' );
 	} );
 
-	QUnit.test( 'Enable', 15, function ( assert ) {
+	QUnit.test( 'Enable', 18, function ( assert ) {
-		var $header, $icon, $text, $textHeader,
+		var $header, $icon, $text, $textHeader, $aboutLink,
 			$submitButton, $cancelButton,
 			dialog = makeDialog(),
 			deferred = $.Deferred();
@@ -97,6 +102,7 @@
 
 		$text = dialog.$enableDiv.find( 'div.mw-mmv-options-text' );
 		$textHeader = $text.find( 'p.mw-mmv-options-text-header' );
+		$aboutLink = $text.find( 'a.mw-mmv-project-info-link' );
 		$submitButton = dialog.$enableDiv.find( 'button.mw-mmv-options-submit-button' );
 		$cancelButton = dialog.$enableDiv.find( 'button.mw-mmv-options-cancel-button' );
 
@@ -110,6 +116,10 @@
 		assert.strictEqual( $textHeader.length, 1, 'Text header created successfully.' );
 		assert.strictEqual( $textHeader.text(), 'Enable this media viewing feature for all files by default.', 'Text header has correct text (if this fails, it may be due to i18n differences)' );
 
+		assert.strictEqual( $aboutLink.length, 1, 'About link created successfully.' );
+		assert.strictEqual( $aboutLink.text(), 'Learn more', 'About link has correct text (if this fails, it may be due to i18n differences)' );
+		assert.strictEqual( $aboutLink.prop( 'href' ), 'http://mediawiki.org/wiki/Special:MyLanguage/Help:Extension:Media_Viewer', 'About link has correct href (depends on your current protocol, so if you are on https, this will fail).' );
+
 		assert.strictEqual( $submitButton.length, 1, 'Enable button created successfully.' );
 		assert.strictEqual( $submitButton.text(), 'Enable Media Viewer', 'Enable button has correct text (if this fails, it may be due to i18n differences)' );