gwu

package
v0.0.0-...-73643b2 Latest Latest
Warning

This package is not in the latest version of its module.

Go to latest
Published: Mar 16, 2015 License: GPL-3.0 Imports: 15 Imported by: 0

Documentation

Overview

Package gwu implements an easy to use, platform independent Web UI Toolkit in pure Go.

For additional documentation, News and more please visit the home page: https://sites.google.com/site/gowebuitoolkit/

Introduction

Gowut (Go Web UI Toolkit) is a full-featured, easy to use, platform independent Web UI Toolkit written in pure Go, no platform dependent native code is linked or called.

The usage of the Gowut is similar to Google's GWT and the Java Swing toolkit. If you are familiar with those, you will get started very easily. The main difference compared to GWT is that this solution does not compile into JavaScript but remains and runs as Go code (on the server side). Remaining on the server side means you don't have to hassle with asynchronous event handlers like in GWT, you can write real synchronous event handlers (like in Java Swing).

You can use this toolkit and build user interfaces with writing Go code only: you can assemble the client interface in Go, and write event handlers in Go. You may optionally spice it and make it more customized with some HTML and CSS (also added from Go code), but that is not required.

The UI can be simply assembled hierarchically from containers and components. Components can generate events which are dispatched to event handlers - also written in pure Go. If there is no component for an HTML tag you wish to use, you can use the Html component to wrap your custom HTML code. Components also allow you to specify custom HTML attributes that will be added for their (wrapper) HTML tags.

Creating user interfaces using Gowut does not require you to think like that the clients will view it and interact with it through a browser. The "browser" layer is hidden by Gowut. While styling the components is done through CSS (either by calling the style builder's methods or passing direct CSS codes), think of it like a way similar to formatting HTML tags with CSS.

The state of the components are stored on server side, in the memory. This means that if a browser is closed and reopened, or you navigate away and back, the same state will be rendered again. AJAX technology is used to automatically synchronize component's state from browser to server, and to dispatch events. AJAX technology is used also to refresh some parts (components) that change (during event handling) without having to reload the whole page to see the changes.

To quickly test it and see it in action, run the "Showcase of Features" application by typing: (assuming you're in the root of your GOPATH)

go run src/code.google.com/p/gowut/examples/showcase.go

Features of Gowut

-A component library to assemble your user interfaces with

-A GUI server which serves browser clients

-Session management

-Automatic event handling and dispatching

-(CSS) Style builder to easily manipulate the style of components

Server and Events and Sessions

The package contains a GUI server which is responsible to serve GUI clients which are standard browsers. The user interface can be viewed from any browsers (including smart phones) which makes this a cross platform solution. Starting the GUI server with a non-local address gives you the possibility to view the GUI from a remote computer. The server can be configured to run in normal mode (HTTP) or in secure mode (HTTPS).

The GUI server also has Session management. By default windows added to the server are public windows, and shared between all users (clients). This means if a user changes the content (e.g. enters a text into a text box), that text will be visible to all other users. This is suitable for most desktop applications.

Sessions can be created during event handling (by calling the Event.NewSession() method), and windows added to the session will only be visible to the client associated with the session. If other users request the same window, a new instance of the window is to be created and added to their sessions.

Event handling is possible via event handlers. An event handler is an implementation of the EventHandler interface. Event handlers have to be attached to the components which will be the source of the event. Event handlers are registered to event types or kinds (EventType) such as click event (ETYPE_CLICK), value change event (ETYPE_CHANGE), key up event (ETYPE_KEY_UP) etc.

The HandleEvent method of an event handler gets an Event value which has multiple purposes and functions. 1) The event contains the parameters of the event (such as the event type, the event source component, mouse position in case of a mouse event etc.). 2) The Event is an accessor to the Session associated with the client the event is originating from. Through the event an event handler may access the current Session, create a new Session or may remove it (invalidate it). 3) The event is also used to define actions to be executed (automatically by Gowut) after the event handling (post-event actions). For example if the event handler changes a component, the handler has to mark it dirty causing it to be re-rendered in the client browser, or an event handler can change the focused component, or reload another window.

Creating a session from an event handler during event dispatching requires a public window and an event source component (e.g. a Button). There is another handy way to create sessions. Sessions can also be created automatically by requesting pre-registered paths, paths of not-yet existing windows. When such a window is requested and no private session associated with the client exists, a new session will be created. A registered SessionHandler can be used then to create the window prior to it being served. Here's an example how to do it:

// A SessionHandler implementation:
type MySessHandler struct {}
func (h SessHandler) Created(s gwu.Session) {
	win := gwu.NewWindow("login", "Login Window")
	// ...add content to the login window...
	s.AddWindow(win)
}
func (h SessHandler) Removed(s gwu.Session) {}

// And to auto-create sessions for the login window:
server := gwu.NewServer("guitest","")
server.AddSessCreatorName("login", "Login Window")
server.AddSHandler(MySessHandler{})

Despite the use of sessions if you access the application remotely (e.g. not from localhost), security is only guaranteed if you configure the server to run in secure (HTTPS) mode.

Under the hood

User interfaces are generated HTML documents which communicate with the server with AJAX calls. The GUI server is based on the web server integrated in Go.

When a Window is requested by its URL, the Window will render a complete HTML document. The Window will recursively include its child components. Components render themselves into HTML codes. When a component generates an event, the page in the browser will make an AJAX call sending the event to the server. The event will be passed to all the appropriate event handlers. Event handlers can mark components dirty, specifying that they may have changed and they must be re-rendered. When all the event handlers are done, the ids of the dirty components are sent back, and the browser will request only to render the dirty components, with AJAX calls, and the results will replace the old component nodes in the HTML DOM.

Since the clients are HTTP browsers, the GWU sessions are implemented and function as HTTP sessions. Cookies are used to maintain the browser sessions.

Styling

Styling the components is done through CSS. You can do this from Go code by calling the style builder's methods, or you can create external CSS files.

The Comp interface contains a Style() method which returns the style builder of the component. The builder can be used to set/manipulate the style class names of the component (e.g. SetClass(), AddClass(), RemoveClass() methods). The builder also has get and set methods for the common CSS attributes, and the GWU package contains many CSS constants for CSS attribute values. Many styling can be achieved using the builder's built-in methods and constants resulting in the Go code containing no direct CSS at all. You can use the general Get() and Set() methods of the style builder to manipulate any style attributes which it does not have predefined methods for.

Each Gowut component has its own CSS class derived from its name using the "gwu-" prefix, for example the Button component has the default CSS class "gwu-Button". Many components use multiple CSS classes for their internal structure. These classes are listed in the documentation of the components. Gowut has multiple built-in CSS themes. A CSS theme is basically the collection of the style definitions of the style classes used by the components. You can set the default theme with the Server.SetTheme() method. This will be used for all windows. You can set themes individually for windows too, using the Window.SetTheme() method.

You can create your own external CSS files where you can extend/override the definitions of the built-in style classes. For example you can define the "gwu-Button" style class to have red background, and the result will be that all Buttons will have red background without having to change their style individually.

Component palette

Containers to group and lay out components:

Expander  - shows and hides a content comp when clicking on the header comp
(Link)    - allows only one optional child
Panel     - it has configurable layout
Table     - it is dynamic and flexible
TabPanel  - for tabbed displaying components (only 1 is visible at a time)
Window    - top of component hierarchy, it is an extension of the Panel

Input components to get data from users:

