HTML lists: unordered, ordered and definition lists

This namespace contains object oriented implementations of HTML lists.

Unrdered lists: The Ul component

The Ul class implements an unordered (bulleted) list (The <ul>).

Use The ul tag together with The li tag to create unordered lists. Instances of StandardList, Ul and Ol classes wrap all inserted content not implementing StandardListItem into a Li object.

Ordered lists: The Ol component

The Ol component (an ordered list) extends StandardList. It supports indexing in the generated HTML output. This indexing can be numerical or alphabetical.

  • Ol::setListType(): sets the kind of marker used in the list
    • '1': Decimal numbers (1, 2, 3, 4) Default
    • 'a': Alphabetically ordered list, lowercase (a, b, c, d)
    • 'A': Alphabetically ordered list, uppercase (A, B, C, D)
    • 'i': Roman numbers, lowercase (i, ii, iii, iv)
    • 'I': Roman numbers, uppercase (I, II, III, IV)
  • Ol::setStart(): sets the start value of the list ordering index
  • Examples of different list types
    1. <?php
    2.  
    3. namespace Sphp\Html\Lists;
    4.  
    5. use Sphp\Html\Foundation\Sites\Grids\BasicRow;
    6.  
    7. $layout = new BasicRow();
    8. $colors = ['yellow', 'blue', 'white'];
    9. $ul = new Ul($colors);
    10. $ulCopy = clone $ul;
    11. $ulCopy->prepend('red')->inlineStyles()->setProperty('color', 'red');
    12. $ulCopy->appendLink('http://www.w3schools.com/html/html_lists.asp', 'w3schools', '_blank');
    13. $ulCopy->append("magenta")->inlineStyles()->setProperty('color', 'magenta');
    14.  
    15. $ol = new Ol($colors);
    16. $ol->appendLink('http://www.w3schools.com/colors/color_tryit.asp?color=Black', 'w3schools', '_blank');
    17.  
    18. $olCopy = clone $ol;
    19. $olCopy->setListType('I');
    20. $olCopy->append('magenta')->inlineStyles()->setProperty('color', 'magenta');
    21. $olCopy->prepend('red')->inlineStyles()->setProperty('color', 'red');
    22.  
    23.  
    24. $dl = new Dl();
    25. $dl->appendTerm("Colors:");
    26. $dl->appendDescription('red')->inlineStyles()->setProperty('color', 'red');
    27. foreach ($colors as $color) {
    28.   $dl->appendDescription($color);
    29. }
    30. $dl->appendDescription('magenta')->inlineStyles()->setProperty('color', 'magenta');
    31.  
    32. $layout->appendCell($ul)->small(12)->large('auto');
    33. $layout->appendCell($ulCopy)->small(12)->large('auto');
    34. $layout->appendCell($ol)->small(12)->large('auto');
    35. $layout->appendCell($olCopy)->small(12)->large('auto');
    36. $layout->appendCell($dl)->small(12)->large('auto');
    37. $layout->printHtml();
    38.  
    Highlighted with GeSHi 1.0.9.1
  • Execution result as HTML5 flow
    • yellow
    • blue
    • white
    1. yellow
    2. blue
    3. white
    4. w3schools
    1. red
    2. yellow
    3. blue
    4. white
    5. w3schools
    6. magenta
    Colors:
    red
    yellow
    blue
    white
    magenta

Definition lists: The Dl component

The Dl component is a list of Dt terms and Dd descriptions for thee terms. Dt - Dd groups may be terms and definitions, metadata topics and values, questions and answers, or any other groups of name-value data.

  • PHP code
    1. <?php
    2.  
    3. namespace Sphp\Html\Lists;
    4.  
    5. $dl = new Dl();
    6. $dl->appendTerm("Numbers:");
    7. foreach (["zero", "one", "two", "three", "four"] as $number) {
    8.   $dl->appendDescription($number);
    9. }
    10. $dl->printHtml();
    11.  
    Highlighted with GeSHi 1.0.9.1
  • Execution result as HTML5 flow
    Numbers:
    zero
    one
    two
    three
    four

HTML tables: for tabular data

Namespace contains object oriented PHP implementation of the HTML table structure. Table element represents tabular data —that is, information expressed via a two-dimensional data table. Therefore HTML tables should not be used as layout aids.

The Table component

The structure of a Table object follows closely the specification of a HTML <table>.

  • The Caption class specifies the caption (or title) of a table
  • The Thead class defines a set of rows defining the head of the columns of the table.
  • The Tbody class groups one or more rows as the body of a table.
  • The Tbody class groups one or more rows as the body of a table.
    • The Tr class defines a row of cells in a table. Those are implementaitions of Cell interface.
      • The Th class implements Cell as header of a group of table cells.
      • The Td class implements Cell as data container.
  • HTML table example
    1. <?php
    2.  
    3. namespace Sphp\Html\Tables;
    4.  
    5. $table = (new Table());
    6. $table->useTbody()->useThead()->setCaption('Cars:');
    7. $table->thead()->appendHeaderRow(['Name', 'Stock', 'Sold']);
    8. $table->tbody()->appendBodyRow(['Volvo', 22, 18]);
    9. $table->tbody()->appendBodyRow(['BMW', 15, 13]);
    10. $table->tbody()->appendBodyRow(['Land Rover', 17, 15]);
    11. $table->printHtml();
    12.  
    Highlighted with GeSHi 1.0.9.1
  • Execution result as HTML5 flow
    Cars:
    NameStockSold
    Volvo2218
    BMW1513
    Land Rover1715

TABLE FACTORIES: Table building and manipulation

TableBuilder is able to generate HTML tables from data sources. A LineNumberer instance makes it possible to add linenumbers to a table object.

  • HTML table builder example
    1. <?php
    2.  
    3. namespace Sphp\Html\Tables;
    4.  
    5. $bodyData = [
    6.     ['Sami', 'Holck', 'sami.holck@gmail.com', 'http://samiholck.com'],
    7.     ['John', 'Doe', 'john.doe@unknown.no', '-'],
    8. ];
    9. $labels = ['First name', 'Last name', 'Email', 'Homepage'];
    10. $builder = new TableBuilder();
    11. $builder->setTbodyData($bodyData);
    12. $builder->setTheadData($labels);
    13. $builder->setTfootData($labels);
    14. $labeller = new Labeller($labels);
    15. $builder->addTableFilter($labeller);
    16. $linenumberer = new LineNumberer();
    17. $linenumberer->prependLineNumbers(true);
    18. $builder->addTableFilter($linenumberer);
    19. //$builder->getLineNumberer()->prependLineNumbers(true);
    20. $builder->printHtml();
    21.  
    Highlighted with GeSHi 1.0.9.1
  • Execution result as HTML5 flow
    TypeError: Return value of Sphp\Html\Tables\TableBuilder::getHtml() must be of the type string, object returned in /home/int48291/public_html/playground/sphp/php/Sphp/Html/Tables/TableBuilder.php:185 Stack trace: #0 /home/int48291/public_html/playground/sphp/php/Sphp/Html/AbstractContent.php(29): Sphp\Html\Tables\TableBuilder->getHtml() #1 /home/int48291/public_html/playground/sphp/php/Sphp/Html/AbstractContent.php(37): Sphp\Html\AbstractContent->__toString() #2 /home/int48291/public_html/playground/manual/examples/Sphp/Html/Tables/TableBuilder.php(20): Sphp\Html\AbstractContent->printHtml() #3 /home/int48291/public_html/playground/sphp/php/Sphp/Stdlib/Filesystem.php(106): include('/home/int48291/...') #4 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(110): Sphp\Stdlib\Filesystem::executePhpToString('Sphp/Html/Table...') #5 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(76): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder->setPath('Sphp/Html/Table...') #6 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(289): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder->__construct('Sphp/Html/Table...', NULL, true) #7 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(110): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder::build('Sphp/Html/Table...', NULL, true) #8 /home/int48291/public_html/playground/manual/pages/Sphp.Html.Tables.php(53): Sphp\Manual\example('Sphp/Html/Table...') #9 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(47): include('/home/int48291/...') #10 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(66): Sphp\Manual\createPage('Sphp.Html.Table...') #11 /home/int48291/public_html/playground/manual/pages/Sphp.Html.Lists-Tables.php(69): Sphp\Manual\printPage('Sphp.Html.Table...') #12 /home/int48291/public_html/playground/sphp/php/Sphp/Stdlib/Filesystem.php(106): include('/home/int48291/...') #13 /home/int48291/public_html/playground/sphp/php/Sphp/Html/ContentParserTrait.php(62): Sphp\Stdlib\Filesystem::executePhpToString('manual/pages/Sp...') #14 /home/int48291/public_html/playground/manual/classes/MVC/PageLoader.php(57): Sphp\Html\AbstractContainerTag->appendPhpFile('manual/pages/Sp...') #15 /home/int48291/public_html/playground/manual/classes/MVC/PageLoader.php(93): Sphp\Manual\MVC\PageLoader->load('manual/pages/Sp...') #16 [internal function]: Sphp\Manual\MVC\PageLoader->loadPage('/Sphp.Html.List...', 'Sphp.Html.Lists...') #17 /home/int48291/public_html/playground/sphp/php/Sphp/MVC/Router.php(138): call_user_func_array(Array, Array) #18 /home/int48291/public_html/playground/index.php(22): Sphp\MVC\Router->execute('http://playgrou...') #19 {main}

