drp-tech · d-roak · Sep 19, 2024 · Sep 15, 2024 · Sep 16, 2024 · Sep 16, 2024
@@ -0,0 +1,24 @@
+# Topology Protocol Example
+
+This is an example that uses Topology Protocol to implement a 2D grid space where users appear to be circles and can move around the integer grid one grid at a time.
+
+## Specifics
+
+The Grid CRO has a mapping from user id (node id concacenated with a randomly assigned color string) to the user's position on the grid. The CRO leverages the underlying hash graph for conflict-free consistency. The mergeCallback function receives the linearised operations returned from the underlying hash graph, and recomputes the user-position mapping from those operations.
+
+## How to run locally
+
+After cloning the repository, run the following commands:
+
+```bash
+cd ts-topology/examples/grid
+pnpm dev
+```
+Debugging is made easier by setting the mode in `webpack.config.js` to "development":
+
+```js
+module.exports = {
+  mode: "development",
+  ...
+}
+```
@@ -0,0 +1,27 @@
+{
+	"entries": ["./src/objects/chat.ts"],
+	"targets": {
+		"debug": {
+			"outFile": "dist/asc/debug.wasm",
+			"textFile": "dist/asc/debug.wat",
+			"sourceMap": true,
+			"debug": true
+		},
+		"release": {
+			"outFile": "dist/asc/release.wasm",
+			"textFile": "dist/asc/release.wat",
+			"sourceMap": false,
+			"optimizeLevel": 3,
+			"shrinkLevel": 0,
+			"converge": false,
+			"noAssert": false
+		}
+	},
+	"options": {
+		"lib": {
+			"@topology-foundation/crdt": [
+				"../node_modules/@topology-foundation/crdt/src/index.asc.ts"
+			]
+		}
+	}
+}
@@ -0,0 +1,42 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Topology - Grid</title>
+  </head>
+  <body>
+    <div>
+      <h1>A 2D grid made with CRO</h1>
+      <p>Your Peer ID: <span id="peerId"></span></p>
+      <p>Peers on dRAM: <span id="peers"></span></p>
+      <p>Discovery Peers: <span id="discoveryPeers"></span></p>
+
+      <button id="createGrid">Spawn a new Grid CRO</button>
+      <span style="margin: 0 10px;">|</span>
+      <input id="gridInput" type="text" placeholder="Enter Grid CRO ID" />
+      <button id="joinGrid">Connect to existing Grid CRO</button>
+      <p>
+        Connected to Grid CRO ID:
+        <span id="gridId" style="text-decoration: underline;"></span>
+        <button id="copyGridId" style="margin-left: 10px; display: none;">Copy</button>
+      </p>
+      <p>Peers in CRO: <span id="objectPeers"></span></p>
+    </div>
+
+    <div
+      id="grid"
+      style="
+        position: relative;
+        width: 100%;
+        height: 60vh;
+        border: 1px solid black;
+        overflow: hidden;
+      "
+    >
+      <!-- Users will appear here -->
+    </div>
+
+    <script type="module" src="/src/index.ts"></script>
+  </body>
+</html>
@@ -0,0 +1,37 @@
+{
+  "name": "topology-example-grid",
+  "version": "0.1.1",
+  "description": "Topology Protocol Grid Exmaple",
+  "main": "src/index.ts",
+  "repository": "https://github.com/topology-foundation/ts-topology.git",
+  "license": "MIT",
+  "scripts": {
+    "asbuild": "asc --config asconfig.json --target release",
+    "build": "vite build",
+    "clean": "rm -rf dist/ node_modules/",
+    "dev": "vite serve",
+    "start": "ts-node ./src/index.ts"
+  },
+  "dependencies": {
+    "@topology-foundation/crdt": "0.1.1",
+    "@topology-foundation/network": "0.1.1",
+    "@topology-foundation/node": "0.1.1",
+    "@topology-foundation/object": "0.1.1",
+    "assemblyscript": "^0.27.29",
+    "crypto-browserify": "^3.12.0",
+    "memfs": "^4.11.1",
+    "process": "^0.11.10",
+    "react-spring": "^9.7.4",
+    "stream-browserify": "^3.0.0",
+    "ts-node": "^10.9.2",
+    "uint8arrays": "^5.1.0",
+    "vm-browserify": "^1.1.2"
+  },
+  "devDependencies": {
+    "@types/node": "^22.5.4",
+    "ts-loader": "^9.5.1",
+    "typescript": "^5.5.4",
+    "vite": "^5.4.3",
+    "vite-plugin-node-polyfills": "^0.22.0"
+  }
+}