CheckBox
ListBox    (it's either a drop-down list or a multi-line/multi-select list box)
TextBox    (it's either a one-line text box or a multi-line text area)
PasswBox
RadioButton
SwitchButton

Other components:

Button
Html
Image
Label
Link
Timer

Full application example

Let a full example follow here which is a complete application. It builds a simple window, adds components to it, registers event handlers which modify the content and starts the GUI server. Component modifications (including both individual components and component structure) will be seen without page reload. All written in Go.

Source of this application is available here: http://code.google.com/p/gowut/source/browse/examples/simple_demo.go

type MyButtonHandler struct {
	counter int
	text    string
}

func (h *MyButtonHandler) HandleEvent(e gwu.Event) {
	if b, isButton := e.Src().(gwu.Button); isButton {
		b.SetText(b.Text() + h.text)
		h.counter++
		b.SetToolTip("You've clicked " + strconv.Itoa(h.counter) + " times!")
		e.MarkDirty(b)
	}
}

func main() {
	// Create and build a window
	win := gwu.NewWindow("main", "Test GUI Window")
	win.Style().SetFullWidth()
	win.SetHAlign(gwu.HA_CENTER)
	win.SetCellPadding(2)

	// Button which changes window content
	win.Add(gwu.NewLabel("I'm a label! Try clicking on the button=>"))
	btn := gwu.NewButton("Click me")
	btn.AddEHandler(&MyButtonHandler{text: ":-)"}, gwu.ETYPE_CLICK)
	win.Add(btn)
	btnsPanel := gwu.NewNaturalPanel()
	btn.AddEHandlerFunc(func(e gwu.Event) {
		// Create and add a new button...
		newbtn := gwu.NewButton("Extra #" + strconv.Itoa(btnsPanel.CompsCount()))
		newbtn.AddEHandlerFunc(func(e gwu.Event) {
			btnsPanel.Remove(newbtn) // ...which removes itself when clicked
			e.MarkDirty(btnsPanel)
		}, gwu.ETYPE_CLICK)
		btnsPanel.Insert(newbtn, 0)
		e.MarkDirty(btnsPanel)
	}, gwu.ETYPE_CLICK)
	win.Add(btnsPanel)

	// ListBox examples
	p := gwu.NewHorizontalPanel()
	p.Style().SetBorder2(1, gwu.BRD_STYLE_SOLID, gwu.CLR_BLACK)
	p.SetCellPadding(2)
	p.Add(gwu.NewLabel("A drop-down list being"))
	widelb := gwu.NewListBox([]string{"50", "100", "150", "200", "250"})
	widelb.Style().SetWidth("50")
	widelb.AddEHandlerFunc(func(e gwu.Event) {
		widelb.Style().SetWidth(widelb.SelectedValue() + "px")
		e.MarkDirty(widelb)
	}, gwu.ETYPE_CHANGE)
	p.Add(widelb)
	p.Add(gwu.NewLabel("pixel wide. And a multi-select list:"))
	listBox := gwu.NewListBox([]string{"First", "Second", "Third", "Forth", "Fifth", "Sixth"})
	listBox.SetMulti(true)
	listBox.SetRows(4)
	p.Add(listBox)
	countLabel := gwu.NewLabel("Selected count: 0")
	listBox.AddEHandlerFunc(func(e gwu.Event) {
		countLabel.SetText("Selected count: " + strconv.Itoa(len(listBox.SelectedIndices())))
		e.MarkDirty(countLabel)
	}, gwu.ETYPE_CHANGE)
	p.Add(countLabel)
	win.Add(p)

	// Self-color changer check box
	greencb := gwu.NewCheckBox("I'm a check box. When checked, I'm green!")
	greencb.AddEHandlerFunc(func(e gwu.Event) {
		if greencb.State() {
			greencb.Style().SetBackground(gwu.CLR_GREEN)
		} else {
			greencb.Style().SetBackground("")
		}
		e.MarkDirty(greencb)
	}, gwu.ETYPE_CLICK)
	win.Add(greencb)

	// TextBox with echo
	p = gwu.NewHorizontalPanel()
	p.Add(gwu.NewLabel("Enter your name:"))
	tb := gwu.NewTextBox("")
	tb.AddSyncOnETypes(gwu.ETYPE_KEY_UP)
	p.Add(tb)
	p.Add(gwu.NewLabel("You entered:"))
	nameLabel := gwu.NewLabel("")
	nameLabel.Style().SetColor(gwu.CLR_RED)
	tb.AddEHandlerFunc(func(e gwu.Event) {
		nameLabel.SetText(tb.Text())
		e.MarkDirty(nameLabel)
	}, gwu.ETYPE_CHANGE, gwu.ETYPE_KEY_UP)
	p.Add(nameLabel)
	win.Add(p)

	// Create and start a GUI server (omitting error check)
	server := gwu.NewServer("guitest", "localhost:8081")
	server.SetText("Test GUI App")
	server.AddWin(win)
	server.Start("") // Also opens windows list in browser
}

Now start the application and open the http://localhost:8081/guitest/main URL in your browser to see the window. You can also try visiting http://localhost:8081/guitest/ which will render the available window list. Test the components. Now close the browser and reopen the page. Gowut remembers everything.

Limitations

1) Attaching onmouseover and onmouseout event handlers to a component and changing (re-rendering) the same component causes some trouble (the browsers generate multiple mouseover and mouseout events because the same HTML node is replaced under the mouse cursor).

2) Attaching onmousedown and onmouseup event handlers to a check box and re-rendering it prevents ETYPE_CHANGE handlers being called when clicking on it.

Closing

From the MVC point of view looking at a Go application using Gowut, the Go components are the Model, the generated (and manipulated) HTML document in the browser is the View and the Controller is integrated in both.

Gowut is ideal to create (cross platform) user interfaces for desktop applications written in Go. It is also easy and handy to write the admin and also client interfaces of your Go web application using Gowut.

Happy UI coding in Go :-)

Index

Examples

Constants

View Source
const (
	THEME_DEFAULT = "default" // Default CSS theme
	THEME_DEBUG   = "debug"   // Debug CSS theme, useful for developing/debugging purposes.
)

Built-in CSS themes.

View Source
const (
	GOWUT_VERSION         = "0.8.0"          // Gowut version (major.minor.maintenance)
	GOWUT_RELEASE_DATE    = "2013-02-19 CET" // Gowut release date
	GOWUT_REL_DATE_LAYOUT = "2006-01-02 MST" // Gowut release date layout (for time.Parse())
)

Gowut version information.

View Source
const (
	MOUSE_BTN_UNKNOWN MouseBtn = -1 // Unknown mouse button (info not available)
	MOUSE_BTN_LEFT             = 0  // Left mouse button
	MOUSE_BTN_MIDDLE           = 1  // Middle mouse button
	MOUSE_BTN_RIGHT            = 2  // Right mouse button
)

Mouse buttons

View Source
const (
	ST_BACKGROUND     = "background"     // Background (color)
	ST_BORDER         = "border"         // Border
	ST_BORDER_LEFT    = "border-left"    // Left border
	ST_BORDER_RIGHT   = "border-right"   // Right border
	ST_BORDER_TOP     = "border-top"     // Top border
	ST_BORDER_BOTTOM  = "border-bottom"  // Bottom border
	ST_COLOR          = "color"          // (Foreground) color
	ST_CURSOR         = "cursor"         // Cursor
	ST_DISPLAY        = "display"        // Display
	ST_FONT_SIZE      = "font-size"      // Font size
	ST_FONT_STYLE     = "font-style"     // Font style
	ST_FONT_WEIGHT    = "font-weight"    // Font weight
	ST_HEIGHT         = "height"         // Height
	ST_MARGIN         = "margin"         // Margin
	ST_MARGIN_LEFT    = "margin-left"    // Left margin
	ST_MARGIN_RIGHT   = "margin-right"   // Right margin
	ST_MARGIN_TOP     = "margin-top"     // Top margin
	ST_MARGIN_BOTTOM  = "margin-bottom"  // Bottom margin
	ST_PADDING        = "padding"        // Padding
	ST_PADDING_LEFT   = "padding-left"   // Left padding
	ST_PADDING_RIGHT  = "padding-right"  // Right padding
	ST_PADDING_TOP    = "padding-top"    // Top padding
	ST_PADDING_BOTTOM = "padding-bottom" // Bottom padding
	ST_WHITE_SPACE    = "white-space"    // White-space
	ST_WIDTH          = "width"          // Width
)

Style attribute constants.

View Source
const (
	CLR_AQUA    = "Aqua"    // Aqua    (#00FFFF)
	CLR_BLACK   = "Black"   // Black   (#000000)
	CLR_BLUE    = "Blue"    // Blue    (#0000FF)
	CLR_FUCHSIA = "Fuchsia" // Fuchsia (#FF00FF)
	CLR_GRAY    = "Gray"    // Gray    (#808080)
	CLR_GREY    = "Grey"    // Grey    (#808080)
	CLR_GREEN   = "Green"   // Green   (#008000)
	CLR_LIME    = "Lime"    // Lime    (#00FF00)
	CLR_MAROON  = "Maroon"  // Maroon  (#800000)
	CLR_NAVY    = "Navy"    // Navy    (#000080)
	CLR_OLIVE   = "Olive"   // Olive   (#808000)
	CLR_PURPLE  = "Purple"  // Purple  (#800080)
	CLR_RED     = "Red"     // Red     (#FF0000)
	CLR_SILVER  = "Silver"  // Silver  (#C0C0C0)
	CLR_TEAL    = "Teal"    // Teal    (#008080)
	CLR_WHITE   = "White"   // White   (#FFFFFF)
	CLR_YELLOW  = "Yellow"  // Yellow  (#FFFF00)
)

The 17 standard color constants.

View Source
const (
	BRD_STYLE_SOLID  = "solid"  // Solid
	BRD_STYLE_DASHED = "dashed" // Dashed
	BRD_STYLE_DOTTED = "dotted" // Dotted
	BRD_STYLE_DOUBLE = "double" // Double
	BRD_STYLE_GROOVE = "groove" // 3D grooved border
	BRD_STYLE_RIDGE  = "ridge"  // 3D ridged border
	BRD_STYLE_INSET  = "inset"  // 3D inset border
	BRD_STYLE_OUTSET = "outset" // 3D outset border
)

Border style constants.

View Source
const (
	FONT_WEIGHT_NORMAL  = "normal"  // Normal
	FONT_WEIGHT_BOLD    = "bold"    // Bold
	FONT_WEIGHT_BOLDER  = "bolder"  // Bolder
	FONT_WEIGHT_LIGHTER = "lighter" // Lighter
)

Font weight constants.

