Merge branch 'portable_infobox_mvp' into DAT-2762

PortableInfobox.i18n.php

@@ -3,9 +3,11 @@ $messages = [];
 
 $messages[ 'en' ] = [
 	'portable-infobox-desc' => 'Create portable infoboxes which can be rendered using clean semantic HTML markup on
-	any skin / platform using using easy to understand powerful XML-like markup'
+	any skin / platform using using easy to understand powerful XML-like markup',
+	'unimplemented-infobox-tag' => 'Unimplemented infobox tag: <$1>'
 ];
 
 $messages[ 'qqq' ] = [
-	'portable-infobox-desc' => 'Portable Infobox extension description'
-];
+	'portable-infobox-desc' => 'Portable Infobox extension description',
+	'unimplemented-infobox-tag' => 'Error message for using unimplemented infobox tag; $1 is the tag name without pointy braces'
+];

PortableInfobox.setup.php

@@ -48,7 +48,6 @@ $wgAutoloadClasses[ 'PortableInfoboxHooks' ] = $dir . 'PortableInfoboxHooks.clas
 // hooks
 $wgHooks[ 'ParserFirstCallInit' ][] = 'PortableInfoboxParserTagController::parserTagInit';
 $wgHooks['BeforePageDisplay'][] = 'PortableInfoboxHooks::onBeforePageDisplay';
-$wgHooks[ 'SkinAfterBottomScripts' ][] = 'PortableInfoboxHooks::onSkinAfterBottomScripts';
 
 // i18n mapping
 $wgExtensionMessagesFiles[ 'PortableInfobox' ] = $dir . 'PortableInfobox.i18n.php';

PortableInfoboxHooks.class.php

@@ -5,22 +5,4 @@ class PortableInfoboxHooks {
 		Wikia::addAssetsToOutput('portable_infobox_scss');
 		return true;
 	}
-
-	/**
-	 * Adds assets on the bottom of the body tag for special maps page
-	 *
-	 * @param {String} $skin
-	 * @param {String} $text
-	 *
-	 * @return bool
-	 */
-	public static function onSkinAfterBottomScripts( $skin, &$text ) {
-		$scripts = AssetsManager::getInstance()->getURL( 'portable_infobox_js' );
-
-		foreach ( $scripts as $script ) {
-			$text .= Html::linkedScript( $script );
-		}
-
-		return true;
-	}
 }

controllers/PortableInfoboxParserTagController.class.php

