Niouzes

< Novembre 2021 >
Lu Ma Me Je Ve Sa Di
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30          

Citation

Attention

The documentation is incomplete. The Vae Soli! team works hard to make it as exhaustive as possible with tons of useful examples and easy to understand explanations.

On top of that, we have decided to use our own tool to generate the documentation you read. This also takes time to fine-tune. Our goal is have better documentation, easier to read, easier to use, completely integrated with our site.

Even though NOT finalized, you can now link back to our documentation pages as we have decided once and for all about the structure of our documents and where they all reside on our server.

Thank you very much
The Vae Soli! team.

2020-01-18 à 01:24:43

Table Of Contents

  1. FOUNDATION (functions) (01/04/2015)
  2. LSAction (class) (01/04/2015)
  3. LSAddress (class) (01/04/2015)
  4. LSAdministrativeArea (class) (01/04/2015)
  5. LSApplication (class) (14/10/2013)
  6. LSArray (class) (14/10/2013)
  7. LSArticle (class) (18/02/2014)
  8. LSAssertion (class) (14/10/2013)
  9. LSAudience (class) (18/02/2014)
  10. AUTOLOAD (function) (21/04/2014)
  11. LSAutoReference (class) (14/10/2013)
  12. LSBag (class) (14/10/2013)
  13. LSBBCodes (class) (10/06/2014)
  14. LSBrowser (class) (14/10/2013)
  15. LSCache (class) (14/10/2013)
  16. LSCalculator (class) (14/10/2013)
  17. LSCalendar (class) (14/10/2013)
  18. LSCameraSnapshot (class) (14/10/2013)
  19. LSCitation (class) (14/10/2013)
  20. LSClass (class) (14/10/2013)
  21. LSCode (class) ()
  22. Colors (functions) (18/01/2020)
  23. LSContactForm (class) (14/10/2013)
  24. LSContainer (class) (14/10/2013)
  25. LSContents (class) (14/10/2013)
  26. LSContentsAccounts (class) (14/10/2013)
  27. LSContentsArticles (class) (14/10/2013)
  28. LSContentsAtomicClock (class) (14/10/2013)
  29. LSContentsBusinessCoordinates (class) (14/10/2013)
  30. LSContentsBusinessOff (class) (14/10/2013)
  31. LSContentsBusinessOpeningHours (class) (14/10/2013)
  32. LSContentsBreadcrumb (class) (14/10/2013)
  33. LSContentsCalendar (class) (14/10/2013)
  34. LSContentsCatalogue (class) (14/10/2013)
  35. LSContentsCharter (class) (18/02/2014)
  36. LSContentsCitation (class) (14/10/2013)
  37. LSContentsClock (class) (14/10/2013)
  38. LSContentsComments (class) (14/10/2013)
  39. LSContentsCookieUsage (class) (14/10/2013)
  40. LSContentsCountdown (class) (14/10/2013)
  41. LSContentsDatetime (class) (14/10/2013)
  42. LSContentsHeartbeat (class) (14/10/2013)
  43. LSContentsIFrame (class) (14/10/2013)
  44. LSContentsImageGallery (class) (14/10/2013)
  45. LSContentsLanguageSwitchers (class) (14/10/2013)
  46. LSContentsLegal (class) (18/02/2014)
  47. LSContentsMicronews (class) (14/10/2013)
  48. LSContentsMyAccount (class) (14/10/2013)
  49. LSContentsPaymentOptions (class) (14/10/2013)
  50. LSContentsPinboard (class) (14/10/2013)
  51. LSContentsRememberPassword (class) (14/10/2013)
  52. LSContentsRSS (class) (14/10/2013)
  53. LSContentsSiteManager (class) (14/10/2013)
  54. LSContentsSitemap (class) (14/10/2013)
  55. LSContentsShare (class) (14/10/2013)
  56. LSContentsStopwatch (class) (14/10/2013)
  57. LSContentsTagCloud (class) (14/10/2013)
  58. LSContentsTodosOnPage (class) (14/10/2013)
  59. LSContentsW3C (class) (14/10/2013)
  60. LSContentsWeather (class) (14/10/2013)
  61. LSControl (class) (14/10/2013)
  62. LSCreativeWork (class) (18/02/2014)
  63. LSCursor (class) (09/03/2015)
  64. LSCustomer (class) (14/10/2013)
  65. LSDataEnvironment (class) (14/10/2013)
  66. Dates (functions) (01/04/2015)
  67. LSDate (class) (14/10/2013)
  68. LSDictionary (class) (14/10/2013)
  69. LSDom, LSDomNode and LSXPath (class) (30/04/2014)
  70. LSErrors and LSError (classes) (14/10/2013)
  71. LSException (class) (16/10/2013)
  72. LSExplorer (class) (14/10/2013)
  73. LSFieldset (class) (14/10/2013)
  74. LSFile (class) (14/10/2013)
  75. LSFileProperties (class) (14/10/2013)
  76. Files (functions) (01/04/2015)
  77. Finance (functions) (01/04/2015)
  78. LSFootnotes (class) (22/02/2014)
  79. LSForm (class) (09/06/2014)
  80. LSFunction (class) (14/10/2013)
  81. LSGeorama (class) (24/10/2013)
  82. LSGeoramaVar (class) (24/10/2013)
  83. LSGlossary (class) (09/03/2015)
  84. LSGroup (class) (14/10/2013)
  85. HTML (functions) (01/04/2015)
  86. LSHttp (class) (14/10/2013)
  87. HTTP (functions) (01/04/2015)
  88. LSImageGallery (class) (14/10/2013)
  89. Images (functions) (01/04/2015)
  90. LSInput (class) (26/04/2014)
  91. IP (functions) (01/04/2015)
  92. LSIslandAbstract (14/10/2013)
  93. LSIslandFormAbstract (class) (14/10/2013)
  94. LSLabel (class) (14/10/2013)
  95. LSLanguageSwitchers (class) (14/10/2013)
  96. LSLatin (class) (14/10/2013)
  97. LSLegalPerson (class) (14/10/2013)
  98. LSLinkedList (class) (14/10/2013)
  99. LSList (class) (14/10/2013)
  100. Mails (functions) (01/04/2015)
  101. LSMap (class) (14/10/2013)
  102. Math (functions) (01/04/2015)
  103. LSMicronews (class) (18/02/2014)
  104. Miscellaneous (functions) (01/04/2015)
  105. LSModuleAbstract (class) (14/10/2013)
  106. LSNaturalPerson (class) (14/10/2013)
  107. LSNewsArticle (class) (18/02/2014)
  108. LSNote (class) (14/10/2013)
  109. LSMotherNature (class) (16/10/2013)
  110. LSPage (class) (18/02/2014)
  111. LSParameter (class) (14/10/2013)
  112. LSPaymentOptions (class) (14/10/2013)
  113. LSPeopleAudience (class) (18/02/2014)
  114. LSPerson (class) (14/10/2013)
  115. LSPlace (class) (18/02/2014)
  116. LSProperty (class) (14/10/2013)
  117. LSPublication (class) (14/10/2013)
  118. LSRequirement (class) (14/10/2013)
  119. LSReturn (class) (24/10/2013)
  120. LSRisk (class) (14/10/2013)
  121. LSSentanaiAbstract (14/10/2013)
  122. LSServiceMessage (class) (14/10/2013)
  123. LSSession (class) (14/10/2013)
  124. LSSiteManager (class) (14/10/2013)
  125. LSSitemap (class) (14/10/2013)
  126. LSSockets (class) (14/10/2013)
  127. LSSoftwareApplication (class) (18/02/2014)
  128. LSSource (class) (14/10/2013)
  129. Strings (functions) (31/07/2016)
  130. LSSupplier (class) (14/10/2013)
  131. System (functions) (01/04/2015)
  132. LSTag (class) (21/04/2014)
  133. LSTagCloud (class) (14/10/2013)
  134. LSTechArticle (class) (18/02/2014)
  135. LSThing (class) (18/02/2014)
  136. LSTimeline (class) (14/10/2013)
  137. LSTimer (class) (16/10/2013)
  138. LSTracer (class) (09/03/2015)
  139. LSUnitTesting (class) (14/10/2013)
  140. URL (functions) (01/04/2015)
  141. LSUser (class) (09/03/2015)
  142. LSUserMgr (class) (14/10/2013)
  143. LSVaesoli (class) (09/06/2014)
  144. LSVersion (class) (14/10/2013)
  145. LSWebSite (class) (14/10/2013)
  146. LSWidget (class) (14/10/2013)
  147. LSWireTransferForm (class) (14/10/2013)
  148. LSXMLSitemap (class) (14/10/2013)
  149. XML (functions) (01/04/2015)