View Source
const (
	FONT_STYLE_NORMAL = "normal" // Normal
	FONT_STYLE_ITALIC = "italic" // Italic
)

Font style constants.

View Source
const (
	CURSOR_AUTO      = "auto"      // Default. Web browser sets the cursor.
	CURSOR_CROSSHAIR = "crosshair" // Crosshair
	CURSOR_DEFAULT   = "default"   // The default cursor.
	CURSOR_HELP      = "help"      // Help
	CURSOR_MOVE      = "move"      // Move
	CURSOR_POINTER   = "pointer"   // Pointer
	CURSOR_PROGRESS  = "progress"  // Progress
	CURSOR_TEXT      = "text"      // Text
	CURSOR_WAIT      = "wait"      // Wait
	CURSOR_INHERIT   = "inherit"   // The cursor should be inherited from the parent element.
)

Mouse cursor constants.

View Source
const (
	DISPLAY_NONE    = "none"    // The element will not be displayed.
	DISPLAY_BLOCK   = "block"   // The element is displayed as a block.
	DISPLAY_INLINE  = "inline"  // The element is displayed as an in-line element. This is the default.
	DISPLAY_INHERIT = "inherit" // The display property value will be inherited from the parent element.
)

Display mode constants.

View Source
const (
	WHITE_SPACE_NORMAL   = "normal"   // Sequences of white spaces are collapsed into a single whitespace. Text will wrap when neccessary. This is the default.
	WHITE_SPACE_NOWRAP   = "nowrap"   // Sequences of whitespace will collapse into a single whitespace. Text will never wrap to the next line (the text is in one line).
	WHITE_SPACE_PRE      = "pre"      // Whitespace is preserved. Text will only wrap on line breaks.
	WHITE_SPACE_PRE_LINE = "pre-line" // Sequences of whitespace will collapse into a single whitespace. Text will wrap when necessary and on line breaks.
	WHITE_SPACE_PRE_WRAP = "pre-wrap" // Whitespace is preserved. Text will wrap when necessary, and on line breaks.
	WHITE_SPACE_INHERIT  = "inherit"  // Whitespace property will be inherited from the parent element.
)

White space constants.

View Source
const EMPTY_EHANDLER emptyEventHandler = emptyEventHandler(0)

Empty event handler which does nothing.

Variables

This section is empty.

Functions

func NewWriter

func NewWriter(w io.Writer) writer

NewWriter returns an implementation of our writer.

Types

type Button

type Button interface {
	// Button is a component.
	Comp

	// Button has text.
	HasText

	// Button can be enabled/disabled.
	HasEnabled
}

Button interface defines a clickable button.

Suggested event type to handle actions: ETYPE_CLICK

Default style class: "gwu-Button"

Example

Example code determining which button was clicked.

package main

import (
	"github.com/sinni800/gowut/gwu"
)

func main() {
	b := gwu.NewButton("Click me")
	b.AddEHandlerFunc(func(e gwu.Event) {
		if e.MouseBtn() == gwu.MOUSE_BTN_MIDDLE {
			// Middle click
		}
	}, gwu.ETYPE_CLICK)
}
Output:

func NewButton

func NewButton(text string) Button

NewButton creates a new Button.

type CSSRule

type CSSRule interface {
	Selector() string

	SetSelector(selector string)

	Style() Style
	// contains filtered or unexported methods
}

func NewCSSRule

func NewCSSRule() CSSRule

type CSSRuleCollection

type CSSRuleCollection interface {
	AddRule(r CSSRule)
	// contains filtered or unexported methods
}

type CellFmt

type CellFmt interface {
	// CellFmt allows overriding horizontal and vertical alignment.
	HasHVAlign

	// Style returns the Style builder of the wrapper cell.
	Style() Style
	// contains filtered or unexported methods
}

CellFmt interface defines a cell formatter which can be used to format and style the wrapper cells of individual components such as child components of a PanelView or a Table.

type CheckBox

type CheckBox interface {
	// CheckBox is a StateButton.
	StateButton
}

CheckBox interface defines a check box, a button which has 2 states: selected/deselected.

Suggested event type to handle changes: ETYPE_CLICK

Default style classes: "gwu-CheckBox", "gwu-CheckBox-Disabled"

func NewCheckBox

func NewCheckBox(text string) CheckBox

NewCheckBox creates a new CheckBox. The initial state is false.

type Comp

type Comp interface {
	// Id returns the unique id of the component
	Id() ID

	// Equals tells if this component is equal to the specified another component.
	Equals(c2 Comp) bool

	// Parent returns the component's parent container.
	Parent() Container

	// Attr returns the explicitly set value of the specified HTML attribute.
	Attr(name string) string

	// SetAttr sets the value of the specified HTML attribute.
	// Pass an empty string value to delete the attribute.
	SetAttr(name, value string)

	// IAttr returns the explicitly set value of the specified HTML attribute
	// as an int.
	// -1 is returned if the value is not set explicitly or is not an int.
	IAttr(name string) int

	// SetAttr sets the value of the specified HTML attribute as an int.
	SetIAttr(name string, value int)

	// ToolTip returns the tool tip of the component.
	ToolTip() string

	// SetToolTip sets the tool tip of the component.
	SetToolTip(toolTip string)

	// Style returns the Style builder of the component.
	Style() Style

	// DescendantOf tells if this component is a descendant of the specified another component.
	DescendantOf(c2 Comp) bool

	// AddEHandler adds a new event handler.
	AddEHandler(handler EventHandler, etypes ...EventType)

	// AddEHandlerFunc adds a new event handler generated from a handler function.
	AddEHandlerFunc(hf func(e Event), etypes ...EventType)

	// HandlersCount returns the number of added handlers.
	HandlersCount(etype EventType) int

	// SyncOnETypes returns the event types on which to synchronize component value
	// from browser to the server.
	SyncOnETypes() []EventType

	// AddSyncOnETypes adds additional event types on which to synchronize
	// component value from browser to the server.
	AddSyncOnETypes(etypes ...EventType)

	// Render renders the component (as HTML code).
	Render(w writer)
	// contains filtered or unexported methods
}

Comp interface: the base of all UI components.

type Container

type Container interface {
	// Container is a component.
	Comp

	// Remove removes a component from this container.
	// Return value indicates if the specified component was a child
	// and was removed successfully.
	// After a successful Remove the specified component's
	// Parent() method will return nil.
	Remove(c Comp) bool

	// ById finds a component (recursively) by its ID and returns it.
	// nil is returned if no child component is found (recursively)
	// with the specified ID.
	ById(id ID) Comp

	// Clear clears the container, removes all child components.
	Clear()
}

Container interface defines a component that can contain other components. Since a Container is a component itself, it can be added to other containers as well. The contained components are called the child components.

type Event

type Event interface {
	// Type returns the type of the event.
	Type() EventType

	// Src returns the source of the event,
	// the component the event is originating from
	Src() Comp

	// Parent returns the parent event if there's one.
	// Usually internal events have parent event for which the internal
	// event was created and dispatched.
	// The parent event can be used to identify the original source and event type.
	Parent() Event

	// Mouse returns the mouse x and y coordinates relative to the component.
	// If no mouse coordinate info is available, (-1, -1) is returned.
	Mouse() (x, y int)

	// MouseWin returns the mouse x and y coordinates inside the window.
	// If no mouse coordinate info is available, (-1, -1) is returned.
	MouseWin() (x, y int)

	// MouseBtn returns the mouse button.
	// If no mouse button info is available, MOUSE_BTN_UNKNOWN is returned.
	MouseBtn() MouseBtn

	// ModKeys returns the states of the modifier keys.
	// The returned value contains the states of all modifier keys,
	// constants of type ModKey can be used to test a specific modifier key,
	// or use the ModKey method.
	ModKeys() int

	// ModKey returns the state of the specified modifier key.
	ModKey(modKey ModKey) bool

	// Key code returns the key code.
	KeyCode() Key

	// Requests the specified window to be reloaded
	// after processing the current event.
	// Tip: pass an empty string to reload the current window.
	ReloadWin(name string)

	// MarkDirty marks components dirty,
	// causing them to be re-rendered after processing the current event.
	// Component re-rendering happens without page reload in the browser.
	//
	// Note: the Window itself (which is a Comp) can also be marked dirty
	// causing the whole window content to be re-rendered without page reload!
	//
	// Marking a component dirty also marks all of its decendants dirty, recursively.
	//
	// Also note that components will not be re-rendered multiple times.
	// For example if a child component and its parent component are both
	// marked dirty, the child component will only be re-rendered once.
	MarkDirty(comps ...Comp)

	// SetFocusedComp sets the component to be focused after processing
	// the current event.
	SetFocusedComp(comp Comp)

	// Session returns the current session.
	// The Private() method of the session can be used to tell if the session
	// is a private session or the public shared session.
	Session() Session

	// NewSession creates a new (private) session.
	// If the current session (as returned by Session()) is private,
	// it will be removed first.
	NewSession() Session

	// RemoveSess removes (invalidates) the current session.
	// Only private sessions can be removed, calling this
	// when the current session (as returned by Session()) is public is a no-op.
	// After this method Session() will return the shared public session.
	RemoveSess()
	// contains filtered or unexported methods
}

Event interface defines the event originating from components.

type EventCategory

type EventCategory int

Event type category.

const (
	ECAT_GENERAL  EventCategory = iota // General event type for all components
	ECAT_WINDOW                        // Window event type for Window only
	ECAT_INTERNAL                      // Internal event generated and dispatched internally while processing another event

	ECAT_UNKNOWN EventCategory = -1 // Unknown event category
)

Event type categories.

type EventHandler

type EventHandler interface {
	// Handles the event.
	//
	// If components are modified in a way that their view changes,
	// these components must be marked dirty in the event object
	// (so the client will see up-to-date state).
	//
	// If the component tree is modified (new component added
	// or removed for example), then the Container whose structure
	// was modified has to be marked dirty.
	HandleEvent(e Event)
}

EventHandler interface defines a handler capable of handling events.

type EventType

type EventType int

Event type (kind) type.

const (
	// General events for all components
	ETYPE_CLICK      EventType = iota // Mouse click event
	ETYPE_DBL_CLICK                   // Mouse double click event
	ETYPE_MOUSE_DOWN                  // Mouse down event
	ETYPE_MOUSE_MOVE                  // Mouse move event
	ETYPE_MOUSE_OVER                  // Mouse over event
	ETYPE_MOUSE_OUT                   // Mouse out event
	ETYPE_MOUSE_UP                    // Mouse up event
	ETYPE_KEY_DOWN                    // Key down event
	ETYPE_KEY_PRESS                   // Key press event
	ETYPE_KEY_UP                      // Key up event
	ETYPE_BLUR                        // Blur event (component loses focus)
	ETYPE_CHANGE                      // Change event (value change)
	ETYPE_FOCUS                       // Focus event (component gains focus)

	// Window events (for Window only)
	ETYPE_WIN_LOAD   // Window load event
	ETYPE_WIN_UNLOAD // Window unload event

	// Internal events, generated and dispatched internally while processing another event
	ETYPE_STATE_CHANGE // State change
)

Event types.

func (EventType) Category

func (etype EventType) Category() EventCategory

Category returns the event type category.

func (EventType) String

func (etype EventType) String() string

Converts an Event type to a string.

type Expander

type Expander interface {
	// Expander is a TableView.
	TableView

	// Header returns the header component of the expander.
	Header() Comp

	// SetHeader sets the header component of the expander.
	SetHeader(h Comp)

	// Content returns the content component of the expander.
	Content() Comp

	// SetContent sets the content component of the expander.
	SetContent(c Comp)

	// Expanded returns whether the expander is expanded.
	Expanded() bool

	// SetExpanded sets whether the expander is expanded.
	SetExpanded(expanded bool)

	// HeaderFmt returns the cell formatter of the header.
	HeaderFmt() CellFmt

	// ContentFmt returns the cell formatter of the content.
	ContentFmt() CellFmt
}

Expander interface defines a component which can show and hide another component when clicked on the header.

You can register ETYPE_STATE_CHANGE event handlers which will be called when the user expands or collapses the expander by clicking on the header. The event source will be the expander. The event will have a parent event whose source will be the clicked header component and will contain the mouse coordinates.

Default style classes: "gwu-Expander", "gwu-Expander-Header", "gwuimg-collapsed", "gwu-Expander-Header-Expanded", "gwuimg-expanded", "gwu-Expander-Content"

func NewExpander

func NewExpander() Expander

NewExpander creates a new Expander. By default expanders are collapsed.

type HAlign

type HAlign string

Horizontal alignment type.

const (
	HA_LEFT   HAlign = "left"   // Horizontal left alignment
	HA_CENTER HAlign = "center" // Horizontal center alignment
	HA_RIGHT  HAlign = "right"  // Horizontal right alignment

	HA_DEFAULT HAlign = "" // Browser default (or inherited) horizontal alignment
)

Horizontal alignment constants.

type HasEnabled

type HasEnabled interface {
	// Enabled returns the enabled property.
	Enabled() bool

	// SetEnabled sets the enabled property.
	SetEnabled(enabled bool)
}

HasEnabled interface defines an enabled property.

type HasHVAlign

type HasHVAlign interface {
	// HAlign returns the horizontal alignment.
	HAlign() HAlign

	// SetHAlign sets the horizontal alignment.
	SetHAlign(halign HAlign)

	// VAlign returns the vertical alignment.
	VAlign() VAlign

	// SetVAlign sets the vertical alignment.
	SetVAlign(valign VAlign)

	// SetAlign sets both the horizontal and vertical alignments.
	SetAlign(halign HAlign, valign VAlign)
}

HasHVAlign interfaces defines a horizontal and a vertical alignment property.

type HasText

type HasText interface {
	// Text returns the text.
	Text() string

	// SetText sets the text.
	SetText(text string)
}

HasText interface defines a modifiable text property.

type HasUrl

type HasUrl interface {
	// URL returns the URL string.
	Url() string

	// SetUrl sets the URL string.
	SetUrl(url string)
}

HasUrl interface defines a URL string property.

type Html

type Html interface {
	// Html is a component.
	Comp

	// Html returns the HTML text.
	Html() string

	// SetHtml sets the HTML text.
	SetHtml(html string)
}

Html interface defines a component which wraps an HTML text into a component.

Default style class: "gwu-Html"

func NewHtml

func NewHtml(html string) Html

NewHtml creates a new Html.

type ID

type ID int

The type of the ids of the components.

func AtoID

func AtoID(s string) (ID, error)

Converts a string to ID

func (ID) String

func (id ID) String() string

Converts an ID to a string.

type Image

type Image interface {
	// Image is a component.
	Comp

	// Image has text which is its description (alternate text).
	HasText

	// Image has URL string.
	HasUrl
}

Image interface defines an image.

Default style class: "gwu-Image"

func NewImage

func NewImage(text, url string) Image

NewImage creates a new Image. The text is used as the alternate text for the image.

type Key

type Key int

Key (keyboard key) type.

const (
	KEY_BACKSPACE  Key = 8
	KEY_ENTER      Key = 13
	KEY_SHIFT      Key = 16
	KEY_CTRL       Key = 17
	KEY_ALT        Key = 18
	KEY_CAPS_LOCK  Key = 20
	KEY_ESCAPE     Key = 27
	KEY_SPACE      Key = 32
	KEY_PG_UP      Key = 33
	KEY_PG_DOWN    Key = 34
	KEY_END        Key = 35
	KEY_HOME       Key = 36
	KEY_LEFT       Key = 37
	KEY_UP         Key = 38
	KEY_RIGHT      Key = 39
	KEY_DOWN       Key = 40
	KEY_PRINT_SCRN Key = 44
	KEY_INSERT     Key = 45
	KEY_DEL        Key = 46

	KEY_0 Key = 48
	KEY_9 Key = 57

	KEY_A Key = 65
	KEY_Z Key = 90

	KEY_WIN Key = 91

	KEY_NUMPAD_0     Key = 96
	KEY_NUMPAD_9     Key = 105
	KEY_NUMPAD_MUL   Key = 106
	KEY_NUMPAD_PLUS  Key = 107
	KEY_NUMPAD_MINUS Key = 109
	KEY_NUMPAD_DOT   Key = 110
	KEY_NUMPAD_DIV   Key = 111

	KEY_F1  Key = 112
	KEY_F2  Key = 113
	KEY_F3  Key = 114
	KEY_F4  Key = 115
	KEY_F5  Key = 116
	KEY_F6  Key = 117
	KEY_F7  Key = 118
	KEY_F8  Key = 119
	KEY_F9  Key = 120
	KEY_F10 Key = 121
	KEY_F11 Key = 122
	KEY_F12 Key = 123

	KEY_NUM_LOCK    Key = 144
	KEY_SCROLL_LOCK Key = 145
)

Some key codes.

type Label

type Label interface {
	// Label is a component.
	Comp

	// Label has text.
	HasText
}

Label interface defines a component which wraps a text into a component.

Default style class: "gwu-Label"

func NewLabel

func NewLabel(text string) Label

NewLabel creates a new Label.

type Layout

type Layout int

Layout strategy type.

const (
	LAYOUT_NATURAL    Layout = iota // Natural layout: elements are displayed in their natural order.
	LAYOUT_VERTICAL                 // Vertical layout: elements are layed out vertically.
	LAYOUT_HORIZONTAL               // Horizontal layout: elements are layed out horizontally.
)

Layout strategies.

type Link interface {
	// Link is a Container.
	Container

	// Link has text.
	HasText

	// Link has URL string.
	HasUrl

	// Target returns the target of the link.
	Target() string

	// SetTarget sets the target of the link.
	// Tip: pass "_blank" if you want the URL to open in a new window
	// (this is the default).
	SetTarget(target string)

	// Comp returns the optional child component, if set.
	Comp() Comp

	// SetComp sets the only child component
	// (which can be a Container of course).
	SetComp(c Comp)
}

