From ee2af1a5e7fff53d7be8862bf3c839f73f640621 Mon Sep 17 00:00:00 2001 From: sawka Date: Wed, 6 Nov 2024 22:55:13 -0800 Subject: [PATCH] fix apps for new boilerplate --- go.mod | 7 +- go.sum | 8 -- particle/particle-main.go | 2 - pomodoro/pomodoro-main.go | 2 - sample/sample-main.go | 163 ++++++++++++++++++++++++++++++++++++++ sample/style.css | 42 ++++++++++ 6 files changed, 206 insertions(+), 18 deletions(-) create mode 100644 sample/sample-main.go create mode 100644 sample/style.css diff --git a/go.mod b/go.mod index eedef95..1aa46f9 100644 --- a/go.mod +++ b/go.mod @@ -2,10 +2,7 @@ module vdomtest go 1.22.4 -require ( - github.com/spf13/cobra v1.8.1 - github.com/wavetermdev/waveterm v0.9.1 -) +require github.com/wavetermdev/waveterm v0.9.1 require ( github.com/alexflint/go-filemutex v1.3.0 // indirect @@ -13,9 +10,7 @@ require ( github.com/golang-jwt/jwt/v5 v5.2.1 // indirect github.com/google/uuid v1.6.0 // indirect github.com/gorilla/mux v1.8.1 // indirect - github.com/inconshreveable/mousetrap v1.1.0 // indirect github.com/mitchellh/mapstructure v1.5.0 // indirect - github.com/spf13/pflag v1.0.5 // indirect github.com/stretchr/testify v1.9.0 // indirect github.com/wavetermdev/htmltoken v0.2.0 // indirect golang.org/x/net v0.29.0 // indirect diff --git a/go.sum b/go.sum index f845175..0b3a622 100644 --- a/go.sum +++ b/go.sum @@ -1,6 +1,5 @@ github.com/alexflint/go-filemutex v1.3.0 h1:LgE+nTUWnQCyRKbpoceKZsPQbs84LivvgwUymZXdOcM= github.com/alexflint/go-filemutex v1.3.0/go.mod h1:U0+VA/i30mGBlLCrFPGtTe9y6wGQfNAWPBTekHQ+c8A= -github.com/cpuguy83/go-md2man/v2 v2.0.4/go.mod h1:tgQtvFlXSQOSOSIRvRPT7W67SCa46tRHOmNcaadrF8o= 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= @@ -12,17 +11,10 @@ github.com/google/uuid v1.6.0 h1:NIvaJDMOsjHA8n1jAhLSgzrAzy1Hgr+hNrb57e+94F0= github.com/google/uuid v1.6.0/go.mod h1:TIyPZe4MgqvfeYDBFedMoGGpEw/LqOeaOT+nhxU+yHo= github.com/gorilla/mux v1.8.1 h1:TuBL49tXwgrFYWhqrNgrUNEY92u81SPhu7sTdzQEiWY= github.com/gorilla/mux v1.8.1/go.mod h1:AKf9I4AEqPTmMytcMc0KkNouC66V3BtZ4qD5fmWSiMQ= -github.com/inconshreveable/mousetrap v1.1.0 h1:wN+x4NVGpMsO7ErUn/mUI3vEoE6Jt13X2s0bqwp9tc8= -github.com/inconshreveable/mousetrap v1.1.0/go.mod h1:vpF70FUmC8bwa3OWnCshd2FqLfsEA9PFc4w1p2J65bw= github.com/mitchellh/mapstructure v1.5.0 h1:jeMsZIYE/09sWLaz43PL7Gy6RuMjD2eJVyuac5Z2hdY= github.com/mitchellh/mapstructure v1.5.0/go.mod h1:bFUtVrKA4DC2yAKiSyO/QUcy7e+RRV2QTWOzhPopBRo= github.com/pmezard/go-difflib v1.0.0 h1:4DBwDE0NGyQoBHbLQYPwSUPoCMWR5BEzIk/f1lZbAQM= github.com/pmezard/go-difflib v1.0.0/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4= -github.com/russross/blackfriday/v2 v2.1.0/go.mod h1:+Rmxgy9KzJVeS9/2gXHxylqXiyQDYRxCVz55jmeOWTM= -github.com/spf13/cobra v1.8.1 h1:e5/vxKd/rZsfSJMUX1agtjeTDf+qv1/JdBF8gg5k9ZM= -github.com/spf13/cobra v1.8.1/go.mod h1:wHxEcudfqmLYa8iTfL+OuZPbBZkmvliBWKIezN3kD9Y= -github.com/spf13/pflag v1.0.5 h1:iy+VFUOCP1a+8yFto/drg2CJ5u0yRoB7fZw3DKv/JXA= -github.com/spf13/pflag v1.0.5/go.mod h1:McXfInJRrz4CZXVZOBLb0bTZqETkiAhM9Iw0y3An2Bg= github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME= github.com/stretchr/testify v1.4.0/go.mod h1:j7eGeouHqKxXV5pUuKE4zz7dFj8WfuZ+81PSLYec5m4= github.com/stretchr/testify v1.9.0 h1:HtqpIVDClZ4nwg75+f6Lvsy/wHu+3BoSGCbBAcpTsTg= diff --git a/particle/particle-main.go b/particle/particle-main.go index 73ba4c6..22d7301 100644 --- a/particle/particle-main.go +++ b/particle/particle-main.go @@ -13,8 +13,6 @@ import ( ) var ParticleVDomClient *vdomclient.Client = vdomclient.MakeClient(vdomclient.ApplicationOpts{ - Name: "particle", - Description: "particle canvas application", CloseOnCtrlC: true, }) diff --git a/pomodoro/pomodoro-main.go b/pomodoro/pomodoro-main.go index 5f2a697..7bd1fcc 100644 --- a/pomodoro/pomodoro-main.go +++ b/pomodoro/pomodoro-main.go @@ -14,8 +14,6 @@ import ( var styleCSS []byte var PomodoroVDomClient *vdomclient.Client = vdomclient.MakeClient(vdomclient.ApplicationOpts{ - Name: "pomodoro", - Description: "pomodoro timer application", CloseOnCtrlC: true, GlobalStyles: styleCSS, }) diff --git a/sample/sample-main.go b/sample/sample-main.go new file mode 100644 index 0000000..803df21 --- /dev/null +++ b/sample/sample-main.go @@ -0,0 +1,163 @@ +// Copyright 2024, Command Line Inc. +// SPDX-License-Identifier: Apache-2.0 + +package main + +import ( + "context" + _ "embed" + "log" + + "github.com/wavetermdev/waveterm/pkg/vdom" + "github.com/wavetermdev/waveterm/pkg/vdom/vdomclient" + "github.com/wavetermdev/waveterm/pkg/waveobj" + "github.com/wavetermdev/waveterm/pkg/wshrpc" + "github.com/wavetermdev/waveterm/pkg/wshrpc/wshclient" +) + +//go:embed style.css +var styleCSS []byte + +var HtmlVDomClient *vdomclient.Client = vdomclient.MakeClient(vdomclient.ApplicationOpts{ + CloseOnCtrlC: true, + GlobalStyles: styleCSS, +}) + +func init() { + HtmlVDomClient.AddSetupFn(func() { + + }) +} + +// Prop Types +type BgItemProps struct { + Bg string `json:"bg"` + Label string `json:"label"` + OnClick func() `json:"onClick"` +} + +type BgListProps struct { + Items []BgItem `json:"items"` +} + +type BgItem struct { + Bg string `json:"bg"` + Label string `json:"label"` +} + +// Components +var Style = vdomclient.DefineComponent[struct{}](HtmlVDomClient, "Style", + func(ctx context.Context, _ struct{}) any { + return vdom.E("wave:style", + vdom.P("src", "vdom:///style.css"), + ) + }, +) + +var BgItemTag = vdomclient.DefineComponent[BgItemProps](HtmlVDomClient, "BgItem", + func(ctx context.Context, props BgItemProps) any { + return vdom.E("div", + vdom.Class("bg-item"), + vdom.E("div", + vdom.Class("bg-preview"), + vdom.PStyle("background", props.Bg), + ), + vdom.E("div", + vdom.Class("bg-label"), + props.Label, + ), + vdom.P("onClick", props.OnClick), + ) + }, +) + +var BgList = vdomclient.DefineComponent[BgListProps](HtmlVDomClient, "BgList", + func(ctx context.Context, props BgListProps) any { + setBackground := func(bg string) func() { + return func() { + blockInfo, err := wshclient.BlockInfoCommand(HtmlVDomClient.RpcClient, HtmlVDomClient.RpcContext.BlockId, nil) + if err != nil { + log.Printf("error getting block info: %v\n", err) + return + } + err = wshclient.SetMetaCommand(HtmlVDomClient.RpcClient, wshrpc.CommandSetMetaData{ + ORef: waveobj.ORef{OType: "tab", OID: blockInfo.TabId}, + Meta: map[string]any{"bg": bg}, + }, nil) + if err != nil { + log.Printf("error setting meta: %v\n", err) + } + } + } + + return vdom.E("div", + vdom.Class("background"), + vdom.E("div", + vdom.Class("background-inner"), + vdom.ForEach(props.Items, func(item BgItem) any { + return BgItemTag(BgItemProps{ + Bg: item.Bg, + Label: item.Label, + OnClick: setBackground(item.Bg), + }) + }), + ), + ) + }, +) + +var App = vdomclient.DefineComponent[struct{}](HtmlVDomClient, "App", + func(ctx context.Context, _ struct{}) any { + inputText, setInputText := vdom.UseState(ctx, "start") + + bgItems := []BgItem{ + {Bg: "", Label: "default"}, + {Bg: "#ff0000", Label: "red"}, + {Bg: "#00ff00", Label: "green"}, + {Bg: "#0000ff", Label: "blue"}, + } + + return vdom.E("div", + vdom.Class("root"), + Style(struct{}{}), + vdom.E("h1", nil, "Set Background"), + vdom.E("div", nil, + vdom.E("wave:markdown", + vdom.P("text", "*quick vdom application to set background colors*"), + vdom.P("scrollable", false), + vdom.P("rehype", false), + ), + ), + vdom.E("div", nil, + BgList(BgListProps{Items: bgItems}), + ), + vdom.E("div", nil, + vdom.E("img", + vdom.PStyle("width", "100%"), + vdom.PStyle("height", "100%"), + vdom.PStyle("maxWidth", "300px"), + vdom.PStyle("maxHeight", "300px"), + vdom.PStyle("objectFit", "contain"), + vdom.P("src", "vdom:///test.png"), + ), + ), + vdom.E("div", nil, + vdom.E("input", + vdom.P("type", "text"), + vdom.P("value", inputText), + vdom.P("onChange", func(e vdom.VDomEvent) { + setInputText(e.TargetValue) + }), + ), + vdom.E("div", nil, "text ", inputText), + ), + ) + }, +) + +func main() { + HtmlVDomClient.RegisterFileHandler("/test.png", vdomclient.FileHandlerOption{ + FilePath: "~/Downloads/IMG_1939.png", + }) + HtmlVDomClient.RunMain() +} diff --git a/sample/style.css b/sample/style.css new file mode 100644 index 0000000..bc9fb33 --- /dev/null +++ b/sample/style.css @@ -0,0 +1,42 @@ +.root { + padding: 10px; +} + +.background { + display: flex; + align-items: center; + width: 100%; +} + +.background-inner { + max-width: 300px; +} + +.bg-item { + cursor: pointer; + padding: 8px 12px; + border-radius: 4px; + display: flex; + flex-direction: row; + align-items: flex-start; + justify-content: flex-start; +} + +.bg-item:hover { + background-color: var(--button-grey-hover-bg); +} + +.bg-preview { + width: 20px; + height: 20px; + margin-right: 10px; + border-radius: 50%; + border: 1px solid #777; +} + +.bg-label { + display: block; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +}