HTML Helper

The HTML Helper file contains handlers that assist in working with HTML.

Loading this Helper

This helper is loaded using the following code:

rigLoadHelper "html"

The following handlers are available:

rigHtmlBr()

Generates line break tags (<br />) based on the number you submit. Example:

put rigHtmlBr(3) into gData["threeBreaks"]

The above would produce: <br /><br /><br />

rigHtmlHeading()

Lets you create HTML <h1> tags. The first parameter will contain the data, the second the size of the heading. Example:

put rigHtmlHeading("Welcome!", 3) into gData["welcomeH"]

The above would produce: <h3>Welcome!</h3>

rigHtmlImg()

Lets you create HTML <img /> tags. The first parameter contains the image source. Example:

put rigHtmlImg("images/picture.jpg") into gData["myPic"]
-- gives <img src="http://site.com/images/picture.jpg" />

There is an optional second parameter that is a TRUE/FALSE value that specifics if the src should have the page specified by gConfig["indexPage"] added to the address it creates. Presumably, this would be if you were using a media controller.

put rigHtmlImg("images/picture.jpg", TRUE) into gData["myPic"]
-- gives <img src="http://site.com/index.lc/images/picture.jpg" />

Additionally, an associative array can be passed to the rigHtmlImg() function for complete control over all attributes and values.

put "images/picture.jpg" into tImgProperties["src"]
put "Me, demonstrating how to eat 4 slices of pizza at one time" into tImgProperties["alt"]
put "post_images" into tImgProperties["class"]
put "200" into tImgProperties["width"]
put "200" into tImgProperties["height"]
put "That was quite a night" into tImgProperties["title"]
put "lightbox" into tImgProperties["rel"]


put rigHtmlImg(tImgProperties) into gData["myPic"]
-- <img src="http://site.com/index.lc/images/picture.jpg" alt="Me, demonstrating how to eat 4 slices of pizza at one time" class="post_images" width="200" height="200" title="That was quite a night" rel="lightbox" />

rigHtmlLinkTag()

Lets you create HTML <link /> tags. This is useful for stylesheet links, as well as other links. The parameters are href, with optional rel, type, title, media, indexPage and cors. indexPage is a TRUE/FALSE value that specifies if the href should have the page specified by gConfig["indexPage"] added to the address it creates; cors is a boolean which adds the "crossorigin" attribute if set to TRUE.

put rigHtmlLinkTag("css/mystyles.css") into gData["myStyleLink"]
-- gives <link href="http://site.com/css/mystyles.css" rel="stylesheet" type="text/css" />

Further examples:

put rigHtmlLinkTag("favicon.ico", "shortcut icon", "image/ico") into gData["myIconLink"]
-- <link href="http://site.com/favicon.ico" rel="shortcut icon" type="image/ico" /> 
  
  
put rigHtmlLinkTag("feed", "alternate", "application/rss+xml", "My RSS Feed") into gData["myFeedLink"]
-- <link href="http://site.com/feed" rel="alternate" type="application/rss+xml" title="My RSS Feed" /> 

Additionally, an associative array can be passed to the rigHtmlLinkTag() function for complete control over all attributes and values.

put "css/printer.css" into tLink["href"]
put "stylesheet" into tLink["rel"]
put "text/css" into tLink["type"]
put "print" into tLink["media"]


put rigHtmlLinkTag(tLink) into gData["myStyleLink"]
-- <link href="http://site.com/css/printer.css" rel="stylesheet" type="text/css" media="print" />

Preloading a font:

put "assets/fonts/dosis-v7-latin-300.woff2" into tFontLinkDosis["href"]
put "preload" into tFontLinkDosis["rel"]
put "font/woff2" into tFontLinkDosis["type"]
put true into tFontLinkDosis["cors"]


put rigHtmlLinkTag(tFontLinkDosis) into gData["fontLinkDosis"]
 -- <link href="https://site.com/assets/fonts/dosis-v7-latin-300.woff2" rel="preload" type="font/woff2" crossorigin />

rigHtmlNbs()

Generates non-breaking spaces (&nbsp;) based on the number you submit. Example:

put rigHtmlNbs(3) into gData["threeNbs"]

The above would produce: &nbsp;&nbsp;&nbsp;

rigHtmlOL()  and  rigHtmlUL()

Permits you to generate ordered or unordered HTML lists from simple or multi-dimensional arrays. Example:

rigLoadHelper "html"

put "red,blue,green,yellow" into tList
split tList using comma


put "boldlist" into tAttributes["class"]
put "mylist" into tAttributes["id"]


put rigHtmlUL(tList, tAttributes) into gData["myUL"]

Note: You can use a comma separated list for the tList parameter. There is no need to use an array as in the example.

The above code will produce this:

<ul class="boldlist" id="mylist">
  <li>red</li>
  <li>blue</li>
  <li>green</li>
  <li>yellow</li>
</ul>

Here is a more complex example, using a multi-dimensional array:

rigLoadHelper "html"

put "boldlist" into tAttributes["class"]
put "mylist" into tAttributes["id"]


put "red" into tList[1]["colors"][1]
put "blue" into tList[1]["colors"][2]
put "green" into tList[1]["colors"][3]

put "round" into tList[2]["shapes"][1]
put "square" into tList[2]["shapes"][2]
put "ellipse" into tList[2]["shapes"][3]["circles"][1]
put "oval" into tList[2]["shapes"][3]["circles"][2]
put "sphere" into tList[2]["shapes"][3]["circles"][3]

put "happy" into tList[3]["moods"][1]
put "dejected" into tList[3]["moods"][2]["upset"][1]["defeated"][1]
put "disheartened" into tList[3]["moods"][2]["upset"][1]["defeated"][2]
put "depressed" into tList[3]["moods"][2]["upset"][1]["defeated"][3]
put "annoyed" into tList[3]["moods"][2]["upset"][2]
put "cross" into tList[3]["moods"][2]["upset"][3]
put "angry" into tList[3]["moods"][2]["upset"][4]


put rigHtmlUL(tList, tAttributes) into gData["myUL"]

The above code will produce this:

<ul class="boldlist" id="mylist">
  <li>colors
    <ul>
      <li>red</li>
      <li>blue</li>
      <li>green</li>
    </ul>
  </li>
  <li>shapes
    <ul>
      <li>round</li>
      <li>square</li>
      <li>circles
        <ul>
          <li>elipse</li>
          <li>oval</li>
          <li>sphere</li>
        </ul>
      </li>
    </ul>
  </li>
  <li>moods
    <ul>
      <li>happy</li>
      <li>upset
        <ul>
          <li>defeated
            <ul>
              <li>dejected</li>
              <li>disheartened</li>
              <li>depressed</li>
            </ul>
          </li>
          <li>annoyed</li>
          <li>cross</li>
          <li>angry</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>

rigHtmlMeta()

Helps you generate meta tags. You can pass strings to the function, or simple arrays, or multidimensional ones. Examples:

put rigHtmlMeta("description", "My Great site") into gData["desc"]
-- Generates:  <meta name="description" content="My Great Site" />


put rigHtmlMeta("Content-type", "text/html; charset=utf-8", "equiv") into gData["contType"] -- Note the third parameter.  Can be "equiv" or "name"
-- Generates:  <meta http-equiv="Content-type" content="text/html; charset=utf-8" />



put "robots" into tArray["name"]
put "no-cache" into tArray["content"]
put rigHtmlMeta(tArray) into gData["robMeta"]
-- Generates:  <meta name="robots" content="no-cache" />



put "robots" into tMeta[1]["name"]
put "no-cache" into tMeta[1]["content"]
put "description" into tMeta[2]["name"]
put "My Great Site" into tMeta[2]["content"]
put "keywords" into tMeta[3]["name"]
put "love, passion, intrigue, deception" into tMeta[3]["content"]
put "robots" into tMeta[4]["name"]
put "no-cache" into tMeta[4]["content"]
put "Content-type" into tMeta[5]["name"]
put "text/html; charset=utf-8" into tMeta[5]["content"]
put "equiv" into tMeta[5]["type"]


put rigHtmlMeta(tMeta) into gData["myMeta"]

-- Generates:  
-- <meta name="robots" content="no-cache" />
-- <meta name="description" content="My Great Site" />
-- <meta name="keywords" content="love, passion, intrigue, deception" />
-- <meta name="robots" content="no-cache" />
-- <meta http-equiv="Content-type" content="text/html; charset=utf-8" />

rigHtmlDocType()

Helps you generate document type declarations, or DTD's. XHTML 1.0 Strict is used by default, but many doctypes are available.

put rigHtmlDocType() into gData["docType"]
-- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

put rigHtmlDocType("html4-trans") into gData["docType"]
-- <!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

The following is a list of doctype choices. These are configurable, and pulled from application/config/doctypes.lc

Doctype Option Result
XHTML 1.1 "xhtml11" <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
XHTML 1.0 Strict "xhtml1-strict" <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
XHTML 1.0 Transitional "xhtml1-trans" <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
XHTML 1.0 Frameset "xhtml1-frame" <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
HTML 5 "html5" <!DOCTYPE html>
HTML 4 Strict "html4-strict" <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
HTML 4 Transitional "html4-trans" <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
HTML 4 Frameset "html4-frame" <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">