[MediaWiki-commits] [Gerrit] WikidataPageBanner client-side image loading - change (mediawiki...WikidataPageBanner)

[Sumit (Code Review)]

Sumit has uploaded a new change for review.

  https://gerrit.wikimedia.org/r/212512

Change subject: WikidataPageBanner client-side image loading
......................................................................

WikidataPageBanner client-side image loading

In order to load banner image of appropriate browser size, a js module added
which reads data-src attribute on .ext-wpb-pagebanner element and retrieves
an image of appropriate size via api request.

Change-Id: I3b3564d5bf96528108ce7eb0b41937356f766722
---
M includes/WikidataPageBanner.hooks.php
M resources/Resources.php
A resources/ext.WikidataPageBanner.loadImage/ext.WikidataPageBanner.loadImage.js
3 files changed, 37 insertions(+), 4 deletions(-)


  git pull 
ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/WikidataPageBanner 
refs/changes/12/212512/1

diff --git a/includes/WikidataPageBanner.hooks.php 
b/includes/WikidataPageBanner.hooks.php
index 3b67b7e..eb9f3ea 100644
--- a/includes/WikidataPageBanner.hooks.php
+++ b/includes/WikidataPageBanner.hooks.php
@@ -27,7 +27,7 @@
                        // if no image exists with given bannerurl, no banner 
will be added
                        if ( in_array( $ns, $wgBannerNamespaces ) && 
!$title->isMainPage()
                                && $bannerurl !== null ) {
-                               $banner = self::getBannerHtml( $bannerurl, 
$title );
+                               $banner = self::getBannerHtml( $bannerurl, 
$title, $wgPBImage );
                                $out->addHtml( $banner );
                                $out->setProperty( 'articlebanner', $banner );
                        }
@@ -51,6 +51,7 @@
                if ( $out->getProperty( 'articlebanner' ) != null ) {
                        // if articlebanner property is set, we need to add 
banner styles
                        $out->addModuleStyles( 'ext.WikidataPageBanner' );
+                       $out->addModuleScripts( 
'ext.WikidataPageBanner.loadImage' );
                }
        }
 
@@ -73,7 +74,7 @@
                $title = $parser->getTitle();
                $ns = $title->getNamespace();
                if ( in_array( $ns, $wgBannerNamespaces ) && 
!$title->isMainPage() ) {
-                       $banner = self::getBannerHtml( $fileurl, $title );
+                       $banner = self::getBannerHtml( $fileurl, $title, 
$bannername );
                        // Set 'articlebanner' property for future reference
                        $parser->getOutput()->setProperty( 'articlebanner', 
$banner );
                }
@@ -120,10 +121,11 @@
         * @return string Html code of the banner
         * TODO:Move this banner html code to a template.
         */
-       public static function getBannerHtml( $bannerurl, $title ) {
+       public static function getBannerHtml( $bannerurl, $title, $file ) {
                $banner = Html::openElement( 'div', array( 'class' => 'noprint' 
) ) .
                        Html::openElement( 'div', array( 'class' => 
'ext-wpb-pagebanner',
-                                                                       'style' 
=> "background-image:url($bannerurl);"
+                                                                       'style' 
=> "background-image:url($bannerurl);",
+                                                                       
'data-src' => "$file"
                                                                )
                                                        ) .
                        Html::openElement( 'div', array( 'class' => 'topbanner' 
) ) .
diff --git a/resources/Resources.php b/resources/Resources.php
index 018323d..94e80fb 100644
--- a/resources/Resources.php
+++ b/resources/Resources.php
@@ -32,3 +32,14 @@
        'remoteExtPath' => 'WikidataPageBanner/resources',
        'targets' => array( 'desktop', 'mobile' ),
 );
+$wgResourceModules['ext.WikidataPageBanner.loadImage'] = array(
+       'scripts' => array(
+               
'ext.WikidataPageBanner.loadImage/ext.WikidataPageBanner.loadImage.js',
+       ),
+       'localBasePath' => __DIR__,
+       'remoteExtPath' => 'WikidataPageBanner/resources',
+       'dependencies' => array(
+                       'mediawiki.api'
+               ),
+       'targets' => array( 'desktop', 'mobile' ),
+);
diff --git 
a/resources/ext.WikidataPageBanner.loadImage/ext.WikidataPageBanner.loadImage.js
 
b/resources/ext.WikidataPageBanner.loadImage/ext.WikidataPageBanner.loadImage.js
new file mode 100644
index 0000000..99f7ded
--- /dev/null
+++ 
b/resources/ext.WikidataPageBanner.loadImage/ext.WikidataPageBanner.loadImage.js
@@ -0,0 +1,20 @@
+/*
+ * Javascript for loading banner dynamically depending upon browser size
+ */
+( function ( mw, $ ) {
+       var src = $( '.ext-wpb-pagebanner' ).data( 'src' );
+       src = 'File:abcd.jpg';
+       //alert( src );
+       //console.log(mw.Api);
+       var api = new mw.Api();
+       api.get({
+               'action': 'query',
+               'prop': 'imageinfo',
+               'format': 'json',
+               'iiprop': 'url',
+               'iiurlwidth': '200',
+               'titles': src
+       }).done( function( data ){
+               console.log( data );
+       } );
+}( mediaWiki, jQuery ) );

-- 
To view, visit https://gerrit.wikimedia.org/r/212512
To unsubscribe, visit https://gerrit.wikimedia.org/r/settings

Gerrit-MessageType: newchange
Gerrit-Change-Id: I3b3564d5bf96528108ce7eb0b41937356f766722
Gerrit-PatchSet: 1
Gerrit-Project: mediawiki/extensions/WikidataPageBanner
Gerrit-Branch: master
Gerrit-Owner: Sumit <asthana.sumi...@gmail.com>

_______________________________________________
MediaWiki-commits mailing list
MediaWiki-commits@lists.wikimedia.org
https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits