iris/internal/element/element.go

//build +js,wasm

package element

import (
	"fmt"
	"syscall/js"
)

type Element struct {
	js.Value
}

var doc = js.Global().Get("document")

func Document() Element {
	return Element{doc}
}

func NewElement(tag string) Element {
	doc := Document()
	e := doc.Call("createElement", tag)
	return Element{e}
}

func NewTextNode(text string) Element {
	doc := Document()
	textNode := doc.Call("createTextNode", text)
	return Element{textNode}
}

func (e Element) On(event string, fn func()) Element {
	e.Call("addEventListener", event, js.FuncOf(func(this js.Value, args []js.Value) interface{} {
		fn()
		return nil
	}))
	return e
}

func (e Element) Margin(margin string) Element {
	e.Get("style").Call("setProperty", "margin", margin)
	return e
}

func (e Element) Padding(padding string) Element {
	e.Get("style").Call("setProperty", "padding", padding)
	return e
}

func (e Element) Height(height string) Element {
	e.Get("style").Call("setProperty", "height", height)
	return e
}

func (e Element) MinHeight(height string) Element {
	e.Get("style").Call("setProperty", "min-height", height)
	return e
}

func (e Element) Color(color string) Element {
	e.Get("style").Call("setProperty", "color", color)
	return e
}

func (e Element) Width(width string) Element {
	e.Get("style").Call("setProperty", "width", width)
	return e
}

func (e Element) BackgroundColor(color string) Element {
	e.Get("style").Call("setProperty", "background-color", color)
	return e
}

func (e Element) Attr(name, value string) Element {
	e.Call("setAttribute", name, value)
	return e
}

func (e Element) Text(text string) Element {
	doc := Document()
	textNode := doc.Call("createTextNode", text)
	e.Call("appendChild", textNode)
	return e
}

func (e Element) Child(child Element) Element {
	e.Call("appendChild", child.Value)
	return e
}

func Mount(root Element) {
	doc := Document()
	body := doc.Get("body")

	body.Call("appendChild", root.Value)
}

func (e Element) Flex() Element {
	e.Get("style").Call("setProperty", "display", "flex")
	return e
}

func (e Element) FlexDirection(direction string) Element {
	e.Get("style").Call("setProperty", "flex-direction", direction)
	return e
}

func (e Element) JustifyContent(justify string) Element {
	e.Get("style").Call("setProperty", "justify-content", justify)
	return e
}

func (e Element) JustifyItems(justify string) Element {
	e.Get("style").Call("setProperty", "justify-items", justify)
	return e
}

func (e Element) AlignItems(align string) Element {
	e.Get("style").Call("setProperty", "align-items", align)
	return e
}

func (e Element) FlexGrow(grow int) Element {
	e.Get("style").Call("setProperty", "flex-grow", grow)
	return e
}

func (e Element) FlexWrap(wrap string) Element {
	e.Get("style").Call("setProperty", "flex-wrap", wrap)
	return e
}

func (e Element) Grid() Element {
	e.Get("style").Call("setProperty", "display", "grid")
	return e
}

func (e Element) GridAutoFlow(flow string) Element {
	e.Get("style").Call("setProperty", "grid-auto-flow", flow)
	return e
}

func (e Element) GridTemplateColumns(columns string) Element {
	e.Get("style").Call("setProperty", "grid-template-columns", columns)
	return e
}

func (e Element) GridTemplateRows(rows string) Element {
	e.Get("style").Call("setProperty", "grid-template-rows", rows)
	return e
}

func (e Element) MaxWidth(width string) Element {
	e.Get("style").Call("setProperty", "max-width", width)
	return e
}

// OnWithEvent adds an event listener that provides access to the event object
func (e Element) OnWithEvent(event string, fn func(js.Value)) Element {
	e.Call("addEventListener", event, js.FuncOf(func(this js.Value, args []js.Value) interface{} {
		if len(args) > 0 {
			fn(args[0])
		}
		return nil
	}))
	return e
}

// Positioning methods

func (e Element) Position(pos string) Element {
	e.Get("style").Call("setProperty", "position", pos)
	return e
}

func (e Element) Left(value string) Element {
	e.Get("style").Call("setProperty", "left", value)
	return e
}

func (e Element) Top(value string) Element {
	e.Get("style").Call("setProperty", "top", value)
	return e
}

func (e Element) Right(value string) Element {
	e.Get("style").Call("setProperty", "right", value)
	return e
}

func (e Element) Bottom(value string) Element {
	e.Get("style").Call("setProperty", "bottom", value)
	return e
}

func (e Element) ZIndex(value int) Element {
	e.Get("style").Call("setProperty", "z-index", fmt.Sprintf("%d", value))
	return e
}

// Transform methods

func (e Element) Transform(value string) Element {
	e.Get("style").Call("setProperty", "transform", value)
	return e
}

func (e Element) TransformOrigin(value string) Element {
	e.Get("style").Call("setProperty", "transform-origin", value)
	return e
}

// Cursor and interaction

func (e Element) Cursor(value string) Element {
	e.Get("style").Call("setProperty", "cursor", value)
	return e
}

func (e Element) UserSelect(value string) Element {
	e.Get("style").Call("setProperty", "user-select", value)
	return e
}

func (e Element) PointerEvents(value string) Element {
	e.Get("style").Call("setProperty", "pointer-events", value)
	return e
}

// Overflow

func (e Element) Overflow(value string) Element {
	e.Get("style").Call("setProperty", "overflow", value)
	return e
}

// Box styling

func (e Element) BoxShadow(value string) Element {
	e.Get("style").Call("setProperty", "box-shadow", value)
	return e
}

func (e Element) BorderRadius(value string) Element {
	e.Get("style").Call("setProperty", "border-radius", value)
	return e
}

func (e Element) Border(value string) Element {
	e.Get("style").Call("setProperty", "border", value)
	return e
}

// DOM manipulation

func (e Element) RemoveChild(child Element) Element {
	e.Call("removeChild", child.Value)
	return e
}

func (e Element) ClearChildren() Element {
	e.Set("innerHTML", "")
	return e
}

// SVG support

func NewElementNS(namespace, tag string) Element {
	doc := Document()
	e := doc.Call("createElementNS", namespace, tag)
	return Element{e}
}

// AttrNS sets an attribute with namespace (for SVG)
func (e Element) AttrNS(namespace, name, value string) Element {
	if namespace == "" {
		e.Call("setAttribute", name, value)
	} else {
		e.Call("setAttributeNS", namespace, name, value)
	}
	return e
}