LSTag.class.php

Generated by The Vae Soli! Documentor: Guide v. 1.3.0018 on 21-04-2014 09:31:40 (DD-MM-YYYY HH:mm:SS). This documentation is built with Vae Soli! functions and classes!

File Properties

C:\websites\vaesoli.org\www\httpdocs/vaesoli/include/LSTag.class.phpC:\websites\vaesoli.org\www\httpdocs\vaesoli\include\LSTag.class.phpapplication/force-downloadC:\websites\vaesoli.org\www\httpdocs\vaesoli\include130178 bytes03/08/2013 23:27:5321/04/2014 09:29:3021/04/2014 09:29:30

Compliance

Assertions count: 20

Assertions successful: 20

Assertion failures: 0

Early Warning

LSTag.class.php exceeds 51200 bytes. We suggest this file got broken down in smaller chunks!

LSTag.class.php contains 2660 lines of code, which exceeds the suggested limit of 1024 lines. We suggest this file got broken down in smaller chunks!

Manifest Constants

LS_TAG_CLASS_PWH: Define "LS" Tag (Pat Was Here)

VAESOLI_PATH: Define the path where Vae Soli! is installed

VAESOLI_PLUGINS: Define the path where plugins are located

Sources required

LSInput.class.inc: Manifest constants defined for input support

LSStrings.functions.php: String functions

LSMisc.functions.php: Miscellaneous functions

Classes

LSTagGeneric services to create (X)HTML tags, controls and containers

