Jhernandez has uploaded a new change for review. https://gerrit.wikimedia.org/r/187397
Change subject: WIP: Show in Special:Collections the user's Watchlist "collectionized" ...................................................................... WIP: Show in Special:Collections the user's Watchlist "collectionized" NOT WORKING, doesnt load the collection right now As part of the first sprint we are creating the views by using watchlist as our backend for the moment. In the future in Special:Collections there will actually be the list of collections from the user. Change-Id: Id1e62c0ac97cfd20e52112b13c0970ccdb70f0e1 --- M MobileFrontend.php M includes/Resources.php M includes/models/MobilePage.php M includes/specials/SpecialCollections.php A includes/views/MobileCollectionItemCardView.php M includes/views/MobileCollectionView.php A less/specials/collections.less M less/specials/common.less 8 files changed, 212 insertions(+), 10 deletions(-) git pull ssh://gerrit.wikimedia.org:29418/mediawiki/extensions/MobileFrontend refs/changes/97/187397/1 diff --git a/MobileFrontend.php b/MobileFrontend.php index 6196e56..cfda0d2 100644 --- a/MobileFrontend.php +++ b/MobileFrontend.php @@ -66,6 +66,7 @@ 'MobileView' => 'views/MobileView', 'MobileCollectionView' => 'views/MobileCollectionView', + 'MobileCollectionItemCardView' => 'views/MobileCollectionItemCardView', 'MobileUI' => 'MobileUI', 'MobileUserInfo' => 'MobileUserInfo', diff --git a/includes/Resources.php b/includes/Resources.php index 683db00..ce7fb63 100644 --- a/includes/Resources.php +++ b/includes/Resources.php @@ -1413,6 +1413,12 @@ * suffixed by '.styles' or '.scripts' */ $wgMobileSpecialPageModules = array( + 'mobile.special.collections.styles' => $wgMFMobileSpecialPageResourceBoilerplate + array( + 'styles' => array( + 'less/specials/collections.less', + ), + ), + 'mobile.special.mobilemenu.styles' => $wgMFMobileSpecialPageResourceBoilerplate + array( 'styles' => array( 'less/specials/mobilemenu.less', @@ -1543,6 +1549,7 @@ 'javascripts/specials/mobilediff.js', ), ), + ); /** diff --git a/includes/models/MobilePage.php b/includes/models/MobilePage.php index 902457c..1e41490 100644 --- a/includes/models/MobilePage.php +++ b/includes/models/MobilePage.php @@ -13,6 +13,8 @@ const SMALL_IMAGE_WIDTH = 150; const TINY_IMAGE_WIDTH = 80; + protected $extract; + /** * @var Title: Title for page */ @@ -53,6 +55,18 @@ return $this->title; } + public function getDescription() { + return 'WikiData description'; + } + + public function getExtract() { + return $this->extract; + } + + public function setExtract( $extract ) { + $this->extract = $extract; + } + /** * Get a placeholder div container for thumbnails * @param string $className diff --git a/includes/specials/SpecialCollections.php b/includes/specials/SpecialCollections.php index c920f41..723ea6c 100644 --- a/includes/specials/SpecialCollections.php +++ b/includes/specials/SpecialCollections.php @@ -23,13 +23,14 @@ public function executeWhenAvailable( $subpage ) { if ( $subpage ) { $args = explode( '/', $subpage ); - $user = User::newFromName( $args[0] ); - if ( isset( $args[1] ) ) { - // check permissions - // getCollection( id ) + // If there is a user argument, that's what we want to use + if ( isset( $args[0] ) ) { + $user = User::newFromName( $args[0] ); } else { - $collection = new MobileWatchlistCollection( $this->getUser() ); + // Otherwise just show the users page + $user = $this->getUser(); } + $collection = new MobileWatchlistCollection( $user ); } else { $collection = new MobileWatchlistCollection( $this->getUser() ); } @@ -41,9 +42,13 @@ public function render( $collection ) { $out = $this->getOutput(); $this->setHeaders(); - $title = $collection->getTitle(); - $out->setPageTitle( $title ); - $view = new MobileCollectionView( $collection ); - $view->render( $out ); + if ( count( $collection ) > 0 ) { + $out->setPageTitle( $collection->getTitle() ); + } else { + // FIXME: Set title properly? Redirect to other not found? + $out->setPageTitle( 'Collection not found' ); + } + $view = new MobileCollectionView( $collection ); + $view->render( $out ); } } diff --git a/includes/views/MobileCollectionItemCardView.php b/includes/views/MobileCollectionItemCardView.php new file mode 100644 index 0000000..3262207 --- /dev/null +++ b/includes/views/MobileCollectionItemCardView.php @@ -0,0 +1,29 @@ +<?php + +class MobileCollectionItemCardView extends MobileView { + + public function __construct( MobileCollectionItem $item ) { + $this->item = $item; + } + + public function getHtml() { + $page = $this->item->getMobilePage(); + $html = Html::openElement( 'div', array( 'class' => 'collection-item' ) ) . + $page->getMediumThumbnailHtml( true ) . + Html::element( + 'h2', array( 'class' => 'collection-item-title' ), $page->getTitle()->getText() + ) . + Html::element( + 'span', array( 'class' => 'collection-item-description' ), $page->getDescription() + ) . + Html::element( 'p', array( 'class' => 'collection-item-excerpt' ), $page->getExtract() ) . + Html::openElement( 'div', array( 'class' => 'collection-item-footer' ) ) . + Html::openElement( 'a', array( 'class' => MobileUI::anchorClass( 'progressive' ) ) ) . + 'Read more' . + Html::element( 'span', array( 'class' => MobileUI::iconClass( 'ok' ) ) ) . + Html::closeElement( 'a' ) . + Html::closeElement( 'div' ) . + Html::closeElement( 'div' ); + return $html; + } +} diff --git a/includes/views/MobileCollectionView.php b/includes/views/MobileCollectionView.php index 6e00869..402c652 100644 --- a/includes/views/MobileCollectionView.php +++ b/includes/views/MobileCollectionView.php @@ -16,12 +16,66 @@ } /** + * Returns the rendered html for the collection header + * + * @return Html + */ + private function getHeaderHtml() { + $collection = $this->collection; + $description = $collection->getDescription(); + $owner = $collection->getOwner(); + $lastUpdated = $collection->getLastModified(); + $now = new MWTimestamp(); + $diff = $lastUpdated->diff( $now ); + + $html = Html::openElement( 'div', array( 'class' => 'collection-header' ) ) . + Html::element( 'div', array( 'class' => 'collection-description' ), $description ) . + $this->getOwnerHtml( $owner ) . + Html::element( + 'div', array( 'class' => 'collection-last-updated' ), + 'Last updated ' . $diff->days . ' days ago' + ) . + Html::element( + 'button', + array( 'class' => 'collection-action-button mw-ui-button mw-ui-progressive' ), + 'Subscribe' + ) . + Html::closeElement( 'div' ); + + return $html; + } + + private function getOwnerHtml( $owner ) { + $classes = array( + 'class' => 'collection-owner' . ' ' . + 'mw-ui-icon mw-ui-icon-before mw-ui-icon-user' + ); + return Html::element( 'span', $classes, $owner->getName() ); + } + + /** * Returns the html for a collection * * @protected * @return string Html */ public function getHtml() { - return 'Collections'; + $collection = $this->collection; + + if ( count( $collection ) > 0 ) { + $html .= Html::openElement( 'div', array( 'class' => 'collection content' ) ) . + $this->getHeaderHtml() . + Html::openElement( 'div', array( 'class' => 'collection-items' ) ); + foreach ( $collection as $item ) { + if ( $item->getTitle()->getNamespace() === NS_MAIN ) { + $view = new MobileCollectionItemCardView( $item ); + $html .= $view->getHtml(); + } + } + $html .= Html::closeElement( 'div' ) . + Html::closeElement( 'div' ); + } + + return $html; } } diff --git a/less/specials/collections.less b/less/specials/collections.less new file mode 100644 index 0000000..89382d2 --- /dev/null +++ b/less/specials/collections.less @@ -0,0 +1,90 @@ +@import "minerva.variables"; +@import "minerva.mixins"; + +.collection { + + .collection-header { + text-align: center; + padding: 0 1em; + margin-bottom: 2em; + + h1 { + font-weight: bold; + } + + .collection-description { + color: @grayMediumLight; + + margin-bottom: 1em; + } + + .collection-owner { + &.mw-ui-icon-before:before { + margin-right: 0.5em; + width: 1em; + } + } + + .collection-last-updated { + color: @grayMediumLight; + font-style: italic; + + margin-bottom: 1.5em; + } + + .collection-action-button { + padding: 0.5em 2em; + } + } + + .collection-items { + } + + .collection-item { + @collectionItemPadding: 1em; + + border: 1px solid @grayLightest; + padding: 0 @collectionItemPadding; + margin-bottom: 2em; + + .list-thumb { + height: 300px; + margin: 0 -@collectionItemPadding; + } + + .collection-item-title { + font-size: 2em; + padding-bottom: 0; + // Reset .mw-mf-special #content_wrapper styles for headers... + text-align: left; + font-family: @fontFamilyHeading; + line-height: 1.3em; + color: black; + margin: 0; + } + + .collection-item-description { + color: @grayMediumLight; + display: inline-block; + margin-bottom: @collectionItemPadding * 2; + } + + .collection-item-excerpt { + margin-top: 0; + } + + .collection-item-footer { + margin: 0 -@collectionItemPadding; + padding: @collectionItemPadding; + text-align: right; + border-top: 1px solid @grayLightest; + font-weight: bold; + + // FIXME: mw-ui-text mw-ui-progressive is not styling the link SpecialMobileCollections.php:90 + .mw-ui-progressive { + color: #347bff; + } + } + } + +} diff --git a/less/specials/common.less b/less/specials/common.less index 74596b4..b2868ab 100644 --- a/less/specials/common.less +++ b/less/specials/common.less @@ -30,7 +30,9 @@ padding: 0; border-bottom: none; } +} +.mw-mf-special { .content { h2 { text-align: center; -- To view, visit https://gerrit.wikimedia.org/r/187397 To unsubscribe, visit https://gerrit.wikimedia.org/r/settings Gerrit-MessageType: newchange Gerrit-Change-Id: Id1e62c0ac97cfd20e52112b13c0970ccdb70f0e1 Gerrit-PatchSet: 1 Gerrit-Project: mediawiki/extensions/MobileFrontend Gerrit-Branch: master Gerrit-Owner: Jhernandez <jhernan...@wikimedia.org> _______________________________________________ MediaWiki-commits mailing list MediaWiki-commits@lists.wikimedia.org https://lists.wikimedia.org/mailman/listinfo/mediawiki-commits