feat: new javascript generation #9

.gitignore

@@ -313,3 +313,6 @@ Taskfile.yaml
 
 /environment/do-secrets.json
 documentation/manual/de/book/
+/examples/example5/scripts/main.mjs
+/examples/example5/scripts/page.mjs
+/examples/example5/styles/main.css

README.md

@@ -259,7 +259,47 @@ the task `task update-code` must be called.
 The hash is currently always null, as a vendor directory is used 
 in the project. This is created with `go mod vendor`.
 
+#### JavaScript
 
+##### generate
+
+Bob can use **ESBuild** to transform JavaScript code directly from an HTML file. 
+For this, the relevant `<script>` tags must include specific attributes. 
+
+ESBuild is licensed under the (https://github.com/evanw/esbuild?tab=MIT-1-ov-file#readme)[MIT license].
+
+Here’s an example:
+
+```html
+<script 
+    data-bob-source="source/main.mjs" 
+    data-bob-script-dist="scripts/main.mjs" 
+    data-bob-style-dist="styles/main.css" 
+    src="/scripts/main.mjs" 
+    type="module">
+</script>
+```
+
+**Attribute Explanation:**
+
+- **`data-bob-source`**  
+  Specifies the file to be used as the source for the build process (e.g., `source/page.mjs`).
+
+- **`data-bob-target`** *(optional)*  
+  Defines the target JavaScript format. The default is `esnext`. A common alternative is `es6`.
+
+- **`data-bob-script-dist`**  
+  Specifies the path to the output JavaScript file relative to the template, e.g., `scripts/page.mjs`.
+
+- **`data-bob-style-dist`**  
+  Defines the path to the output styles file, e.g., `styles/page.css`.
+
+- **`src`**  
+  Indicates the URL where the script is served in the browser. This value is **not** used by ESBuild for the build process.
+
+### Notes:
+- These attributes help separate development and delivery paths clearly.
+- `src` is used solely for delivery and has no impact on the ESBuild process.
 
 
 ## Questions

examples/example5/package-lock.json

+{
+  "name": "example5",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "example5",
+      "version": "1.0.0",
+      "license": "ISC",
+      "dependencies": {
+        "@schukai/monster": "^3.88.0"
+      }
+    },
+    "node_modules/@floating-ui/core": {
+      "version": "1.6.8",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.8.tgz",
+      "integrity": "sha512-7XJ9cPU+yI2QeLS+FCSlqNFZJq8arvswefkZrYI1yQBbftw6FyrZOxYSh+9S7z7TpeWlRt9zJ5IhM1WIL334jA==",
+      "license": "MIT",
+      "dependencies": {
+        "@floating-ui/utils": "^0.2.8"
+      }
+    },
+    "node_modules/@floating-ui/dom": {
+      "version": "1.6.12",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.12.tgz",
+      "integrity": "sha512-NP83c0HjokcGVEMeoStg317VD9W7eDlGK7457dMBANbKA6GJZdc7rjujdgqzTaz93jkGgc5P/jeWbaCHnMNc+w==",
+      "license": "MIT",
+      "dependencies": {
+        "@floating-ui/core": "^1.6.0",
+        "@floating-ui/utils": "^0.2.8"
+      }
+    },
+    "node_modules/@floating-ui/utils": {
+      "version": "0.2.8",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.8.tgz",
+      "integrity": "sha512-kym7SodPp8/wloecOpcmSnWJsK7M0E5Wg8UcFA+uO4B9s5d0ywXOEro/8HM9x0rW+TljRzul/14UYz3TleT3ig==",
+      "license": "MIT"
+    },
+    "node_modules/@popperjs/core": {
+      "version": "2.11.8",
+      "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.8.tgz",
+      "integrity": "sha512-P1st0aksCrn9sGZhp8GMYwBnQsbvAWsZAX44oXNNvLHGqAOcoVxmjZiohstwQ7SqKnbR47akdNi+uleWD8+g6A==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/popperjs"
+      }
+    },
+    "node_modules/@schukai/monster": {
+      "version": "3.88.0",
+      "resolved": "https://registry.npmjs.org/@schukai/monster/-/monster-3.88.0.tgz",
+      "integrity": "sha512-hwV5hlpubSjxkOS3LZazS0+Up0Cp5OJ+oxpV+2iNGtXUwhiRuvtVmfNlsuN9MxXGu4pOoXzbFUk/jFmPuGOLmA==",
+      "license": "AGPL 3.0",
+      "dependencies": {
+        "@floating-ui/dom": "^1.6.12",
+        "@popperjs/core": "^2.11.8"
+      }
+    }
+  }
+}

examples/example5/package.json

+{
+  "name": "example5",
+  "version": "1.0.0",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "description": "",
+  "dependencies": {
+    "@schukai/monster": "^3.88.0"
+  }
+}

examples/example5/source/lib.mjs

+
+
+
+export const A=1;
\ No newline at end of file

examples/example5/source/main.css

