1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-10 00:42:41 +01:00

PHUIButtonBarView

Summary: Adds a handy bar full of tiny buttons. Use only when directed. Ref: T4394

Test Plan: View UI Examples.

Reviewers: epriestley, btrahan

Reviewed By: epriestley

CC: Korvin, epriestley, aran

Differential Revision: https://secure.phabricator.com/D8169
This commit is contained in:
Chad Little 2014-02-10 11:11:36 -08:00
parent eec593e313
commit 724be3930f
8 changed files with 134 additions and 8 deletions

View file

@ -7,7 +7,7 @@
return array(
'names' =>
array(
'core.pkg.css' => '882662b1',
'core.pkg.css' => '71e0a12a',
'core.pkg.js' => 'c7854cc5',
'darkconsole.pkg.js' => 'ca8671ce',
'differential.pkg.css' => '5a65a762',
@ -127,13 +127,13 @@ return array(
'rsrc/css/layout/phabricator-source-code-view.css' => '62a99814',
'rsrc/css/layout/phabricator-timeline-view.css' => 'f4f846c4',
'rsrc/css/phui/phui-box.css' => '21da4d8c',
'rsrc/css/phui/phui-button.css' => '8106a67a',
'rsrc/css/phui/phui-button.css' => '8784a966',
'rsrc/css/phui/phui-document.css' => '143b2ac8',
'rsrc/css/phui/phui-feed-story.css' => '3a59c2cf',
'rsrc/css/phui/phui-form-view.css' => '0efd3326',
'rsrc/css/phui/phui-form.css' => 'b78ec020',
'rsrc/css/phui/phui-header-view.css' => '472a6003',
'rsrc/css/phui/phui-icon.css' => '29e83226',
'rsrc/css/phui/phui-icon.css' => 'fcb145a7',
'rsrc/css/phui/phui-info-panel.css' => '27ea50a1',
'rsrc/css/phui/phui-list.css' => '2edb76cf',
'rsrc/css/phui/phui-object-box.css' => '4f916b80',
@ -738,13 +738,13 @@ return array(
'phrequent-css' => 'ffc185ad',
'phriction-document-css' => 'b0309d8e',
'phui-box-css' => '21da4d8c',
'phui-button-css' => '8106a67a',
'phui-button-css' => '8784a966',
'phui-document-view-css' => '143b2ac8',
'phui-feed-story-css' => '3a59c2cf',
'phui-form-css' => 'b78ec020',
'phui-form-view-css' => '0efd3326',
'phui-header-view-css' => '472a6003',
'phui-icon-view-css' => '29e83226',
'phui-icon-view-css' => 'fcb145a7',
'phui-info-panel-css' => '27ea50a1',
'phui-list-view-css' => '2edb76cf',
'phui-object-box-css' => '4f916b80',

View file

@ -979,6 +979,8 @@ phutil_register_library_map(array(
'PHUI' => 'view/phui/PHUI.php',
'PHUIBoxExample' => 'applications/uiexample/examples/PHUIBoxExample.php',
'PHUIBoxView' => 'view/phui/PHUIBoxView.php',
'PHUIButtonBarExample' => 'applications/uiexample/examples/PHUIButtonBarExample.php',
'PHUIButtonBarView' => 'view/phui/PHUIButtonBarView.php',
'PHUIButtonExample' => 'applications/uiexample/examples/PHUIButtonExample.php',
'PHUIButtonView' => 'view/phui/PHUIButtonView.php',
'PHUIColorPalletteExample' => 'applications/uiexample/examples/PHUIColorPalletteExample.php',
@ -3599,6 +3601,8 @@ phutil_register_library_map(array(
'OwnersPackageReplyHandler' => 'PhabricatorMailReplyHandler',
'PHUIBoxExample' => 'PhabricatorUIExample',
'PHUIBoxView' => 'AphrontTagView',
'PHUIButtonBarExample' => 'PhabricatorUIExample',
'PHUIButtonBarView' => 'AphrontTagView',
'PHUIButtonExample' => 'PhabricatorUIExample',
'PHUIButtonView' => 'AphrontTagView',
'PHUIColorPalletteExample' => 'PhabricatorUIExample',

View file

@ -0,0 +1,47 @@
<?php
final class PHUIButtonBarExample extends PhabricatorUIExample {
public function getName() {
return pht('Button Bar');
}
public function getDescription() {
return pht('A minimal UI for Buttons');
}
public function renderExample() {
$request = $this->getRequest();
$user = $request->getUser();
// Icon Buttons
$icons = array(
'Go Back' => 'chevron-left',
'Choose Date' => 'calendar',
'Edit View' => 'pencil',
'Go Forward' => 'chevron-right');
$button_bar = new PHUIButtonBarView();
foreach ($icons as $text => $icon) {
$image = id(new PHUIIconView())
->setSpriteSheet(PHUIIconView::SPRITE_BUTTONBAR)
->setSpriteIcon($icon);
$button = id(new PHUIButtonView())
->setTag('a')
->setColor(PHUIButtonView::GREY)
->setTitle($text)
->setIcon($image);
$button_bar->addButton($button);
}
$layout = id(new PHUIBoxView())
->appendChild($button_bar)
->addPadding(PHUI::PADDING_LARGE);
$wrap1 = id(new PHUIObjectBoxView())
->setHeaderText('Button Bar Example')
->appendChild($layout);
return array($wrap1);
}
}

View file

@ -0,0 +1,42 @@
<?php
final class PHUIButtonBarView extends AphrontTagView {
private $buttons = array();
public function addButton($button) {
$this->buttons[] = $button;
return $this;
}
protected function getTagAttributes() {
return array('class' => 'phui-button-bar');
}
public function getTagName() {
return 'div';
}
public function getTagContent() {
require_celerity_resource('phui-button-css');
$i = 1;
$j = count($this->buttons);
foreach ($this->buttons as $button) {
// LeeLoo Dallas Multi-Pass
if ($j > 1) {
if ($i == 1) {
$button->addClass('phui-button-bar-first');
} elseif ($i == $j) {
$button->addClass('phui-button-bar-last');
} elseif ($j > 1) {
$button->addClass('phui-button-bar-middle');
}
}
$this->appendChild($button);
$i++;
}
return $this->renderChildren();
}
}

View file

@ -19,6 +19,7 @@ final class PHUIButtonView extends AphrontTagView {
private $dropdown;
private $icon;
private $href = null;
private $title = null;
public function setText($text) {
$this->text = $text;
@ -30,6 +31,11 @@ final class PHUIButtonView extends AphrontTagView {
return $this;
}
public function setTitle($title) {
$this->title = $title;
return $this;
}
public function setSubtext($subtext) {
$this->subtext = $subtext;
return $this;
@ -88,7 +94,8 @@ final class PHUIButtonView extends AphrontTagView {
}
return array('class' => $classes,
'href' => $this->href);
'href' => $this->href,
'title' => $this->title);
}
protected function getTagContent() {

View file

@ -11,6 +11,7 @@ final class PHUIIconView extends AphrontTagView {
const SPRITE_LOGIN = 'login';
const SPRITE_STATUS = 'status';
const SPRITE_PROJECTS = 'projects';
const SPRITE_BUTTONBAR = 'buttonbar';
const HEAD_SMALL = 'phuihead-small';
const HEAD_MEDIUM = 'phuihead-medium';

View file

@ -338,3 +338,27 @@ a.toggle-fixed {
line-height: 15px;
font-weight: normal;
}
/* PHUI Button Bar */
.phui-button-bar a.button {
display: inline-block;
height: 16px;
width: 12px;
}
.phui-button-bar .phui-button-bar-first {
border-top-right-radius: 0px;
border-bottom-right-radius: 0px;
}
.phui-button-bar .phui-button-bar-middle {
border-radius: 0;
border-left: none;
}
.phui-button-bar .phui-button-bar-last {
border-left: none;
border-top-left-radius: 0px;
border-bottom-left-radius: 0px;
}

View file

@ -19,7 +19,8 @@
.phui-icon-view.sprite-apps,
.phui-icon-view.sprite-icons,
.phui-icon-view.sprite-status {
.phui-icon-view.sprite-status,
.phui-icon-view.sprite-buttonbar {
height: 14px;
width: 14px;
}