Link interface defines a clickable link pointing to a URL. Links are usually used with a text, although Link is a container, and allows to set a child component which if set will also be a part of the clickable link.

Default style class: "gwu-Link"

func NewLink(text, url string) Link

NewLink creates a new Link. By default links open in a new window (tab) because their target is set to "_blank".

type ListBox

type ListBox interface {
	// ListBox is a component
	Comp

	// ListBox can be enabled/disabled.
	HasEnabled

	// Multi tells if multiple selections are allowed.
	Multi() bool

	// SetMulti sets whether multiple selections are allowed.
	SetMulti(multi bool)

	// Rows returns the number of displayed rows.
	Rows() int

	// SetRows sets the number of displayed rows.
	// rows=1 will make this ListBox a dropdown list (if multi is false!).
	// Note that if rows is greater than 1, most browsers enforce a visual minimum size
	// (about 4 rows) even if rows is less than that.
	SetRows(rows int)

	// SelectedValue retruns the first selected value.
	// Empty string is returned if nothing is selected.
	SelectedValue() string

	// SelectedValues retruns all the selected values.
	SelectedValues() []string

	// Selected tells if the value at index i is selected.
	Selected(i int) bool

	// SelectedIdx returns the first selected index.
	// Returns -1 if nothing is selected.
	SelectedIdx() int

	// SelectedIndices returns a slice of the indices of the selected values.
	SelectedIndices() []int

	// SetSelected sets the selection state of the value at index i.
	SetSelected(i int, selected bool)

	// SetSelectedIndices sets the (only) selected values.
	// Only values will be selected that are contained in the specified indices slice.
	SetSelectedIndices(indices []int)

	// ClearSelected deselects all values.
	ClearSelected()
}

ListBox interface defines a component which allows selecting one or multiple values from a predefined list.

Suggested event type to handle changes: ETYPE_CHANGE

Default style class: "gwu-ListBox"

func NewListBox

func NewListBox(values []string) ListBox

NewListBox creates a new ListBox.

type ModKey

type ModKey int

Modifier key type.

const (
	MOD_KEY_ALT   ModKey = 1 << iota // Alt key
	MOD_KEY_CTRL                     // Control key
	MOD_KEY_META                     // Meta key
	MOD_KEY_SHIFT                    // Shift key
)

Modifier key masks.

type MouseBtn

type MouseBtn int

Mouse button type.

type Panel

type Panel interface {
	// Panel is a PanelView.
	PanelView

	// Add adds a component to the panel.
	Add(c Comp)

	// Insert inserts a component at the specified index.
	// Returns true if the index was valid and the component is inserted
	// successfully, false otherwise. idx=CompsCount() is also allowed
	// in which case comp will be the last component.
	Insert(c Comp, idx int) bool

	// AddHSpace adds and returns a fixed-width horizontal space consumer.
	// Useful when layout is LAYOUT_HORIZONTAL.
	AddHSpace(width int) Comp

	// AddVSpace adds and returns a fixed-height vertical space consumer.
	// Useful when layout is LAYOUT_VERTICAL.
	AddVSpace(height int) Comp

	// AddSpace adds and returns a fixed-size space consumer.
	AddSpace(width, height int) Comp

	// AddHConsumer adds and returns a horizontal (free) space consumer.
	// Useful when layout is LAYOUT_HORIZONTAL.
	//
	// Tip: When adding a horizontal space consumer, you may set the
	// white space style attribute of other components in the the panel
	// to WHITE_SPACE_NOWRAP to avoid texts getting wrapped to multiple lines.
	AddHConsumer() Comp

	// AddVConsumer adds and returns a vertical (free) space consumer.
	// Useful when layout is LAYOUT_VERTICAL.
	AddVConsumer() Comp
}

Panel interface defines a container which stores child components associated with an index, and lays out its children based on a layout strategy. Default style class: "gwu-Panel"

func NewHorizontalPanel

func NewHorizontalPanel() Panel

NewHorizontalPanel creates a new Panel initialized with LAYOUT_HORIZONTAL layout. Default horizontal alignment is HA_DEFAULT, default vertical alignment is VA_DEFAULT.

func NewNaturalPanel

func NewNaturalPanel() Panel

NewNaturalPanel creates a new Panel initialized with LAYOUT_NATURAL layout. Default horizontal alignment is HA_DEFAULT, default vertical alignment is VA_DEFAULT.

func NewPanel

func NewPanel() Panel

NewPanel creates a new Panel. Default layout strategy is LAYOUT_VERTICAL, default horizontal alignment is HA_DEFAULT, default vertical alignment is VA_DEFAULT.

func NewVerticalPanel

func NewVerticalPanel() Panel

NewVerticalPanel creates a new Panel initialized with LAYOUT_VERTICAL layout. Default horizontal alignment is HA_DEFAULT, default vertical alignment is VA_DEFAULT.

type PanelView

type PanelView interface {
	// PanelView is a TableView.
	TableView

	// Layout returns the layout strategy used to lay out components when rendering.
	Layout() Layout

	// SetLayout sets the layout strategy used to lay out components when rendering.
	SetLayout(layout Layout)

	// CompsCount returns the number of components added to the panel.
	CompsCount() int

	// CompAt returns the component at the specified index.
	// Returns nil if idx<0 or idx>=CompsCount().
	CompAt(idx int) Comp

	// CompIdx returns the index of the specified component in the panel.
	// -1 is returned if the component is not added to the panel.
	CompIdx(c Comp) int

	// CellFmt returns the cell formatter of the specified child component.
	// If the specified component is not a child, nil is returned.
	// Cell formatting has no effect if layout is LAYOUT_NATURAL.
	CellFmt(c Comp) CellFmt
}

PanelView interface defines a container which stores child components sequentially (one dimensional, associated with an index), and lays out its children in a row or column using TableView based on a layout strategy, but does not define the way how child components can be added.

Default style class: "gwu-Panel"

type PasswBox

type PasswBox interface {
	// PasswBox is a TextBox.
	TextBox
}

PasswBox interface defines a text box for password input purpose.

Suggested event type to handle actions: ETYPE_CHANGE

By default the value of the PasswBox is synchronized with the server on ETYPE_CHANGE event which is when the PasswBox loses focus or when the ENTER key is pressed. If you want a PasswBox to synchronize values during editing (while you type in characters), add the ETYPE_KEY_UP event type to the events on which synchronization happens by calling:

AddSyncOnETypes(ETYPE_KEY_UP)

Default style class: "gwu-PasswBox"

type RadioButton

type RadioButton interface {
	// RadioButton is a StateButton.
	StateButton

	// Group returns the group of the radio button.
	Group() RadioGroup
	// contains filtered or unexported methods
}

RadioButton interface defines a radio button, a button which has 2 states: selected/deselected. In addition to the state, radio buttons belong to a group, and in each group only one radio button can be selected. Selecting an unselected radio button deselects the selected radio button of the group, if there was one.

Suggested event type to handle changes: ETYPE_CLICK

Default style classes: "gwu-RadioButton", "gwu-RadioButton-Disabled"

func NewRadioButton

func NewRadioButton(text string, group RadioGroup) RadioButton

NewRadioButton creates a new radio button. The initial state is false.

type RadioGroup

type RadioGroup interface {
	// Name returns the name of the radio group.
	Name() string

	// Selected returns the selected radio button of the group.
	Selected() RadioButton

	// PrevSelected returns the radio button that was selected
	// before the current selected radio button.
	PrevSelected() RadioButton
	// contains filtered or unexported methods
}

RadioGroup interface defines the group for grouping radio buttons.

func NewRadioGroup

func NewRadioGroup(name string) RadioGroup

NewRadioGroup creates a new RadioGroup.

type Server

type Server interface {
	// The Server implements the Session interface:
	// there is one public session which is shared between
	// the "sessionless" requests.
	// This is to maintain windows without a session.
	Session

	// A server has text which will be used as the title
	// of the server.
	HasText

	// Secure returns if the server is configured to run
	// in secure (HTTPS) mode or in HTTP mode.
	Secure() bool

	// AppUrl returns the application URL string.
	AppUrl() string

	// AppPath returns the application path string.
	AppPath() string

	// AddSessCreatorName registers a nonexistent window name
	// whose path auto-creates a new session.
	//
	// Normally sessions are created from event handlers during
	// event dispatching by calling Event.NewSession(). This
	// requires a public window and an event source component
	// (e.g. a Button) to create a session.
	// With AddSessCreatorName you can register nonexistent (meaning
	// not-yet added) window names whose path will trigger an automatic
	// session creation (if the current session is not private), and
	// with a registered SessionHandler you can build the window and
	// add it to the auto-created new session prior to it being served.
	//
	// The text linking to the name will be included in the window list
	// if text is a non-empty string.
	//
	// Tip: You can use this to pre-register a login window for example.
	// You can call
	// 		AddSessCreatorName("login", "Login Window")
	// and in the Created() method of a registered SessionHandler:
	//		func (h MySessHanlder) Created(s gwu.Session) {
	//			win := gwu.NewWindow("login", "Login Window")
	//			// ...add content to the login window...
	// 			s.AddWindow(win)
	// 		}
	AddSessCreatorName(name, text string)

	// AddSHandler adds a new session handler.
	AddSHandler(handler SessionHandler)

	// AddStaticDir registers a directory whose content (files) recursively
	// will be served by the server when requested.
	// path is an app-path relative path to address a file, dir is the root directory
	// to search in.
	//
	// Example:
	//     AddStaticDir("img", "/tmp/myimg")
	// And then the request "/appname/img/faces/happy.gif" will serve "/tmp/myimg/faces/happy.gif".
	// Note that the app name must be included in the request path!
	AddStaticDir(path, dir string) error

	// Theme returns the default CSS theme of the server.
	Theme() string

	// SetTheme sets the default CSS theme of the server.
	SetTheme(theme string)

	// SetLogger sets the logger to be used
	// to log incoming requests.
	// Pass nil to disable logging. This is the default.
	SetLogger(logger *log.Logger)

	// Start starts the GUI server and waits for incoming connections.
	//
	// Sessionless window names may be specified as optional parameters
	// that will be opened in the default browser.
	// Tip: Pass an empty string to open the window list.
	// Tip: Not passing any window names will start the server silently
	// without opening any windows.
	Start(openWins ...string) error
}

