jenkins-bot has submitted this change and it was merged.
Change subject: Make the banner image clickable
......................................................................
Make the banner image clickable
Bug: T96404
Change-Id: Ia599e2ae6763a9b59943f5d432bc981b4ba64bd8
---
M includes/Resources.php
M resources/mobile.bannerImage/BannerImage.js
M resources/mobile.bannerImage/Image.js
M resources/mobile.bannerImage/MobileViewBannerImageRepository.js
M resources/mobile.bannerImage/bannerImage.less
M tests/qunit/mobile.bannerImage/test_MobileViewBannerImageRepository.js
6 files changed, 38 insertions(+), 8 deletions(-)
Approvals:
Phuedx: Looks good to me, approved
jenkins-bot: Verified
diff --git a/includes/Resources.php b/includes/Resources.php
index e866466..cfe047b 100644
--- a/includes/Resources.php
+++ b/includes/Resources.php
@@ -1324,6 +1324,8 @@
'mobile.bannerImage' => $wgMFResourceFileModuleBoilerplate + array(
'dependencies' => array(
+ 'mediawiki.Title',
+ 'mobile.startup',
'mobile.ajax',
),
'scripts' => array(
diff --git a/resources/mobile.bannerImage/BannerImage.js
b/resources/mobile.bannerImage/BannerImage.js
index 0476611..568d793 100644
--- a/resources/mobile.bannerImage/BannerImage.js
+++ b/resources/mobile.bannerImage/BannerImage.js
@@ -1,5 +1,6 @@
( function ( M, $ ) {
var BannerImage,
+ router = M.require( 'router' ),
View = M.require( 'View' ),
browser = M.require( 'browser' );
@@ -87,7 +88,14 @@
.css( {
'background-image': 'url("' + image.src
+ '")'
} )
- .show();
+ .show()
+ /**
+ * Show the image in mediaViewer
+ */
+ .on( 'click', function () {
+ var title = new mw.Title( 'File:' +
image.fileName );
+ router.navigate( '#/media/' +
title.toString() );
+ } );
self.resizeContainer();
diff --git a/resources/mobile.bannerImage/Image.js
b/resources/mobile.bannerImage/Image.js
index 164a5c9..ae49063 100644
--- a/resources/mobile.bannerImage/Image.js
+++ b/resources/mobile.bannerImage/Image.js
@@ -6,11 +6,16 @@
* An image that can be loaded.
*
* @class Image
+ * @param {String} src
+ * @param {Number} width
+ * @param {String} height
+ * @param {String} fileName The name of the file from which the
thumbnail was created
*/
- function Image( src, width, height ) {
+ function Image( src, width, height, fileName ) {
this.src = src;
this.width = width;
this.height = height;
+ this.fileName = fileName;
}
/**
diff --git a/resources/mobile.bannerImage/MobileViewBannerImageRepository.js
b/resources/mobile.bannerImage/MobileViewBannerImageRepository.js
index 60b00dd..1f95e76 100644
--- a/resources/mobile.bannerImage/MobileViewBannerImageRepository.js
+++ b/resources/mobile.bannerImage/MobileViewBannerImageRepository.js
@@ -42,7 +42,7 @@
self.api.get( {
action: 'mobileview',
- prop: 'thumb',
+ prop: 'thumb|image',
page: self.title,
thumbwidth: targetWidth
} )
@@ -57,8 +57,11 @@
return;
}
- // Page exists but doesn't have thumbnail.
- if ( !data.mobileview.hasOwnProperty( 'thumb' )
) {
+ // Page exists but doesn't have thumbnail or
the main image.
+ if (
+ !data.mobileview.hasOwnProperty(
'thumb' ) ||
+ !data.mobileview.hasOwnProperty(
'image' )
+ ) {
// TODO: Should this reject with an
error?
deferred.reject();
@@ -69,7 +72,8 @@
image = new Image(
thumb.url,
thumb.width,
- thumb.height
+ thumb.height,
+ data.mobileview.image.file
);
self.cache[targetWidth] = image;
diff --git a/resources/mobile.bannerImage/bannerImage.less
b/resources/mobile.bannerImage/bannerImage.less
index 0cd4f25..f529fd2 100644
--- a/resources/mobile.bannerImage/bannerImage.less
+++ b/resources/mobile.bannerImage/bannerImage.less
@@ -14,6 +14,7 @@
background-position: 50% 20%;
background-repeat: no-repeat;
.background-size( e(''), cover);
+ cursor: pointer;
}
@media all and (min-width: @wgMFDeviceWidthTablet) {
diff --git
a/tests/qunit/mobile.bannerImage/test_MobileViewBannerImageRepository.js
b/tests/qunit/mobile.bannerImage/test_MobileViewBannerImageRepository.js
index 0864b63..d284ec2 100644
--- a/tests/qunit/mobile.bannerImage/test_MobileViewBannerImageRepository.js
+++ b/tests/qunit/mobile.bannerImage/test_MobileViewBannerImageRepository.js
@@ -18,7 +18,7 @@
assert.deepEqual( this.getSpy.lastCall.args[0], {
action: 'mobileview',
- prop: 'thumb',
+ prop: 'thumb|image',
page: this.title,
thumbwidth: 1234
} );
@@ -53,6 +53,11 @@
QUnit.test( 'it should return the image if there is one', 1, function (
assert ) {
this.getDeferred.resolve( {
mobileview: {
+ image: {
+ file: 'Glory Day celebration of the
Poumai Naga.jpg',
+ height: 206,
+ width: 296
+ },
thumb: {
url: 'http://foo/bar/baz',
width: 1,
@@ -63,7 +68,7 @@
} );
this.repository.getImage( 1234 ).then( function ( image ) {
- assert.deepEqual( image, new Image(
'http://foo/bar/baz', 1, 1 ) );
+ assert.deepEqual( image, new Image(
'http://foo/bar/baz', 1, 1, 'Glory Day celebration of the Poumai Naga.jpg' ) );
} );
} );
@@ -82,6 +87,11 @@
QUnit.test( 'it shouldn\'t try to get the image at the target width
more than once', 1, function ( assert ) {
this.getDeferred.resolve( {
mobileview: {
+ image: {
+ file: 'Glory Day celebration of the
Poumai Naga.jpg',
+ height: 206,
+ width: 296
+ },
thumb: {
url: 'http://foo/bar/baz',
width: 1,
--
To view, visit https://gerrit.wikimedia.org/r/210623
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings
Gerrit-MessageType: merged
Gerrit-Change-Id: Ia599e2ae6763a9b59943f5d432bc981b4ba64bd8
Gerrit-PatchSet: 5
Gerrit-Project: mediawiki/extensions/MobileFrontend
Gerrit-Branch: master
Gerrit-Owner: Bmansurov <bmansu...@wikimedia.org>
Gerrit-Reviewer: Bmansurov <bmansu...@wikimedia.org>
Gerrit-Reviewer: Phuedx <g...@samsmith.io>
Gerrit-Reviewer: jenkins-bot <>
_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits
