diff --git a/resources/celerity/map.php b/resources/celerity/map.php index 5fb67b2d91..8343d9526c 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' => '09a39e8d', + 'rsrc/css/application/phame/phame.css' => 'dac8fdf2', 'rsrc/css/application/pholio/pholio-edit.css' => '3ad9d1ee', 'rsrc/css/application/pholio/pholio-inline-comments.css' => '8e545e49', 'rsrc/css/application/pholio/pholio.css' => '95174bdd', @@ -127,7 +127,7 @@ return array( 'rsrc/css/phui/phui-box.css' => 'a5bb366d', 'rsrc/css/phui/phui-button.css' => '16020a60', 'rsrc/css/phui/phui-crumbs-view.css' => '414406b5', - 'rsrc/css/phui/phui-document-pro.css' => 'e0fad431', + 'rsrc/css/phui/phui-document-pro.css' => '8799acf7', 'rsrc/css/phui/phui-document-summary.css' => '9ca48bdf', 'rsrc/css/phui/phui-document.css' => 'a4a1c3b9', 'rsrc/css/phui/phui-feed-story.css' => 'b7b26d23', @@ -781,7 +781,7 @@ return array( 'phabricator-uiexample-reactor-sendclass' => '1def2711', 'phabricator-uiexample-reactor-sendproperties' => 'b1f0ccee', 'phabricator-zindex-css' => '57ddcaa2', - 'phame-css' => '09a39e8d', + 'phame-css' => 'dac8fdf2', 'pholio-css' => '95174bdd', 'pholio-edit-css' => '3ad9d1ee', 'pholio-inline-comments-css' => '8e545e49', @@ -802,7 +802,7 @@ return array( 'phui-crumbs-view-css' => '414406b5', 'phui-document-summary-view-css' => '9ca48bdf', 'phui-document-view-css' => 'a4a1c3b9', - 'phui-document-view-pro-css' => 'e0fad431', + 'phui-document-view-pro-css' => '8799acf7', 'phui-feed-story-css' => 'b7b26d23', 'phui-font-icon-base-css' => 'ecbbb4c2', 'phui-fontkit-css' => '9cda225e', diff --git a/src/__phutil_library_map__.php b/src/__phutil_library_map__.php index 03dae199af..6c5a01fd0e 100644 --- a/src/__phutil_library_map__.php +++ b/src/__phutil_library_map__.php @@ -3427,6 +3427,7 @@ phutil_register_library_map(array( 'PhameDraftListView' => 'applications/phame/view/PhameDraftListView.php', 'PhameHomeController' => 'applications/phame/controller/PhameHomeController.php', 'PhameLiveController' => 'applications/phame/controller/PhameLiveController.php', + 'PhameNextPostView' => 'applications/phame/view/PhameNextPostView.php', 'PhamePost' => 'applications/phame/storage/PhamePost.php', 'PhamePostCommentController' => 'applications/phame/controller/post/PhamePostCommentController.php', 'PhamePostController' => 'applications/phame/controller/post/PhamePostController.php', @@ -7880,6 +7881,7 @@ phutil_register_library_map(array( 'PhameDraftListView' => 'AphrontTagView', 'PhameHomeController' => 'PhamePostController', 'PhameLiveController' => 'PhameController', + 'PhameNextPostView' => 'AphrontTagView', 'PhamePost' => array( 'PhameDAO', 'PhabricatorPolicyInterface', diff --git a/src/applications/phame/controller/post/PhamePostViewController.php b/src/applications/phame/controller/post/PhamePostViewController.php index 0472db20bd..6a0ceace4f 100644 --- a/src/applications/phame/controller/post/PhamePostViewController.php +++ b/src/applications/phame/controller/post/PhamePostViewController.php @@ -126,20 +126,15 @@ final class PhamePostViewController ->setUser($viewer) ->setObject($post); + $next_view = new PhameNextPostView(); if ($next) { - $properties->addProperty( - pht('Later Posts'), - $viewer->renderHandleList(mpull($next, 'getPHID'))); + $next_view->setNext($next->getTitle(), $next->getViewURI()); } - if ($prev) { - $properties->addProperty( - pht('Earlier Posts'), - $viewer->renderHandleList(mpull($prev, 'getPHID'))); + $next_view->setPrevious($prev->getTitle(), $prev->getViewURI()); } - $properties->invokeWillRenderEvent(); - + $document->setFoot($next_view); $crumbs = $this->buildApplicationCrumbs(); $page = $this->newPage() @@ -257,7 +252,7 @@ final class PhamePostViewController ->setViewer($viewer) ->withVisibility(PhameConstants::VISIBILITY_PUBLISHED) ->withBlogPHIDs(array($post->getBlog()->getPHID())) - ->setLimit(2); + ->setLimit(1); $prev = id(clone $query) ->setAfterID($post->getID()) @@ -267,7 +262,7 @@ final class PhamePostViewController ->setBeforeID($post->getID()) ->execute(); - return array($prev, $next); + return array(head($prev), head($next)); } } diff --git a/src/applications/phame/view/PhameNextPostView.php b/src/applications/phame/view/PhameNextPostView.php new file mode 100644 index 0000000000..87f4f7aa1a --- /dev/null +++ b/src/applications/phame/view/PhameNextPostView.php @@ -0,0 +1,113 @@ +nextTitle = $title; + $this->nextHref = $href; + return $this; + } + + public function setPrevious($title, $href) { + $this->previousTitle = $title; + $this->previousHref = $href; + return $this; + } + + protected function getTagAttributes() { + $classes = array(); + $classes[] = 'phame-next-post-view'; + $classes[] = 'grouped'; + return array('class' => implode(' ', $classes)); + } + + protected function getTagContent() { + require_celerity_resource('phame-css'); + + $p_icon = id(new PHUIIconView()) + ->setIconFont('fa-angle-left'); + + $previous_icon = phutil_tag( + 'div', + array( + 'class' => 'phame-previous-arrow', + ), + $p_icon); + + $previous_text = phutil_tag( + 'div', + array( + 'class' => 'phame-previous-header', + ), + pht('Previous Post')); + + $previous_title = phutil_tag( + 'div', + array( + 'class' => 'phame-previous-title', + ), + $this->previousTitle); + + $previous = null; + if ($this->previousHref) { + $previous = phutil_tag( + 'a', + array( + 'class' => 'phame-previous', + 'href' => $this->previousHref, + ), + array( + $previous_icon, + $previous_text, + $previous_title, + )); + } + + $n_icon = id(new PHUIIconView()) + ->setIconFont('fa-angle-right'); + + $next_icon = phutil_tag( + 'div', + array( + 'class' => 'phame-next-arrow', + ), + $n_icon); + + $next_text = phutil_tag( + 'div', + array( + 'class' => 'phame-next-header', + ), + pht('Next Post')); + + $next_title = phutil_tag( + 'div', + array( + 'class' => 'phame-next-title', + ), + $this->nextTitle); + + $next = null; + if ($this->nextHref) { + $next = phutil_tag( + 'a', + array( + 'class' => 'phame-next', + 'href' => $this->nextHref, + ), + array( + $next_icon, + $next_text, + $next_title, + )); + } + + return array($previous, $next); + } + +} diff --git a/src/view/phui/PHUIDocumentViewPro.php b/src/view/phui/PHUIDocumentViewPro.php index c18732e2c6..dbab3ab54c 100644 --- a/src/view/phui/PHUIDocumentViewPro.php +++ b/src/view/phui/PHUIDocumentViewPro.php @@ -7,6 +7,7 @@ final class PHUIDocumentViewPro extends AphrontTagView { private $bookdescription; private $fluid; private $toc; + private $foot; public function setHeader(PHUIHeaderView $header) { $header->setTall(true); @@ -30,6 +31,11 @@ final class PHUIDocumentViewPro extends AphrontTagView { return $this; } + public function setFoot($foot) { + $this->foot = $foot; + return $this; + } + protected function getTagAttributes() { $classes = array(); @@ -37,6 +43,9 @@ final class PHUIDocumentViewPro extends AphrontTagView { if ($this->fluid) { $classes[] = 'phui-document-fluid'; } + if ($this->foot) { + $classes[] = 'document-has-foot'; + } return array( 'class' => implode(' ', $classes), @@ -95,6 +104,16 @@ final class PHUIDocumentViewPro extends AphrontTagView { $toc); } + $foot_content = null; + if ($this->foot) { + $foot_content = phutil_tag( + 'div', + array( + 'class' => 'phui-document-foot-content', + ), + $this->foot); + } + $content_inner = phutil_tag( 'div', array( @@ -104,6 +123,7 @@ final class PHUIDocumentViewPro extends AphrontTagView { $table_of_contents, $this->header, $main_content, + $foot_content, )); $content = phutil_tag( diff --git a/webroot/rsrc/css/application/phame/phame.css b/webroot/rsrc/css/application/phame/phame.css index 02d8761a6b..65604a6dd6 100644 --- a/webroot/rsrc/css/application/phame/phame.css +++ b/webroot/rsrc/css/application/phame/phame.css @@ -134,3 +134,106 @@ width: 14px; color: {$lightbluetext}; } + +.phame-next-post-view { + margin: 0 auto; + padding: 12px 0; + font-family: 'Aleo', {$fontfamily}; +} + +.phame-next { + width: 360px; + float: right; + text-align: right; + color: #000; + position: relative; +} + +.phame-next-arrow, +.phame-previous-arrow { + border: 1px solid {$lightblueborder}; + border-radius: 36px; + height: 36px; + width: 36px; + text-align: center; +} + +.phame-next-arrow .phui-icon-view, +.phame-previous-arrow .phui-icon-view { + height: 36px; + width: 34px; + font-size: 24px; + line-height: 35px; + color: {$lightblueborder}; +} + +.phame-previous-arrow { + float: left; +} + +.phame-next-arrow { + float: right; +} + +.phame-previous { + width: 360px; + float: left; + text-align: left; + color: #000; + position: relative; +} + +.device .phame-previous, +.device .phame-next { + width: 100px; +} + +.device .phame-previous .phame-previous-title, +.device .phame-next .phame-next-title { + display: none; +} + +.phame-next:hover, +.phame-previous:hover { + text-decoration: none; +} + +.phame-next:hover .phame-next-arrow, +.phame-previous:hover .phame-previous-arrow { + border-color: {$indigo}; +} + +.phame-next:hover .phui-icon-view, +.phame-previous:hover .phui-icon-view { + color: {$indigo}; +} + +.phame-next-header, +.phame-previous-header { + font-weight: bold; + font-size: {$biggerfontsize}; +} + +.phame-next-header { + top: 2px; + right: 50px; + position: absolute; +} + +.phame-next-title { + top: 22px; + right: 50px; + position: absolute; +} + +.phame-previous-header { + top: 2px; + left: 50px; + position: absolute; +} + +.phame-previous-title { + top: 22px; + left: 50px; + position: absolute; +} diff --git a/webroot/rsrc/css/phui/phui-document-pro.css b/webroot/rsrc/css/phui/phui-document-pro.css index ab3a22656c..90f268cf66 100644 --- a/webroot/rsrc/css/phui/phui-document-pro.css +++ b/webroot/rsrc/css/phui/phui-document-pro.css @@ -179,11 +179,6 @@ a.button.phui-document-toc { display: none; } -.phui-document-view-pro-box .phui-timeline-major-event .phui-timeline-content - .phui-timeline-core-content { - -} - .phui-document-view-pro-box .phui-object-box { margin: 0; } @@ -195,3 +190,11 @@ a.button.phui-document-toc { .phui-document-view-pro-box .phui-object-box .remarkup-assist-textarea { height: 9em; } + +.document-has-foot .phui-document-view-pro { + padding-bottom: 0; +} + +.phui-document-foot-content { + margin: 64px 0 32px; +}