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

Reply via email to