Server interface defines the GUI server which handles sessions, renders the windows, components and handles event dispatching.

func NewServer

func NewServer(appName, addr string) Server

NewServer creates a new GUI server in HTTP mode. The specified app name will be part of the application path (the first part). If addr is empty string, "localhost:3434" will be used.

Tip: Pass an empty string as appName to place the GUI server to the root path ("/").

func NewServerTLS

func NewServerTLS(appName, addr, certFile, keyFile string) Server

NewServerTLS creates a new GUI server in secure (HTTPS) mode. The specified app name will be part of the application path (the first part). If addr is empty string, "localhost:3434" will be used.

Tip: Pass an empty string as appName to place the GUI server to the root path ("/"). Tip: You can use generate_cert.go in crypto/tls to generate a test certificate and key file (cert.pem andkey.pem).

type Session

type Session interface {
	// Id returns the id of the session.
	Id() string

	// New tells if the session is new meaning the client
	// does not (yet) know about it.
	New() bool

	// Private tells if the session is a private session.
	// There is only one public session, and it is shared
	// between the "sessionless" users.
	Private() bool

	// AddWin adds a window to the session.
	// Returns an error if window name is empty or
	// a window with the same name has already been added.
	AddWin(w Window) error

	// RemoveWin removes a window from the session.
	// Returns if the window was removed from the session.
	RemoveWin(w Window) bool

	// SortedWins returns a sorted slice of windows.
	// The slice is sorted by window text (title).
	SortedWins() []Window

	// WinByName returns a window specified by its name.
	WinByName(name string) Window

	// Attr returns the value of an attribute stored in the session.
	// TODO use an interface type something like "serializable".
	Attr(name string) interface{}

	// SetAttr sets the value of an attribute stored in the session.
	// Pass the nil value to delete the attribute.
	SetAttr(name string, value interface{})

	// Created returns the time when the session was created.
	Created() time.Time

	// Accessed returns the time when the session was last accessed.
	Accessed() time.Time

	// Timeout returns the session timeout.
	Timeout() time.Duration

	// SetTimeout sets the session timeout.
	SetTimeout(timeout time.Duration)
	// contains filtered or unexported methods
}

Session interface defines the session to the GWU users (clients).

type SessionHandler

type SessionHandler interface {
	// Created is called when a new session is created.
	// At this time the client does not yet know about the session.
	Created(sess Session)

	// Removed is called when a session is being removed
	// from the server. After removal, the session id will become
	// an invalid session id.
	Removed(sess Session)
}

SessionHandler interface defines a callback to get notified for certain events related to session life-cycles.

type StateButton

type StateButton interface {
	// stateButton is a button
	Button

	// State returns the state of the button.
	State() bool

	// SetState sets the state of the button.
	// In case of RadioButton, the button's RadioGroup is managed
	// so that only one can be selected.
	SetState(state bool)
}

StateButton interface defines a button which has a boolean state: true/false or selected/deselected.

type Style

type Style interface {
	// AddClass adds a style class name to the class name list.
	AddClass(class string) Style

	// SetClass sets a style class name, removing all previously
	// added style class names.
	// Tip: set an empty string class name to remove all class names.
	SetClass(class string) Style

	// RemoveClass removes a style class name.
	// If the specified class is not found, this is a no-op.
	RemoveClass(class string) Style

	// Get returns the explicitly set value of the specified style attribute.
	// Explicitly set style attributes will be concatenated and rendered
	// as the "style" HTML attribute of the component.
	Get(name string) string

	// Set sets the value of the specified style attribute.
	// Pass an empty string value to delete the specified style attribute.
	Set(name, value string) Style

	// Size returns the size.
	Size() (width, height string)

	// SetSize sets the width and height.
	SetSize(width, height string) Style

	// SetSizePx sets the width and height, in pixels.
	SetSizePx(width, height int) Style

	// SetFullSize sets full width (100%) and height (100%).
	SetFullSize() Style

	// Padding returns the padding.
	// (The "padding" style attribute only.)
	Padding() string

	// SetPadding sets the padding.
	// (The "padding" style attribute only.)
	SetPadding(value string) Style

	// SetPadding2 sets the padding specified by parts.
	// (The "padding" style attribute only.)
	SetPadding2(top, right, bottom, left string) Style

	// SetPaddingPx sets the padding specified by parts, in pixels.
	// (The "padding" style attribute only.)
	SetPaddingPx(top, right, bottom, left int) Style

	// PaddingLeft returns the left padding.
	// (The "padding-left" style attribute only.)
	PaddingLeft() string

	// SetPaddingLeft sets the left padding.
	// (The "padding-left" style attribute only.)
	SetPaddingLeft(value string) Style

	// SetPaddingLeftPx sets the left padding, in pixels.
	// (The "padding-left" style attribute only.)
	SetPaddingLeftPx(width int) Style

	// PaddingRight returns the right padding.
	// (The "padding-right" style attribute only.)
	PaddingRight() string

	// SetPaddingRight sets the right padding.
	// (The "padding-right" style attribute only.)
	SetPaddingRight(value string) Style

	// SetPaddingRightPx sets the right padding, in pixels.
	// (The "padding-right" style attribute only.)
	SetPaddingRightPx(width int) Style

	// PaddingTop returns the top padding.
	// (The "padding-top" style attribute only.)
	PaddingTop() string

	// SetPaddingTop sets the top padding.
	// (The "padding-top" style attribute only.)
	SetPaddingTop(value string) Style

	// SetPaddingTopPx sets the top padding, in pixels.
	// (The "padding-top" style attribute only.)
	SetPaddingTopPx(height int) Style

	// PaddingBottom returns the bottom padding.
	// (The "padding-bottom" style attribute only.)
	PaddingBottom() string

	// SetPaddingBottom sets the bottom padding.
	// (The "padding-bottom" style attribute only.)
	SetPaddingBottom(value string) Style

	// SetPaddingBottomPx sets the bottom padding, in pixels.
	// (The "padding-bottom" style attribute only.)
	SetPaddingBottomPx(height int) Style

	// Margin returns the margin.
	// (The "margin" style attribute only.)
	Margin() string

	// SetMargin sets the margin.
	// (The "margin" style attribute only.)
	SetMargin(value string) Style

	// SetMargin2 sets the margin specified by parts.
	// (The "margin" style attribute only.)
	SetMargin2(top, right, bottom, left string) Style

	// SetMarginPx sets the margin specified by parts, in pixels.
	// (The "margin" style attribute only.)
	SetMarginPx(top, right, bottom, left int) Style

	// MarginLeft returns the left margin.
	// (The "margin-left" style attribute only.)
	MarginLeft() string

	// SetMarginLeft sets the left margin.
	// (The "margin-left" style attribute only.)
	SetMarginLeft(value string) Style

	// SetMarginLeftPx sets the left margin, in pixels.
	// (The "margin-left" style attribute only.)
	SetMarginLeftPx(width int) Style

	// MarginRight returns the right margin.
	// (The "margin-right" style attribute only.)
	MarginRight() string

	// SetMarginRight sets the right margin.
	// (The "margin-right" style attribute only.)
	SetMarginRight(value string) Style

	// SetMarginRightPx sets the right margin, in pixels.
	// (The "margin-right" style attribute only.)
	SetMarginRightPx(width int) Style

	// MarginTop returns the top margin.
	// (The "margin-top" style attribute only.)
	MarginTop() string

	// SetMarginTop sets the top margin.
	// (The "margin-top" style attribute only.)
	SetMarginTop(value string) Style

	// SetMarginTopPx sets the top margin, in pixels.
	// (The "margin-top" style attribute only.)
	SetMarginTopPx(height int) Style

	// MarginBottom returns the bottom margin.
	// (The "margin-bottom" style attribute only.)
	MarginBottom() string

	// SetMarginBottom sets the bottom margin.
	// (The "margin-bottom" style attribute only.)
	SetMarginBottom(value string) Style

	// SetMarginBottomPx sets the bottom margin, in pixels.
	// (The "margin-bottom" style attribute only.)
	SetMarginBottomPx(height int) Style

	// Background returns the background (color).
	Background() string

	// SetBackground sets the background (color).
	SetBackground(value string) Style

	// Border returns the border.
	Border() string

	// SetBorder sets the border.
	SetBorder(value string) Style

	// SetBorder2 sets the border specified by parts.
	// (The "border" style attribute only.)
	SetBorder2(width int, style, color string) Style

	// BorderLeft returns the left border.
	BorderLeft() string

	// SetBorderLeft sets the left border.
	SetBorderLeft(value string) Style

	// SetBorderLeft2 sets the left border specified by parts.
	// (The "border-left" style attribute only.)
	SetBorderLeft2(width int, style, color string) Style

	// BorderRight returns the right border.
	BorderRight() string

	// SetBorderRight sets the right border.
	SetBorderRight(value string) Style

	// SetBorderRight2 sets the right border specified by parts.
	// (The "border-right" style attribute only.)
	SetBorderRight2(width int, style, color string) Style

	// BorderTop returns the top border.
	BorderTop() string

	// SetBorderTop sets the top border.
	SetBorderTop(value string) Style

	// SetBorderTop2 sets the top border specified by parts.
	// (The "border-top" style attribute only.)
	SetBorderTop2(width int, style, color string) Style

	// BorderBottom returns the bottom border.
	BorderBottom() string

	// SetBorderBottom sets the bottom border.
	SetBorderBottom(value string) Style

	// SetBorderBottom2 sets the bottom border specified by parts.
	// (The "border-bottom" style attribute only.)
	SetBorderBottom2(width int, style, color string) Style

	// Color returns the (foreground) color.
	Color() string

	// SetColor sets the (foreground) color.
	SetColor(value string) Style

	// Cursor returns the (mouse) cursor.
	Cursor() string

	// SetCursor sets the (mouse) cursor.
	SetCursor(value string) Style

	// Display returns the display mode.
	Display() string

	// SetDisplay sets the display mode
	SetDisplay(value string) Style

	// FontSize returns the font size.
	FontSize() string

	// SetFontSize sets the font size.
	SetFontSize(value string) Style

	// FontStyle returns the font style.
	FontStyle() string

	// SetFontStyle sets the font style.
	SetFontStyle(value string) Style

	// FontWeight returns the font weight.
	FontWeight() string

	// SetFontWeight sets the font weight.
	SetFontWeight(value string) Style

	// Width returns the width.
	Width() string

	// SetWidth sets the width.
	SetWidth(value string) Style

	// SetWidthPx sets the width, in pixels.
	SetWidthPx(width int) Style

	// SetFullWidth sets full width (100%).
	SetFullWidth() Style

	// Height returns the height.
	Height() string

	// SetHeight sets the height.
	SetHeight(value string) Style

	// SetHeightPx sets the height.
	SetHeightPx(height int) Style

	// SetFullHeight sets full height (100%).
	SetFullHeight() Style

	// WhiteSpace returns the white space attribute value.
	WhiteSpace() string

	// SetWhiteSpace sets the white space attribute value.
	SetWhiteSpace(value string) Style
	// contains filtered or unexported methods
}

