>(
{ ssr: false },
);
-export default function ExamplePageExampleView({
- code,
- description,
- baseScene,
- initialClientCount,
-}: ExampleViewProps) {
- return (
-
- );
+export default function ExamplePageExampleView(props: ExampleViewProps) {
+ return ;
}
diff --git a/src/content/blogPosts/introducing-mml/body.mdx b/src/content/blogPosts/introducing-mml/body.mdx
index 714109c..40d6877 100644
--- a/src/content/blogPosts/introducing-mml/body.mdx
+++ b/src/content/blogPosts/introducing-mml/body.mdx
@@ -1,5 +1,6 @@
import * as React from "react";
import DocsExampleView from "@/src/components/ExampleView/DocsExampleViewDynamic";
+import { CLIENT_TYPES } from "@/types/docs-reference";
# Introducing MML: An Open Source Metaverse Markup Language for Multi-User Interactive 3D Experiences
_[Marcus Longmuir](https://twitter.com/marcuslongmuir) - 2023-06-15_
@@ -54,7 +55,7 @@ demonstrating one document seen by multiple clients complete with live editing.
some attributes:
-
+
diff --git a/src/content/docs/connectionEvent/index.ts b/src/content/docs/connectionEvent/index.ts
index 1cd2746..9cc1f87 100644
--- a/src/content/docs/connectionEvent/index.ts
+++ b/src/content/docs/connectionEvent/index.ts
@@ -1,4 +1,4 @@
-import { DocsExamples } from "@/types/docs-reference";
+import { CLIENT_TYPES, DocsExamples } from "@/types/docs-reference";
import disconnected from "./disconnected.mml";
import primary from "./primary.mml";
@@ -9,21 +9,18 @@ export const examples: DocsExamples = {
title: "Basic connection event",
description: "A label that shows the client ids that have connected.",
code: primary,
- clientsNumber: 2,
- showClientsControls: true,
+ clients: [CLIENT_TYPES.FLOATING, CLIENT_TYPES.FLOATING],
},
test: {
title: "Basic disconnection event",
description: "A label that shows the client ids that have disconnected.",
code: disconnected,
- clientsNumber: 2,
- showClientsControls: true,
+ clients: [CLIENT_TYPES.FLOATING, CLIENT_TYPES.FLOATING],
},
visibleTo: {
title: "Visible to event",
description: "A label that shows only the client id of one specific client",
code: visibleTo,
- clientsNumber: 2,
- showClientsControls: true,
+ clients: [CLIENT_TYPES.FLOATING, CLIENT_TYPES.FLOATING],
},
};
diff --git a/src/content/docs/m-light/point.mml b/src/content/docs/m-light/point.mml
index 4b81302..9c744df 100644
--- a/src/content/docs/m-light/point.mml
+++ b/src/content/docs/m-light/point.mml
@@ -10,4 +10,4 @@
-
+
diff --git a/src/content/docs/m-light/primary.mml b/src/content/docs/m-light/primary.mml
index c05e3c7..5d10330 100644
--- a/src/content/docs/m-light/primary.mml
+++ b/src/content/docs/m-light/primary.mml
@@ -11,4 +11,4 @@
-
+
diff --git a/src/content/docs/m-light/spotlight.mml b/src/content/docs/m-light/spotlight.mml
index 2fa6530..d382966 100644
--- a/src/content/docs/m-light/spotlight.mml
+++ b/src/content/docs/m-light/spotlight.mml
@@ -13,4 +13,4 @@
-
+
diff --git a/src/content/docs/mmlClickEvent/index.ts b/src/content/docs/mmlClickEvent/index.ts
index 700522d..661237f 100644
--- a/src/content/docs/mmlClickEvent/index.ts
+++ b/src/content/docs/mmlClickEvent/index.ts
@@ -1,4 +1,4 @@
-import { DocsExamples } from "@/types/docs-reference";
+import { CLIENT_TYPES, DocsExamples } from "@/types/docs-reference";
import clickedBy from "./clicked-by.mml";
import position from "./position.mml";
@@ -14,8 +14,7 @@ export const examples: DocsExamples = {
title: "Clicked by",
description: "This example shows which client clicked the cube.",
code: clickedBy,
- clientsNumber: 2,
- showClientsControls: true,
+ clients: [CLIENT_TYPES.FLOATING, CLIENT_TYPES.FLOATING],
},
position: {
title: "Position",
diff --git a/src/content/docs/mmlCollisionStartEvent/index.ts b/src/content/docs/mmlCollisionStartEvent/index.ts
index c4db6f1..5cdc890 100644
--- a/src/content/docs/mmlCollisionStartEvent/index.ts
+++ b/src/content/docs/mmlCollisionStartEvent/index.ts
@@ -1,3 +1,12 @@
-import { DocsExamples } from "@/types/docs-reference";
+import primary from "@/src/content/docs/mmlCollisionStartEvent/primary.mml";
+import { CLIENT_TYPES, DocsExamples } from "@/types/docs-reference";
-export const examples: DocsExamples = {};
+export const examples: DocsExamples = {
+ primary: {
+ title: "Collision start event",
+ description: "The label shows the connection id of the user colliding with the platform.",
+ code: primary,
+ clients: [CLIENT_TYPES.AVATAR, CLIENT_TYPES.AVATAR],
+ baseSceneOn: false,
+ },
+};
diff --git a/src/content/docs/mmlCollisionStartEvent/primary.mml b/src/content/docs/mmlCollisionStartEvent/primary.mml
new file mode 100644
index 0000000..202d2a1
--- /dev/null
+++ b/src/content/docs/mmlCollisionStartEvent/primary.mml
@@ -0,0 +1,15 @@
+
+
+
+
+
+
diff --git a/src/pages/docs/reference/elements/[reference-id].tsx b/src/pages/docs/reference/elements/[reference-id].tsx
index c737efd..f86f50d 100644
--- a/src/pages/docs/reference/elements/[reference-id].tsx
+++ b/src/pages/docs/reference/elements/[reference-id].tsx
@@ -12,6 +12,7 @@ import ExampleView from "@/src/components/ExampleView/DocsExampleViewDynamic";
import { MarkDown } from "@/src/config/mdx";
import * as docsExamples from "@/src/content/docs";
import { getPageTitle } from "@/src/util";
+import { CLIENT_TYPES } from "@/types/docs-reference";
// This function gets called at build time to generate all the files
export function getStaticPaths() {
@@ -86,13 +87,13 @@ const DocsPage = ({ referenceId }: { referenceId: string }) => {
Try it
)}
@@ -141,7 +142,7 @@ const DocsPage = ({ referenceId }: { referenceId: string }) => {
description={example.title}
baseScene={example.baseSceneOn !== undefined ? example.baseSceneOn : true}
code={example.code}
- initialClientCount={1}
+ initialClients={example.clients ?? [CLIENT_TYPES.FLOATING]}
/>
);
diff --git a/src/pages/docs/reference/events/[event-id].tsx b/src/pages/docs/reference/events/[event-id].tsx
index 844bf7b..c73a99d 100644
--- a/src/pages/docs/reference/events/[event-id].tsx
+++ b/src/pages/docs/reference/events/[event-id].tsx
@@ -15,6 +15,7 @@ import { MarkDown } from "@/src/config/mdx";
import * as docsExamples from "@/src/content/docs";
import { getPageTitle } from "@/src/util";
import { eventClasses } from "@/src/util/event-classes";
+import { CLIENT_TYPES } from "@/types/docs-reference";
// This function gets called at build time to generate all the files
export function getStaticPaths() {
@@ -110,21 +111,19 @@ const DocsPage = ({ eventId }: { eventId: string }) => {
)}
{primaryExample && (
- <>
+
Try it
-
+
)}
Properties
@@ -186,8 +185,7 @@ const DocsPage = ({ eventId }: { eventId: string }) => {
description={example.title}
baseScene={example.baseSceneOn !== undefined ? example.baseSceneOn : true}
code={example.code}
- initialClientCount={example?.clientsNumber ?? 1}
- showClientsControls={example?.showClientsControls}
+ initialClients={example.clients ?? [CLIENT_TYPES.FLOATING]}
/>
);
diff --git a/src/pages/examples.tsx b/src/pages/examples.tsx
index e24d600..2d8bd9f 100644
--- a/src/pages/examples.tsx
+++ b/src/pages/examples.tsx
@@ -8,6 +8,7 @@ import { ChangeEvent, useEffect } from "react";
import ExampleView from "@/src/components/ExampleView/ExamplePageExampleViewDynamic";
import { examples } from "@/src/content/examples";
import { getPageTitle } from "@/src/util";
+import { CLIENT_TYPES } from "@/types/docs-reference";
import { Example, ExamplesByName } from "@/types/example";
const ExamplesPage = () => {
@@ -109,7 +110,7 @@ const ExamplesPage = () => {
{
+ return clientId++;
+ };
+}
diff --git a/types/docs-reference.ts b/types/docs-reference.ts
index 53ed952..9caec1a 100644
--- a/types/docs-reference.ts
+++ b/types/docs-reference.ts
@@ -1,10 +1,17 @@
+// Technically not a type but I'm not sure where to put this constant
+export const CLIENT_TYPES = {
+ FLOATING: "floating",
+ AVATAR: "avatar",
+} as const;
+
+export type ClientType = (typeof CLIENT_TYPES)[keyof typeof CLIENT_TYPES];
+
export type DocsReference = {
title: string;
description: string;
code: string;
baseSceneOn?: boolean;
- clientsNumber?: number;
- showClientsControls?: boolean;
+ clients?: ClientType[];
};
export type DocsExamples = {
diff --git a/types/example.ts b/types/example.ts
index 66d476f..2682966 100644
--- a/types/example.ts
+++ b/types/example.ts
@@ -1,9 +1,12 @@
+import { ClientType } from "@/types/docs-reference";
+
export type Example = {
name: string;
image: string;
description: string;
code: string;
baseScene?: boolean;
+ clients?: ClientType[];
};
export type ExamplesByName = {