Properties
NameVisibilityTypeDescription
$IsVisible public bool Indicates whether the tag must be kept visible or not (true by default)
$aCustomData public array Array of HTML5 "data-..." attributes
$aGenes public array Gene of the object. null by default. When a container (LSContainer) implements a genome ($szGenome), one of the current object's genes must match the genome of the container as to be included; otherwise it is simply disregarded at the time of the rendering (gene expression) of the container
$aObjects public array Array of inner objects
$iHeight public int Height of the tag (used in style="...")
$iIndentLevel public int If a tag requires some indentation, you can specify it here (indentation level)
$iIndentSpaces public int If a tag requires some indentation, you can specify it here (number of spaces BY indentation level)
$iInstance public int Current instance number
$iInstances public int Number of active instances of this class
$iLeft public int Left position of the tag (used in style="...")
$iLevel public int Level of a heading (e.g. h1 .. h6)
$iTop public int Top position of the tag (used in style="...")
$iWidth public int Width of the tag (used in style="...")
$oContainer public object Parent container (if any)
$szBrowser public string The browser of the user
$szClass public string CSS class of the tag
$szDesc public string Description of the tag
$szGUID public string Tag GUID
$szID public string ID of the tag
$szInnerLeader public string Tag inner leader part (leader<tag>innerLeader...innerTrailer</tag>trailer )
$szInnerTrailer public string Tag inner trailer part (leader<tag>innerLeader...innerTrailer</tag>trailer )
$szLang public string Language of the tag
$szLeader public string Tag leading part (leader<tag>innerLeader...innerTrailer</tag>trailer )
$szName public string Name of the tag (if appropriate)
$szName public string Comment associated to the tag
$szOnBlur public string onblur clause
$szOnChange public string onchange clause
$szOnClick public string onclick clause
$szOnFocus public string onfocus clause
$szOnKeyDown public string onkeydown clause
$szOnKeyPress public string onkeypress clause
$szOnKeyUp public string onkeyup clause
$szOnLoad public string onload clause
$szOnMouseOver public string onmouseover clause
$szOnSelect public string onselect clause
$szOnSubmit public string onsubmit clause
$szOnUnLoad public string onunload clause
$szPixels public string The unit that is used to mention a positioning (can be 'px', 'em', ...)
$szPlatform public string The platform of the user (Mac, Windows, Linux, iOS, ...)
$szStyle public string Style of the tag (style="...")
$szText public string Inner text associated with the control (eg. <div>text</div>)
$szTitle public string title="..."
$szTooltip public string Tooltip associated to the tag (has precedence over $szTitle)
$szTrailer public string Tag trailing part (leader<tag>innerLeader...innerTrailer</tag>trailer )
$szType public string Tag type (eg. 'p','div','section',...)
$szValue public string Value of the tag
Methods
  1. __construct(): Creates a tag
  2. AddAbject(): Adds an object to the current object (provided that the current object is a suitable container for the object to add)
  3. AddCustomData(): Adds a custom data attribute
  4. AddItem(): Adds an item to a tag that can accept inner items
  5. AddItems(): Adds items to a combobox, an ordered list (ol), an unordered list(ul), or any control/tag that supports this feature
  6. BuildAlt(): Generates the 'alt' of the tag (if any)
  7. BuildCite(): Generates the cite attribute (URI)
  8. BuildClass(): Builds the class attribute of the tag ('LSInputRequired' added if tag is a mandatory tag)
  9. BuildIndent(): Generates necessary indentation spaces
  10. BuildLang(): Generates the language of the tag (if any)
  11. BuildSrcset(): Generates the 'srcset' of the tag (if any)
  12. BuildTitle(): Generates the title of the tag (if any)
  13. ClearCustomData(): Clears all custom data attributes
  14. DelCustomData(): Deletes a custom data attribute
  15. PopulateFromArray(): Populate control from the values found in the $szRecordSource if this property is an array (contrary to what the $szRecordSource variable/property prefix suggests)
  16. PopulateFromValues(): Populate control from the values found in the $szRecordSource property
  17. PopulateFromXML(): Populate control from the values found in an XML file if $szRecordSource holds a reference to such an XML file.
  18. Render(): Generates the HTML code of the tag
  19. RenderItems(): Renders the inner items of a tag
__construct(): Creates a tag

[ back to method list ]

Syntax

__construct( $szType,$szID,$szClass,$szStyle,$szText )

Parameters
NameTypeDescription
$szType string Tag type ( 'p', 'div', 'ol', ... ). Optional. 'p' by default
$szID string Tag ID (id="..."). Optional. null by default
$szClass string Tag ID (class="..."). Optional. null by default
$szStyle string Tag style (style="..."). Optional. null by default
$szText string Tag text (

...

). Optional. null by default
Parameters Warning

__construct() uses 5 parameters whereas the suggested limit is 3.

Example Executed
$oImg = new LSTag('img');
echo htmlentities( $szHTML = $oImg->Render() );
echo LSUnitTesting::assert( strstr( $szHTML,'<img' )                            ,
                            'ASSERTION SUCCESS: image tag successfully created' ,
                            'ASSERTION FAILURE: image tag COULD NOT be created' ,
                            'GuideAssert' );
$oImg->szSrcset = 'image1.jpg 1x,image2.jpg 2x';
echo htmlentities( $szHTML = $oImg->Render() );
echo LSUnitTesting::assert( strstr( $szHTML,'srcset=' )                         ,
                            'ASSERTION SUCCESS: srcset detection OK' ,
                            'ASSERTION FAILURE: no srcset detection' ,
                            'GuideAssert' );

$oP = new LSTag('p');
$oP->szText = 'Hello World';
echo htmlentities( $szHTML = $oP->Render() );

echo LSUnitTesting::assert( strstr( $szHTML,'<p' ) && strstr( $szHTML,'Hello' )     ,
                            'ASSERTION SUCCESS: paragraph tag successfully created' ,
                            'ASSERTION FAILURE: paragraph tag COULD NOT be created' ,
                            'GuideAssert' );

