const express = require('express')
const renderplus = require('renderplus')
const app = express()
app.use(renderplus)
 
let button1 = false
 
let options = [
    { text: 'Zero', value: 0 },
    { text: 'One', value: 1 },
    { text: 'Two', value: 2 },
    { text: 'Three', value: 3 },
    { text: 'Four', value: 4 }
]
 
app.get('/', (req, res) => {
    res.render(
        ['html', [
            ['head', [
                ['title', 'Test'],
                ['meta', { charset: 'utf-8' }]
            ]],
            ['body', [
                //Text
                'SELECT A NUMBER:',
                ['br'],
                ['select', { id: 'choice', onchange: 'test()' }, [
                    //List rendering
                    ['for', options, i => (
                        ['option', { value: i.value }, i.text]
                    )]
                ]],
                //Conditional rendering
                ['if', button1, {
                    then: ['button', 'Button 1'],
                    else: ['button', 'Button 2']
                }]
            ]]
        ]]
    )
})
 
app.listen(8080)

res.render(htmlTag)

[tagName, attributes, content]

['br']

['h1', 'Hello World']

['meta', {charset: 'utf-8'}]

['div', {id: 'test'}, 'Hello World']

['div', {id: 'test'}, [
    //children here
]]

['body', [
    //children here
]]

['body', [
    'It is a text inside BODY',
    ['br'],
    ['h1', 'It is a text inside H1'],
    'Here is another text inside BODY'
]]

['if', condition, {
    then: thenContent,
    else: elseContent
}]

['for', list, callback]

(item, index) => content

const express = require('express')
const renderplus = require("renderplus")
const app = express()
app.use(renderplus)
 
let layout(children) => (
    ['html', [
        ['head', [
            ['title', 'Test'],
            ['meta', {charset: 'utf-8'}]
        ]],
        ['body', children]
    ]]
)
 
let customButton(label) => (
    ['button', {class: 'my-custom-button'}, label]
)
 
app.get('/', (req, res) => {
    res.render(
        layout([
            ['div', [
                customButton('Button 1'),
                customButton('Button 2'),
                ['hr']
            ]]
        ])
    )
})
 
app.listen(8080)