[Summary view] [Print] [Text view]

   1  <?php
   2  
   3  final class PhabricatorMultiColumnExample extends PhabricatorUIExample {
   4  
   5    public function getName() {
   6      return 'Multiple Column Layouts';
   7    }
   8  
   9    public function getDescription() {
  10      return 'A container good for 1-7 equally spaced columns. '.
  11        'Fixed and Fluid layouts.';
  12    }
  13  
  14    public function renderExample() {
  15      $request = $this->getRequest();
  16      $user = $request->getUser();
  17  
  18      $column1 = phutil_tag(
  19        'div',
  20          array(
  21            'class' => 'pm',
  22            'style' => 'border: 1px solid green;',
  23          ),
  24          'Bruce Campbell');
  25  
  26      $column2 = phutil_tag(
  27        'div',
  28          array(
  29            'class' => 'pm',
  30            'style' => 'border: 1px solid blue;',
  31          ),
  32          'Army of Darkness');
  33  
  34      $head1 = id(new PHUIHeaderView())
  35        ->setHeader(pht('2 Column Fixed'));
  36      $layout1 = id(new AphrontMultiColumnView())
  37        ->addColumn($column1)
  38        ->addColumn($column2)
  39        ->setGutter(AphrontMultiColumnView::GUTTER_MEDIUM);
  40  
  41      $head2 = id(new PHUIHeaderView())
  42        ->setHeader(pht('2 Column Fluid'));
  43      $layout2 = id(new AphrontMultiColumnView())
  44        ->addColumn($column1)
  45        ->addColumn($column2)
  46        ->setFluidLayout(true)
  47        ->setGutter(AphrontMultiColumnView::GUTTER_MEDIUM);
  48  
  49      $head3 = id(new PHUIHeaderView())
  50        ->setHeader(pht('4 Column Fixed'));
  51      $layout3 = id(new AphrontMultiColumnView())
  52        ->addColumn($column1)
  53        ->addColumn($column2)
  54        ->addColumn($column1)
  55        ->addColumn($column2)
  56        ->setGutter(AphrontMultiColumnView::GUTTER_SMALL);
  57  
  58      $head4 = id(new PHUIHeaderView())
  59        ->setHeader(pht('4 Column Fluid'));
  60      $layout4 = id(new AphrontMultiColumnView())
  61        ->addColumn($column1)
  62        ->addColumn($column2)
  63        ->addColumn($column1)
  64        ->addColumn($column2)
  65        ->setFluidLayout(true)
  66        ->setGutter(AphrontMultiColumnView::GUTTER_SMALL);
  67  
  68      $sunday = hsprintf('<strong>Sunday</strong><br /><br />Watch Football'.
  69        '<br />Code<br />Eat<br />Sleep');
  70  
  71      $monday = hsprintf('<strong>Monday</strong><br /><br />Code'.
  72        '<br />Eat<br />Sleep');
  73  
  74      $tuesday = hsprintf('<strong>Tuesday</strong><br />'.
  75        '<br />Code<br />Eat<br />Sleep');
  76  
  77      $wednesday = hsprintf('<strong>Wednesday</strong><br /><br />Code'.
  78        '<br />Eat<br />Sleep');
  79  
  80      $thursday = hsprintf('<strong>Thursday</strong><br />'.
  81        '<br />Code<br />Eat<br />Sleep');
  82  
  83      $friday = hsprintf('<strong>Friday</strong><br /><br />Code'.
  84        '<br />Eat<br />Sleep');
  85  
  86      $saturday = hsprintf('<strong>Saturday</strong><br /><br />StarCraft II'.
  87        '<br />All<br />Damn<br />Day');
  88  
  89      $head5 = id(new PHUIHeaderView())
  90        ->setHeader(pht('7 Column Fluid'));
  91      $layout5 = id(new AphrontMultiColumnView())
  92        ->addColumn($sunday)
  93        ->addColumn($monday)
  94        ->addColumn($tuesday)
  95        ->addColumn($wednesday)
  96        ->addColumn($thursday)
  97        ->addColumn($friday)
  98        ->addColumn($saturday)
  99        ->setFluidLayout(true)
 100        ->setBorder(true);
 101  
 102      $shipping = id(new PHUIFormLayoutView())
 103        ->setUser($user)
 104        ->setFullWidth(true)
 105        ->appendChild(
 106          id(new AphrontFormTextControl())
 107          ->setLabel('Name')
 108          ->setDisableAutocomplete(true)
 109          ->setSigil('name-input'))
 110        ->appendChild(
 111          id(new AphrontFormTextControl())
 112          ->setLabel('Address')
 113          ->setDisableAutocomplete(true)
 114          ->setSigil('address-input'))
 115        ->appendChild(
 116          id(new AphrontFormTextControl())
 117          ->setLabel('City/State')
 118          ->setDisableAutocomplete(true)
 119          ->setSigil('city-input'))
 120        ->appendChild(
 121          id(new AphrontFormTextControl())
 122          ->setLabel('Country')
 123          ->setDisableAutocomplete(true)
 124          ->setSigil('country-input'))
 125        ->appendChild(
 126          id(new AphrontFormTextControl())
 127          ->setLabel('Postal Code')
 128          ->setDisableAutocomplete(true)
 129          ->setSigil('postal-input'));
 130  
 131      $cc = id(new PHUIFormLayoutView())
 132        ->setUser($user)
 133        ->setFullWidth(true)
 134        ->appendChild(
 135          id(new AphrontFormTextControl())
 136          ->setLabel('Card Number')
 137          ->setDisableAutocomplete(true)
 138          ->setSigil('number-input')
 139          ->setError(''))
 140        ->appendChild(
 141          id(new AphrontFormTextControl())
 142          ->setLabel('CVC')
 143          ->setDisableAutocomplete(true)
 144          ->setSigil('cvc-input')
 145          ->setError(''))
 146        ->appendChild(
 147          id(new PhortuneMonthYearExpiryControl())
 148          ->setLabel('Expiration')
 149          ->setUser($user)
 150          ->setError(''));
 151  
 152      $shipping_title = pht('Shipping Address');
 153      $billing_title = pht('Billing Address');
 154      $cc_title = pht('Payment Information');
 155  
 156      $head6 = id(new PHUIHeaderView())
 157        ->setHeader(pht('Let\'s Go Shopping'));
 158      $layout6 = id(new AphrontMultiColumnView())
 159        ->addColumn(hsprintf('<h1>%s</h1>%s', $shipping_title, $shipping))
 160        ->addColumn(hsprintf('<h1>%s</h1>%s', $billing_title, $shipping))
 161        ->addColumn(hsprintf('<h1>%s</h1>%s', $cc_title, $cc))
 162        ->setFluidLayout(true)
 163        ->setBorder(true);
 164  
 165      $wrap1 = phutil_tag(
 166        'div',
 167          array(
 168            'class' => 'ml',
 169          ),
 170          $layout1);
 171  
 172      $wrap2 = phutil_tag(
 173        'div',
 174          array(
 175            'class' => 'ml',
 176          ),
 177          $layout2);
 178  
 179      $wrap3 = phutil_tag(
 180        'div',
 181          array(
 182            'class' => 'ml',
 183          ),
 184          $layout3);
 185  
 186      $wrap4 = phutil_tag(
 187        'div',
 188          array(
 189            'class' => 'ml',
 190          ),
 191          $layout4);
 192  
 193      $wrap5 = phutil_tag(
 194        'div',
 195          array(
 196            'class' => 'ml',
 197          ),
 198          $layout5);
 199  
 200      $wrap6 = phutil_tag(
 201        'div',
 202          array(
 203            'class' => 'ml',
 204          ),
 205          $layout6);
 206  
 207      return phutil_tag(
 208        'div',
 209          array(),
 210          array(
 211            $head1,
 212            $wrap1,
 213            $head2,
 214            $wrap2,
 215            $head3,
 216            $wrap3,
 217            $head4,
 218            $wrap4,
 219            $head5,
 220            $wrap5,
 221            $head6,
 222            $wrap6,
 223          ));
 224    }
 225  }