Page Menu
Home
Phabricator
Search
Configure Global Search
Log In
Files
F15290848
D11709.id28181.diff
No One
Temporary
Actions
View File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Flag For Later
Size
9 KB
Referenced Files
None
Subscribers
None
D11709.id28181.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
@@ -122,6 +122,7 @@
'rsrc/css/phui/calendar/phui-calendar.css' => '8675968e',
'rsrc/css/phui/phui-action-header-view.css' => '89c497e7',
'rsrc/css/phui/phui-action-list.css' => '9ee9910a',
+ 'rsrc/css/phui/phui-action-panel.css' => '43989d50',
'rsrc/css/phui/phui-box.css' => '7b3a2eed',
'rsrc/css/phui/phui-button.css' => '008ba5e2',
'rsrc/css/phui/phui-crumbs-view.css' => '594d719e',
@@ -765,6 +766,7 @@
'phrequent-css' => 'ffc185ad',
'phriction-document-css' => '7d7f0071',
'phui-action-header-view-css' => '89c497e7',
+ 'phui-action-panel-css' => '43989d50',
'phui-box-css' => '7b3a2eed',
'phui-button-css' => '008ba5e2',
'phui-calendar-css' => '8675968e',
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
@@ -1122,6 +1122,8 @@
'PHUI' => 'view/phui/PHUI.php',
'PHUIActionHeaderExample' => 'applications/uiexample/examples/PHUIActionHeaderExample.php',
'PHUIActionHeaderView' => 'view/phui/PHUIActionHeaderView.php',
+ 'PHUIActionPanelExample' => 'applications/uiexample/examples/PHUIActionPanelExample.php',
+ 'PHUIActionPanelView' => 'view/phui/PHUIActionPanelView.php',
'PHUIBoxExample' => 'applications/uiexample/examples/PHUIBoxExample.php',
'PHUIBoxView' => 'view/phui/PHUIBoxView.php',
'PHUIButtonBarExample' => 'applications/uiexample/examples/PHUIButtonBarExample.php',
@@ -4318,6 +4320,8 @@
'PHIDQueryConduitAPIMethod' => 'PHIDConduitAPIMethod',
'PHUIActionHeaderExample' => 'PhabricatorUIExample',
'PHUIActionHeaderView' => 'AphrontView',
+ 'PHUIActionPanelExample' => 'PhabricatorUIExample',
+ 'PHUIActionPanelView' => 'AphrontTagView',
'PHUIBoxExample' => 'PhabricatorUIExample',
'PHUIBoxView' => 'AphrontTagView',
'PHUIButtonBarExample' => 'PhabricatorUIExample',
diff --git a/src/applications/uiexample/examples/PHUIActionPanelExample.php b/src/applications/uiexample/examples/PHUIActionPanelExample.php
new file mode 100644
--- /dev/null
+++ b/src/applications/uiexample/examples/PHUIActionPanelExample.php
@@ -0,0 +1,59 @@
+<?php
+
+final class PHUIActionPanelExample extends PhabricatorUIExample {
+
+ public function getName() {
+ return 'Action Panel';
+ }
+
+ public function getDescription() {
+ return 'A panel with strong tendencies for inciting ACTION!';
+ }
+
+ public function renderExample() {
+
+ $view = id(new AphrontMultiColumnView())
+ ->setFluidLayout(true)
+ ->setBorder(true);
+
+ /* Action Panels */
+ $panel1 = id(new PHUIActionPanelView())
+ ->setFontIcon('fa-book')
+ ->setHeader(pht('Read Documentation'))
+ ->setHref('#')
+ ->setSubHeader(pht('Reading is a common way to learn about things.'))
+ ->setStatus(pht('Carrots help you see better.'))
+ ->setState(PHUIActionPanelView::STATE_NONE);
+ $view->addColumn($panel1);
+
+ $panel2 = id(new PHUIActionPanelView())
+ ->setFontIcon('fa-server')
+ ->setHeader(pht('Launch Instance'))
+ ->setHref('#')
+ ->setSubHeader(pht('Maybe this is what you\'re likely here for.'))
+ ->setStatus(pht('You have no instances.'))
+ ->setState(PHUIActionPanelView::STATE_ERROR);
+ $view->addColumn($panel2);
+
+ $panel3 = id(new PHUIActionPanelView())
+ ->setFontIcon('fa-group')
+ ->setHeader(pht('Code with Friends'))
+ ->setHref('#')
+ ->setSubHeader(pht('Writing code is much more fun with friends!'))
+ ->setStatus(pht('You need more friends.'))
+ ->setState(PHUIActionPanelView::STATE_WARN);
+ $view->addColumn($panel3);
+
+ $panel4 = id(new PHUIActionPanelView())
+ ->setFontIcon('fa-cloud-download')
+ ->setHeader(pht('Download Data'))
+ ->setHref('#')
+ ->setSubHeader(pht('Need a backup of all your kitten memes?'))
+ ->setStatus(pht('Building Download'))
+ ->setState(PHUIActionPanelView::STATE_PROGRESS);
+ $view->addColumn($panel4);
+
+
+ return phutil_tag_div('ml', $view);
+ }
+}
diff --git a/src/view/phui/PHUIActionPanelView.php b/src/view/phui/PHUIActionPanelView.php
new file mode 100644
--- /dev/null
+++ b/src/view/phui/PHUIActionPanelView.php
@@ -0,0 +1,151 @@
+<?php
+
+final class PHUIActionPanelView extends AphrontTagView {
+
+ private $href;
+ private $fontIcon;
+ private $header;
+ private $subHeader;
+ private $state;
+ private $status;
+
+ const STATE_WARN = 'phui-action-panel-warn';
+ const STATE_INFO = 'phui-action-panel-info';
+ const STATE_ERROR = 'phui-action-panel-error';
+ const STATE_PROGRESS = 'phui-action-panel-progress';
+ const STATE_NONE = 'phui-action-panel-none';
+
+ public function setHref($href) {
+ $this->href = $href;
+ return $this;
+ }
+
+ public function setFontIcon($image) {
+ $this->fontIcon = $image;
+ return $this;
+ }
+
+ public function setHeader($header) {
+ $this->header = $header;
+ return $this;
+ }
+
+ public function setSubHeader($sub) {
+ $this->subHeader = $sub;
+ return $this;
+ }
+
+ public function setState($state) {
+ $this->state = $state;
+ return $this;
+ }
+
+ public function setStatus($text) {
+ $this->status = $text;
+ return $this;
+ }
+
+ protected function getStateIcon() {
+ $icon = new PHUIIconView();
+ switch ($this->state) {
+ case self::STATE_WARN:
+ $icon->setIconFont('fa-exclamation-circle msr');
+ break;
+ case self::STATE_INFO:
+ $icon->setIconFont('fa-info-circle msr');
+ break;
+ case self::STATE_ERROR:
+ $icon->setIconFont('fa-exclamation-triangle msr');
+ break;
+ case self::STATE_PROGRESS:
+ $icon->setIconFont('fa-refresh ph-spin msr');
+ break;
+ case self::STATE_NONE:
+ $icon->setIconFont('fa-info-circle msr');
+ break;
+ }
+ return $icon;
+ }
+
+ protected function getTagAttributes() {
+ require_celerity_resource('phui-action-panel-css');
+
+ $classes = array();
+ $classes[] = 'phui-action-panel';
+ if ($this->state) {
+ $classes[] = $this->state;
+ }
+
+ return array(
+ 'class' => implode(' ', $classes),
+ );
+
+ }
+
+ protected function getTagContent() {
+
+ $icon = null;
+ if ($this->fontIcon) {
+ $fonticon = id(new PHUIIconView())
+ ->setIconFont($this->fontIcon);
+ if ($this->href) {
+ $fonticon = phutil_tag(
+ 'a',
+ array(
+ 'href' => $this->href,
+ ),
+ $fonticon);
+ }
+ $icon = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'phui-action-panel-icon',
+ ),
+ $fonticon);
+ }
+
+ $header = null;
+ if ($this->header) {
+ $header = $this->header;
+ if ($this->href) {
+ $header = phutil_tag(
+ 'a',
+ array(
+ 'href' => $this->href,
+ ),
+ $this->header);
+ }
+ $header = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'phui-action-panel-header',
+ ),
+ $header);
+ }
+
+ $subheader = null;
+ if ($this->subHeader) {
+ $subheader = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'phui-action-panel-subheader',
+ ),
+ $this->subHeader);
+ }
+
+ $status = null;
+ if ($this->status && $this->state) {
+ $state_icon = $this->getStateIcon();
+ $status = phutil_tag(
+ 'div',
+ array(
+ 'class' => 'phui-action-panel-status',
+ ),
+ array($state_icon, $this->status));
+ }
+
+ return array($icon, $header, $subheader, $status);
+
+ }
+
+}
diff --git a/webroot/rsrc/css/phui/phui-action-panel.css b/webroot/rsrc/css/phui/phui-action-panel.css
new file mode 100644
--- /dev/null
+++ b/webroot/rsrc/css/phui/phui-action-panel.css
@@ -0,0 +1,99 @@
+/**
+ * @provides phui-action-panel-css
+ */
+
+.phui-action-panel {
+ position: relative;
+ padding-bottom: 44px;
+}
+
+.phui-action-panel-icon {
+ height: 128px;
+ line-height: 160px;
+ text-align: center;
+ vertical-align: bottom;
+}
+
+.phui-action-panel-icon a:hover .phui-icon-view {
+ color: {$blue};
+}
+
+.phui-action-panel-icon .phui-icon-view {
+ font-size: 64px;
+ color: {$lightgreytext};
+}
+
+.phui-action-panel-header {
+ padding: 0 8px 4px 8px;
+ font-weight: bold;
+ font-size: 14px;
+ color: {$darkbluetext};
+}
+
+.phui-action-panel-header a {
+ color: {$blue};
+}
+
+.phui-action-panel-subheader {
+ padding: 0 8px 4px 8px;
+ font-size: 13px;
+ color: {$bluetext};
+}
+
+.phui-action-panel-status {
+ padding: 8px 12px;
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+}
+
+.phui-action-panel-none .phui-action-panel-status {
+ background-color: {$lightgreybackground};
+ border-left: 4px solid {$greyborder};
+ color: {$greytext};
+}
+
+.phui-action-panel-warn .phui-action-panel-status .phui-icon-view {
+ color: {$greytext};
+}
+
+.phui-action-panel-warn .phui-action-panel-status {
+ background-color: {$lightyellow};
+ border-left: 4px solid #bc7837;
+ color: #bc7837;
+}
+
+.phui-action-panel-warn .phui-action-panel-status .phui-icon-view {
+ color: #bc7837;
+}
+
+.phui-action-panel-error .phui-action-panel-status {
+ background-color: {$lightred};
+ border-left: 4px solid {$red};
+ color: {$red};
+}
+
+.phui-action-panel-error .phui-action-panel-status .phui-icon-view {
+ color: {$red};
+}
+
+.phui-action-panel-info .phui-action-panel-status {
+ background-color: {$lightblue};
+ border-left: 4px solid {$blue};
+ color: {$blue};
+}
+
+.phui-action-panel-info .phui-action-panel-status .phui-icon-view {
+ color: {$blue};
+}
+
+.phui-action-panel-progress .phui-action-panel-status {
+ background-color: {$lightblue};
+ color: {$blue};
+ border-left: 4px solid {$blue};
+}
+
+.phui-action-panel-progress .phui-action-panel-status .phui-icon-view {
+ color: {$blue};
+}
File Metadata
Details
Attached
Mime Type
text/plain
Expires
Wed, Mar 5, 11:51 PM (3 d, 16 h ago)
Storage Engine
blob
Storage Format
Encrypted (AES-256-CBC)
Storage Handle
7227982
Default Alt Text
D11709.id28181.diff (9 KB)
Attached To
Mode
D11709: PHUIActionPanelView
Attached
Detach File
Event Timeline
Log In to Comment