gromer

git clone https://pyrossh.dev/repos/gromer.git

gromer is a framework and cli to build multipage web apps in golang using htmx and alpinejs.

a5c4f8b2 — Peter John

add hooks

Files changed (7) hide show

.snapshots/{TestHtmlPage.html → TestHtml.html} +6 -6
go.mod +1 -0
go.sum +2 -0
hooks.go +31 -0
hooks_test.go +31 -0
html.go +12 -8
html_test.go +69 -70

.snapshots/{TestHtmlPage.html → TestHtml.html} RENAMED Viewed

@@ -3,7 +3,7 @@
   <head>
     <meta charset="UTF-8">
     <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
-    <meta http-equiv="encoding" content="utf-8">
+    <meta content="utf-8" http-equiv="encoding">
     <title>            123    </title>
     <meta name="description" content="123">
@@ -11,11 +11,11 @@
     <meta name="keywords" content="123">
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, viewport-fit=cover">
     <link rel="icon" href="/assets/icon.png">
-    <link rel="apple-touch-icon" href="/assets/icon.png">
+    <link href="/assets/icon.png" rel="apple-touch-icon">
     <link rel="stylesheet" href="/assets/styles.css">
     <script src="/assets/alpine.js" defer></script>
-    <meta name="title" content="title">
+    <meta content="title" name="title">
     <style>
 			*, ::before, ::after { box-sizing: border-box; }
 			html { -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; line-height: 1.15; -webkit-text-size-adjust: 100%; }
@@ -89,11 +89,11 @@
       </div>
       <div class="flex flex-row justify-center items-center">
-        <button @click="Decrement">                    -        </button>
+        <button @click="decrement">                    -        </button>
-        <div x-text="state.count" class="flex flex-row justify-center items-center m-20 text-5xl">                    4        </div>
+        <div class="flex flex-row justify-center items-center m-20 text-5xl" x-text="count">                    4        </div>
-        <button @click="Increment">                    +        </button>
+        <button @click="increment">                    +        </button>
       </div>
     </div>

go.mod CHANGED Viewed

