Update Calendar for PHUITwoColumnView

Summary: Moves calendar event view to PHUITwoColumnView. Tightened up some phui status spacing.

Test Plan: Review Calendar Events, Differential status list.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D15387

resources/celerity/map.php

@@ -7,7 +7,7 @@
  */
 return array(
   'names' => array(
-    'core.pkg.css' => 'd5d34907',
+    'core.pkg.css' => 'dd1447be',
     'core.pkg.js' => '7d8faf57',
     'darkconsole.pkg.js' => 'e7393ebb',
     'differential.pkg.css' => '2de124c9',
@@ -152,10 +152,10 @@ return array(
     'rsrc/css/phui/phui-remarkup-preview.css' => '1a8f2591',
     'rsrc/css/phui/phui-segment-bar-view.css' => '46342871',
     'rsrc/css/phui/phui-spacing.css' => '042804d6',
-    'rsrc/css/phui/phui-status.css' => '888cedb8',
+    'rsrc/css/phui/phui-status.css' => '37309046',
     'rsrc/css/phui/phui-tag-view.css' => '9d5d4400',
     'rsrc/css/phui/phui-timeline-view.css' => '2efceff8',
-    'rsrc/css/phui/phui-two-column-view.css' => '64355d16',
+    'rsrc/css/phui/phui-two-column-view.css' => 'd0ad8c10',
     'rsrc/css/phui/workboards/phui-workboard-color.css' => 'ac6fe6a7',
     'rsrc/css/phui/workboards/phui-workboard.css' => 'e6d89647',
     'rsrc/css/phui/workboards/phui-workcard.css' => '3646fb96',
@@ -839,11 +839,11 @@ return array(
     'phui-remarkup-preview-css' => '1a8f2591',
     'phui-segment-bar-view-css' => '46342871',
     'phui-spacing-css' => '042804d6',
-    'phui-status-list-view-css' => '888cedb8',
+    'phui-status-list-view-css' => '37309046',
     'phui-tag-view-css' => '9d5d4400',
     'phui-theme-css' => '027ba77e',
     'phui-timeline-view-css' => '2efceff8',
-    'phui-two-column-view-css' => '64355d16',
+    'phui-two-column-view-css' => 'd0ad8c10',
     'phui-workboard-color-css' => 'ac6fe6a7',
     'phui-workboard-view-css' => 'e6d89647',
     'phui-workcard-view-css' => '3646fb96',

src/applications/calendar/controller/PhabricatorCalendarEventViewController.php

@@ -52,7 +52,8 @@ final class PhabricatorCalendarEventViewController
       $title = 'E'.$event->getID();
       $page_title = $title.' '.$event->getName();
       $crumbs = $this->buildApplicationCrumbs();
-      $crumbs->addTextCrumb($title, '/E'.$event->getID());
+      $crumbs->addTextCrumb($title);
+      $crumbs->setBorder(true);
     }
 
     if (!$event->getIsGhostEvent()) {
@@ -63,12 +64,9 @@ final class PhabricatorCalendarEventViewController
 
     $header = $this->buildHeaderView($event);
     $actions = $this->buildActionView($event);
-    $properties = $this->buildPropertyView($event);
+    $properties = $this->buildPropertyListView($event);
-
+    $details = $this->buildPropertySection($event);
-    $properties->setActionList($actions);
+    $description = $this->buildDescriptionView($event);
-    $box = id(new PHUIObjectBoxView())
-      ->setHeader($header)
-      ->addPropertyList($properties);
 
     $is_serious = PhabricatorEnv::getEnvConfig('phabricator.serious-business');
     $add_comment_header = $is_serious
@@ -90,26 +88,32 @@ final class PhabricatorCalendarEventViewController
       ->setAction($comment_uri)
       ->setSubmitButtonName(pht('Add Comment'));
 
-    return $this->buildApplicationPage(
+    $view = id(new PHUITwoColumnView())
-      array(
+      ->setHeader($header)
-        $crumbs,
+      ->setMainColumn($timeline)
-        $box,
+      ->setPropertyList($properties)
-        $timeline,
+      ->addPropertySection(pht('DETAILS'), $details)
-        $add_comment_form,
+      ->addPropertySection(pht('DESCRIPTION'), $description)
-      ),
+      ->setActionList($actions);
-      array(
+
-        'title' => $page_title,
+    return $this->newPage()
-        'pageObjects' => array($event->getPHID()),
+      ->setTitle($page_title)
+      ->setCrumbs($crumbs)
+      ->setPageObjectPHIDs(array($event->getPHID()))
+      ->appendChild(
+        array(
+          $view,
       ));
   }
 
-  private function buildHeaderView(PhabricatorCalendarEvent $event) {
+  private function buildHeaderView(
-    $viewer = $this->getRequest()->getUser();
+    PhabricatorCalendarEvent $event) {
+    $viewer = $this->getViewer();
     $id = $event->getID();
 
     $is_cancelled = $event->getIsCancelled();
-    $icon = $is_cancelled ? ('fa-times') : ('fa-calendar');
+    $icon = $is_cancelled ? ('fa-ban') : ('fa-check');
-    $color = $is_cancelled ? ('grey') : ('green');
+    $color = $is_cancelled ? ('red') : ('bluegrey');
     $status = $is_cancelled ? pht('Cancelled') : pht('Active');
 
     $invite_status = $event->getUserInviteStatus($viewer->getPHID());
@@ -120,7 +124,8 @@ final class PhabricatorCalendarEventViewController
       ->setUser($viewer)
       ->setHeader($event->getName())
       ->setStatus($icon, $color, $status)
-      ->setPolicyObject($event);
+      ->setPolicyObject($event)
+      ->setHeaderIcon('fa-calendar');
 
     if ($is_invite_pending) {
       $decline_button = id(new PHUIButtonView())
@@ -245,13 +250,26 @@ final class PhabricatorCalendarEventViewController
     return $actions;
   }
 
-  private function buildPropertyView(PhabricatorCalendarEvent $event) {
+  private function buildPropertyListView(
-    $viewer = $this->getRequest()->getUser();
+    PhabricatorCalendarEvent $event) {
+    $viewer = $this->getViewer();
 
     $properties = id(new PHUIPropertyListView())
       ->setUser($viewer)
       ->setObject($event);
 
+    $properties->invokeWillRenderEvent();
+
+    return $properties;
+  }
+
+  private function buildPropertySection(
+    PhabricatorCalendarEvent $event) {
+    $viewer = $this->getViewer();
+
+    $properties = id(new PHUIPropertyListView())
+      ->setUser($viewer);
+
     if ($event->getIsAllDay()) {
       $date_start = phabricator_date($event->getDateFrom(), $viewer);
       $date_end = phabricator_date($event->getDateTo(), $viewer);
@@ -362,16 +380,23 @@ final class PhabricatorCalendarEventViewController
       id(new PhabricatorCalendarIconSet())
         ->getIconLabel($event->getIcon()));
 
-    if (strlen($event->getDescription())) {
-      $description = new PHUIRemarkupView($viewer, $event->getDescription());
-      $properties->addSectionHeader(
-        pht('Description'),
-        PHUIPropertyListView::ICON_SUMMARY);
-
-      $properties->addTextContent($description);
-    }
-
     return $properties;
   }
 
+  private function buildDescriptionView(
+    PhabricatorCalendarEvent $event) {
+    $viewer = $this->getViewer();
+
+    $properties = id(new PHUIPropertyListView())
+      ->setUser($viewer);
+
+    if (strlen($event->getDescription())) {
+      $description = new PHUIRemarkupView($viewer, $event->getDescription());
+      $properties->addTextContent($description);
+      return $properties;
+    }
+
+    return null;
+  }
+
 }

src/view/phui/PHUIStatusItemView.php

@@ -83,17 +83,15 @@ final class PHUIStatusItemView extends AphrontTagView {
       }
     }
 
-    $icon_cell = phutil_tag(
-      'td',
-      array(),
-      $icon);
-
     $target_cell = phutil_tag(
       'td',
       array(
         'class' => 'phui-status-item-target',
       ),
-      $this->target);
+      array(
+        $icon,
+        $this->target,
+      ));
 
     $note_cell = phutil_tag(
       'td',
@@ -103,7 +101,6 @@ final class PHUIStatusItemView extends AphrontTagView {
       $this->note);
 
     return array(
-      $icon_cell,
       $target_cell,
       $note_cell,
     );

webroot/rsrc/css/phui/phui-status.css

@@ -7,10 +7,9 @@
 }
 
 .phui-status-list-view .phui-icon-view {
-  display: block;
   width: 14px;
   height: 14px;
-  margin: 3px 4px;
+  margin: 2px 4px 2px 0;
 }
 
 .phui-status-item-target {

webroot/rsrc/css/phui/phui-two-column-view.css

@@ -108,7 +108,7 @@
 
 .device-desktop .phui-main-column .phui-property-list-value {
   margin-left: 8px;
-  width: auto;
+  width: calc(100% - 180px);
 }