<img src="" />

GuideAssert() ... ASSERTION SUCCESS: image tag successfully created

<img srcset="image1.jpg 1x,image2.jpg 2x" src="" />

GuideAssert() ... ASSERTION SUCCESS: srcset detection OK

<p>Hello World</p>

GuideAssert() ... ASSERTION SUCCESS: paragraph tag successfully created

Unit Testing

3 assertions: 3 successful; 0 failed

AddAbject(): Adds an object to the current object (provided that the current object is a suitable container for the object to add)

[ back to method list ]

Syntax

AddAbject( $oObj )

Parameters
NameTypeDescription
$oObj LSTag The LSTag object to add
Return

(void)

Examples Executed
Example #1
$oDiv = new LSTag( 'div' );
$oP   = new LSTag( 'p' );
$oP->szText = 'Hello World';
$oDiv->AddObject( $oP );

echo htmlentities( $szHTML = (string) $oDiv );

echo LSUnitTesting::assert( strstr( $szHTML,'<div><p>' )                            ,
                            'ASSERTION SUCCESS: div and p tags successfully created',
                            'ASSERTION FAILURE: div and p tags COULD NOT be created',
                            'GuideAssert' );

<div><p>Hello World</p></div>

GuideAssert() ... ASSERTION SUCCESS: div and p tags successfully created

Example #2
// Create a figure
$oFigure        = new LSTag( 'figure' );

// Create an image
$oImg           = new LSTag( 'img' );
$oImg->szSrc    = '/vaesoli/resources/images/continent.jpg';
$oImg->szSrcset = '/vaesoli/resources/images/continent-saturate-loss.jpg 1x, ' .
                  '/vaesoli/resources/images/continent-saturate-high.jpg 2x';
$oImg->szAlt    = 'A digital continent as an example of Vae Soli! image functions';

// Add the image to the figure
$oFigure->AddObject( $oImg );

// Create a caption for the figure
$oFigCaption    = new LSTag( 'figcaption' );
$oFigCaption->szText = 'A digital continent ';

// Create an anchor
$oA             = new LSTag( 'a' );
$oA->szText     = 'by Pat Boens';
$oA->szHref     = 'https://plus.google.com/112760916678066650470';

// Add the anchor to the caption of the figure
$oFigCaption->AddObject( $oA );

// Add the caption to the figure
$oFigure->AddObject( $oFigCaption );

// Show the figure
echo $oFigure;

// Show the HTML code of the figure
echo '<code>',wordwrap( htmlentities( $szHTML = $oFigure->Render() ),85 ),'</code>';

echo LSUnitTesting::assert( preg_match( '%<figure><img.*?<figcaption>.*?<a.*?></figcaption></figure>%s',$szHTML ),
                            'ASSERTION SUCCESS: figure, image, figcaption and a tags successfully created'       ,
                            'ASSERTION FAILURE: figure, image, figcaption and a tags COULD NOT be created'       ,
                            'GuideAssert' );

A digital continent as an example of Vae Soli! image functions
A digital continent by Pat Boens
<figure><img alt="A digital continent as an example of Vae Soli! image functions" srcset="/vaesoli/resources/images/continent-saturate-loss.jpg 1x, /vaesoli/resources/images/continent-saturate-high.jpg 2x" src="/vaesoli/resources/images/continent.jpg" /><figcaption>A digital continent <a href="https://plus.google.com/112760916678066650470">by Pat Boens</a></figcaption></figure>

GuideAssert() ... ASSERTION SUCCESS: figure, image, figcaption and a tags successfully created

Unit Testing

2 assertions: 2 successful; 0 failed

AddCustomData(): Adds a custom data attribute

[ back to method list ]

Remark

The MISC_CastString() function is applied on the $xValue parameter when code generation is requested (via Render())

Syntax

AddCustomData( $szKey,$xValue )

Parameters
NameTypeDescription
$szKey string Custom data attribute name
$xValue mixed The value of the custom data attribute. Usually a string
Return

(void)

Example Executed
$oDiv = new LSTag( 'div' );
$oDiv->AddCustomData( 'role' ,'page' );
$oDiv->AddCustomData( 'theme','burgundi' );
$szHTML = $oDiv->Render();

echo LSUnitTesting::assert( preg_match( '/(data-role="page").+(data-theme="burgundi")/s',$szHTML )  ,
                            'ASSERTION SUCCESSFUL: data-role and data-theme found'                  ,
                            'ASSERTION FAILURE: not the expected result!'                           ,
                            'GuideAssert' );

// Change the theme attribute
$oDiv->AddCustomData( 'theme','crimson' );
$szHTML = $oDiv->Render();

echo LSUnitTesting::assert( preg_match( '/(data-role="page").+(data-theme="crimson")/s',$szHTML )   ,
                            'ASSERTION SUCCESSFUL: data-theme successfully modified to crimson'     ,
                            'ASSERTION FAILURE: not the expected result!'                           ,
                            'GuideAssert' );

// Discard the theme attribute (same as DelCustomData())
$oDiv->AddCustomData( 'theme',null );
$szHTML = $oDiv->Render();

echo LSUnitTesting::assert( preg_match( '/(data-role="page")/s',$szHTML ) &&
                            ! preg_match( '/(data-theme="burgundi")/s',$szHTML )            ,
                            'ASSERTION SUCCESSFUL: data-role found but data-theme NOT found',
                            'ASSERTION FAILURE: not the expected result!'                   ,
                            'GuideAssert' );

// Extensive example that mimics JQuery Mobile (very partial implementation)
// -------------------------------------------------------------------------
$oDiv = new LSTag( 'div','page-1' );
$oDiv->AddCustomData('role','page' );

$oStyle = new LSTag( 'style' );

$oStyle->szText = "\n[data-role=content] { background:#eee;\n" .
    "padding:1.5em; }\n\n";

$oStyle->szText .= "[data-role=header],[data-role=footer] { background: #7db9e8;\n"     .
    "background: linear-gradient(to bottom, #7db9e8 0%,#2989d8 50%,#1e5799 100%);\n"    .
    "height: 4em;\n"                                                                    .
    "line-height: 4em;\n"                                                               .
    "vertical-align: middle;\n"                                                         .
    "text-align: center;\n"                                                             .
    "font-weight: bold;\n"                                                              .
    "color: #fff;\n"                                                                    .
    "overflow: hidden; }\n\n";

$oStyle->szText .= "[data-icon=home] { background:#779bef;\n"           .
    "background: url(/vaesoli/resources/icons/home01.png) "             .
    "4px center no-repeat,"                                             .
    "linear-gradient(to bottom,#779bef 0%,#2989d8 63%,#174177 100%);\n" .
    "padding: .5em 1em .5em 24px;\n"                                    .
    "border: 1px solid #444;\n"                                         .
    "line-height:1em;\n"                                                .
    "color: #fff;\n"                                                    .
    "text-decoration:none;\n"                                           .
    "display: inline-block;\n"                                          .
    "position:relative;\n"                                              .
    "right: 45%;\n"                                                     .
    "bottom: 135%;\n"                                                   .
    "border-radius: .5em; }\n\n";

$oStyle->szText .= "[data-role=header] h1,"                             .
                   "[data-role=footer] h1,"                             .
                   "[data-role=header] p, "                             .
                   "[data-role=footer] p { white-space: nowrap; " . 
                   "color: #fff; margin: 0; padding: 0; }\n\n";

$oStyle->szText .= "[data-role=button] { background: "                      .
    "linear-gradient(to bottom, #d3d7da 0px, #dee3e5 100%) transparent;\n"  .
    "border-bottom: 1px solid #d3d7da;\n"                                   .
    "border-left: 1px solid #d3d7da;\n"                                     .
    "border-radius: .5em;\n"                                                .
    "border-right: 1px solid #d3d7da;\n"                                    .
    "box-shadow: 0px 20px 15px -15px rgba(0, 0, 0, 0.506);\n"               .
    "color: #000;\n"                                                        .
    "font-family: \"Trebuchet MS\",\"Arial\",\"Helvetica\",sans-serif;\n"   .
    "font-size: 1.3em;\n"                                                   .
    "letter-spacing: -1px;\n"                                               .
    "line-height: 1.2em;\n"                                                 .
    "min-height: 2em;\n"                                                    .
    "margin: 1em 0 1em 0;\n"                                                .
    "padding: 1em 0 0 1em;\n"                                               .
    "text-align:center;\n"                                                  .
    "font-weight: bold;\n"                                                  .
    "word-spacing: 2px;\n"                                                  .
    "display:block;\n"                                                      .
    "text-decoration: none; }\n";

$oHeader = new LSTag( 'div' );
$oHeader->AddCustomData('role','header' );

$oA = new LSTag( 'a' );
$oA->szText = 'Home';
$oA->szHref = '/';
$oA->AddCustomData( 'icon','home' );
$oA->szTooltip = "Get back to the homepage of Vae Soli!";

$oH1_a = new LSTag( 'h1' );
$oH1_a->szText = 'Welcome';

$oHeader->AddObject( $oH1_a );
$oHeader->AddObject( $oA );

$oContent = new LSTag( 'div' );
$oContent->AddCustomData('role','content' );

$oP = new LSTag( 'p' );
$oP->szText = 'This can be the content of a mobile web app!';

$oA2 = new LSTag( 'a' );
$oA2->szText = 'Go to documentation';
$oA2->szHref = '/documentation/';
$oA2->AddCustomData( 'role','button' );
$oA2->szTooltip = "Go directly to the documentation of Vae Soli! (page 1)";

$oContent->AddObject( $oP );
$oContent->AddObject( $oA2 );

$oFooter = new LSTag( 'div' );
$oFooter->szText = 'Footer';
$oFooter->AddCustomData( 'role','footer' );

$oDiv->AddObject( $oStyle );
$oDiv->AddObject( $oHeader );
$oDiv->AddObject( $oContent );
$oDiv->AddObject( $oFooter );

// End of the extensive example that mimics JQuery Mobile
// ------------------------------------------------------

echo "\nLet's see what code Vae Soli! did generate:\n\n";
echo wordwrap( htmlentities( $szHTML = $oDiv->Render() ) );

// Now let's see how it looks like
// -------------------------------
echo "\n\n\nLet's see the result now:\n\n";
echo $szHTML;

echo LSUnitTesting::assert( preg_match( '%<div id="page-1"%s',$szHTML )     && 
                            preg_match( '%\[data-icon=home\]%s',$szHTML )   &&
                            preg_match( '%data-role="page"%s',$szHTML )     ,
                            'ASSERTION SUCCESSFUL: the page seems to be OK' ,
                            'ASSERTION FAILURE: not the expected result!'   ,
                            'GuideAssert' );

GuideAssert() ... ASSERTION SUCCESSFUL: data-role and data-theme found

GuideAssert() ... ASSERTION SUCCESSFUL: data-theme successfully modified to crimson

GuideAssert() ... ASSERTION SUCCESSFUL: data-role found but data-theme NOT found

Let's see what code Vae Soli! did generate: <div id="page-1" data-role="page"><style> [data-role=content] { background:#eee; padding:1.5em; } [data-role=header],[data-role=footer] { background: #7db9e8; background: linear-gradient(to bottom, #7db9e8 0%,#2989d8 50%,#1e5799 100%); height: 4em; line-height: 4em; vertical-align: middle; text-align: center; font-weight: bold; color: #fff; overflow: hidden; } [data-icon=home] { background:#779bef; background: url(/vaesoli/resources/icons/home01.png) 4px center no-repeat,linear-gradient(to bottom,#779bef 0%,#2989d8 63%,#174177 100%); padding: .5em 1em .5em 24px; border: 1px solid #444; line-height:1em; color: #fff; text-decoration:none; display: inline-block; position:relative; right: 45%; bottom: 135%; border-radius: .5em; } [data-role=header] h1,[data-role=footer] h1,[data-role=header] p, [data-role=footer] p { white-space: nowrap; color: #fff; margin: 0; padding: 0; } [data-role=button] { background: linear-gradient(to bottom, #d3d7da 0px, #dee3e5 100%) transparent; border-bottom: 1px solid #d3d7da; border-left: 1px solid #d3d7da; border-radius: .5em; border-right: 1px solid #d3d7da; box-shadow: 0px 20px 15px -15px rgba(0, 0, 0, 0.506); color: #000; font-family: "Trebuchet MS","Arial","Helvetica",sans-serif; font-size: 1.3em; letter-spacing: -1px; line-height: 1.2em; min-height: 2em; margin: 1em 0 1em 0; padding: 1em 0 0 1em; text-align:center; font-weight: bold; word-spacing: 2px; display:block; text-decoration: none; } </style><div data-role="header"><h1>Welcome</h1><a title="Get back to the homepage of Vae Soli!" data-icon="home" href="/">Home</a></div><div data-role="content"><p>This can be the content of a mobile web app!</p><a title="Go directly to the documentation of Vae Soli! (page 1)" data-role="button" href="/documentation/">Go to documentation</a></div><div data-role="footer">Footer</div></div> Let's see the result now:

Welcome

Home

This can be the content of a mobile web app!

Go to documentation
Footer

GuideAssert() ... ASSERTION SUCCESSFUL: the page seems to be OK

Unit Testing

4 assertions: 4 successful; 0 failed

AddItem(): Adds an item to a tag that can accept inner items

[ back to method list ]

Remark

The AddItem() method applies on few tags:
combo like tags
lists (ol,ul,dl)
datalist

Syntax

AddItem( $szItem,$szValue )

Parameters
NameTypeDescription
$szItem string Option/item to add
$szValue string Value assigned to $szItem.
Examples Executed
Example #1
// Generate an unordered list
$oUL = new LSTag( 'ul' );
$oUL->AddItem( 'First' );
$oUL->AddItem( 'Second' );
$oUL->AddItem( 'Third' );
echo ( $szHTML = $oUL );
echo '<code>',htmlentities( $szHTML ),'</code>';
echo LSUnitTesting::assert( $szHTML == '<ul><li>First</li><li>Second</li><li>Third</li></ul>'   ,
                            'ASSERTION SUCCESS: unordered list succesfully generated'           ,
                            'ASSERTION FAILURE: unordered list NOT generated correctly'         ,
                            'GuideAssert' );

  • First
  • Second
  • Third
<ul><li>First</li><li>Second</li><li>Third</li></ul>

GuideAssert() ... ASSERTION SUCCESS: unordered list succesfully generated

Example #2
// Generate a datalist
$oDatalist = new LSTag( 'datalist','urls' );
$oDatalist->AddItem( 'Vae Soli'             ,'http://www.vaesoli.org'   );
$oDatalist->AddItem( 'FastWrite'            ,'http://www.fastwrite.com' );
$oDatalist->AddItem( 'Lato Sensu Management','http://www.latosensu.be'  );

$szHTML = (string) $oDatalist;
echo '<code>',wordwrap( htmlentities( $szHTML ),85 ),'</code>';

echo LSUnitTesting::assert( preg_match('%<datalist id="urls">.*?</datalist>%s',$szHTML ),
                            'ASSERTION SUCCESS: datalist successfully generated'        ,
                            'ASSERTION FAILURE: datalist NOT generated correctly'       ,
                            'GuideAssert' );

// Generate an input zone
$oInput = new LSInput( 'text','txtInput','txtInput' );

// Attach the datalist to the input zone
$oInput->AddObject( $oDatalist );

// Generate the input zone + datalist
echo ( $szHTML = $oInput ),'<br />';

// Show how this HTML code looks like
echo '<code>',wordwrap( htmlentities( $szHTML ),85 ),'</code>';

echo LSUnitTesting::assert( preg_match( '%<input +type="text".*'                                        .
                                        'list="urls" +?/><datalist id="urls">.*?</datalist>%s',$szHTML ),
                            'ASSERTION SUCCESS: input zone + datalist successfully generated'           ,
                            'ASSERTION FAILURE: input zone + datalist NOT generated correctly'          ,
                            'GuideAssert' );

<datalist id="urls"><option
value="http://www.vaesoli.org" label="Vae Soli" /><option
value="http://www.fastwrite.com" label="FastWrite"
/><option value="http://www.latosensu.be" label="Lato Sensu
Management" /></datalist>

GuideAssert() ... ASSERTION SUCCESS: datalist successfully generated


<input type="text" value="" id="txtInput" name="txtInput" list="urls" /><datalist id="urls"><option value="http://www.vaesoli.org" label="Vae Soli" /><option value="http://www.fastwrite.com" label="FastWrite" /><option value="http://www.latosensu.be" label="Lato Sensu Management" /></datalist>

GuideAssert() ... ASSERTION SUCCESS: input zone + datalist successfully generated

Unit Testing

3 assertions: 3 successful; 0 failed

AddItems(): Adds items to a combobox, an ordered list (ol), an unordered list(ul), or any control/tag that supports this feature

[ back to method list ]

Syntax

AddItems( $szItems )

Parameters
NameTypeDescription
$szItems string A tokenized list of items (',' or ';' separated)
Return

(void)

Unit Testing

WARNING: No Unit Testing found. Please provide assertions with assertion constructs ({*assert ... *}) or with GuideAssert() function calls in exec constructs ({*exec ... *}).

PROTECTED BuildAlt(): Generates the 'alt' of the tag (if any)

[ back to method list ]

Syntax

BuildAlt()

Parameters

None

Return

(string) The alt attribute ' alt="..."';

Example Executed
$oP   = new LSTag();
$oImg = new LSTag( 'img' );
$oImg->szSrc = '/vaesoli/resources/images/continent-saturate-loss.jpg';
$oImg->szAlt = 'A saturate loss image as an example of Vae Soli! image functions';
$oP->AddObject( $oImg );

echo ( $szHTML = $oP );

echo LSUnitTesting::assert( strstr( $szHTML,'<p><img' )                             ,
                            'ASSERTION SUCCESS: p and img tags created successfully',
                            'ASSERTION FAILURE: p and img tags COULD NOT be created',
                            'GuideAssert' );
echo LSUnitTesting::assert( strstr( $szHTML,'alt="A saturate' )                         ,
                            'ASSERTION SUCCESS: img alt attribute created successfully' ,
                            'ASSERTION FAILURE: img alt attribute COULD NOT be created' ,
                            'GuideAssert' );

A saturate loss image as an example of Vae Soli! image functions

GuideAssert() ... ASSERTION SUCCESS: p and img tags created successfully

GuideAssert() ... ASSERTION SUCCESS: img alt attribute created successfully

Unit Testing

2 assertions: 2 successful; 0 failed

PROTECTED BuildCite(): Generates the cite attribute (URI)

[ back to method list ]

Docs

The cite attribute @W3C:

Syntax

BuildCite()

Parameters

None

Return

(string) The 'cite' attribute

Example Executed
$oQuote = new LSTag('blockquote');
$oQuote->szText = 'This is the quote';
$oQuote->szCite = 'http://www.quote.com/sample.html';
echo htmlentities( $szHTML = $oQuote );

echo LSUnitTesting::assert( strstr( $szHTML,'cite="http://www.quote.com/sample.html"' ) ,
                            'ASSERTION SUCCESS: cite detection OK'                      ,
                            'ASSERTION FAILURE: no cite!'                               ,
                            'GuideAssert' );

<blockquote cite="http://www.quote.com/sample.html">This is the quote</blockquote>

GuideAssert() ... ASSERTION SUCCESS: cite detection OK

Unit Testing

1 assertions: 1 successful; 0 failed

PROTECTED BuildClass(): Builds the class attribute of the tag ('LSInputRequired' added if tag is a mandatory tag)

[ back to method list ]

Syntax

BuildClass()

Parameters

None

Return

(string) The ' class="..."' attribute

Unit Testing

WARNING: No Unit Testing found. Please provide assertions with assertion constructs ({*assert ... *}) or with GuideAssert() function calls in exec constructs ({*exec ... *}).

BuildIndent(): Generates necessary indentation spaces

[ back to method list ]

Syntax

BuildIndent()

Parameters

None

Return

(string) A number of spaces depending on the indentation level

Unit Testing

WARNING: No Unit Testing found. Please provide assertions with assertion constructs ({*assert ... *}) or with GuideAssert() function calls in exec constructs ({*exec ... *}).

PROTECTED BuildLang(): Generates the language of the tag (if any)

[ back to method list ]

Author

Syntax

BuildLang()

Parameters

None

Return

(string) Language clause of the tag (lang="...")

Assertions

true === true successful

Unit Testing

1 assertions: 1 successful; 0 failed

PROTECTED BuildSrcset(): Generates the 'srcset' of the tag (if any)

[ back to method list ]

Docs

The srcset attribute @W3C: ;
High DPI Images for Variable Pixel Densities from Boris Smus @html5rocks:

Syntax

BuildSrcset()

Parameters

None

Return

(string) The srcset attribute ' srcset="..."';

Example Executed
$oImg = new LSTag('img');
$oImg->szSrc = '/vaesoli/resources/images/continent.jpg';
$oImg->szSrcset = '/vaesoli/resources/images/continent-saturate-loss.jpg 1x, ' .
                  '/vaesoli/resources/images/continent-saturate-high.jpg 2x';