+
+
+div {
+    color: red;
+}
\ No newline at end of file

examples/example5/source/main.mjs

+import  "@schukai/monster/source/components/form/button.mjs";
+import {A} from "./lib.mjs";
+import "./main.css";
+
+console.log(A);
+
+

examples/example5/source/page.mjs

+import {A} from "./lib.mjs";
+
+
+console.log(A);
+
+

examples/example5/test.html

+<!DOCTYPE html><html lang="en" data-attributes="lang path:lang"><head>
+
+    <meta charset="utf-8"/>
+
+    <link rel="apple-touch-icon" href="/apple-touch-icon.png"/>
+
+    <script data-bob-source="source/main.mjs" data-bob-script-dist="scripts/main.mjs" data-bob-style-dist="styles/main.css" src="/scripts/main.mjs" type="module"></script>
+    <script data-bob-source="source/page.mjs" data-bob-target=es6 data-bob-script-dist="scripts/page.mjs" data-bob-style-dist="styles/page.css" src="/scripts/page.mjs" type="module"></script>
+
+    <script type="application/json" data-monster-role="translations" data-bob-reference="the-translation" data-replace="path:translations.the-translation.content">
+      {
+        "key5": "translation4"
+      }
+    </script>
+  </head>
+
+  <body>
+    <header>
+      <div class="gradient"></div>
+    </header>
+
+
+  <monster-button>test</monster-button>
+  
+
+</body></html>
\ No newline at end of file

flake.lock

