revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2025-01-15 17:21:10 +01:00
Code Issues Releases Wiki Activity

[Redesign] New PHUIObjectItemListView

Browse source 
Summary:
New, cleaner, ObjectItemLists. Lots of minor style tweaks, basic overview:

 - Remove FootIcons
 - Remove Stackable
 - Remove Plain List
 - Add StatusIcon
 - Add setting ObjectList to an ObjectBox
 - Minor retouches to Headers

Mostly, this should give us an idea of life with the new Object Lists. I'll take another application by application pass down the road. This mostly looks at implementation in Maniphest, Differential, Audit, Workboards. Checked a few other areas and dialogs while testing, and everything looks square.

Test Plan: Maniphest, Differential, Homepage, Audit, People, and other applications. Drag reorder, etc.

Reviewers: btrahan, epriestley

Reviewed By: epriestley

Subscribers: Korvin, epriestley

Differential Revision: https://secure.phabricator.com/D12865
This commit is contained in:
Chad Little 2015-05-15 13:28:59 -07:00
parent b1b97dddc7
commit 46f6c2680e
25 changed files with 280 additions and 315 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
resources/celerity/map.php
View file

@ -7,14 +7,14 @@
*/
return array(
'names' => array(
'core.pkg.css' => '50250d4f',
'core.pkg.css' => '178ec7e2',
'core.pkg.js' => 'f3e08b38',
'darkconsole.pkg.js' => 'e7393ebb',
'differential.pkg.css' => 'bb338e4b',
'differential.pkg.js' => '895b8d62',
'diffusion.pkg.css' => '591664fa',
'diffusion.pkg.js' => '0115b37c',
'maniphest.pkg.css' => '68d4dd3d',
'maniphest.pkg.css' => 'ddf93c68',
'maniphest.pkg.js' => 'df4aa49f',
'rsrc/css/aphront/aphront-bars.css' => '231ac33c',
'rsrc/css/aphront/dark-console.css' => '6378ef3d',
@ -74,10 +74,10 @@ return array(
'rsrc/css/application/harbormaster/harbormaster.css' => '49d64eb4',
'rsrc/css/application/herald/herald-test.css' => '778b008e',
'rsrc/css/application/herald/herald.css' => '826075fa',
'rsrc/css/application/maniphest/batch-editor.css' => '8f380ebc',
'rsrc/css/application/maniphest/batch-editor.css' => '9a5ed9c1',
'rsrc/css/application/maniphest/report.css' => 'f6931fdf',
'rsrc/css/application/maniphest/task-edit.css' => '8e23031b',
'rsrc/css/application/maniphest/task-summary.css' => 'ab2fc691',
'rsrc/css/application/maniphest/task-summary.css' => '307c88e9',
'rsrc/css/application/objectselector/object-selector.css' => '029a133d',
'rsrc/css/application/owners/owners-path-editor.css' => '2f00933b',
'rsrc/css/application/paste/paste.css' => 'eb997ddd',
@ -134,14 +134,14 @@ return array(
'rsrc/css/phui/phui-fontkit.css' => '1e71371a',
'rsrc/css/phui/phui-form-view.css' => 'e1abbe8e',
'rsrc/css/phui/phui-form.css' => 'f535f938',
'rsrc/css/phui/phui-header-view.css' => '5c0c1c39',
'rsrc/css/phui/phui-header-view.css' => 'c2855306',
'rsrc/css/phui/phui-icon.css' => 'bc766998',
'rsrc/css/phui/phui-image-mask.css' => '5a8b09c8',
'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
'rsrc/css/phui/phui-info-view.css' => '33595731',
'rsrc/css/phui/phui-list.css' => '2e25ebfb',
'rsrc/css/phui/phui-object-box.css' => '3a601bc5',
'rsrc/css/phui/phui-object-item-list-view.css' => 'c259c94f',
'rsrc/css/phui/phui-object-item-list-view.css' => 'e052f697',
'rsrc/css/phui/phui-pinboard-view.css' => 'eaab2b1b',
'rsrc/css/phui/phui-property-list-view.css' => 'd2d143ea',
'rsrc/css/phui/phui-remarkup-preview.css' => '19ad512b',
@ -685,10 +685,10 @@ return array(
'javelin-websocket' => 'e292eaf4',
'javelin-workflow' => '5b2e3e2b',
'lightbox-attachment-css' => '7acac05d',
'maniphest-batch-editor' => '8f380ebc',
'maniphest-batch-editor' => '9a5ed9c1',
'maniphest-report-css' => 'f6931fdf',
'maniphest-task-edit-css' => '8e23031b',
'maniphest-task-summary-css' => 'ab2fc691',
'maniphest-task-summary-css' => '307c88e9',
'multirow-row-manager' => 'b5d57730',
'owners-path-editor' => 'aa1733d0',
'owners-path-editor-css' => '2f00933b',
@ -769,7 +769,7 @@ return array(
'phui-fontkit-css' => '1e71371a',
'phui-form-css' => 'f535f938',
'phui-form-view-css' => 'e1abbe8e',
'phui-header-view-css' => '5c0c1c39',
'phui-header-view-css' => 'c2855306',
'phui-icon-view-css' => 'bc766998',
'phui-image-mask-css' => '5a8b09c8',
'phui-info-panel-css' => '27ea50a1',
@ -777,7 +777,7 @@ return array(
'phui-inline-comment-view-css' => '2174771a',
'phui-list-view-css' => '2e25ebfb',
'phui-object-box-css' => '3a601bc5',
'phui-object-item-list-view-css' => 'c259c94f',
'phui-object-item-list-view-css' => 'e052f697',
'phui-pinboard-view-css' => 'eaab2b1b',
'phui-property-list-view-css' => 'd2d143ea',
'phui-remarkup-preview-css' => '19ad512b',

5
src/applications/almanac/controller/AlmanacConsoleController.php
View file

@ -10,8 +10,7 @@ final class AlmanacConsoleController extends AlmanacController {
$viewer = $request->getViewer();
$menu = id(new PHUIObjectItemListView())
->setUser($viewer)
->setStackable(true);
->setUser($viewer);
$menu->addItem(
id(new PHUIObjectItemView())
@ -45,7 +44,7 @@ final class AlmanacConsoleController extends AlmanacController {
$box = id(new PHUIObjectBoxView())
->setHeaderText('Console')
->appendChild($menu);
->setObjectList($menu);
return $this->buildApplicationPage(
array(

5
src/applications/audit/view/PhabricatorAuditListView.php
View file

@ -148,7 +148,6 @@ final class PhabricatorAuditListView extends AphrontView {
->setObjectName($commit_name)
->setHeader($commit_desc)
->setHref($commit_link)
->setBarColor($status_color)
->addAttribute($status_text)
->addAttribute($reasons)
->addIcon('none', $committed)
@ -158,6 +157,10 @@ final class PhabricatorAuditListView extends AphrontView {
$item->addByLine(pht('Auditors: %s', $auditors));
}
if ($status_color) {
$item->setStatusIcon('fa-exclamation-triangle '.$status_color);
}
$list->addItem($item);
}

3
src/applications/config/controller/PhabricatorConfigGroupController.php
View file

@ -24,7 +24,7 @@ final class PhabricatorConfigGroupController
$box = id(new PHUIObjectBoxView())
->setHeaderText($title)
->appendChild($list);
->setObjectList($list);
$crumbs = $this
->buildApplicationCrumbs()
@ -63,7 +63,6 @@ final class PhabricatorConfigGroupController
$engine->process();
$list = new PHUIObjectItemListView();
$list->setStackable(true);
foreach ($options as $option) {
$summary = $engine->getOutput($option, 'summary');

1
src/applications/config/controller/PhabricatorConfigIssueListController.php
View file

@ -76,7 +76,6 @@ final class PhabricatorConfigIssueListController
private function buildIssueList(array $issues, $group) {
assert_instances_of($issues, 'PhabricatorSetupIssue');
$list = new PHUIObjectItemListView();
$list->setStackable(true);
$ignored_items = array();
$items = 0;

3
src/applications/config/controller/PhabricatorConfigListController.php
View file

@ -22,7 +22,7 @@ final class PhabricatorConfigListController
$apps = id(new PHUIObjectBoxView())
->setHeaderText(pht('Applications Configuration'))
->appendChild($apps_list);
->setObjectList($apps_list);
$nav->appendChild(
array(
@ -47,7 +47,6 @@ final class PhabricatorConfigListController
assert_instances_of($groups, 'PhabricatorApplicationConfigOptions');
$list = new PHUIObjectItemListView();
$list->setStackable(true);
$groups = msort($groups, 'getName');
foreach ($groups as $group) {
if ($group->getGroup() == $type) {

11
src/applications/differential/view/DifferentialRevisionListView.php
View file

@ -165,19 +165,24 @@ final class DifferentialRevisionListView extends AphrontView {
switch ($status) {
case ArcanistDifferentialRevisionStatus::NEEDS_REVIEW:
$item->setStatusIcon('fa-square-o black', pht('Needs Review'));
break;
case ArcanistDifferentialRevisionStatus::NEEDS_REVISION:
$item->setStatusIcon('fa-refresh red', pht('Needs Revision'));
break;
case ArcanistDifferentialRevisionStatus::CHANGES_PLANNED:
$item->setBarColor('red');
$item->setStatusIcon('fa-headphones red', pht('Changes Planned'));
break;
case ArcanistDifferentialRevisionStatus::ACCEPTED:
$item->setBarColor('green');
$item->setStatusIcon('fa-check green', pht('Accepted'));
break;
case ArcanistDifferentialRevisionStatus::CLOSED:
$item->setDisabled(true);
$item->setStatusIcon('fa-check-square-o black', pht('Closed'));
break;
case ArcanistDifferentialRevisionStatus::ABANDONED:
$item->setBarColor('black');
$item->setDisabled(true);
$item->setStatusIcon('fa-plane black', pht('Abandoned'));
break;
}

13
src/applications/home/controller/PhabricatorHomeMainController.php
View file

@ -152,7 +152,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController {
$title = pht('Unbreak Now!');
$panel = new PHUIObjectBoxView();
$panel->setHeader($this->renderSectionHeader($title, $href));
$panel->appendChild($this->buildTaskListView($tasks));
$panel->setObjectList($this->buildTaskListView($tasks));
return $panel;
}
@ -202,7 +202,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController {
$user->getPHID());
$panel = new PHUIObjectBoxView();
$panel->setHeader($this->renderSectionHeader($title, $href));
$panel->appendChild($this->buildTaskListView($tasks));
$panel->setObjectList($this->buildTaskListView($tasks));
return $panel;
}
@ -248,9 +248,8 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController {
$revision_view->setHandles($handles);
$list_view = $revision_view->render();
$list_view->setFlush(true);
$panel->appendChild($list_view);
$panel->setObjectList($list_view);
return $panel;
}
@ -290,7 +289,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController {
$href = '/maniphest/query/assigned/';
$panel = new PHUIObjectBoxView();
$panel->setHeader($this->renderSectionHeader($title, $href));
$panel->appendChild($this->buildTaskListView($tasks));
$panel->setObjectList($this->buildTaskListView($tasks));
return $panel;
}
@ -375,7 +374,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController {
$href = '/audit/';
$panel = new PHUIObjectBoxView();
$panel->setHeader($this->renderSectionHeader($title, $href));
$panel->appendChild($view);
$panel->setObjectList($view);
return $panel;
}
@ -414,7 +413,7 @@ final class PhabricatorHomeMainController extends PhabricatorHomeController {
$href = '/audit/';
$panel = new PHUIObjectBoxView();
$panel->setHeader($this->renderSectionHeader($title, $href));
$panel->appendChild($view);
$panel->setObjectList($view);
return $panel;
}

8
src/applications/maniphest/view/ManiphestTaskListView.php
View file

@ -41,7 +41,6 @@ final class ManiphestTaskListView extends ManiphestView {
require_celerity_resource('maniphest-task-summary-css');
$list = new PHUIObjectItemListView();
$list->setFlush(true);
if ($this->noDataString) {
$list->setNoDataString($this->noDataString);
@ -68,11 +67,14 @@ final class ManiphestTaskListView extends ManiphestView {
}
$status = $task->getStatus();
// TODO: redesign-2015 move icon map to maniphest.statuses
$icon = 'fa-exclamation-circle ';
$icon .= idx($color_map, $task->getPriority(), 'grey');
if ($task->isClosed()) {
$item->setDisabled(true);
$icon = 'fa-check-square-o grey';
}
$item->setBarColor(idx($color_map, $task->getPriority(), 'grey'));
$item->setStatusIcon($icon, idx($status_map, $task->getStatus()));
$item->addIcon(
'none',

49
src/applications/maniphest/view/ManiphestTaskResultListView.php
View file

@ -79,26 +79,16 @@ final class ManiphestTaskResultListView extends ManiphestView {
$task_list->setTasks($list);
$task_list->setHandles($handles);
$header = javelin_tag(
'h1',
array(
'class' => 'maniphest-task-group-header',
'sigil' => 'task-group',
'meta' => array(
'priority' => head($list)->getPriority(),
),
),
pht('%s (%s)', $group, new PhutilNumber(count($list))));
$header = id(new PHUIHeaderView())
->addClass('maniphest-task-group-header')
->addSigil('task-group')
->setMetadata(array('priority' => head($list)->getPriority()))
->setHeader(pht('%s (%s)', $group, new PhutilNumber(count($list))));
$lists[] = id(new PHUIObjectBoxView())
->setHeader($header)
->appendChild($task_list);
$lists[] = phutil_tag(
'div',
array(
'class' => 'maniphest-task-group',
),
array(
$header,
$task_list,
));
}
if ($can_drag) {
@ -109,15 +99,10 @@ final class ManiphestTaskResultListView extends ManiphestView {
));
}
return phutil_tag(
'div',
array(
'class' => 'maniphest-list-container',
),
array(
return array(
$lists,
$this->showBatchControls ? $this->renderBatchEditor($query) : null,
));
);
}
@ -251,8 +236,6 @@ final class ManiphestTaskResultListView extends ManiphestView {
'');
$editor = hsprintf(
'<div class="maniphest-batch-editor">'.
'<div class="batch-editor-header">%s</div>'.
'<table class="maniphest-batch-editor-layout">'.
'<tr>'.
'<td>%s%s</td>'.
@ -260,9 +243,7 @@ final class ManiphestTaskResultListView extends ManiphestView {
'<td id="batch-select-status-cell">%s</td>'.
'<td class="batch-select-submit-cell">%s%s</td>'.
'</tr>'.
'</table>'.
'</div>',
pht('Batch Task Editor'),
'</table>',
$select_all,
$select_none,
$export,
@ -279,6 +260,10 @@ final class ManiphestTaskResultListView extends ManiphestView {
),
$editor);
return $editor;
$box = id(new PHUIObjectBoxView())
->setHeaderText(pht('Batch Task Editor'))
->appendChild($editor);
return $box;
}
}

6
src/applications/phortune/controller/PhortuneAccountListController.php
View file

@ -27,7 +27,6 @@ final class PhortuneAccountListController extends PhortuneController {
$crumbs->addTextCrumb(pht('Accounts'));
$payment_list = id(new PHUIObjectItemListView())
->setStackable(true)
->setUser($viewer)
->setNoDataString(
pht(
@ -57,10 +56,9 @@ final class PhortuneAccountListController extends PhortuneController {
$payment_box = id(new PHUIObjectBoxView())
->setHeader($payment_header)
->appendChild($payment_list);
->setObjectList($payment_list);
$merchant_list = id(new PHUIObjectItemListView())
->setStackable(true)
->setUser($viewer)
->setNoDataString(
pht(
@ -90,7 +88,7 @@ final class PhortuneAccountListController extends PhortuneController {
$merchant_box = id(new PHUIObjectBoxView())
->setHeader($merchant_header)
->appendChild($merchant_list);
->setObjectList($merchant_list);
return $this->buildApplicationPage(
array(

9
src/applications/project/controller/PhabricatorProjectBoardReorderController.php
View file

@ -102,8 +102,7 @@ final class PhabricatorProjectBoardReorderController
$list = id(new PHUIObjectItemListView())
->setUser($viewer)
->setID($list_id)
->setFlush(true)
->setStackable(true);
->setFlush(true);
foreach ($columns as $column) {
$item = id(new PHUIObjectItemView())
@ -132,10 +131,14 @@ final class PhabricatorProjectBoardReorderController
'reorderURI' => $reorder_uri,
));
$note = id(new PHUIInfoView())
->appendChild(pht('Drag and drop columns to reorder them.'))
->setSeverity(PHUIInfoView::SEVERITY_NOTICE);
return $this->newDialog()
->setTitle(pht('Reorder Columns'))
->setWidth(AphrontDialogView::WIDTH_FORM)
->appendParagraph(pht('Drag and drop columns to reorder them.'))
->appendChild($note)
->appendChild($list)
->addSubmitButton(pht('Done'));
}

5
src/applications/project/controller/PhabricatorProjectMembersEditController.php
View file

@ -129,8 +129,7 @@ final class PhabricatorProjectMembersEditController
PhabricatorPolicyCapability::CAN_EDIT);
$list = id(new PHUIObjectItemListView())
->setNoDataString(pht('This project does not have any members.'))
->setStackable(true);
->setNoDataString(pht('This project does not have any members.'));
foreach ($handles as $handle) {
$remove_uri = $this->getApplicationURI(
@ -155,7 +154,7 @@ final class PhabricatorProjectMembersEditController
$box = id(new PHUIObjectBoxView())
->setHeaderText(pht('Members'))
->appendChild($list);
->setObjectList($list);
return $box;
}

3
src/applications/settings/panel/PhabricatorHomePreferencesSettingsPanel.php
View file

@ -126,8 +126,7 @@ final class PhabricatorHomePreferencesSettingsPanel
$list = id(new PHUIObjectItemListView())
->setUser($user)
->setID($list_id)
->setStackable(true);
->setID($list_id);
Javelin::initBehavior(
'reorder-applications',

3
src/applications/subscriptions/view/SubscriptionListDialogBuilder.php
View file

@ -53,7 +53,6 @@ final class SubscriptionListDialogBuilder {
return id(new AphrontDialogView())
->setUser($this->getViewer())
->setWidth(AphrontDialogView::WIDTH_FORM)
->setFlush(true)
->setTitle($this->getTitle())
->appendChild($this->buildBody($this->getViewer(), $handles))
->addCancelButton($object_handle->getURI(), pht('Close'));
@ -63,7 +62,7 @@ final class SubscriptionListDialogBuilder {
$list = id(new PHUIObjectItemListView())
->setUser($viewer)
->setStackable(true);
->setFlush(true);
foreach ($handles as $handle) {
$item = id(new PHUIObjectItemView())
->setHeader($handle->getFullName())

3
src/applications/tokens/controller/PhabricatorTokenGivenController.php
View file

@ -39,7 +39,6 @@ final class PhabricatorTokenGivenController extends PhabricatorTokenController {
}
$list = new PHUIObjectItemListView();
$list->setStackable(true);
foreach ($tokens_given as $token_given) {
$handle = $handles[$token_given->getObjectPHID()];
$token = idx($tokens, $token_given->getTokenPHID());
@ -62,7 +61,7 @@ final class PhabricatorTokenGivenController extends PhabricatorTokenController {
$box = id(new PHUIObjectBoxView())
->setHeaderText($title)
->appendChild($list);
->setObjectList($list);
$nav = $this->buildSideNav();
$nav->setCrumbs(

3
src/applications/tokens/controller/PhabricatorTokenLeaderController.php
View file

@ -30,7 +30,6 @@ final class PhabricatorTokenLeaderController
}
$list = new PHUIObjectItemListView();
$list->setStackable(true);
foreach ($phids as $object) {
$count = idx($counts, $object, 0);
$item = id(new PHUIObjectItemView());
@ -46,7 +45,7 @@ final class PhabricatorTokenLeaderController
$box = id(new PHUIObjectBoxView())
->setHeaderText($title)
->appendChild($list);
->setObjectList($list);
$nav = $this->buildSideNav();
$nav->setCrumbs(

153
src/applications/uiexample/examples/PHUIObjectItemListExample.php
View file

@ -22,14 +22,12 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
$out = array();
$head = id(new PHUIHeaderView())
->setHeader(pht('Basic List'));
$list = new PHUIObjectItemListView();
$list->addItem(
id(new PHUIObjectItemView())
->setObjectName('FRUIT1')
->setStatusIcon('fa-apple')
->setHeader(pht('Apple'))
->setHref('#'));
@ -45,22 +43,22 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
->setHeader(pht('Cherry'))
->setHref('#'));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Basic List')
->setObjectList($list);
$out[] = $box;
$head = id(new PHUIHeaderView())
->setHeader(pht('Empty List'));
$list = new PHUIObjectItemListView();
$list->setNoDataString(pht('This list is empty.'));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Empty List')
->setObjectList($list);
$out[] = $box;
$head = id(new PHUIHeaderView())
->setHeader(pht('Stacked List'));
$list = new PHUIObjectItemListView();
$list->setStackable(true);
$list->addItem(
id(new PHUIObjectItemView())
@ -79,56 +77,29 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
->setHeader(pht('Thursday'))
->setHref('#'));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Stacked List')
->setObjectList($list);
$head = id(new PHUIHeaderView())
->setHeader(pht('Plain List'));
$list = new PHUIObjectItemListView();
$list->setPlain(true);
$out[] = $box;
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Monday'))
->setSubHead('I love cats')
->setHref('#'));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Tuesday'))
->setSubHead('Cat, cats, cats')
->setHref('#'));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Wednesday'))
->setSubHead('Meow, meow, meow')
->setHref('#'));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Thursday'))
->setSubHead('Every single day')
->setHref('#'));
$out[] = array($head, $list);
$head = id(new PHUIHeaderView())
->setHeader(pht('Card List'));
$list = new PHUIObjectItemListView();
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Business Card'))
->setBarColor('red'));
->setStatusIcon('fa-warning red'));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Playing Card'))
->setBarColor('orange')
->setStatusIcon('fa-warning orange')
->addIcon('fa-comment', pht('Royal Flush!')));
$owner = phutil_tag('a', array('href' => '#'), pht('jackofclubs'));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('House of Cards'))
->setBarColor('yellow')
->setStatusIcon('fa-warning yellow')
->setDisabled(true)
->addByline(pht('Owner: %s', $owner)));
@ -136,67 +107,65 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Cardigan'))
->setBarColor('green')
->setStatusIcon('fa-check green')
->addIcon('fa-star', pht('Warm!'))
->addByline(pht('Author: %s', $author)));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Cardamom'))
->addFootIcon('fa-shield white', 'Spice')
->setBarColor('blue'));
->setStatusIcon('fa-check blue'));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht(
'The human cardiovascular system includes the heart, lungs, and '.
'some other parts; most of these parts are pretty squishy'))
->addFootIcon('fa-search white', pht('Respiration!'))
->addHandleIcon($handle, pht('You have a cardiovascular system!'))
->setBarColor('indigo'));
->setStatusIcon('fa-check indigo'));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Card List')
->setObjectList($list);
$out[] = $box;
$head = id(new PHUIHeaderView())
->setHeader(pht('Grippable List'));
$list = new PHUIObjectItemListView();
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Grab ahold!'))
->setHref('#')
->setGrippable(true)
->setBarColor('red'));
->setGrippable(true));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('Hold on tight!'))
->setHref('#')
->setGrippable(true)
->setBarColor('yellow'));
->setGrippable(true));
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht("Don't let go!"))
->setHref('#')
->setGrippable(true)
->setBarColor('green')
->addAction(
id(new PHUIListItemView())
->setHref('#')
->setIcon('fa-times')));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Grippable List')
->setObjectList($list);
$out[] = $box;
$head = id(new PHUIHeaderView())
->setHeader(pht('List With Actions'));
$list = new PHUIObjectItemListView();
$list->addItem(
id(new PHUIObjectItemView())
->setHeader(pht('You Have The Power'))
->setHref('#')
->setBarColor('blue')
->setStatusIcon('fa-circle-o blue')
->addAction(
id(new PHUIListItemView())
->setHref('#')
@ -207,7 +176,7 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
id(new PHUIObjectItemView())
->setHeader(pht('Believe In Yourself'))
->setHref('#')
->setBarColor('violet')
->setStatusIcon('fa-circle-o violet')
->addAction(
id(new PHUIListItemView())
->setHref('#')
@ -219,8 +188,9 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
->setName(pht('Oink'))
->setIcon('fa-times')));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Action Link List')
->setObjectList($list);
$head = id(new PHUIHeaderView())
->setHeader(pht('Extras'));
@ -237,8 +207,6 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
->addAttribute(pht('Rank: Ace'))
->addIcon('fa-heart', pht('Ace'))
->addIcon('fa-heart red', pht('Hearts'))
->addFootIcon('fa-heart white', pht('Ace'))
->addFootIcon('fa-heart white', pht('Heart'))
->addHandleIcon($handle, pht('You hold all the cards.'))
->addHandleIcon($handle, pht('You make all the rules.')));
@ -264,11 +232,11 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
->addIcon('fa-circle green', pht('Stuff'))
->addHandleIcon($handle, pht('More Stuff')));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Action List')
->setObjectList($list);
$head = id(new PHUIHeaderView())
->setHeader(pht('Effects'));
$out[] = $box;
$list = new PHUIObjectItemListView();
@ -299,11 +267,11 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
->setDisabled(true)
->setHref('#'));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Extra Things and Stuff')
->setObjectList($list);
$head = id(new PHUIHeaderView())
->setHeader(pht('Colors'));
$out[] = $box;
$list = new PHUIObjectItemListView();
@ -325,16 +293,17 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
$list->addItem(
id(new PHUIObjectItemView())
->setHeader($bar_label)
->setBarColor($bar_color));
->setStatusIcon('fa-bell '.$bar_color));
}
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Color Icons')
->setObjectList($list);
$head = id(new PHUIHeaderView())
->setHeader(pht('Images'));
$out[] = $box;
$list = new PHUIObjectItemListView();
$list->setFlush(true);
$default_profile = PhabricatorFile::loadBuiltin($user, 'profile.png');
$default_project = PhabricatorFile::loadBuiltin($user, 'project.png');
@ -343,11 +312,18 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
id(new PHUIObjectItemView())
->setImageURI($default_profile->getViewURI())
->setHeader(pht('Default User Profile Image'))
->setBarColor('violet')
->addAction(
id(new PHUIListItemView())
->setHref('#')
->setIcon('fa-plus-square')));
->setIcon('fa-pencil-square'))
->addAction(
id(new PHUIListItemView())
->setHref('#')
->setIcon('fa-plus-square'))
->addAction(
id(new PHUIListItemView())
->setHref('#')
->setIcon('fa-minus-square')));
$list->addItem(
id(new PHUIObjectItemView())
@ -356,10 +332,11 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
->setGrippable(true)
->addAttribute(pht('This is the default project profile image.')));
$out[] = array($head, $list);
$box = id(new PHUIObjectBoxView())
->setHeaderText('Profile Images')
->setObjectList($list);
$head = id(new PHUIHeaderView())
->setHeader(pht('States'));
$out[] = $box;
$list = id(new PHUIObjectItemListView())
->setStates(true);
@ -405,10 +382,10 @@ final class PHUIObjectItemListExample extends PhabricatorUIExample {
->setState(PHUIObjectItemView::STATE_BUILD));
$box = id(new PHUIObjectBoxView())
->setHeaderText('Test Things')
->appendChild($list);
->setHeaderText('State Icons')
->setObjectList($list);
$out[] = array($head, $box);
$out[] = array($box);
return $out;
}

10
src/view/phui/PHUIObjectBoxView.php
View file

@ -15,6 +15,7 @@ final class PHUIObjectBoxView extends AphrontView {
private $sigils = array();
private $metadata;
private $actionListID;
private $objectList;
private $tabs = array();
private $propertyLists = array();
@ -138,6 +139,11 @@ final class PHUIObjectBoxView extends AphrontView {
return $this;
}
public function setObjectList($list) {
$this->objectList = $list;
return $this;
}
public function setValidationException(
PhabricatorApplicationTransactionValidationException $ex = null) {
$this->validationException = $ex;
@ -313,6 +319,10 @@ final class PHUIObjectBoxView extends AphrontView {
$content->setMetadata($this->metadata);
}
if ($this->objectList) {
$content->appendChild($this->objectList);
}
return $content;
}
}

20
src/view/phui/PHUIObjectItemListView.php
View file

@ -5,14 +5,11 @@ final class PHUIObjectItemListView extends AphrontTagView {
private $header;
private $items;
private $pager;
private $stackable;
private $noDataString;
private $flush;
private $plain;
private $allowEmptyList;
private $states;
public function setAllowEmptyList($allow_empty_list) {
$this->allowEmptyList = $allow_empty_list;
return $this;
@ -27,11 +24,6 @@ final class PHUIObjectItemListView extends AphrontTagView {
return $this;
}
public function setPlain($plain) {
$this->plain = $plain;
return $this;
}
public function setHeader($header) {
$this->header = $header;
return $this;
@ -52,11 +44,6 @@ final class PHUIObjectItemListView extends AphrontTagView {
return $this;
}
public function setStackable($stackable) {
$this->stackable = $stackable;
return $this;
}
public function setStates($states) {
$this->states = $states;
return $this;
@ -70,19 +57,12 @@ final class PHUIObjectItemListView extends AphrontTagView {
$classes = array();
$classes[] = 'phui-object-item-list-view';
if ($this->stackable) {
$classes[] = 'phui-object-list-stackable';
}
if ($this->states) {
$classes[] = 'phui-object-list-states';
$classes[] = 'phui-object-list-stackable';
}
if ($this->flush) {
$classes[] = 'phui-object-list-flush';
}
if ($this->plain) {
$classes[] = 'phui-object-list-plain';
}
return array(
'class' => $classes,

78
src/view/phui/PHUIObjectItemView.php
View file

@ -11,7 +11,7 @@ final class PHUIObjectItemView extends AphrontTagView {
private $barColor;
private $object;
private $effect;
private $footIcons = array();
private $statusIcon;
private $handleIcons = array();
private $bylines = array();
private $grippable;
@ -212,8 +212,8 @@ final class PHUIObjectItemView extends AphrontTagView {
return $this;
}
public function addFootIcon($icon, $label = null) {
$this->footIcons[] = array(
public function setStatusIcon($icon, $label = null) {
$this->statusIcon = array(
'icon' => $icon,
'label' => $label,
);
@ -270,10 +270,6 @@ final class PHUIObjectItemView extends AphrontTagView {
$item_classes[] = 'phui-object-item-bar-color-'.$this->barColor;
}
if ($this->footIcons) {
$item_classes[] = 'phui-object-item-with-foot-icons';
}
if ($this->actions) {
$n = count($this->actions);
$item_classes[] = 'phui-object-item-with-actions';
@ -426,8 +422,9 @@ final class PHUIObjectItemView extends AphrontTagView {
if ($this->handleIcons) {
$handle_bar = array();
foreach ($this->handleIcons as $icon) {
$handle_bar[] = $this->renderHandleIcon($icon['icon'], $icon['label']);
foreach ($this->handleIcon as $handleicon) {
$handle_bar[] =
$this->renderHandleIcon($handleicon['icon'], $handleicon['label']);
}
$icons[] = phutil_tag(
'div',
@ -505,18 +502,10 @@ final class PHUIObjectItemView extends AphrontTagView {
$attrs);
}
$foot = null;
if ($this->footIcons) {
$foot_bar = array();
foreach ($this->footIcons as $icon) {
$foot_bar[] = $this->renderFootIcon($icon['icon'], $icon['label']);
}
$foot = phutil_tag(
'div',
array(
'class' => 'phui-object-item-foot-icons',
),
$foot_bar);
$status = null;
if ($this->statusIcon) {
$icon = $this->statusIcon;
$status = $this->renderStatusIcon($icon['icon'], $icon['label']);
}
$grippable = null;
@ -538,7 +527,6 @@ final class PHUIObjectItemView extends AphrontTagView {
$subhead,
$attrs,
$this->renderChildren(),
$foot,
));
$image = null;
@ -579,6 +567,16 @@ final class PHUIObjectItemView extends AphrontTagView {
}
/* Build a fake table */
$column0 = null;
if ($status) {
$column0 = phutil_tag(
'div',
array(
'class' => 'phui-object-item-col0',
),
$status);
}
$column1 = phutil_tag(
'div',
array(
@ -607,7 +605,13 @@ final class PHUIObjectItemView extends AphrontTagView {
array(
'class' => 'phui-object-item-table',
),
phutil_tag_div('phui-object-item-table-row', array($column1, $column2)));
phutil_tag_div(
'phui-object-item-table-row',
array(
$column0,
$column1,
$column2,
)));
$box = phutil_tag(
'div',
@ -647,23 +651,22 @@ final class PHUIObjectItemView extends AphrontTagView {
));
}
private function renderFootIcon($icon, $label) {
private function renderStatusIcon($icon, $label) {
Javelin::initBehavior('phabricator-tooltips');
$icon = id(new PHUIIconView())
->setIconFont($icon);
$label = phutil_tag(
'span',
array(
),
$label);
$options = array(
'class' => 'phui-object-item-status-icon',
);
return phutil_tag(
'span',
array(
'class' => 'phui-object-item-foot-icon',
),
array($icon, $label));
if (strlen($label)) {
$options['sigil'] = 'has-tooltip';
$options['meta'] = array('tip' => $label);
}
return javelin_tag('div', $options, $icon);
}
@ -680,10 +683,7 @@ final class PHUIObjectItemView extends AphrontTagView {
$options['meta'] = array('tip' => $label);
}
return javelin_tag(
'span',
$options,
'');
return javelin_tag('span', $options, '');
}

2
webroot/rsrc/css/application/maniphest/batch-editor.css
View file

@ -4,7 +4,7 @@
.maniphest-batch-actions-table {
width: 100%;
margin: 1em 0;
margin: 12px 0;
}
.maniphest-batch-actions-table td {

41
webroot/rsrc/css/application/maniphest/task-summary.css
View file

@ -2,14 +2,6 @@
* @provides maniphest-task-summary-css
*/
.maniphest-task-group + .maniphest-task-group {
padding-top: 24px;
}
.maniphest-batch-selected td {
background: #fff;
}
.device-phone .maniphest-task-batch,
.device-phone .maniphest-task-updated {
display: none;
@ -17,8 +9,8 @@
.maniphest-task-group-header {
font-size: 16px;
font-weight: bold;
color: {$darkgreytext};
font-weight: normal;
color: {$darkbluetext};
padding: 0 0 8px 0;
}
@ -33,31 +25,12 @@
padding-right: 5px;
}
.batch-editor-header {
font-size: 16px;
color: {$darkgreytext};
padding: 8px 0px;
font-weight: bold;
}
/* TODO: Implement */
.device-phone .maniphest-batch-editor {
display: none;
}
.maniphest-batch-editor {
padding-top: 24px;
}
.maniphest-batch-editor-layout {
width: 100%;
border: 1px solid #e7e7e7;
border-bottom: 1px solid {$greyborder};
background: #fff;
}
.maniphest-batch-editor-layout td {
padding: 10px 8px;
padding: 12px 4px 8px;
white-space: nowrap;
}
@ -78,14 +51,6 @@
width: 100%;
}
.maniphest-list-container {
padding: 16px;
}
.device-phone .maniphest-list-container {
padding: 20px 8px;
}
.maniphest-board-link {
color: {$bluetext};
}

6
webroot/rsrc/css/phui/phui-header-view.css
View file

@ -46,6 +46,12 @@ body .phui-header-shell.phui-bleed-header
position: relative;
}
.phui-object-box .phui-header-tall h1.phui-header-view,
.phui-document-view .phui-header-tall h1.phui-header-view {
font-size: 18px;
font-weight: 500;
}
.phui-header-view a,
.phui-header-view a.simple {
color: {$darkbluetext};

131
webroot/rsrc/css/phui/phui-object-item-list-view.css
View file

@ -17,9 +17,10 @@ ul.phui-object-item-list-view {
.phui-object-item-list-view.phui-object-list-flush {
padding: 0;
margin: 0;
}
.phui-object-box .phui-object-list-flush .phui-object-item,
.phui-object-box .phui-object-item-list-view .phui-object-item,
.homepage-panel .phui-object-list-flush .phui-object-item {
margin: 0;
}
@ -62,6 +63,12 @@ ul.phui-object-item-list-view {
margin: 0;
}
.phui-object-item-status-icon {
font-weight: bold;
padding: 0 8px;
font-size: 16px;
}
.phui-object-item-name {
font-weight: bold;
padding: 8px 8px 0;
@ -134,6 +141,12 @@ ul.phui-object-item-list-view {
display: table-row;
}
.phui-object-item-col0 {
width: 24px;
display: table-cell;
vertical-align: middle;
}
.phui-object-item-col1 {
display: table-cell;
vertical-align: top;
@ -159,12 +172,11 @@ ul.phui-object-item-list-view {
.phui-object-item-actions {
position: absolute;
right: 0;
top: 0;
bottom: 0;
right: 4px;
top: 4px;
bottom: 4px;
vertical-align: middle;
text-align: right;
border-left: 1px solid {$lightgreyborder};
}
.phui-object-item-actions .phui-list-item-view {
@ -175,11 +187,6 @@ ul.phui-object-item-list-view {
position: relative;
}
.phui-object-item-actions .phui-list-item-view +
.phui-list-item-view {
border-right: 1px solid #d6d6e9;
}
.phui-object-item-actions .phui-list-item-href {
display: inline-block;
position: relative;
@ -189,6 +196,7 @@ ul.phui-object-item-list-view {
.device-desktop .phui-object-item-actions .phui-list-item-href:hover {
background: {$hoverblue};
border-radius: 3px;
}
.phui-object-item-actions .phui-list-item-icon {
@ -221,27 +229,21 @@ ul.phui-object-item-list-view {
}
/* - Stackable List ------------------------------------------------------------
/* - Object Box List -----------------------------------------------------------
Tighter, stacking list.
Tighter, stacking list when inside an Object Box
*/
.phui-object-item-list-view.phui-object-list-stackable
.phui-object-item {
margin: -1px 0 0 0;
background: #fff;
}
.phui-object-box .phui-object-list-stackable {
.phui-object-box .phui-object-item-list-view {
padding: 0;
}
.phui-object-box .phui-object-list-stackable .phui-object-item {
.phui-object-box .phui-object-item-list-view {
border: none;
}
.phui-object-box .phui-object-list-stackable .phui-object-item-frame {
.phui-object-box .phui-object-item-frame {
border-right: none;
}
@ -346,15 +348,66 @@ ul.phui-object-item-icons {
margin-right: 4px;
}
/* - Bar Colors ----------------------------------------------------------------
Colors for the left-hand border bars, used to indicate object status or other
attributes.
*/
.phui-workboard-view .phui-object-item {
border-left-width: 4px;
}
.phui-object-item {
border-left-width: 0;
}
.phui-object-item-bar-color-red {
border-left-color: {$red};
}
.phui-object-item-bar-color-orange {
border-left-color: {$orange};
}
.phui-object-item-bar-color-yellow {
border-left-color: {$yellow};
}
.phui-object-item-bar-color-green {
border-left-color: {$green};
}
.phui-object-item-bar-color-sky {
border-left-color: {$sky};
}
.phui-object-item-bar-color-blue {
border-left-color: {$blue};
}
.phui-object-item-bar-color-indigo {
border-left-color: {$indigo};
}
.phui-object-item-bar-color-violet {
border-left-color: {$violet};
}
.phui-object-item-bar-color-grey {
border-left-color: #bdc3c7;
}
.phui-object-item-bar-color-black {
border-left-color: #333333;
}
/* - Disabled ------------------------------------------------------------------
Disabled/inactive objects.
*/
.phui-object-item-disabled {
border-left-color: #d7d7d7;
}
.phui-object-item-disabled .phui-object-item-link,
.phui-object-item-disabled .phui-object-item-link a {
@ -378,19 +431,19 @@ ul.phui-object-item-icons {
*/
.phui-object-item.phui-object-item-highlighted {
background: {$lightyellow};
background: {$sh-yellowbackground};
}
.phui-object-item-highlighted .phui-object-item-frame {
border-color: {$yellow};
border-color: {$sh-yellowborder};
}
.phui-object-item-selected {
background: {$lightblue};
background: {$sh-bluebackground};
}
.phui-object-item-selected .phui-object-item-frame {
border-color: {$blue};
border-color: {$sh-blueborder};
}
@ -495,26 +548,14 @@ ul.phui-object-item-icons {
.drag-ghost {
position: relative;
border: 1px dashed #fff;
background: rgba(255,255,255,.5);
background: {$lightgreybackground};
margin-bottom: 4px;
}
.phui-object-list-stackable .drag-ghost {
background: {$hoverblue};
margin: 0;
border: none;
border-top: 1px solid {$lightgreyborder}
}
.drag-dragging {
position: relative;
opacity: 0.85;
}
.phui-object-box .phui-object-list-stackable .drag-dragging
.phui-object-item-frame {
border-bottom: 1px solid {$lightgreyborder};
background: {$sh-bluebackground};
opacity: 0.9;
}
.drag-sending {
@ -598,14 +639,14 @@ ul.phui-object-item-icons {
}
.dashboard-panel .phui-object-item-list-view .phui-object-item,
.phui-object-box .phui-object-item-list-view.phui-object-list-flush {
.phui-object-box .phui-object-item-list-view {
margin: 0;
background-image: none;
background-color: #fff;
}
.dashboard-panel .phui-object-item-frame,
.phui-object-box .phui-object-list-flush .phui-object-item-frame {
.phui-object-box .phui-object-item-list-view .phui-object-item-frame {
border: none;
border-bottom: 1px solid {$thinblueborder};
}