echo wordwrap( htmlentities( $szHTML = $oImg->Render() ),85 );
echo LSUnitTesting::assert( strstr( $szHTML,'srcset=' )              ,
                            'ASSERTION SUCCESS: srcset detection OK' ,
                            'ASSERTION FAILURE: no srcset detection' ,
                            'GuideAssert' );

<img srcset="/vaesoli/resources/images/continent-saturate-loss.jpg 1x,
/vaesoli/resources/images/continent-saturate-high.jpg 2x"
src="/vaesoli/resources/images/continent.jpg" />

GuideAssert() ... ASSERTION SUCCESS: srcset detection OK

Unit Testing

1 assertions: 1 successful; 0 failed

PROTECTED BuildTitle(): Generates the title of the tag (if any)

[ back to method list ]

Syntax

BuildTitle( $szTitle )

Parameters
NameTypeDescription
$szTitle string Optional title (tooltip)
Return

(string) Title clause of the tag (title="...")

Unit Testing

WARNING: No Unit Testing found. Please provide assertions with assertion constructs ({*assert ... *}) or with GuideAssert() function calls in exec constructs ({*exec ... *}).

ClearCustomData(): Clears all custom data attributes

[ back to method list ]

Syntax

ClearCustomData()

Parameters

None

Return

(void)

Example Executed
$oDiv = new LSTag( 'div' );
$oDiv->AddCustomData( 'role' ,'page' );
$oDiv->AddCustomData( 'theme','burgundi' );
$oDiv->ClearCustomData( 'theme' );
$szHTML = $oDiv->Render();

echo LSUnitTesting::assert( ! preg_match( '/(data-role=)/s',$szHTML ) &&
                            ! preg_match( '/(data-theme=)/s',$szHTML )                  ,
                            'ASSERTION SUCCESSFUL: data-role an data-theme NOT found'   ,
                            'ASSERTION FAILURE: not the expected result!'               ,
                            'GuideAssert' );

GuideAssert() ... ASSERTION SUCCESSFUL: data-role an data-theme NOT found

Unit Testing

1 assertions: 1 successful; 0 failed

DelCustomData(): Deletes a custom data attribute

[ back to method list ]

Syntax

DelCustomData( $szKey )

Parameters
NameTypeDescription
$szKey string Custom data attribute name
Return

(void)

Example Executed
$oDiv = new LSTag( 'div' );
$oDiv->AddCustomData( 'role' ,'page' );
$oDiv->AddCustomData( 'theme','burgundi' );
$oDiv->DelCustomData( 'theme' );
$szHTML = $oDiv->Render();

echo LSUnitTesting::assert( preg_match( '/(data-role="page")/s',$szHTML ) &&
                            ! preg_match( '/(data-theme="burgundi")/s',$szHTML )            ,
                            'ASSERTION SUCCESSFUL: data-role found but data-theme NOT found',
                            'ASSERTION FAILURE: not the expected result!'                   ,
                            'GuideAssert' );

// This deletes a custom that does not exist. This should do no harm
$oDiv->DelCustomData( 'piliu' );

GuideAssert() ... ASSERTION SUCCESSFUL: data-role found but data-theme NOT found

Unit Testing

1 assertions: 1 successful; 0 failed

PopulateFromArray(): Populate control from the values found in the $szRecordSource if this property is an array (contrary to what the $szRecordSource variable/property prefix suggests)

[ back to method list ]

Syntax

PopulateFromArray()

Parameters

None

Return

(void)

Unit Testing

WARNING: No Unit Testing found. Please provide assertions with assertion constructs ({*assert ... *}) or with GuideAssert() function calls in exec constructs ({*exec ... *}).

PopulateFromValues(): Populate control from the values found in the $szRecordSource property

[ back to method list ]

Syntax

PopulateFromValues()

Parameters

None

Return

(void)

Unit Testing

WARNING: No Unit Testing found. Please provide assertions with assertion constructs ({*assert ... *}) or with GuideAssert() function calls in exec constructs ({*exec ... *}).

PopulateFromXML(): Populate control from the values found in an XML file if $szRecordSource holds a reference to such an XML file.

[ back to method list ]

Syntax

PopulateFromXML()

Parameters

None

Return

(void)

Unit Testing

WARNING: No Unit Testing found. Please provide assertions with assertion constructs ({*assert ... *}) or with GuideAssert() function calls in exec constructs ({*exec ... *}).

Render(): Generates the HTML code of the tag

[ back to method list ]

Modified: 21/04/2014 08:23

Author

Syntax

Render( $oContainer )

Parameters
NameTypeDescription
$oContainer LSControl The container of the current control. Optional. null by default.
Return

(void)

Assertions

true === true successful

Unit Testing

1 assertions: 1 successful; 0 failed

RenderItems(): Renders the inner items of a tag

[ back to method list ]

Remark

The RenderItems() method applies on few tags:
combo like tags
lists (ol,ul,dl)
datalist

Syntax

RenderItems( $d )

Parameters
NameTypeDescription
$d mixed Dummy parameter. Do not use it. null by default.
Unit Testing

WARNING: No Unit Testing found. Please provide assertions with assertion constructs ({*assert ... *}) or with GuideAssert() function calls in exec constructs ({*exec ... *}).

Précédent Suivant