HTML Helper

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

Loading this Helper

This helper is loaded using the following code:

loadHelper "html"

The following methods are available:

htmlBr()

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

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

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

htmlHeading()

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

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

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

htmlImg()

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

put htmlImg("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 htmlImg("images/picture.jpg", TRUE) into gData["myPic"]
-- gives <img src="http://site.com/index.irev/images/picture.jpg" />

Additionally, an associative array can be passed to the htmlImg() 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 htmlImg(tImgProperties) into gData["myPic"]
-- <img src="http://site.com/index.irev/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" />

htmlLinkTag()

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 and indexPage. 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.

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

Further examples:

put htmlLinkTag("favicon.ico", "shortcut icon", "image/ico") into gData["myIconLink"]
-- <link href="http://site.com/favicon.ico" rel="shortcut icon" type="image/ico" />

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

htmlNbs()

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

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

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

htmlOL()  and  htmlUL()

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

loadHelper "html"

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


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


put htmlUL(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:

loadHelper "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 htmlUL(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>suare</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>

htmlMeta()

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

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


put htmlMeta("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 htmlMeta(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 htmlMeta(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" />

htmlDocType()

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

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

put htmlDocType("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.irev

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