HTML TABLES FROM CSV-FILES: The TableBuilder Class as a factory

TableBuilder::fromCsvFile() is a factory method for generating tables from CSV files.

  • HTML table factory example
    1. <?php
    2.  
    3. namespace Sphp\Html\Tables;
    4.  
    5. use  Sphp\Stdlib\Parsers\CsvFile;
    6.  
    7. echo TableBuilder::fromCsvFile(new CsvFile('manual/snippets/1000.csv'), 10, 5);
    8.  
    9. echo TableBuilder::fromCsvFile(new CsvFile('manual/snippets/1000.csv'), 0, 10);
    10.  
    Highlighted with GeSHi 1.0.9.1
  • Execution result as HTML5 flow
    TypeError: Return value of Sphp\Html\Tables\TableBuilder::getHtml() must be of the type string, object returned in /home/int48291/public_html/playground/sphp/php/Sphp/Html/Tables/TableBuilder.php:185 Stack trace: #0 /home/int48291/public_html/playground/sphp/php/Sphp/Html/AbstractContent.php(29): Sphp\Html\Tables\TableBuilder->getHtml() #1 /home/int48291/public_html/playground/manual/examples/Sphp/Html/Tables/Factory.php(7): Sphp\Html\AbstractContent->__toString() #2 /home/int48291/public_html/playground/sphp/php/Sphp/Stdlib/Filesystem.php(106): include('/home/int48291/...') #3 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(110): Sphp\Stdlib\Filesystem::executePhpToString('Sphp/Html/Table...') #4 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(76): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder->setPath('Sphp/Html/Table...') #5 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(289): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder->__construct('Sphp/Html/Table...', NULL, true) #6 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(110): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder::build('Sphp/Html/Table...', NULL, true) #7 /home/int48291/public_html/playground/manual/pages/Sphp.Html.Tables.php(62): Sphp\Manual\example('Sphp/Html/Table...') #8 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(47): include('/home/int48291/...') #9 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(66): Sphp\Manual\createPage('Sphp.Html.Table...') #10 /home/int48291/public_html/playground/manual/pages/Sphp.Html.Lists-Tables.php(69): Sphp\Manual\printPage('Sphp.Html.Table...') #11 /home/int48291/public_html/playground/sphp/php/Sphp/Stdlib/Filesystem.php(106): include('/home/int48291/...') #12 /home/int48291/public_html/playground/sphp/php/Sphp/Html/ContentParserTrait.php(62): Sphp\Stdlib\Filesystem::executePhpToString('manual/pages/Sp...') #13 /home/int48291/public_html/playground/manual/classes/MVC/PageLoader.php(57): Sphp\Html\AbstractContainerTag->appendPhpFile('manual/pages/Sp...') #14 /home/int48291/public_html/playground/manual/classes/MVC/PageLoader.php(93): Sphp\Manual\MVC\PageLoader->load('manual/pages/Sp...') #15 [internal function]: Sphp\Manual\MVC\PageLoader->loadPage('/Sphp.Html.List...', 'Sphp.Html.Lists...') #16 /home/int48291/public_html/playground/sphp/php/Sphp/MVC/Router.php(138): call_user_func_array(Array, Array) #17 /home/int48291/public_html/playground/index.php(22): Sphp\MVC\Router->execute('http://playgrou...') #18 {main}TypeError: Return value of Sphp\Html\Tables\TableBuilder::getHtml() must be of the type string, object returned in /home/int48291/public_html/playground/sphp/php/Sphp/Html/Tables/TableBuilder.php:185 Stack trace: #0 /home/int48291/public_html/playground/sphp/php/Sphp/Html/AbstractContent.php(29): Sphp\Html\Tables\TableBuilder->getHtml() #1 /home/int48291/public_html/playground/manual/examples/Sphp/Html/Tables/Factory.php(9): Sphp\Html\AbstractContent->__toString() #2 /home/int48291/public_html/playground/sphp/php/Sphp/Stdlib/Filesystem.php(106): include('/home/int48291/...') #3 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(110): Sphp\Stdlib\Filesystem::executePhpToString('Sphp/Html/Table...') #4 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(76): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder->setPath('Sphp/Html/Table...') #5 /home/int48291/public_html/playground/sphp/php/Sphp/Html/Apps/Syntaxhighlighting/CodeExampleAccordionBuilder.php(289): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder->__construct('Sphp/Html/Table...', NULL, true) #6 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(110): Sphp\Html\Apps\Syntaxhighlighting\CodeExampleAccordionBuilder::build('Sphp/Html/Table...', NULL, true) #7 /home/int48291/public_html/playground/manual/pages/Sphp.Html.Tables.php(62): Sphp\Manual\example('Sphp/Html/Table...') #8 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(47): include('/home/int48291/...') #9 /home/int48291/public_html/playground/manual/common/manual_helper_functions.php(66): Sphp\Manual\createPage('Sphp.Html.Table...') #10 /home/int48291/public_html/playground/manual/pages/Sphp.Html.Lists-Tables.php(69): Sphp\Manual\printPage('Sphp.Html.Table...') #11 /home/int48291/public_html/playground/sphp/php/Sphp/Stdlib/Filesystem.php(106): include('/home/int48291/...') #12 /home/int48291/public_html/playground/sphp/php/Sphp/Html/ContentParserTrait.php(62): Sphp\Stdlib\Filesystem::executePhpToString('manual/pages/Sp...') #13 /home/int48291/public_html/playground/manual/classes/MVC/PageLoader.php(57): Sphp\Html\AbstractContainerTag->appendPhpFile('manual/pages/Sp...') #14 /home/int48291/public_html/playground/manual/classes/MVC/PageLoader.php(93): Sphp\Manual\MVC\PageLoader->load('manual/pages/Sp...') #15 [internal function]: Sphp\Manual\MVC\PageLoader->loadPage('/Sphp.Html.List...', 'Sphp.Html.Lists...') #16 /home/int48291/public_html/playground/sphp/php/Sphp/MVC/Router.php(138): call_user_func_array(Array, Array) #17 /home/int48291/public_html/playground/index.php(22): Sphp\MVC\Router->execute('http://playgrou...') #18 {main}
  • HTML table factory example
    1. <?php
    2.  
    3. namespace Sphp\Html\Tables;
    4.  
    5. $bodyData = [
    6.     ['Sami', 'Holck', 'sami.holck@gmail.com', 'http://samiholck.com'],
    7.     ['John', 'Doe', 'john.doe@unknown.no', '-'],
    8. ];
    9. $builder = new TableBuilder();
    10. $builder->setTheadData(['First name', 'Last name', 'Email', 'Homepage']);
    11. $builder->setTbodyData($bodyData);
    12. $lineNumberer = new LineNumberer(1, 'Row');
    13. $builder->addTableFilter($lineNumberer);
    14.  
    15. //$builder->printHtml();
    16. //$builder->setTfootData([['First name', 'Last name', 'Email', 'Homepage']]);
    17. //$builder->setLineNumbers(1, 'left');
    18. $table = $builder->buildTable();
    19. $labeller = new Labeller(['First name', 'Last name', 'Email', 'Homepage']);
    20. echo $labeller->useInTable($table);
    21.  
    Highlighted with GeSHi 1.0.9.1
  • Execution result as HTML5 flow
    RowFirst nameLast nameEmailHomepage
    1.SamiHolcksami.holck@gmail.comhttp://samiholck.com
    2.JohnDoejohn.doe@unknown.no-

References: