Page Menu
Home
Phabricator
Search
Configure Global Search
Log In
Files
F15399044
D21418.id50963.diff
No One
Temporary
Actions
View File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Flag For Later
Size
13 KB
Referenced Files
None
Subscribers
None
D21418.id50963.diff
View Options
diff --git a/resources/celerity/map.php b/resources/celerity/map.php
--- a/resources/celerity/map.php
+++ b/resources/celerity/map.php
@@ -121,6 +121,8 @@
'rsrc/css/font/font-awesome.css' => '3883938a',
'rsrc/css/font/font-lato.css' => '23631304',
'rsrc/css/font/phui-font-icon-base.css' => '303c9b87',
+ 'rsrc/css/fuel/fuel-grid.css' => 'd87031e7',
+ 'rsrc/css/fuel/fuel-map.css' => 'd6e31510',
'rsrc/css/layout/phabricator-source-code-view.css' => '03d7ac28',
'rsrc/css/phui/button/phui-button-bar.css' => 'a4aa75c4',
'rsrc/css/phui/button/phui-button-simple.css' => '1ff278aa',
@@ -574,6 +576,8 @@
'diviner-shared-css' => '4bd263b0',
'font-fontawesome' => '3883938a',
'font-lato' => '23631304',
+ 'fuel-grid-css' => 'd87031e7',
+ 'fuel-map-css' => 'd6e31510',
'global-drag-and-drop-css' => '1d2713a4',
'harbormaster-css' => '8dfe16b2',
'herald-css' => '648d39e2',
diff --git a/src/__phutil_library_map__.php b/src/__phutil_library_map__.php
--- a/src/__phutil_library_map__.php
+++ b/src/__phutil_library_map__.php
@@ -1305,6 +1305,13 @@
'FlagDeleteConduitAPIMethod' => 'applications/flag/conduit/FlagDeleteConduitAPIMethod.php',
'FlagEditConduitAPIMethod' => 'applications/flag/conduit/FlagEditConduitAPIMethod.php',
'FlagQueryConduitAPIMethod' => 'applications/flag/conduit/FlagQueryConduitAPIMethod.php',
+ 'FuelComponentView' => 'view/fuel/FuelComponentView.php',
+ 'FuelGridCellView' => 'view/fuel/FuelGridCellView.php',
+ 'FuelGridRowView' => 'view/fuel/FuelGridRowView.php',
+ 'FuelGridView' => 'view/fuel/FuelGridView.php',
+ 'FuelMapItemView' => 'view/fuel/FuelMapItemView.php',
+ 'FuelMapView' => 'view/fuel/FuelMapView.php',
+ 'FuelView' => 'view/fuel/FuelView.php',
'FundBacker' => 'applications/fund/storage/FundBacker.php',
'FundBackerCart' => 'applications/fund/phortune/FundBackerCart.php',
'FundBackerEditor' => 'applications/fund/editor/FundBackerEditor.php',
@@ -7439,6 +7446,13 @@
'FlagDeleteConduitAPIMethod' => 'FlagConduitAPIMethod',
'FlagEditConduitAPIMethod' => 'FlagConduitAPIMethod',
'FlagQueryConduitAPIMethod' => 'FlagConduitAPIMethod',
+ 'FuelComponentView' => 'FuelView',
+ 'FuelGridCellView' => 'FuelView',
+ 'FuelGridRowView' => 'FuelView',
+ 'FuelGridView' => 'FuelComponentView',
+ 'FuelMapItemView' => 'AphrontView',
+ 'FuelMapView' => 'FuelComponentView',
+ 'FuelView' => 'AphrontView',
'FundBacker' => array(
'FundDAO',
'PhabricatorPolicyInterface',
diff --git a/src/applications/diffusion/view/DiffusionCommitGraphView.php b/src/applications/diffusion/view/DiffusionCommitGraphView.php
--- a/src/applications/diffusion/view/DiffusionCommitGraphView.php
+++ b/src/applications/diffusion/view/DiffusionCommitGraphView.php
@@ -164,21 +164,23 @@
$this->addAuditAction($item_view, $hash);
if ($show_auditors) {
- $auditor_list = $item_view->newPropertyList();
+ $auditor_list = $item_view->newMapView();
if ($commit) {
$auditors = $this->newAuditorList($commit, $handles);
- $auditor_list->addProperty(pht('Auditors'), $auditors);
+ $auditor_list->newItem()
+ ->setName(pht('Auditors'))
+ ->setValue($auditors);
}
}
- $property_list = $item_view->newPropertyList();
+ $property_list = $item_view->newMapView();
if ($commit) {
$author_view = $this->getCommitAuthorView($commit);
if ($author_view) {
- $property_list->addProperty(
- pht('Author'),
- $this->getCommitAuthorView($commit));
+ $property_list->newItem()
+ ->setName(pht('Author'))
+ ->setValue($author_view);
}
}
@@ -189,9 +191,9 @@
$revision = head($revisions);
$handle = $handles[$revision->getPHID()];
- $property_list->addProperty(
- pht('Revision'),
- $handle->renderLink());
+ $property_list->newItem()
+ ->setName(pht('Revision'))
+ ->setValue($handle->renderLink());
}
}
}
diff --git a/src/view/fuel/FuelComponentView.php b/src/view/fuel/FuelComponentView.php
new file mode 100644
--- /dev/null
+++ b/src/view/fuel/FuelComponentView.php
@@ -0,0 +1,35 @@
+<?php
+
+abstract class FuelComponentView
+ extends FuelView {
+
+ private $classes = array();
+
+ final public function addClass($class) {
+ $this->classes[] = $class;
+ return $this;
+ }
+
+ private function getClasses() {
+ return $this->classes;
+ }
+
+ final protected function newComponentTag(
+ $tag,
+ array $attributes,
+ $content) {
+
+ $classes = $this->getClasses();
+ if (isset($attributes['class'])) {
+ $classes[] = $attributes['class'];
+ }
+
+ if ($classes) {
+ $classes = implode(' ', $classes);
+ $attributes['class'] = $classes;
+ }
+
+ return javelin_tag($tag, $attributes, $content);
+ }
+
+}
diff --git a/src/view/fuel/FuelGridCellView.php b/src/view/fuel/FuelGridCellView.php
new file mode 100644
--- /dev/null
+++ b/src/view/fuel/FuelGridCellView.php
@@ -0,0 +1,28 @@
+<?php
+
+final class FuelGridCellView
+ extends FuelView {
+
+ private $content;
+
+ public function setContent($content) {
+ $this->content = $content;
+ return $this;
+ }
+
+ public function getContent() {
+ return $this->content;
+ }
+
+ public function render() {
+ $content = $this->getContent();
+
+ return phutil_tag(
+ 'div',
+ array(
+ 'class' => 'fuel-grid-cell',
+ ),
+ $content);
+ }
+
+}
diff --git a/src/view/fuel/FuelGridRowView.php b/src/view/fuel/FuelGridRowView.php
new file mode 100644
--- /dev/null
+++ b/src/view/fuel/FuelGridRowView.php
@@ -0,0 +1,32 @@
+<?php
+
+final class FuelGridRowView
+ extends FuelView {
+
+ private $cells = array();
+
+ public function newCell() {
+ $cell = new FuelGridCellView();
+ $this->cells[] = $cell;
+ return $cell;
+ }
+
+ public function render() {
+ $cells = $this->cells;
+
+ $classes = array();
+ $classes[] = 'fuel-grid-row';
+
+ $classes[] = sprintf(
+ 'fuel-grid-cell-count-%d',
+ count($cells));
+
+ return phutil_tag(
+ 'div',
+ array(
+ 'class' => implode(' ', $classes),
+ ),
+ $cells);
+ }
+
+}
diff --git a/src/view/fuel/FuelGridView.php b/src/view/fuel/FuelGridView.php
new file mode 100644
--- /dev/null
+++ b/src/view/fuel/FuelGridView.php
@@ -0,0 +1,41 @@
+<?php
+
+final class FuelGridView
+ extends FuelComponentView {
+
+ private $rows = array();
+
+ public function newRow() {
+ $row = new FuelGridRowView();
+ $this->rows[] = $row;
+ return $row;
+ }
+
+ public function render() {
+ require_celerity_resource('fuel-grid-css');
+
+ $rows = $this->rows;
+
+ $body = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'fuel-grid-body',
+ ),
+ $rows);
+
+ $grid = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'fuel-grid',
+ ),
+ $body);
+
+ return $this->newComponentTag(
+ 'div',
+ array(
+ 'class' => 'fuel-grid-component',
+ ),
+ $grid);
+ }
+
+}
diff --git a/src/view/fuel/FuelMapItemView.php b/src/view/fuel/FuelMapItemView.php
new file mode 100644
--- /dev/null
+++ b/src/view/fuel/FuelMapItemView.php
@@ -0,0 +1,54 @@
+<?php
+
+final class FuelMapItemView
+ extends AphrontView {
+
+ private $name;
+ private $value;
+
+ public function setName($name) {
+ $this->name = $name;
+ return $this;
+ }
+
+ public function getName() {
+ return $this->name;
+ }
+
+ public function setValue($value) {
+ $this->value = $value;
+ return $this;
+ }
+
+ public function getValue() {
+ return $this->value;
+ }
+
+ public function render() {
+ $value = $this->getValue();
+
+ $view = array();
+
+ $view[] = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'fuel-map-name',
+ ),
+ $this->getName());
+
+ $view[] = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'fuel-map-value',
+ ),
+ $value);
+
+ return phutil_tag(
+ 'div',
+ array(
+ 'class' => 'fuel-map-pair',
+ ),
+ $view);
+ }
+
+}
diff --git a/src/view/fuel/FuelMapView.php b/src/view/fuel/FuelMapView.php
new file mode 100644
--- /dev/null
+++ b/src/view/fuel/FuelMapView.php
@@ -0,0 +1,45 @@
+<?php
+
+final class FuelMapView
+ extends FuelComponentView {
+
+ private $items = array();
+
+ public function newItem() {
+ $item = new FuelMapItemView();
+ $this->items[] = $item;
+ return $item;
+ }
+
+ public function render() {
+ require_celerity_resource('fuel-map-css');
+
+ $items = $this->items;
+
+ if (!$items) {
+ return null;
+ }
+
+ $body = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'fuel-map-items',
+ ),
+ $items);
+
+ $map = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'fuel-map',
+ ),
+ $body);
+
+ return $this->newComponentTag(
+ 'div',
+ array(
+ 'class' => 'fuel-map-component',
+ ),
+ $map);
+ }
+
+}
diff --git a/src/view/fuel/FuelView.php b/src/view/fuel/FuelView.php
new file mode 100644
--- /dev/null
+++ b/src/view/fuel/FuelView.php
@@ -0,0 +1,10 @@
+<?php
+
+abstract class FuelView
+ extends AphrontView {
+
+ final protected function canAppendChild() {
+ return false;
+ }
+
+}
diff --git a/src/view/phui/PHUIObjectItemView.php b/src/view/phui/PHUIObjectItemView.php
--- a/src/view/phui/PHUIObjectItemView.php
+++ b/src/view/phui/PHUIObjectItemView.php
@@ -30,7 +30,7 @@
private $coverImage;
private $description;
private $clickable;
- private $propertyLists = array();
+ private $mapViews = array();
private $selectableName;
private $selectableValue;
@@ -220,9 +220,10 @@
return $action;
}
- public function newPropertyList() {
- $list = new PHUIPropertyListView();
- $this->propertyLists[] = $list;
+ public function newMapView() {
+ $list = id(new FuelMapView())
+ ->addClass('fuel-map-property-list');
+ $this->mapViews[] = $list;
return $list;
}
@@ -612,12 +613,18 @@
'');
}
- $property_lists = null;
- if ($this->propertyLists) {
- $property_lists[] = phutil_tag(
- 'div',
- array(),
- $this->propertyLists);
+ $map_views = null;
+ if ($this->mapViews) {
+ $grid = id(new FuelGridView())
+ ->addClass('fuel-grid-property-list');
+
+ $row = $grid->newRow();
+ foreach ($this->mapViews as $map_view) {
+ $row->newCell()
+ ->setContent($map_view);
+ }
+
+ $map_views = $grid;
}
$content = phutil_tag(
@@ -628,7 +635,7 @@
array(
$subhead,
$attrs,
- $property_lists,
+ $map_views,
$this->renderChildren(),
));
diff --git a/webroot/rsrc/css/fuel/fuel-grid.css b/webroot/rsrc/css/fuel/fuel-grid.css
new file mode 100644
--- /dev/null
+++ b/webroot/rsrc/css/fuel/fuel-grid.css
@@ -0,0 +1,29 @@
+/**
+ * @provides fuel-grid-css
+ */
+
+.device-desktop .fuel-grid {
+ display: table;
+ table-layout: fixed;
+}
+
+.device-desktop .fuel-grid-body {
+ display: table-row-group;
+}
+
+.device-desktop .fuel-grid-row {
+ display: table-row;
+}
+
+.device-desktop .fuel-grid-cell {
+ display: table-cell;
+ vertical-align: top;
+}
+
+.device-desktop .fuel-grid-cell-count-2 > .fuel-grid-cell {
+ width: 50%;
+}
+
+.fuel-grid-property-list > .fuel-grid {
+ width: 100%;
+}
diff --git a/webroot/rsrc/css/fuel/fuel-map.css b/webroot/rsrc/css/fuel/fuel-map.css
new file mode 100644
--- /dev/null
+++ b/webroot/rsrc/css/fuel/fuel-map.css
@@ -0,0 +1,71 @@
+/**
+ * @provides fuel-map-css
+ */
+
+.device-desktop .fuel-map {
+ display: table;
+ table-layout: fixed;
+}
+
+.device-desktop .fuel-map-items {
+ display: table-row-group;
+}
+
+.device-desktop .fuel-map-pair {
+ display: table-row;
+}
+
+.device-desktop .fuel-map-name,
+.device-desktop .fuel-map-value {
+ display: table-cell;
+ vertical-align: top;
+}
+
+.fuel-map-property-list {
+ margin: 4px;
+}
+
+.fuel-map-property-list > .fuel-map {
+ overflow: hidden;
+ width: 100%;
+ max-width: 100%;
+}
+
+.fuel-map-property-list > .fuel-map > .fuel-map-items > .fuel-map-pair >
+ .fuel-map-name,
+.fuel-map-property-list > .fuel-map > .fuel-map-items > .fuel-map-pair >
+ .fuel-map-value {
+ padding: 2px 4px;
+ white-space: nowrap;
+}
+
+.fuel-map-property-list > .fuel-map > .fuel-map-items > .fuel-map-pair >
+ .fuel-map-name {
+ color: {$bluetext};
+}
+
+.fuel-map-property-list > .fuel-map > .fuel-map-items > .fuel-map-pair >
+ .fuel-map-value {
+ color: {$lightgreytext};
+}
+
+.device-desktop
+ .fuel-map-property-list > .fuel-map > .fuel-map-items > .fuel-map-pair >
+ .fuel-map-name {
+ text-align: right;
+ min-width: 80px;
+ width: 80px;
+}
+
+.device-desktop
+ .fuel-map-property-list > .fuel-map > .fuel-map-items > .fuel-map-pair >
+ .fuel-map-value {
+ text-overflow: ellipsis;
+ overflow: hidden;
+}
+
+.device
+ .fuel-map-property-list > .fuel-map > .fuel-map-items > .fuel-map-pair >
+ .fuel-map-value {
+ padding-left: 12px;
+}
File Metadata
Details
Attached
Mime Type
text/plain
Expires
Tue, Mar 18, 2:34 AM (1 w, 16 h ago)
Storage Engine
blob
Storage Format
Encrypted (AES-256-CBC)
Storage Handle
7381701
Default Alt Text
D21418.id50963.diff (13 KB)
Attached To
Mode
D21418: Improve desktop and mobile layouts for new "CommitGridView"
Attached
Detach File
Event Timeline
Log In to Comment