Style interface contains utility methods for manipulating the style of a component. You can think of it as the Style Builder. Set methods return the style reference so setting the values of multiple style attributes can be chained.

type SwitchButton

type SwitchButton interface {
	// SwitchButton is a component.
	Comp

	// SwitchButton can be enabled/disabled.
	HasEnabled

	// State returns the state of the switch button.
	State() bool

	// SetState sets the state of the switch button.
	SetState(state bool)

	// On returns the text displayed for the ON side.
	On() string

	// Off returns the text displayed for the OFF side.
	Off() string

	// SetOnOff sets the texts of the ON and OFF sides.
	SetOnOff(on, off string)
}

SwitchButton interface defines a button which can be switched ON and OFF.

Suggested event type to handle changes: ETYPE_CLICK

Default style classes: "gwu-SwitchButton", "gwu-SwitchButton-On-Active" "gwu-SwitchButton-On-Inactive", "gwu-SwitchButton-Off-Active", "gwu-SwitchButton-Off-Inactive"

func NewSwitchButton

func NewSwitchButton() SwitchButton

NewSwitchButton creates a new SwitchButton. Default texts for ON and OFF sides are: "ON" and "OFF". The initial state is false (OFF).

type TabBar

type TabBar interface {
	// TabBar is a PanelView.
	PanelView
}

TabBar interface defines the tab bar for selecting the visible component of a TabPanel.

Note: Removing a tab component through the tab bar also removes the content component from the tab panel of the tab bar.

Default style classes: "gwu-TabBar", "gwu-TabBar-Top", "gwu-TabBar-Bottom", "gwu-TabBar-Left", "gwu-TabBar-Right", "gwu-TabBar-NotSelected", "gwu-TabBar-Selected"

type TabBarPlacement

type TabBarPlacement int

Tab bar placement type.

const (
	TB_PLACEMENT_TOP    TabBarPlacement = iota // Tab bar placement to Top
	TB_PLACEMENT_BOTTOM                        // Tab bar placement to Bottom
	TB_PLACEMENT_LEFT                          // Tab bar placement to Left
	TB_PLACEMENT_RIGHT                         // Tab bar placement to Right
)

Tab bar placements.

type TabPanel

type TabPanel interface {
	// TabPanel is a Container.
	PanelView

	// TabBar returns the tab bar.
	TabBar() TabBar

	// TabBarPlacement returns the tab bar placement.
	TabBarPlacement() TabBarPlacement

	// SetTabBarPlacement sets tab bar placement.
	// Also sets the alignment of the tab bar according
	// to the tab bar placement.
	SetTabBarPlacement(tabBarPlacement TabBarPlacement)

	// TabBarFmt returns the cell formatter of the tab bar.
	TabBarFmt() CellFmt

	// Add adds a new tab (component) and an associated (content) component
	// to the tab panel.
	Add(tab, content Comp)

	// Add adds a new tab (string) and an associated (content) component
	// to the tab panel.
	// This is a shorthand for
	// 		Add(NewLabel(tab), content)
	AddString(tab string, content Comp)

	// Selected returns the selected tab idx.
	// Returns -1 if no tab is selected.
	Selected() int

	// PrevSelected returns the previous selected tab idx.
	// Returns -1 if no tab was previously selected.
	PrevSelected() int

	// SetSelected sets the selected tab idx.
	// If idx < 0, no tabs will be selected.
	// If idx > CompsCount(), this is a no-op.
	SetSelected(idx int)
}

TabPanel interface defines a PanelView which has multiple child components but only one is visible at a time. The visible child can be visually selected using an internal TabBar component.

Both the tab panel and its internal tab bar component are PanelViews. This gives high layout configuration possibilities. Usually you only need to set the tab bar placement with the SetTabBarPlacement() method which also sets other reasonable internal layout defaults. But you have many other options to override the layout settings. If the content component is bigger than the tab bar, you can set the tab bar horizontal and the vertical alignment, e.g. with the TabBar().SetAlignment() method. To apply cell formatting to individual content components, you can simply use the CellFmt() method. If the tab bar is bigger than the content component, you can set the content alignment, e.g. with the SetAlignment() method. You can also set different alignments for individual tab components using TabBar().CellFmt(). You can also set other cell formatting applied to the tab bar using TabBarFmt() method.

You can register ETYPE_STATE_CHANGE event handlers which will be called when the user changes tab selection by clicking on a tab. The event source will be the tab panel. The event will have a parent event whose source will be the clicked tab and will contain the mouse coordinates.

Default style classes: "gwu-TabPanel", "gwu-TabPanel-Content"

func NewTabPanel

func NewTabPanel() TabPanel

NewTabPanel creates a new TabPanel. Default tab bar placement is TB_PLACEMENT_TOP, default horizontal alignment is HA_DEFAULT, default vertical alignment is VA_DEFAULT.

type Table

