From ef80c9176ecb8b05aed9f77c1199f82a2930f623 Mon Sep 17 00:00:00 2001 From: "Stanislav N. aka pztrn" Date: Mon, 23 Mar 2020 11:10:49 +0500 Subject: [PATCH] Added table (and related things). --- README.md | 7 ++- common/const.go | 7 +++ elements/table.go | 90 +++++++++++++++++++++++++++++++++++++ elements/tbody.go | 35 +++++++++++++++ elements/td.go | 35 +++++++++++++++ elements/tfoot.go | 35 +++++++++++++++ elements/th.go | 35 +++++++++++++++ elements/thead.go | 35 +++++++++++++++ elements/tr.go | 35 +++++++++++++++ examples/helloworld/main.go | 71 ++++++++++++++++++++++++++++- metas/generic.go | 6 +++ metas/inner.go | 3 +- 12 files changed, 388 insertions(+), 6 deletions(-) create mode 100644 elements/table.go create mode 100644 elements/tbody.go create mode 100644 elements/td.go create mode 100644 elements/tfoot.go create mode 100644 elements/th.go create mode 100644 elements/thead.go create mode 100644 elements/tr.go diff --git a/README.md b/README.md index ca1ed3b..3dc3314 100644 --- a/README.md +++ b/README.md @@ -4,9 +4,12 @@ ## 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 TBW - diff --git a/common/const.go b/common/const.go index da6ed84..73c3651 100644 --- a/common/const.go +++ b/common/const.go @@ -12,6 +12,13 @@ const ( HTMLElementNav = "nav" HTMLElementP = "p" HTMLElementSection = "section" + HTMLElementTable = "table" + HTMLElementTBody = "tbody" + HTMLElementTD = "td" + HTMLElementTFoot = "tfoot" + HTMLElementTH = "th" + HTMLElementTHead = "thead" + HTMLElementTR = "tr" HTMLElementParameterClassList = "classList" HTMLElementParameterHref = "href" diff --git a/elements/table.go b/elements/table.go new file mode 100644 index 0000000..d8fd899 --- /dev/null +++ b/elements/table.go @@ -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) +} diff --git a/elements/tbody.go b/elements/tbody.go new file mode 100644 index 0000000..236e68d --- /dev/null +++ b/elements/tbody.go @@ -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) +} diff --git a/elements/td.go b/elements/td.go new file mode 100644 index 0000000..de386f4 --- /dev/null +++ b/elements/td.go @@ -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) +} diff --git a/elements/tfoot.go b/elements/tfoot.go new file mode 100644 index 0000000..27a991e --- /dev/null +++ b/elements/tfoot.go @@ -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) +} diff --git a/elements/th.go b/elements/th.go new file mode 100644 index 0000000..0c88a65 --- /dev/null +++ b/elements/th.go @@ -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) +} diff --git a/elements/thead.go b/elements/thead.go new file mode 100644 index 0000000..0631ec4 --- /dev/null +++ b/elements/thead.go @@ -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) +} diff --git a/elements/tr.go b/elements/tr.go new file mode 100644 index 0000000..421c8d8 --- /dev/null +++ b/elements/tr.go @@ -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) +} diff --git a/examples/helloworld/main.go b/examples/helloworld/main.go index 8437b0f..e93bd33 100644 --- a/examples/helloworld/main.go +++ b/examples/helloworld/main.go @@ -28,14 +28,14 @@ func constructBody() { // Columns divs. columnsDiv := elements.NewDiv(&elements.DivOptions{ - Class: "columns", + Class: "columns is-centered", ID: "mainColumns", }) mainDiv.AddChild(columnsDiv) // Click-Me button should be in the middle of screen. centerDiv := elements.NewDiv(&elements.DivOptions{ - Class: "column is-half is-offset-two-fifths", + Class: "column is-half", }) columnsDiv.AddChild(centerDiv) @@ -50,6 +50,9 @@ func constructBody() { }) centerDiv.AddChild(startTestButton) + constructTable(mainDiv) + + // Build final document. js.Global.Get(common.HTMLElementDocument). Get(common.HTMLElementBody). Call(common.JSCallAppendChild, mainSection.Build()) @@ -73,3 +76,67 @@ func constructHeader() { 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) +} diff --git a/metas/generic.go b/metas/generic.go index 141e7e9..110fdaf 100644 --- a/metas/generic.go +++ b/metas/generic.go @@ -33,3 +33,9 @@ func (g *Generic) AddClassesFromString(classes string) { func (g *Generic) InitializeGeneric() { 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) +} diff --git a/metas/inner.go b/metas/inner.go index d09f106..6f11004 100644 --- a/metas/inner.go +++ b/metas/inner.go @@ -21,8 +21,7 @@ func (it *InnerItems) AddChild(object Buildable) { // BuildChilds build child elements and adds them to parent. func (it *InnerItems) BuildChilds(parent *js.Object) { for _, item := range it.innerItems { - itemObj := item.Build() - parent.Call(common.JSCallAppendChild, itemObj) + parent.Call(common.JSCallAppendChild, item.Build()) } }