@@ -2,11 +2,11 @@
   "nodes": {
     "nixpkgs": {
       "locked": {
-        "lastModified": 1730883749,
-        "narHash": "sha256-mwrFF0vElHJP8X3pFCByJR365Q2463ATp2qGIrDUdlE=",
+        "lastModified": 1731797254,
+        "narHash": "sha256-df3dJApLPhd11AlueuoN0Q4fHo/hagP75LlM5K1sz9g=",
         "owner": "NixOS",
         "repo": "nixpkgs",
-        "rev": "dba414932936fde69f0606b4f1d87c5bc0003ede",
+        "rev": "e8c38b73aeb218e27163376a2d617e61a2ad9b59",
         "type": "github"
       },
       "original": {

source/.idea/.gitignore

+# Default ignored files
+/shelf/
+/workspace.xml
+# Editor-based HTTP Client requests
+/httpRequests/
+# Datasource local storage ignored files
+/dataSources/
+/dataSources.local.xml

source/.idea/codeStyles/codeStyleConfig.xml

+<component name="ProjectCodeStyleConfiguration">
+  <state>
+    <option name="PREFERRED_PROJECT_CODE_STYLE" value="Default" />
+  </state>
+</component>
\ No newline at end of file

source/.idea/misc.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectRootManager" version="2" languageLevel="JDK_21" default="true" project-jdk-name="21 (4)" project-jdk-type="JavaSDK">
+    <output url="file://$PROJECT_DIR$/out" />
+  </component>
+  <component name="accountSettings">
+    <option name="activeProfile" value="profile:default" />
+    <option name="activeRegion" value="eu-west-1" />
+    <option name="recentlyUsedProfiles">
+      <list>
+        <option value="profile:default" />
+      </list>
+    </option>
+    <option name="recentlyUsedRegions">
+      <list>
+        <option value="eu-west-1" />
+      </list>
+    </option>
+  </component>
+</project>
\ No newline at end of file

source/.idea/modules.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="ProjectModuleManager">
+    <modules>
+      <module fileurl="file://$PROJECT_DIR$/.idea/source.iml" filepath="$PROJECT_DIR$/.idea/source.iml" />
+    </modules>
+  </component>
+</project>
\ No newline at end of file

source/vendor/gitlab.schukai.com/oss/libraries/go/utilities/pathfinder/pathfinder.iml → source/.idea/source.iml

 <?xml version="1.0" encoding="UTF-8"?>
 <module type="JAVA_MODULE" version="4">
+  <component name="Go" enabled="true" />
   <component name="NewModuleRootManager" inherit-compiler-output="true">
     <exclude-output />
-    <content url="file://$MODULE_DIR$">
-      <sourceFolder url="file://$MODULE_DIR$/.devenv/state/go/pkg/mod/github.com/google/addlicense@v1.1.1/testdata/expected" isTestSource="false" />
-      <sourceFolder url="file://$MODULE_DIR$/.devenv/state/go/pkg/mod/github.com/google/addlicense@v1.1.1/testdata/initial" isTestSource="false" />
-    </content>
+    <content url="file://$MODULE_DIR$" />
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />
   </component>

source/.idea/vcs.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<project version="4">
+  <component name="VcsDirectoryMappings">
+    <mapping directory="$PROJECT_DIR$/.." vcs="Git" />
+  </component>
+</project>
\ No newline at end of file

source/command.go

@@ -4,15 +4,17 @@ import (
 	"fmt"
 	"github.com/charmbracelet/log"
 	html2 "gitlab.schukai.com/oss/bob/html"
+	"gitlab.schukai.com/oss/bob/javascript"
 	"gitlab.schukai.com/oss/bob/release"
 	"gitlab.schukai.com/oss/bob/style"
 	template2 "gitlab.schukai.com/oss/bob/template"
 	"gitlab.schukai.com/oss/bob/types"
-	"gitlab.schukai.com/oss/libraries/go/application/xflags"
+	xflags "gitlab.schukai.com/oss/libraries/go/application/xflags.git"
 	"gopkg.in/yaml.v3"
 	"os"
 	"path"
 	"path/filepath"
+	"strings"
 )
 
 type Definition struct {
@@ -25,6 +27,12 @@ type Definition struct {
 			DataFile string `short:"d" long:"data-file" description:"Name of the main data file" default:"data.yaml"`
 		} `command:"prepare" description:"Prepare content from a file" call:"PrepareTemplate"`
 	} `command:"template" description:"Template commands"`
+	Javascript struct {
+		Generate struct {
+			Input       string `short:"i" long:"input" description:"Directory with prepared html files" required:"true"`
+			Development bool   `short:"d" long:"development" description:"Development mode" default:"false"`
+		} `command:"generate" description:"Generate javascript files from a file" call:"GenerateJavascript"`
+	} `command:"javascript" description:"Javascript related commands"`
 	HTML struct {
 		Generate struct {
 			Input     string `short:"i" long:"input" description:"Directory with prepared html files" required:"true"`
@@ -67,6 +75,44 @@ func (d *Definition) CutHTML(s *xflags.Settings[Definition]) {
 	}
 }
 
+func (d *Definition) GenerateJavascript(s *xflags.Settings[Definition]) {
+
+	skipDirs := map[string]bool{
+		"node_modules": true,
+	}
+
+	err := filepath.Walk(d.Javascript.Generate.Input, func(p string, info os.FileInfo, err error) error {
+
+		if err != nil {
+			return err
+		}
+
+		for _, part := range strings.Split(p, string(filepath.Separator)) {
+			if skipDirs[part] {
+				return filepath.SkipDir
+			}
+		}
+
+		if info.IsDir() {
+			return nil
+		}
+
+		ext := filepath.Ext(p)
+		if ext != ".html" {
+			return nil
+		}
+
+		log.Info("Generate " + p)
+
+		return javascript.ParseHTMLFile(p, d.Javascript.Generate.Development)
+	})
+
+	if err != nil {
+		s.AddError(err)
+	}
+
+}
+
 func (d *Definition) SyncHTML(s *xflags.Settings[Definition]) {
 
 	err := html2.SyncHtml(d.HTML.Sync.Specification)

source/go.mod

@@ -7,12 +7,22 @@ toolchain go1.22.4
 require (
 	github.com/andybalholm/cascadia v1.3.2
 	github.com/charmbracelet/log v0.4.0
+	github.com/evanw/esbuild v0.24.0
 	github.com/tdewolff/parse/v2 v2.7.19
+	gitlab.schukai.com/oss/libraries/go/application/configuration.git v1.22.9
+	gitlab.schukai.com/oss/libraries/go/application/xflags.git v1.16.5
+	gitlab.schukai.com/oss/libraries/go/markup/html.git v0.4.7
+	gitlab.schukai.com/oss/libraries/go/services/job-queues.git v1.20.2
+	gitlab.schukai.com/oss/libraries/go/utilities/pathfinder.git v0.9.5
+	gitlab.schukai.com/oss/libraries/go/utilities/watch.git v0.4.2
+	golang.org/x/crypto v0.29.0
+	golang.org/x/net v0.31.0
+	gopkg.in/yaml.v3 v3.0.1
+)
+
+require (
 	gitlab.schukai.com/oss/libraries/go/application/xflags v1.16.3
 	gitlab.schukai.com/oss/libraries/go/markup/html v0.4.6
-	golang.org/x/crypto v0.28.0
-	golang.org/x/net v0.30.0
-	gopkg.in/yaml.v3 v3.0.1
 )
 
 require (
@@ -29,8 +39,7 @@ require (
 	github.com/volker-schukai/tokenizer v1.0.0 // indirect
 	gitlab.schukai.com/oss/libraries/go/utilities/data.git v0.2.2 // indirect
 	gitlab.schukai.com/oss/libraries/go/utilities/pathfinder v0.9.4 // indirect
-	gitlab.schukai.com/oss/libraries/go/utilities/pathfinder.git v0.9.5 // indirect
-	golang.org/x/exp v0.0.0-20241009180824-f66d83c29e7c // indirect
-	golang.org/x/sys v0.26.0 // indirect
+	golang.org/x/exp v0.0.0-20241108190413-2d47ceb2692f // indirect
+	golang.org/x/sys v0.27.0 // indirect
 	gopkg.in/check.v1 v1.0.0-20201130134442-10cb98267c6c // indirect
 )