Add Example page

Author: kateinoigakukun

example/JavaScriptKitExample/.gitignore

@@ -0,0 +1,5 @@
+.DS_Store
+/.build
+/Packages
+/*.xcodeproj
+xcuserdata/

example/JavaScriptKitExample/.swift-version

@@ -0,0 +1 @@
+wasm-DEVELOPMENT

example/JavaScriptKitExample/Makefile

@@ -0,0 +1 @@
+../../src/swift/Makefile

example/JavaScriptKitExample/Package.swift

@@ -0,0 +1,14 @@
+// swift-tools-version:5.2
+
+import PackageDescription
+
+let package = Package(
+    name: "JavaScriptKitExample",
+    products: [
+        .executable(
+            name: "JavaScriptKitExample", targets: ["JavaScriptKitExample"]
+        ),
+    ],
+    dependencies: [.package(name: "JavaScriptKit", path: "../../src/swift")],
+    targets: [.target(name: "JavaScriptKitExample", dependencies: ["JavaScriptKit"])]
+)

example/JavaScriptKitExample/Sources/JavaScriptKitExample/main.swift

@@ -0,0 +1,11 @@
+import JavaScriptKit
+
+let alert = JSObjectRef.global.alert.function!
+let document = JSObjectRef.global.document.object!
+
+let divElement = document.createElement!("div").object!
+divElement.innerText = "Hello, world"
+let body = document.body.object!
+_ = body.appendChild!(divElement)
+
+alert("Swift is running on browser!")

example/JavaScriptKitExample/script

@@ -0,0 +1 @@
+../../src/swift/script

example/Makefile

@@ -0,0 +1,14 @@
+MAKEFILE_DIR := $(dir $(lastword $(MAKEFILE_LIST)))
+SWIFT_LIB_DIR ?= $(MAKEFILE_DIR)/../src/swift
+
+.PHONY: JavaScriptKitExample
+JavaScriptKitExample:
+	cd JavaScriptKitExample && make build
+
+dist/JavaScriptKitExample.wasm: JavaScriptKitExample
+	mkdir -p dist
+	cp ./JavaScriptKitExample/.build/debug/JavaScriptKitExample $@
+
+build: dist/JavaScriptKitExample.wasm
+	cd ../src/web && npm run build
+	npm run build

example/assets/JavaScriptKitExample.wasm

@@ -17,7 +17,7 @@ let wasi = new WASI({
 
 const startWasiTask = async () => {
   // Fetch our Wasm File
-  const response = await fetch("./assets/JavaScriptKitExample.wasm");
+  const response = await fetch("./dist/JavaScriptKitExample.wasm");
   const responseArrayBuffer = await response.arrayBuffer();
 
   // Instantiate the WebAssembly file
@@ -34,7 +34,5 @@ const startWasiTask = async () => {
   // Output what's inside of /dev/stdout!
   const stdout = await wasmFs.getStdOut();
   console.log(stdout);
-
-  console.log(`Print window.foobar = ${foobar}`);
 };
 startWasiTask();

example/src/index.js

@@ -8,4 +8,7 @@ module.exports = {
     filename: 'main.js',
     path: outputPath,
   },
+  devServer: {
+    hot: true
+  }
 };