type Table interface {
	// Table is a TableView.
	TableView

	// EnsureSize ensures that the table will have at least the specified
	// rows, and at least the specified columns in rows whose index is < rows.
	EnsureSize(rows, cols int)

	// EnsureCols ensures that the table will have at least the specified
	// cols at the specified row.
	// This implicitly includes that the table must have at least (row+1) rows.
	// If the table have less than (row+1) rows, empty rows will be added first.
	EnsureCols(row, cols int)

	// CompsCount returns the number of components added to the table.
	CompsCount() int

	// CompAt returns the component at the specified row and column.
	// Returns nil if row or column are invalid.
	CompAt(row, col int) Comp

	// CompIdx returns the row and column of the specified component in the table.
	// (-1, -1) is returned if the component is not added to the table.
	CompIdx(c Comp) (row, col int)

	// RowFmt returns the row formatter of the specified table row.
	// If the table does not have a row specified by row, nil is returned.
	RowFmt(row int) CellFmt

	// CellFmt returns the cell formatter of the specified table cell.
	// If the table does not have a cell specified by row and col,
	// nil is returned.
	CellFmt(row, col int) CellFmt

	// Add adds a component to the table.
	// Return value indicates if the component was added successfully.
	// Returns false if row or col is negative.
	Add(c Comp, row, col int) bool

	// RowSpan returns the row span of the specified table cell.
	// -1 is returned if the table does not have a cell specified by row and col.
	RowSpan(row, col int) int

	// SetRowSpan sets the row span of the specified table cell.
	// If the table does not have a cell specified by row and col,
	// this is a no-op.
	SetRowSpan(row, col, rowSpan int)

	// ColSpan returns the col span of the specified table cell.
	// -1 is returned if the table does not have a cell specified by row and col.
	ColSpan(row, col int) int

	// SetColSpan sets the col span of the specified table cell.
	// If the table does not have a cell specified by row and col,
	// this is a no-op.
	SetColSpan(row, col, colSpan int)
}

Table interface defines a container which lays out its children using a configurable, flexible table. The size of the table grows dynamically, on demand. However, if table size is known or can be guessed before/during building it, it is recommended to call EnsureSize to minimize reallocations in the background.

Default style class: "gwu-Table"

func NewTable

func NewTable() Table

NewTable creates a new Table. Default horizontal alignment is HA_DEFAULT, default vertical alignment is VA_DEFAULT.

type TableView

type TableView interface {
	// TableView is a Container.
	Container

	// Border returns the border width of the table.
	Border() int

	// SetBorder sets the border width of the table.
	SetBorder(width int)

	// TableView has horizontal and vertical alignment.
	// This is the default horizontal and vertical alignment for
	// all children inside their enclosing cells.
	HasHVAlign

	// CellSpacing returns the cell spacing.
	CellSpacing() int

	// SetCellSpacing sets the cell spacing.
	// Has no effect if layout is LAYOUT_NATURAL.
	SetCellSpacing(spacing int)

	// CellPadding returns the cell spacing.
	CellPadding() int

	// SetCellPadding sets the cell padding.
	// Has no effect if layout is LAYOUT_NATURAL.
	SetCellPadding(padding int)
}

TableView interface defines a component which is rendered into a table.

type TextBox

type TextBox interface {
	// TextBox is a component.
	Comp

	// TextBox has text.
	HasText

	// TextBox can be enabled/disabled.
	HasEnabled

	// ReadOnly returns if the text box is read-only.
	ReadOnly() bool

	// SetReadOnly sets if the text box is read-only.
	SetReadOnly(readOnly bool)

	// Rows returns the number of displayed rows.
	Rows() int

	// SetRows sets the number of displayed rows.
	// rows=1 will make this a simple, one-line input text box,
	// rows>1 will make this a text area.
	SetRows(rows int)

	// Cols returns the number of displayed columns.
	Cols() int

	// SetCols sets the number of displayed columns.
	SetCols(cols int)

	// MaxLength returns the maximum number of characters
	// allowed in the text box.
	// -1 is returned if there is no maximum length set.
	MaxLength() int

	// SetMaxLength sets the maximum number of characters
	// allowed in the text box.
	// Pass -1 to not limit the maximum length.
	SetMaxLength(maxLength int)
}

TextBox interface defines a component for text input purpose.

Suggested event type to handle actions: ETYPE_CHANGE

By default the value of the TextBox is synchronized with the server on ETYPE_CHANGE event which is when the TextBox loses focus or when the ENTER key is pressed. If you want a TextBox to synchronize values during editing (while you type in characters), add the ETYPE_KEY_UP event type to the events on which synchronization happens by calling:

AddSyncOnETypes(ETYPE_KEY_UP)

Default style class: "gwu-TextBox"

Example

Example code determining what kind of key is involved.

package main

import (
	"github.com/sinni800/gowut/gwu"
)

func main() {
	b := gwu.NewTextBox("")
	b.AddSyncOnETypes(gwu.ETYPE_KEY_UP) // This is here so we will see up-to-date value in the event handler
	b.AddEHandlerFunc(func(e gwu.Event) {
		if e.ModKey(gwu.MOD_KEY_SHIFT) {
			// SHIFT is pressed
		}

		c := e.KeyCode()
		switch {
		case c == gwu.KEY_ENTER: // Enter
		case c >= gwu.KEY_0 && c <= gwu.KEY_9:
			fallthrough
		case c >= gwu.KEY_NUMPAD_0 && c <= gwu.KEY_NUMPAD_9: // Number
		case c >= gwu.KEY_A && c <= gwu.KEY_Z: // Letter
		case c >= gwu.KEY_F1 && c <= gwu.KEY_F12: // Function key
		}
	}, gwu.ETYPE_KEY_UP)
}
Output:

func NewPasswBox

func NewPasswBox(text string) TextBox

NewPasswBox creates a new PasswBox.

func NewTextBox

func NewTextBox(text string) TextBox

NewTextBox creates a new TextBox.

type Timer

type Timer interface {
	// Timer is a component.
	Comp

	// Timeout returns the timeout of the timer.
	Timeout() time.Duration

	// SetTimeout sets the timeout of the timer.
	// Event will be generated after the timeout period. If timer is on repeat,
	// events will be generated periodically after each timeout.
	//
	// Note: while this method allows you to pass an arbitrary time.Duration,
	// implementation might be using less precision (most likely millisecond).
	// Durations less than 1 ms might be rounded up to 1 ms.
	SetTimeout(timeout time.Duration)

	// Repeat tells if the timer is on repeat.
	Repeat() bool

	// SetRepeat sets if the timer is on repeat.
	// If timer is on repeat, events will be generated periodically after
	// each timeout.
	SetRepeat(repeat bool)

	// Active tells if the timer is active.
	Active() bool

	// SetActive sets if the timer is active.
	// If the timer is not active, events will not be generated.
	// If a timer is deactivated and activated again, its countdown is reset.
	SetActive(active bool)

	// Reset will cause the timer to restart/reschedule.
	// A Timer does not resets the countdown when it is re-rendered,
	// only if the timer config is changed (e.g. timeout or repeat).
	// By calling Reset() the countdown will reset when the timer is
	// re-rendered.
	Reset()
}

Timer interface defines a component which can generate a timed event or a series of timed events periodically.

Timers don't have a visual part, they are used only to generate events. The generated events are of type ETYPE_STATE_CHANGE.

Note that receiving an event from a Timer (like from any other components) updates the last accessed property of the associated session, causing a session never to expire if there are active timers on repeat at the client side.

Also note that the Timer component operates at the client side meaning if the client is closed (or navigates away), events will not be generated. (This can also be used to detect if a Window is still open.)

func NewTimer

func NewTimer(timeout time.Duration) Timer

NewTimer creates a new Timer. By default the timer is active and does not repeat.

type VAlign

type VAlign string

Vertical alignment type.

const (
	VA_TOP    VAlign = "top"    // Vertical top alignment
	VA_MIDDLE VAlign = "middle" // Vertical center alignment
	VA_BOTTOM VAlign = "bottom" // Vertical bottom alignment

	VA_DEFAULT VAlign = "" // Browser default (or inherited) vertical alignment
)

Vertical alignment constants.

type WinSlice

type WinSlice []Window

WinSlice is a slice of windows which implements sort.Interface so it can be sorted by window text (title).

func (WinSlice) Len

func (w WinSlice) Len() int

func (WinSlice) Less

func (w WinSlice) Less(i, j int) bool

func (WinSlice) Swap

func (w WinSlice) Swap(i, j int)

type Window

type Window interface {
	// Window is a Panel, child components can be added to it.
	Panel

	// A window has text which will be used as the title
	// of the browser window.
	HasText

	// Name returns the name of the window.
	// The name appears in the URL.
	Name() string

	// SetName sets the name of the window.
	SetName(name string)

	// AddHeadHtml adds an HTML text which will be included
	// in the HTML head section.
	AddHeadHtml(html string)

	// SetFocusedCompId sets the id of the currently focused component.
	SetFocusedCompId(id ID)

	// Theme returns the CSS theme of the window.
	// If an empty string is returned, the server's theme will be used.
	Theme() string

	// SetTheme sets the default CSS theme of the window.
	// If an empty string is set, the server's theme will be used.
	SetTheme(theme string)

	// AddCSSrule adds a root css rule
	AddCSSRule(r CSSRule)

	// RenderWin renders the window as a complete HTML document.
	RenderWin(w writer, s Server)
}

The Window interface is the top of the component hierarchy. A Window defines the content seen in the browser window. Multiple windows can be created, but only one is visible at a time in the browser. The Window interface is the equivalent of the browser page.

Default style class: "gwu-Window"

func NewWindow

func NewWindow(name, text string) Window

NewWindow creates a new window. The default layout strategy is LAYOUT_VERTICAL.

Jump to

Keyboard shortcuts

? : This menu
/ : Search site
f or F : Jump to
y or Y : Canonical URL