@@ -7,6 +7,7 @@ require (
 	github.com/apex/gateway/v2 v2.0.0
 	github.com/aymerick/raymond v2.0.2+incompatible // indirect
 	github.com/bradleyjkemp/cupaloy v2.3.0+incompatible // indirect
+	github.com/franela/goblin v0.0.0-20211003143422-0a4f594942bf // indirect
 	github.com/gobuffalo/velvet v0.0.0-20170320144106-d97471bf5d8f // indirect
 	github.com/gorilla/mux v1.8.0
 	github.com/kr/pretty v0.1.0 // indirect

go.sum CHANGED Viewed

@@ -18,6 +18,8 @@ github.com/cpuguy83/go-md2man/v2 v2.0.0-20190314233015-f79a8a8ca69d/go.mod h1:ma
 github.com/davecgh/go-spew v1.1.0/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
 github.com/davecgh/go-spew v1.1.1 h1:vj9j/u1bqnvCEfJOwUhtlOARqs3+rkHYY13jYWTU97c=
 github.com/davecgh/go-spew v1.1.1/go.mod h1:J7Y8YcW2NihsgmVo/mv3lAwl/skON4iLHjSsI+c5H38=
+github.com/franela/goblin v0.0.0-20211003143422-0a4f594942bf h1:NrF81UtW8gG2LBGkXFQFqlfNnvMt9WdB46sfdJY4oqc=
+github.com/franela/goblin v0.0.0-20211003143422-0a4f594942bf/go.mod h1:VzmDKDJVZI3aJmnRI9VjAn9nJ8qPPsN1fqzr9dqInIo=
 github.com/gobuffalo/envy v1.6.5 h1:X3is06x7v0nW2xiy2yFbbIjwHz57CD6z6MkvqULTCm8=
 github.com/gobuffalo/envy v1.6.5/go.mod h1:N+GkhhZ/93bGZc6ZKhJLP6+m+tCNPKwgSpH9kaifseQ=
 github.com/gobuffalo/velvet v0.0.0-20170320144106-d97471bf5d8f h1:ddIdPdlkAgKMB0mbkft2LT3oxN1h3MN1fopCFrOgkhY=

hooks.go ADDED Viewed

@@ -0,0 +1,31 @@
+package wapp
+type Context struct {
+	index int
+	datas []interface{}
+}
+// Go 1.18 stuff
+// func UseState[T any](ctx *Context , s T) (func() T, func(v T)) {
+// 	if len(ctx.datas) <= ctx.index + 1 {
+// 			ctx .datas = append(ctx.datas, s)
+// 	}
+// 	return func() T {
+// 	  return ctx.datas[ctx.index].(T)
+// 	}, func(v T) {
+// 	  ctx.datas[ctx.index] = v
+// 	}
+// }
+func UseState(c *Context, s interface{}) (func() interface{}, func(v interface{})) {
+	localIndex := c.index
+	if len(c.datas) <= c.index+1 {
+		c.datas = append(c.datas, s)
+		c.index += 1
+	}
+	return func() interface{} {
+			return c.datas[localIndex].(interface{})
+		}, func(v interface{}) {
+			c.datas[localIndex] = v
+		}
+}

hooks_test.go ADDED Viewed

@@ -0,0 +1,31 @@
+package wapp
+import (
+	"testing"
+	. "github.com/franela/goblin"
+)
+func TestHooks(t *testing.T) {
+	g := Goblin(t)
+	g.Describe("useState", func() {
+		ctx := &Context{index: 0, datas: []interface{}{}}
+		getValue, setValue := UseState(ctx, 12)
+		g.It("should be initialized ", func() {
+			g.Assert(1).Equal(ctx.index)
+			g.Assert(1).Equal(len(ctx.datas))
+			g.Assert(ctx.datas[0]).Equal(12)
+		})
+		g.It("should get value ", func() {
+			g.Assert(getValue()).Equal(12)
+		})
+		g.It("should set value", func() {
+			setValue(15)
+			g.Assert(ctx.datas[0]).Equal(15)
+			g.Assert(getValue()).Equal(15)
+		})
+	})
+}

html.go CHANGED Viewed

@@ -24,6 +24,16 @@ func mergeAttributes(parent *Element, uis ...interface{}) *Element {
 		switch c := v.(type) {
 		case Attribute:
 			parent.setAttr(c.Key, c.Value)
+		case M:
+			for k, v := range c {
+				if a, ok := v.(string); ok {
+					parent.setAttr(k, a)
+				} else {
+					// store some server state on the component ctx
+					// parent.setAttr(k, a)
+				}
+			}
 		case *Element:
 			elems = append(elems, c)
 		case nil:
@@ -339,14 +349,8 @@ func Attr(k, v string) Attribute {
 	return Attribute{k, v}
 }
-func GetFunctionName(i interface{}) string {
-	fnName := runtime.FuncForPC(reflect.ValueOf(i).Pointer()).Name()
-	parts := strings.Split(fnName, ".")
-	return strings.Replace(parts[len(parts)-1], "-fm", "", 1)
-}
-func OnClick(v interface{}) Attribute {
+func OnClick(v string) Attribute {
-	return Attribute{"@click", GetFunctionName(v)}
+	return Attribute{"@click", v}
 }
 func ID(v string) Attribute {

html_test.go CHANGED Viewed

@@ -6,6 +6,7 @@ import (
 	"testing"
 	"github.com/bradleyjkemp/cupaloy"
+	. "github.com/franela/goblin"
 )
 func Row(uis ...interface{}) *Element {
@@ -16,24 +17,14 @@ func Col(uis ...interface{}) *Element {
 	return NewElement("div", false, append([]interface{}{Css("flex flex-col justify-center items-center")}, uis...)...)
 }
+func Counter(c *Context, start int) *Element {
-type CounterState struct {
+	count, setCount := UseState(c, start)
+	increment := func() {
-	Count int
+		setCount(count().(int) + 1)
-}
+	}
-func Counter(start int) *Element {
+	decrement := func() {
-	c := CounterState{Count: start}
+		setCount(count().(int) + 1)
-	return c.Render()
-}
+	}
-func (c *CounterState) Increment() {
-	c.Count += 1
-}
-func (c *CounterState) Decrement() {
-	c.Count -= 1
-}
-func (c *CounterState) Render() *Element {
 	return Col(Css("text-3xl text-gray-700"),
 		Row(
 			Row(Css("underline"),
@@ -41,61 +32,69 @@ func (c *CounterState) Render() *Element {
 			),
 		),
 		Row(
-			Button(OnClick(c.Decrement), Text("-")),
+			Button(OnClick("decrement"), Text("-")),
-			Row(Css("m-20 text-5xl"), XText("state.count"),
+			Row(Css("m-20 text-5xl"), XText("count"),
-				Text(strconv.Itoa(c.Count)),
+				Text(strconv.Itoa(count().(int))),
 			),
-			Button(OnClick(c.Increment), Text("+")),
+			Button(OnClick("increment"), Text("+")),
 		),
+		M{
+			"count":     count,
+			"increment": increment,
+			"decrement": decrement,
+		},
 	)
+	// return `
+	// 	<div class="flex flex-col justify-center items-center text-3xl text-gray-700">
+	// 		<div class="flex flex-row justify-center items-center">
+	// 			<div class="flex flex-row justify-center items-center underline">
+	// 				Counter
+	// 			</div>
+	// 		</div>
+	// 		<div class="flex flex-row justify-center items-center">
+	// 			<button class="btn m-20" @click="Increment">
+	// 				-
+	// 			</button>
+	// 			<div class="flex flex-row justify-center items-center m-20 text-8xl">
+	// 				{{ count }}
+	// 			</div>
+	// 			<button class="btn m-20" @click="Decrement">
+	// 				+
+	// 			</button>
+	// 		</div>
+	// 	</div>
+	// `
 }
-// func CounterHtml() string {
-// 	return `
-// 		<div class="flex flex-col justify-center items-center text-3xl text-gray-700">
-// 			<div class="flex flex-row justify-center items-center">
-// 				<div class="flex flex-row justify-center items-center underline">
-// 					Counter
-// 				</div>
-// 			</div>
-// 			<div class="flex flex-row justify-center items-center">
-// 				<button class="btn m-20" @click={{actions.Increment}}>
-// 					-
-// 				</button>
-// 				<div class="flex flex-row justify-center items-center m-20 text-8xl">
-// 					{{ state.count }}
-// 				</div>
-// 				<button class="btn m-20" @click={{actions.Decrement}}>
-// 					+
-// 				</button>
-// 			</div>
-// 		</div>
-// 	`
-// }
-func TestHtmlPage(t *testing.T) {
+func TestHtml(t *testing.T) {
+	g := Goblin(t)
+	g.Describe("Html", func() {
+		g.It("should match snapshot", func() {
+			ctx := &Context{index: 0, datas: []interface{}{}}
-	b := bytes.NewBuffer(nil)
+			b := bytes.NewBuffer(nil)
-	p := Html(
+			p := Html(
-		Head(
+				Head(
-			Title("123"),
+					Title("123"),
-			Meta("description", "123"),
+					Meta("description", "123"),
-			Meta("author", "123"),
+					Meta("author", "123"),
-			Meta("keywords", "123"),
+					Meta("keywords", "123"),
-			Meta("viewport", "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, viewport-fit=cover"),
+					Meta("viewport", "width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0, viewport-fit=cover"),
-			Link("icon", "/assets/icon.png"),
+					Link("icon", "/assets/icon.png"),
-			Link("apple-touch-icon", "/assets/icon.png"),
+					Link("apple-touch-icon", "/assets/icon.png"),
-			Link("stylesheet", "/assets/styles.css"),
+					Link("stylesheet", "/assets/styles.css"),
-			Script(Src("/assets/alpine.js"), Defer()),
+					Script(Src("/assets/alpine.js"), Defer()),
-			Meta("title", "title"),
+					Meta("title", "title"),
-		),
+				),
-		Body(
+				Body(
-			H1(Text("Hello this is a h1")),
+					H1(Text("Hello this is a h1")),
-			H2(Text("Hello this is a h2")),
+					H2(Text("Hello this is a h2")),
-			H3(XData("{ message: 'I ❤️ Alpine' }"), XText("message"), Text("")),
+					H3(XData("{ message: 'I ❤️ Alpine' }"), XText("message"), Text("")),
-			Counter(4),
+					Counter(ctx, 4),
-		),
+				),
-	)
+			)
-	p.WriteHtml(b)
+			p.WriteHtml(b)
-	c := cupaloy.New(cupaloy.SnapshotFileExtension(".html"))
+			c := cupaloy.New(cupaloy.SnapshotFileExtension(".html"))
-	c.SnapshotT(t, b.String())
+			c.SnapshotT(t, b.String())
+		})
+	})
 }

~repos /gromer

git clone https://pyrossh.dev/repos/gromer.git

gromer is a framework and cli to build multipage web apps in golang using htmx and alpinejs.