From efb6bb3dcfae23fe12bf5a841116b6048a723255 Mon Sep 17 00:00:00 2001 From: Chad Little Date: Sat, 12 Dec 2015 01:23:09 +0000 Subject: [PATCH] Add "Blogs" section to PhameHome Summary: Ref T9927. Adds a "Blogs" section to PhameHome. Removes "New Post" Controller. Adds flipped layout for PHUITwoColumnView Test Plan: Test PhameHome, Ponder, New Post, etc. Mobile and Desktop states. {F1022080} Reviewers: epriestley Reviewed By: epriestley Subscribers: johnny-bit, Korvin Maniphest Tasks: T9927 Differential Revision: https://secure.phabricator.com/D14744 --- resources/celerity/map.php | 4 +- src/__phutil_library_map__.php | 4 +- .../PhabricatorPhameApplication.php | 1 - .../phame/controller/PhameHomeController.php | 30 +++--- .../post/PhamePostNewController.php | 63 ------------ .../phame/view/PhameBlogListView.php | 98 +++++++++++++++++++ src/view/phui/PHUITwoColumnView.php | 37 +++++-- webroot/rsrc/css/application/phame/phame.css | 97 ++++++++++++++++++ 8 files changed, 245 insertions(+), 89 deletions(-) delete mode 100644 src/applications/phame/controller/post/PhamePostNewController.php create mode 100644 src/applications/phame/view/PhameBlogListView.php diff --git a/resources/celerity/map.php b/resources/celerity/map.php index 799cd3d0a5..0879277918 100644 --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -82,7 +82,7 @@ return array( 'rsrc/css/application/owners/owners-path-editor.css' => '2f00933b', 'rsrc/css/application/paste/paste.css' => 'a5157c48', 'rsrc/css/application/people/people-profile.css' => '25970776', - 'rsrc/css/application/phame/phame.css' => 'cea3c9e1', + 'rsrc/css/application/phame/phame.css' => '0b018205', 'rsrc/css/application/pholio/pholio-edit.css' => '3ad9d1ee', 'rsrc/css/application/pholio/pholio-inline-comments.css' => '8e545e49', 'rsrc/css/application/pholio/pholio.css' => '95174bdd', @@ -782,7 +782,7 @@ return array( 'phabricator-uiexample-reactor-sendclass' => '1def2711', 'phabricator-uiexample-reactor-sendproperties' => 'b1f0ccee', 'phabricator-zindex-css' => '57ddcaa2', - 'phame-css' => 'cea3c9e1', + 'phame-css' => '0b018205', 'pholio-css' => '95174bdd', 'pholio-edit-css' => '3ad9d1ee', 'pholio-inline-comments-css' => '8e545e49', diff --git a/src/__phutil_library_map__.php b/src/__phutil_library_map__.php index 63b11ecb75..8adc589fe6 100644 --- a/src/__phutil_library_map__.php +++ b/src/__phutil_library_map__.php @@ -3325,6 +3325,7 @@ phutil_register_library_map(array( 'PhameBlogEditor' => 'applications/phame/editor/PhameBlogEditor.php', 'PhameBlogFeedController' => 'applications/phame/controller/blog/PhameBlogFeedController.php', 'PhameBlogListController' => 'applications/phame/controller/blog/PhameBlogListController.php', + 'PhameBlogListView' => 'applications/phame/view/PhameBlogListView.php', 'PhameBlogManageController' => 'applications/phame/controller/blog/PhameBlogManageController.php', 'PhameBlogProfilePictureController' => 'applications/phame/controller/blog/PhameBlogProfilePictureController.php', 'PhameBlogQuery' => 'applications/phame/query/PhameBlogQuery.php', @@ -3352,7 +3353,6 @@ phutil_register_library_map(array( 'PhamePostListView' => 'applications/phame/view/PhamePostListView.php', 'PhamePostMailReceiver' => 'applications/phame/mail/PhamePostMailReceiver.php', 'PhamePostMoveController' => 'applications/phame/controller/post/PhamePostMoveController.php', - 'PhamePostNewController' => 'applications/phame/controller/post/PhamePostNewController.php', 'PhamePostPublishController' => 'applications/phame/controller/post/PhamePostPublishController.php', 'PhamePostQuery' => 'applications/phame/query/PhamePostQuery.php', 'PhamePostReplyHandler' => 'applications/phame/mail/PhamePostReplyHandler.php', @@ -7675,6 +7675,7 @@ phutil_register_library_map(array( 'PhameBlogEditor' => 'PhabricatorApplicationTransactionEditor', 'PhameBlogFeedController' => 'PhameBlogController', 'PhameBlogListController' => 'PhameBlogController', + 'PhameBlogListView' => 'AphrontTagView', 'PhameBlogManageController' => 'PhameBlogController', 'PhameBlogProfilePictureController' => 'PhameBlogController', 'PhameBlogQuery' => 'PhabricatorCursorPagedPolicyAwareQuery', @@ -7712,7 +7713,6 @@ phutil_register_library_map(array( 'PhamePostListView' => 'AphrontTagView', 'PhamePostMailReceiver' => 'PhabricatorObjectMailReceiver', 'PhamePostMoveController' => 'PhamePostController', - 'PhamePostNewController' => 'PhamePostController', 'PhamePostPublishController' => 'PhamePostController', 'PhamePostQuery' => 'PhabricatorCursorPagedPolicyAwareQuery', 'PhamePostReplyHandler' => 'PhabricatorApplicationTransactionReplyHandler', diff --git a/src/applications/phame/application/PhabricatorPhameApplication.php b/src/applications/phame/application/PhabricatorPhameApplication.php index ddaf2fdf9c..40bf8e0a24 100644 --- a/src/applications/phame/application/PhabricatorPhameApplication.php +++ b/src/applications/phame/application/PhabricatorPhameApplication.php @@ -54,7 +54,6 @@ final class PhabricatorPhameApplication extends PhabricatorApplication { 'preview/(?P\d+)/' => 'PhamePostPreviewController', 'preview/' => 'PhabricatorMarkupPreviewController', 'framed/(?P\d+)/' => 'PhamePostFramedController', - 'new/' => 'PhamePostNewController', 'move/(?P\d+)/' => 'PhamePostMoveController', 'comment/(?P[1-9]\d*)/' => 'PhamePostCommentController', ), diff --git a/src/applications/phame/controller/PhameHomeController.php b/src/applications/phame/controller/PhameHomeController.php index e3bd9802c5..27fb907f50 100644 --- a/src/applications/phame/controller/PhameHomeController.php +++ b/src/applications/phame/controller/PhameHomeController.php @@ -12,6 +12,7 @@ final class PhameHomeController extends PhamePostController { $blogs = id(new PhameBlogQuery()) ->setViewer($viewer) ->withStatuses(array(PhameBlog::STATUS_ACTIVE)) + ->needProfileImage(true) ->execute(); $blog_phids = mpull($blogs, 'getPHID'); @@ -56,12 +57,24 @@ final class PhameHomeController extends PhamePostController { ->setHeader($header) ->appendChild($post_list); + $sidebar = id(new PhameBlogListView()) + ->setBlogs($blogs) + ->setViewer($viewer); + + $phame_view = id(new PHUITwoColumnView()) + ->setMainColumn(array( + $page, + )) + ->setSideColumn($sidebar) + ->setDisplay(PHUITwoColumnView::DISPLAY_LEFT) + ->addClass('phame-home-view'); + return $this->newPage() ->setTitle($title) ->setCrumbs($crumbs) ->appendChild( array( - $page, + $phame_view, )); @@ -83,28 +96,17 @@ final class PhameHomeController extends PhamePostController { ->setHref($this->getApplicationURI('post/')) ->setName(pht('All Posts'))); - $actions->addAction( - id(new PhabricatorActionView()) - ->setIcon('fa-star') - ->setHref($this->getApplicationURI('blog/')) - ->setName(pht('Active Blogs'))); - return $actions; } + private function renderBlogs($viewer, $blogs) {} + protected function buildApplicationCrumbs() { $crumbs = parent::buildApplicationCrumbs(); $can_create = $this->hasApplicationCapability( PhameBlogCreateCapability::CAPABILITY); - $crumbs->addAction( - id(new PHUIListItemView()) - ->setName(pht('New Post')) - ->setHref($this->getApplicationURI('/post/new/')) - ->setIcon('fa-plus-square') - ->setWorkflow(true)); - $crumbs->addAction( id(new PHUIListItemView()) ->setName(pht('New Blog')) diff --git a/src/applications/phame/controller/post/PhamePostNewController.php b/src/applications/phame/controller/post/PhamePostNewController.php deleted file mode 100644 index 1ba7fc3059..0000000000 --- a/src/applications/phame/controller/post/PhamePostNewController.php +++ /dev/null @@ -1,63 +0,0 @@ -getViewer(); - $id = $request->getInt('blog'); - - if ($id) { - $blog = id(new PhameBlogQuery()) - ->setViewer($viewer) - ->withIDs(array($id)) - ->requireCapabilities( - array( - PhabricatorPolicyCapability::CAN_EDIT, - )) - ->executeOne(); - if (!$blog) { - return new Aphront404Response(); - } - - $view_uri = '/post/edit/?blog='.$blog->getID(); - $view_uri = $this->getApplicationURI($view_uri); - - return id(new AphrontRedirectResponse())->setURI($view_uri); - } - - $blogs = id(new PhameBlogQuery()) - ->setViewer($viewer) - ->requireCapabilities( - array( - PhabricatorPolicyCapability::CAN_EDIT, - )) - ->execute(); - - if (!$blogs) { - $form = id(new PHUIInfoView()) - ->setSeverity(PHUIInfoView::SEVERITY_NODATA) - ->appendChild( - pht('You do not have permission to post to any blogs. Create a blog '. - 'first, then you can post to it.')); - - } else { - $options = mpull($blogs, 'getName', 'getID'); - asort($options); - - $form = id(new PHUIFormLayoutView()) - ->setUser($viewer) - ->appendChild( - id(new AphrontFormSelectControl()) - ->setLabel(pht('Blog')) - ->setName('blog') - ->setOptions($options)); - } - - return $this->newDialog() - ->setTitle(pht('New Post')) - ->appendChild($form) - ->addSubmitButton(pht('Continue')); - - } - -} diff --git a/src/applications/phame/view/PhameBlogListView.php b/src/applications/phame/view/PhameBlogListView.php new file mode 100644 index 0000000000..965954f292 --- /dev/null +++ b/src/applications/phame/view/PhameBlogListView.php @@ -0,0 +1,98 @@ +blogs = $blogs; + return $this; + } + + public function setViewer($viewer) { + $this->viewer = $viewer; + return $this; + } + + protected function getTagAttributes() { + $classes = array(); + $classes[] = 'phame-blog-list'; + return array('class' => implode(' ', $classes)); + } + + protected function getTagContent() { + require_celerity_resource('phame-css'); + Javelin::initBehavior('phabricator-tooltips'); + + $list = array(); + foreach ($this->blogs as $blog) { + $image_uri = $blog->getProfileImageURI(); + $image = phutil_tag( + 'a', + array( + 'class' => 'phame-blog-list-image', + 'style' => 'background-image: url('.$image_uri.');', + 'href' => $blog->getViewURI(), + )); + + $title = phutil_tag( + 'a', + array( + 'class' => 'phame-blog-list-title', + 'href' => $blog->getViewURI(), + ), + $blog->getName()); + + $icon = id(new PHUIIconView()) + ->setIconFont('fa-plus-square') + ->addClass('phame-blog-list-icon'); + + $add_new = phutil_tag( + 'a', + array( + 'href' => '/phame/post/edit/?blog='.$blog->getID(), + 'class' => 'phame-blog-list-new-post', + 'sigil' => 'has-tooltip', + 'meta' => array('tip' => pht('New Post')), + ), + $icon); + + $list[] = phutil_tag( + 'div', + array( + 'class' => 'phame-blog-list-item', + ), + array( + $image, + $title, + $add_new, + )); + } + + if (empty($list)) { + $list = phutil_tag( + 'a', + array( + 'href' => '/phame/blog/new/', + ), + pht('Create a Blog')); + } + + $header = phutil_tag( + 'h4', + array( + 'class' => 'phame-blog-list-header', + ), + phutil_tag( + 'a', + array( + 'href' => '/phame/blog/', + ), + pht('Blogs'))); + + return array($header, $list); + } + +} diff --git a/src/view/phui/PHUITwoColumnView.php b/src/view/phui/PHUITwoColumnView.php index a7af97da52..a01ce913b8 100644 --- a/src/view/phui/PHUITwoColumnView.php +++ b/src/view/phui/PHUITwoColumnView.php @@ -4,6 +4,10 @@ final class PHUITwoColumnView extends AphrontTagView { private $mainColumn; private $sideColumn; + private $display; + + const DISPLAY_LEFT = 'phui-side-column-left'; + const DISPLAY_RIGHT = 'phui-side-column-right'; public function setMainColumn($main) { $this->mainColumn = $main; @@ -15,9 +19,27 @@ final class PHUITwoColumnView extends AphrontTagView { return $this; } + public function setDisplay($display) { + $this->display = $display; + return $this; + } + + public function getDisplay() { + if ($this->display) { + return $this->display; + } else { + return self::DISPLAY_RIGHT; + } + } + protected function getTagAttributes() { + $classes = array(); + $classes[] = 'phui-two-column-view'; + $classes[] = 'grouped'; + $classes[] = $this->getDisplay(); + return array( - 'class' => 'phui-two-column-view grouped', + 'class' => implode(' ', $classes), ); } @@ -38,11 +60,12 @@ final class PHUITwoColumnView extends AphrontTagView { ), $this->sideColumn); - return phutil_tag_div( - 'phui-two-column-row', - array( - $main, - $side, - )); + if ($this->getDisplay() == self::DISPLAY_LEFT) { + $order = array($side, $main); + } else { + $order = array($main, $side); + } + + return phutil_tag_div('phui-two-column-row', $order); } } diff --git a/webroot/rsrc/css/application/phame/phame.css b/webroot/rsrc/css/application/phame/phame.css index 67cb65c614..56cff9c3a4 100644 --- a/webroot/rsrc/css/application/phame/phame.css +++ b/webroot/rsrc/css/application/phame/phame.css @@ -34,3 +34,100 @@ border-top: 1px solid rgba(71, 87, 120, 0.20); padding-top: 16px; } + +.phame-home-view .phui-document-view.phui-document-view-pro { + margin: 0; +} + +.phame-home-view .phui-side-column { + background-color: #fff; +} + +.device .phame-home-view .phui-side-column { + background-color: transparent; +} + +.phame-blog-list { + margin: 24px 16px 16px 16px; + padding: 16px; + background-color: {$bluebackground}; + border-radius: 3px; +} + +.device .phame-blog-list { + background-color: #fff; + padding: 8px; +} + +.phame-blog-list-item:last-child { + margin-bottom: 0; +} + +.phame-blog-list-header { + font-size: {$biggerfontsize}; + margin-bottom: 16px; +} + +.phame-blog-list-header a { + color: {$darkbluetext}; +} + +.phame-blog-list-item { + display: block; + color: {$darkgreytext}; + height: 24px; + position: relative; + margin-bottom: 8px; + padding-right: 20px; +} + +.phame-blog-list-title:hover { + color: {$indigo}; + text-decoration: none; +} + +.phame-blog-list-image { + display: inline-block; + background-repeat: no-repeat; + background-size: 100%; + box-shadow: inset 0 0 0 1px rgba(55,55,55,.15); + width: 24px; + height: 24px; + border-radius: 3px; + position: absolute; +} + +.phame-blog-list-title { + margin-left: 30px; + margin-top: 4px; + display: inline-block; + font-weight: bold; + color: {$bluetext}; + width: 190px; + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; +} + +.phame-blog-list-new-post { + display: block; + position: absolute; + top: 6px; + right: 0; +} + +.phame-blog-list-new-post:hover { + color: {$indigo}; + text-decoration: none; +} + +.phame-blog-list-new-post:hover .phame-blog-list-icon { + color: {$indigo}; +} + +.phame-blog-list-icon { + display: block; + height: 14px; + width: 14px; + color: {$lightbluetext}; +}