@@ -30,7 +30,14 @@ class PortableInfoboxParserTagController extends WikiaController {
 
 		$infoboxParser = new Wikia\PortableInfobox\Parser\XmlParser( $frame->getNamedArguments() );
 		$infoboxParser->setExternalParser( ( new Wikia\PortableInfobox\Parser\MediaWikiParserService( $parser, $frame ) ) );
-		$data = $infoboxParser->getDataFromXmlString( $markup );
+
+		try {
+			$data = $infoboxParser->getDataFromXmlString( $markup );
+		} catch ( \Wikia\PortableInfobox\Parser\Nodes\UnimplementedNodeException $e ) {
+
+			return [ $this->renderUnimplementedTagErrorMesssage( $e->getMessage() ), 'markerType' => 'nowiki' ];
+		}
+
 		//save for later api usage
 		$this->saveToParserOutput( $parser->getOutput(), $data );
 
@@ -40,6 +47,13 @@ class PortableInfoboxParserTagController extends WikiaController {
 		return [ $renderedValue, 'markerType' => 'nowiki' ];
 	}
 
+	private function renderUnimplementedTagErrorMesssage( $tagName ) {
+		$renderedValue = '<strong class="error"> '
+			. wfMessage( 'unimplemented-infobox-tag', [ $tagName ] )->escaped()
+			. '</strong>';
+		return $renderedValue;
+	}
+
 	protected function saveToParserOutput( \ParserOutput $parserOutput, $raw ) {
 		if ( !empty( $raw ) ) {
 			$infoboxes = $parserOutput->getProperty( self::INFOBOXES_PROPERTY_NAME );

crowdin.conf

@@ -0,0 +1,4 @@
+[crowdin.project]
+projectid = "ext-PortableInfobox"
+format = "mediawiki"
+source.file = "PortableInfobox.i18n.php"

scripts/PortableInfobox.js

@@ -1,23 +0,0 @@
-'use strict';
-
-(function($, vignette) {
-	var infoboxImages = $('.portable-infobox-image');
-
-	/**
-	 * @desc loads infobox image image
-	 * @param {number} index - array index
-	 * @param {string} img - img html
-	 */
-	function loadImage(index, img) {
-		var $img = $(img),
-			url = $img.data('url'),
-			options = {
-				mode: vignette.mode.scaleToWidth,
-				width: $img.parent().width()
-			};
-
-		$img.attr('src', vignette.getThumbURL(url, options));
-	}
-
-	infoboxImages.each(loadImage);
-})(jQuery, Vignette);

services/Parser/Nodes/NodeImage.php

@@ -8,12 +8,17 @@ class NodeImage extends Node {
 		$node = [];
 
 		$imageName = $this->getValueWithDefault( $this->xmlNode );
-		$node['value'] = $this->resolveImageUrl( $imageName );
+		$node['url'] = $this->resolveImageUrl( $imageName );
+		$node['name'] = $imageName;
 		$node['alt'] = $this->getValueWithDefault( $this->xmlNode->{self::ALT_TAG_NAME} );
 
 		return $node;
 	}
 
+	public function isEmpty( $data ) {
+		return !( isset( $data[ 'url' ] ) ) || empty( $data[ 'url' ] );
+	}
+
 	public function resolveImageUrl( $filename ) {
 		global $wgContLang;
 		$title = \Title::newFromText( \Wikia\PortableInfobox\Helpers\ImageFilenameSanitizer::getInstance()

services/Parser/Nodes/NodeUnimplemented.php

@@ -2,12 +2,9 @@
 namespace Wikia\PortableInfobox\Parser\Nodes;
 
 class NodeUnimplemented extends Node {
-	public function getType() {
-		return parent::getType() . '(unimplemented)';
-	}
 
 	public function getData() {
-		throw new UnimplementedNodeException('Unimplemented node type');
+		throw new UnimplementedNodeException( $this->getType() );
 	}
 }
 

services/PortableInfoboxRenderService.class.php

@@ -2,6 +2,7 @@
 
 class PortableInfoboxRenderService extends WikiaService {
 	const LOGGER_LABEL = 'portable-infobox-render-not-supported-type';
+	const THUMBNAIL_WIDTH = 270;
 
 	private $templates = [
 		'wrapper' => 'PortableInfoboxWrapper.mustache',
@@ -152,6 +153,14 @@ class PortableInfoboxRenderService extends WikiaService {
 	 * @return string - HTML
 	 */
 	private function renderItem( $type, array $data ) {
+		//TODO: with validated the performance of render Service and in the next phase we want to refactor it (make
+		// it modular) While doing this we also need to move this logic to appropriate image render class
+		if ( $type === 'image' ) {
+			$data[ 'thumbnail' ] = VignetteRequest::fromUrl( $data[ 'url' ] )
+				->scaleToWidth( self::THUMBNAIL_WIDTH )
+				->url();
+		}
+
 		return $this->templateEngine->clearData()
 			->setData( $data )
 			->render( $this->templates[ $type ] );

templates/PortableInfoboxItemImage.mustache

@@ -1,5 +1,7 @@
 <div class="portable-infobox-item item-type-image no-margins">
 	<figure>
-		<img class="portable-infobox-image" alt="{{alt}}" data-url="{{value}}" />
+		<a href="{{url}}" class="image image-thumbnail" title="{{alt}}">
+			<img src="{{thumbnail}}" class="portable-infobox-image" alt="{{alt}}" data-image-key="{{name}}" data-image-name="{{name}}"/>
+		</a>
 	</figure>
 </div>

tests/ImageFilenameSanitizerTest.php

@@ -79,6 +79,18 @@ class ImageFilenameSanitizerTest extends WikiaBaseTest {
 				'en',
 				'',
 				'Empty file name'
+			],
+			[
+				'[[File:image.jpg|300px|lorem ipsum]]',
+				'es',
+				'image.jpg',
+				'Link to filename with canonical namespace, width and caption on a non-EN wiki '
+			],
+			[
+				'[[File:image.jpg|lorem ipsum]]',
+				'es',
+				'image.jpg',
+				'Link to filename with canonical namespace and caption on a non-EN wiki '
 			]
 		];
 	}

tests/ParserNodesTest.php

@@ -36,7 +36,8 @@ class PortableInfoboxParserNodesTest extends WikiaBaseTest {
 		$node = $this->getMockBuilder( 'Wikia\PortableInfobox\Parser\Nodes\NodeImage' )->setConstructorArgs( [ $xml, [ 'image2' => 'aaa.jpg', 'alt-source' => 'bbb' ] ] )->setMethods( [ 'resolveImageUrl' ] )->getMock();
 		$node->expects( $this->any() )->method( 'resolveImageUrl' )->will( $this->returnValue( 'aaa.jpg' ) );
 
-		$this->assertTrue( $node->getData()[ 'value' ] == 'aaa.jpg', 'value is not aaa.jpg' );
+		$this->assertTrue( $node->getData()[ 'url' ] == 'aaa.jpg', 'value is not aaa.jpg' );
+		$this->assertTrue( $node->getData()[ 'name' ] == 'aaa.jpg', 'value is not aaa.jpg' );
 		$this->assertTrue( $node->getData()[ 'alt' ] == 'bbb', 'alt is not bbb' );
 		$this->assertTrue( $nodeDefault->getData()[ 'alt' ] == 'default-alt', 'default alt' );
 	}