Added table (and related things).
This commit is contained in:
parent
5d2d29a61d
commit
ef80c9176e
@ -4,9 +4,12 @@
|
|||||||
|
|
||||||
## Installation
|
## Installation
|
||||||
|
|
||||||
TBW
|
BulpherJS made primarily for applications that is using Go modules. So installation would be as simple as:
|
||||||
|
|
||||||
|
```shell script
|
||||||
|
go get -u go.dev.pztrn.name/bulpherjs
|
||||||
|
```
|
||||||
|
|
||||||
## Usage
|
## Usage
|
||||||
|
|
||||||
TBW
|
TBW
|
||||||
|
|
||||||
|
@ -12,6 +12,13 @@ const (
|
|||||||
HTMLElementNav = "nav"
|
HTMLElementNav = "nav"
|
||||||
HTMLElementP = "p"
|
HTMLElementP = "p"
|
||||||
HTMLElementSection = "section"
|
HTMLElementSection = "section"
|
||||||
|
HTMLElementTable = "table"
|
||||||
|
HTMLElementTBody = "tbody"
|
||||||
|
HTMLElementTD = "td"
|
||||||
|
HTMLElementTFoot = "tfoot"
|
||||||
|
HTMLElementTH = "th"
|
||||||
|
HTMLElementTHead = "thead"
|
||||||
|
HTMLElementTR = "tr"
|
||||||
|
|
||||||
HTMLElementParameterClassList = "classList"
|
HTMLElementParameterClassList = "classList"
|
||||||
HTMLElementParameterHref = "href"
|
HTMLElementParameterHref = "href"
|
||||||
|
90
elements/table.go
Normal file
90
elements/table.go
Normal file
@ -0,0 +1,90 @@
|
|||||||
|
package elements
|
||||||
|
|
||||||
|
import (
|
||||||
|
"strings"
|
||||||
|
|
||||||
|
"github.com/gopherjs/gopherjs/js"
|
||||||
|
|
||||||
|
"go.dev.pztrn.name/bulpherjs/common"
|
||||||
|
"go.dev.pztrn.name/bulpherjs/metas"
|
||||||
|
)
|
||||||
|
|
||||||
|
const (
|
||||||
|
tableDefaultClass = "table"
|
||||||
|
)
|
||||||
|
|
||||||
|
// TableOptions is a "table" HTML element configuration structure.
|
||||||
|
type TableOptions struct {
|
||||||
|
Class string
|
||||||
|
IsBordered bool
|
||||||
|
IsFullWidth bool
|
||||||
|
IsHoverable bool
|
||||||
|
IsNarrow bool
|
||||||
|
IsStriped bool
|
||||||
|
}
|
||||||
|
|
||||||
|
// Table is a controlling structure for "table" HTML element.
|
||||||
|
type Table struct {
|
||||||
|
metas.Generic
|
||||||
|
|
||||||
|
options *TableOptions
|
||||||
|
}
|
||||||
|
|
||||||
|
// NewTable creates new "table" HTML element controlling structure.
|
||||||
|
func NewTable(tableOpts *TableOptions) *Table {
|
||||||
|
t := &Table{}
|
||||||
|
t.initialize(tableOpts)
|
||||||
|
|
||||||
|
return t
|
||||||
|
}
|
||||||
|
|
||||||
|
// Build builds element and calls Build() for all child elements.
|
||||||
|
func (t *Table) Build() *js.Object {
|
||||||
|
if t.options == nil {
|
||||||
|
t.AddClassesFromString(tableDefaultClass)
|
||||||
|
t.BuildChilds(t.Object)
|
||||||
|
|
||||||
|
return t.Object
|
||||||
|
}
|
||||||
|
|
||||||
|
if !strings.Contains(t.options.Class, "table") {
|
||||||
|
t.options.Class += " table"
|
||||||
|
}
|
||||||
|
|
||||||
|
if t.options.Class != "" {
|
||||||
|
t.AddClassesFromString(t.options.Class)
|
||||||
|
}
|
||||||
|
|
||||||
|
if t.options.IsBordered {
|
||||||
|
t.AddClassesFromString("is-bordered")
|
||||||
|
}
|
||||||
|
|
||||||
|
if t.options.IsFullWidth {
|
||||||
|
t.AddClassesFromString("is-fullwidth")
|
||||||
|
}
|
||||||
|
|
||||||
|
if t.options.IsHoverable {
|
||||||
|
t.AddClassesFromString("is-hoverable")
|
||||||
|
}
|
||||||
|
|
||||||
|
if t.options.IsNarrow {
|
||||||
|
t.AddClassesFromString("is-narrow")
|
||||||
|
}
|
||||||
|
|
||||||
|
if t.options.IsStriped {
|
||||||
|
t.AddClassesFromString("is-striped")
|
||||||
|
}
|
||||||
|
|
||||||
|
t.BuildChilds(t.Object)
|
||||||
|
|
||||||
|
return t.Object
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initializes controlling structure with necessary parameters.
|
||||||
|
func (t *Table) initialize(tableOpts *TableOptions) {
|
||||||
|
t.options = tableOpts
|
||||||
|
|
||||||
|
t.InitializeGeneric()
|
||||||
|
|
||||||
|
t.Object = js.Global.Get(common.HTMLElementDocument).Call(common.JSCallCreateElement, common.HTMLElementTable)
|
||||||
|
}
|
35
elements/tbody.go
Normal file
35
elements/tbody.go
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
package elements
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/gopherjs/gopherjs/js"
|
||||||
|
|
||||||
|
"go.dev.pztrn.name/bulpherjs/common"
|
||||||
|
"go.dev.pztrn.name/bulpherjs/metas"
|
||||||
|
)
|
||||||
|
|
||||||
|
// TBody is a controlling structure for "tbody" HTML element.
|
||||||
|
type TBody struct {
|
||||||
|
metas.Generic
|
||||||
|
}
|
||||||
|
|
||||||
|
// NewTBody creates new "tbody" HTML element controlling structure.
|
||||||
|
func NewTBody() *TBody {
|
||||||
|
tbody := &TBody{}
|
||||||
|
tbody.initialize()
|
||||||
|
|
||||||
|
return tbody
|
||||||
|
}
|
||||||
|
|
||||||
|
// Build builds element and calls Build() for all child elements.
|
||||||
|
func (t *TBody) Build() *js.Object {
|
||||||
|
t.BuildChilds(t.Object)
|
||||||
|
|
||||||
|
return t.Object
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initializes controlling structure with necessary parameters.
|
||||||
|
func (t *TBody) initialize() {
|
||||||
|
t.InitializeGeneric()
|
||||||
|
|
||||||
|
t.Object = js.Global.Get(common.HTMLElementDocument).Call(common.JSCallCreateElement, common.HTMLElementTBody)
|
||||||
|
}
|
35
elements/td.go
Normal file
35
elements/td.go
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
package elements
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/gopherjs/gopherjs/js"
|
||||||
|
|
||||||
|
"go.dev.pztrn.name/bulpherjs/common"
|
||||||
|
"go.dev.pztrn.name/bulpherjs/metas"
|
||||||
|
)
|
||||||
|
|
||||||
|
// TD is a controlling structure for "td" HTML element.
|
||||||
|
type TD struct {
|
||||||
|
metas.Generic
|
||||||
|
}
|
||||||
|
|
||||||
|
// NewTD creates new "td" HTML element controlling structure.
|
||||||
|
func NewTD() *TD {
|
||||||
|
td := &TD{}
|
||||||
|
td.initialize()
|
||||||
|
|
||||||
|
return td
|
||||||
|
}
|
||||||
|
|
||||||
|
// Build builds element and calls Build() for all child elements.
|
||||||
|
func (t *TD) Build() *js.Object {
|
||||||
|
t.BuildChilds(t.Object)
|
||||||
|
|
||||||
|
return t.Object
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initializes controlling structure with necessary parameters.
|
||||||
|
func (t *TD) initialize() {
|
||||||
|
t.InitializeGeneric()
|
||||||
|
|
||||||
|
t.Object = js.Global.Get(common.HTMLElementDocument).Call(common.JSCallCreateElement, common.HTMLElementTD)
|
||||||
|
}
|
35
elements/tfoot.go
Normal file
35
elements/tfoot.go
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
package elements
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/gopherjs/gopherjs/js"
|
||||||
|
|
||||||
|
"go.dev.pztrn.name/bulpherjs/common"
|
||||||
|
"go.dev.pztrn.name/bulpherjs/metas"
|
||||||
|
)
|
||||||
|
|
||||||
|
// TFoot is a controlling structure for "tfoot" HTML element.
|
||||||
|
type TFoot struct {
|
||||||
|
metas.Generic
|
||||||
|
}
|
||||||
|
|
||||||
|
// NewTFoot creates new "tfoot" HTML element controlling structure.
|
||||||
|
func NewTFoot() *TFoot {
|
||||||
|
tfoot := &TFoot{}
|
||||||
|
tfoot.initialize()
|
||||||
|
|
||||||
|
return tfoot
|
||||||
|
}
|
||||||
|
|
||||||
|
// Build builds element and calls Build() for all child elements.
|
||||||
|
func (t *TFoot) Build() *js.Object {
|
||||||
|
t.BuildChilds(t.Object)
|
||||||
|
|
||||||
|
return t.Object
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initializes controlling structure with necessary parameters.
|
||||||
|
func (t *TFoot) initialize() {
|
||||||
|
t.InitializeGeneric()
|
||||||
|
|
||||||
|
t.Object = js.Global.Get(common.HTMLElementDocument).Call(common.JSCallCreateElement, common.HTMLElementTFoot)
|
||||||
|
}
|
35
elements/th.go
Normal file
35
elements/th.go
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
package elements
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/gopherjs/gopherjs/js"
|
||||||
|
|
||||||
|
"go.dev.pztrn.name/bulpherjs/common"
|
||||||
|
"go.dev.pztrn.name/bulpherjs/metas"
|
||||||
|
)
|
||||||
|
|
||||||
|
// TH is a controlling structure for "th" HTML element.
|
||||||
|
type TH struct {
|
||||||
|
metas.Generic
|
||||||
|
}
|
||||||
|
|
||||||
|
// NewTH creates new "th" HTML element controlling structure.
|
||||||
|
func NewTH() *TH {
|
||||||
|
th := &TH{}
|
||||||
|
th.initialize()
|
||||||
|
|
||||||
|
return th
|
||||||
|
}
|
||||||
|
|
||||||
|
// Build builds element and calls Build() for all child elements.
|
||||||
|
func (t *TH) Build() *js.Object {
|
||||||
|
t.BuildChilds(t.Object)
|
||||||
|
|
||||||
|
return t.Object
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initializes controlling structure with necessary parameters.
|
||||||
|
func (t *TH) initialize() {
|
||||||
|
t.InitializeGeneric()
|
||||||
|
|
||||||
|
t.Object = js.Global.Get(common.HTMLElementDocument).Call(common.JSCallCreateElement, common.HTMLElementTH)
|
||||||
|
}
|
35
elements/thead.go
Normal file
35
elements/thead.go
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
package elements
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/gopherjs/gopherjs/js"
|
||||||
|
|
||||||
|
"go.dev.pztrn.name/bulpherjs/common"
|
||||||
|
"go.dev.pztrn.name/bulpherjs/metas"
|
||||||
|
)
|
||||||
|
|
||||||
|
// THead is a controlling structure for "thead" HTML element.
|
||||||
|
type THead struct {
|
||||||
|
metas.Generic
|
||||||
|
}
|
||||||
|
|
||||||
|
// NewTHead creates new "thead" HTML element controlling structure.
|
||||||
|
func NewTHead() *THead {
|
||||||
|
thead := &THead{}
|
||||||
|
thead.initialize()
|
||||||
|
|
||||||
|
return thead
|
||||||
|
}
|
||||||
|
|
||||||
|
// Build builds element and calls Build() for all child elements.
|
||||||
|
func (t *THead) Build() *js.Object {
|
||||||
|
t.BuildChilds(t.Object)
|
||||||
|
|
||||||
|
return t.Object
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initializes controlling structure with necessary parameters.
|
||||||
|
func (t *THead) initialize() {
|
||||||
|
t.InitializeGeneric()
|
||||||
|
|
||||||
|
t.Object = js.Global.Get(common.HTMLElementDocument).Call(common.JSCallCreateElement, common.HTMLElementTHead)
|
||||||
|
}
|
35
elements/tr.go
Normal file
35
elements/tr.go
Normal file
@ -0,0 +1,35 @@
|
|||||||
|
package elements
|
||||||
|
|
||||||
|
import (
|
||||||
|
"github.com/gopherjs/gopherjs/js"
|
||||||
|
|
||||||
|
"go.dev.pztrn.name/bulpherjs/common"
|
||||||
|
"go.dev.pztrn.name/bulpherjs/metas"
|
||||||
|
)
|
||||||
|
|
||||||
|
// TR is a controlling structure for "tr" HTML element.
|
||||||
|
type TR struct {
|
||||||
|
metas.Generic
|
||||||
|
}
|
||||||
|
|
||||||
|
// NewTR creates new "tr" HTML element controlling structure.
|
||||||
|
func NewTR() *TR {
|
||||||
|
tr := &TR{}
|
||||||
|
tr.initialize()
|
||||||
|
|
||||||
|
return tr
|
||||||
|
}
|
||||||
|
|
||||||
|
// Build builds element and calls Build() for all child elements.
|
||||||
|
func (t *TR) Build() *js.Object {
|
||||||
|
t.BuildChilds(t.Object)
|
||||||
|
|
||||||
|
return t.Object
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initializes controlling structure with necessary parameters.
|
||||||
|
func (t *TR) initialize() {
|
||||||
|
t.InitializeGeneric()
|
||||||
|
|
||||||
|
t.Object = js.Global.Get(common.HTMLElementDocument).Call(common.JSCallCreateElement, common.HTMLElementTR)
|
||||||
|
}
|
@ -28,14 +28,14 @@ func constructBody() {
|
|||||||
|
|
||||||
// Columns divs.
|
// Columns divs.
|
||||||
columnsDiv := elements.NewDiv(&elements.DivOptions{
|
columnsDiv := elements.NewDiv(&elements.DivOptions{
|
||||||
Class: "columns",
|
Class: "columns is-centered",
|
||||||
ID: "mainColumns",
|
ID: "mainColumns",
|
||||||
})
|
})
|
||||||
mainDiv.AddChild(columnsDiv)
|
mainDiv.AddChild(columnsDiv)
|
||||||
|
|
||||||
// Click-Me button should be in the middle of screen.
|
// Click-Me button should be in the middle of screen.
|
||||||
centerDiv := elements.NewDiv(&elements.DivOptions{
|
centerDiv := elements.NewDiv(&elements.DivOptions{
|
||||||
Class: "column is-half is-offset-two-fifths",
|
Class: "column is-half",
|
||||||
})
|
})
|
||||||
columnsDiv.AddChild(centerDiv)
|
columnsDiv.AddChild(centerDiv)
|
||||||
|
|
||||||
@ -50,6 +50,9 @@ func constructBody() {
|
|||||||
})
|
})
|
||||||
centerDiv.AddChild(startTestButton)
|
centerDiv.AddChild(startTestButton)
|
||||||
|
|
||||||
|
constructTable(mainDiv)
|
||||||
|
|
||||||
|
// Build final document.
|
||||||
js.Global.Get(common.HTMLElementDocument).
|
js.Global.Get(common.HTMLElementDocument).
|
||||||
Get(common.HTMLElementBody).
|
Get(common.HTMLElementBody).
|
||||||
Call(common.JSCallAppendChild, mainSection.Build())
|
Call(common.JSCallAppendChild, mainSection.Build())
|
||||||
@ -73,3 +76,67 @@ func constructHeader() {
|
|||||||
|
|
||||||
js.Global.Get(common.HTMLElementDocument).Set(common.HTMLHeadElementTitle, "BulpherJS Hello World application")
|
js.Global.Get(common.HTMLElementDocument).Set(common.HTMLHeadElementTitle, "BulpherJS Hello World application")
|
||||||
}
|
}
|
||||||
|
|
||||||
|
func constructTable(mainDiv *elements.Div) {
|
||||||
|
// Columns divs.
|
||||||
|
columnsDiv := elements.NewDiv(&elements.DivOptions{
|
||||||
|
Class: "columns is-centered",
|
||||||
|
ID: "tableColumns",
|
||||||
|
})
|
||||||
|
mainDiv.AddChild(columnsDiv)
|
||||||
|
|
||||||
|
tableDiv := elements.NewDiv(&elements.DivOptions{
|
||||||
|
Class: "column is-half",
|
||||||
|
})
|
||||||
|
columnsDiv.AddChild(tableDiv)
|
||||||
|
|
||||||
|
testTable := elements.NewTable(&elements.TableOptions{
|
||||||
|
IsBordered: true,
|
||||||
|
IsFullWidth: true,
|
||||||
|
IsHoverable: true,
|
||||||
|
IsNarrow: true,
|
||||||
|
})
|
||||||
|
tableDiv.AddChild(testTable)
|
||||||
|
|
||||||
|
tableHeader := elements.NewTHead()
|
||||||
|
testTable.AddChild(tableHeader)
|
||||||
|
|
||||||
|
tableHeaderLine := elements.NewTR()
|
||||||
|
tableHeader.AddChild(tableHeaderLine)
|
||||||
|
|
||||||
|
thlOne := elements.NewTH()
|
||||||
|
thlOne.SetTextContent("Header")
|
||||||
|
tableHeaderLine.AddChild(thlOne)
|
||||||
|
|
||||||
|
thlTwo := elements.NewTH()
|
||||||
|
thlTwo.SetTextContent("line")
|
||||||
|
tableHeaderLine.AddChild(thlTwo)
|
||||||
|
|
||||||
|
tableBody := elements.NewTBody()
|
||||||
|
testTable.AddChild(tableBody)
|
||||||
|
|
||||||
|
tableBodyLine := elements.NewTR()
|
||||||
|
tableBody.AddChild(tableBodyLine)
|
||||||
|
|
||||||
|
tblOne := elements.NewTD()
|
||||||
|
tblOne.SetTextContent("Body")
|
||||||
|
tableBodyLine.AddChild(tblOne)
|
||||||
|
|
||||||
|
tblTwo := elements.NewTD()
|
||||||
|
tblTwo.SetTextContent("line")
|
||||||
|
tableBodyLine.AddChild(tblTwo)
|
||||||
|
|
||||||
|
tableFooter := elements.NewTFoot()
|
||||||
|
testTable.AddChild(tableFooter)
|
||||||
|
|
||||||
|
tableFooterLine := elements.NewTR()
|
||||||
|
tableFooter.AddChild(tableFooterLine)
|
||||||
|
|
||||||
|
tflOne := elements.NewTD()
|
||||||
|
tflOne.SetTextContent("Footer")
|
||||||
|
tableFooterLine.AddChild(tflOne)
|
||||||
|
|
||||||
|
tflTwo := elements.NewTD()
|
||||||
|
tflTwo.SetTextContent("line")
|
||||||
|
tableFooterLine.AddChild(tflTwo)
|
||||||
|
}
|
||||||
|
@ -33,3 +33,9 @@ func (g *Generic) AddClassesFromString(classes string) {
|
|||||||
func (g *Generic) InitializeGeneric() {
|
func (g *Generic) InitializeGeneric() {
|
||||||
g.initializeInnerItems()
|
g.initializeInnerItems()
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// SetTextContent sets text content for passed object. Note that not
|
||||||
|
// all HTML elements able to display it.
|
||||||
|
func (g *Generic) SetTextContent(text string) {
|
||||||
|
g.Object.Set("textContent", text)
|
||||||
|
}
|
||||||
|
@ -21,8 +21,7 @@ func (it *InnerItems) AddChild(object Buildable) {
|
|||||||
// BuildChilds build child elements and adds them to parent.
|
// BuildChilds build child elements and adds them to parent.
|
||||||
func (it *InnerItems) BuildChilds(parent *js.Object) {
|
func (it *InnerItems) BuildChilds(parent *js.Object) {
|
||||||
for _, item := range it.innerItems {
|
for _, item := range it.innerItems {
|
||||||
itemObj := item.Build()
|
parent.Call(common.JSCallAppendChild, item.Build())
|
||||||
parent.Call(common.JSCallAppendChild, itemObj)
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user