Skip to content

Latest commit

History

5 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

HTML generator built on top of kuiash/xml

The HTML library is just a layer on top of the kuiash XML lbrary, it is mostly boiler plate expansion where the element name is wrapped into a module export e.g. instead of typing xml.el('p', 'this text') you can type html.p('this text').

The calls still return an XNode so it can be freely used with the XML library.

Some of the functions produce an "unclosed" XNode, others do not, this is specified below.

No special checking is performed on which entry is in which (you can put a font inside a table header - it really doesn't care)

No tabs/spacing in Output

This is utterly deliberate - several HTML features will appear "buggy" to an end user if you put spacing in your HTML output files - for example li/ol/ul.

!DOCTYPE

This is one of the more fundamentally annoying parts of the HTML/XML "spec" (there are others).

Use the XML library to wrap this up - The best way to organise you code is NOT to put this in every single place you need to generate HTML but place it in your own local module/function called "wrap_up_page" which you use just before you respond to the HTML request.

Examples (taken from the unit tests)

Simple Web Page

html.html(html.head(html.title('A very simple web page')),html.body(html.h1('Welcome!!!'),html.p('It works!'),html.a({href:'/index.html'},'To the top'))).toString()

Results in... (Note, spacing is added afterwards. Actual output is compact - see above)

<html><head><title>A very simple web page</title></head><body><h1>Welcome!!!</h1><p>It works!</p><ahref="/index.html">To the top</a></body></html>

Make a Table

This function expect an array of objects and an array of column headings. There is nothing "pretty" about its output - human readable column names are left as a user exercise.

functionhtml_table_from_js(data,columns){return(html.table({border:1},html.thead(html.tr(columns.map((column)=>html.th(column)))),html.tbody(data.map((datum)=>html.tr(columns.map((column)=>html.td(datum[column]||'')))))))}

Special Calls

These functions do not map directly to an HTML element with the same name is the function name but provide some additional features

FunctionXML TypeParametersFeatures
cssincClosed ElementurlProduces a link element with attribute of rel="stylesheet" and an href set to the incoming URL
jsincClosed ElementurlA Javascript include from the specified URL
jsrawClosed ElementurlA raw Javascript code block
jsasdClosed ElementurlA raw Javascript code block with the defer and async attributes

Complete List of Entry Points

FunctionXML Type
aClosed Element
abbrClosed Element
acronymClosed Element
addressClosed Element
appletClosed Element
areaClosed Element
articleClosed Element
asideClosed Element
audioClosed Element
bClosed Element
baseClosed Element
basefontClosed Element
bdiClosed Element
bdoClosed Element
bigClosed Element
blockquoteClosed Element
bodyClosed Element
brClosed Element
buttonClosed Element
canvasClosed Element
captionClosed Element
centerClosed Element
citeClosed Element
codeClosed Element
colClosed Element
colgroupClosed Element
datalistClosed Element
ddClosed Element
delClosed Element
detailsClosed Element
dfnClosed Element
dialogClosed Element
dirClosed Element
divClosed Element
dlClosed Element
dtClosed Element
emClosed Element
embedClosed Element
fieldsetClosed Element
figcaptionClosed Element
figureClosed Element
fontClosed Element
footerClosed Element
formClosed Element
frameClosed Element
framesetClosed Element
h1Closed Element
h2Closed Element
h3Closed Element
h4Closed Element
headClosed Element
headerClosed Element
hrClosed Element
htmlClosed Element
iClosed Element
iframeClosed Element
imgClosed Element
inputClosed Element
insClosed Element
kbdClosed Element
keygenClosed Element
labelClosed Element
legendClosed Element
liClosed Element
linkUnclosed Element
mainClosed Element
mapClosed Element
markClosed Element
menuClosed Element
menuitemClosed Element
metaUnclosed Element
meterClosed Element
navClosed Element
noframesClosed Element
noscriptClosed Element
objectClosed Element
olClosed Element
optgroupClosed Element
optionClosed Element
outputClosed Element
pClosed Element
paramClosed Element
pictureClosed Element
preClosed Element
progressClosed Element
qClosed Element
rpClosed Element
rtClosed Element
rubyClosed Element
sClosed Element
sampClosed Element
scriptClosed Element
sectionClosed Element
selectClosed Element
smallClosed Element
sourceClosed Element
spanClosed Element
strikeClosed Element
strongClosed Element
styleClosed Element
subClosed Element
summaryClosed Element
supClosed Element
tableClosed Element
tbodyClosed Element
tdClosed Element
textareaClosed Element
tfootClosed Element
thClosed Element
theadClosed Element
timeClosed Element
titleClosed Element
trClosed Element
trackClosed Element
ttClosed Element
uClosed Element
ulClosed Element
varClosed Element
videoClosed Element
wbrClosed Element

About

HTML generator built on top of kuiash/xml

Resources

Stars

0 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages