Skip to content

Commit

Permalink
website: Add basic syntax highlighting
Browse files Browse the repository at this point in the history
  • Loading branch information
cbebe committed Oct 18, 2024
1 parent 78b5930 commit 32db10d
Show file tree
Hide file tree
Showing 7 changed files with 116 additions and 72 deletions.
5 changes: 4 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,9 +11,12 @@
"@nx-go/nx-go": "^3.2.0",
"@nx/node": "19.8.0",
"@nx/workspace": "19.8.0",
"@types/prismjs": "^1.26.4",
"@types/react": "^18.3.11",
"nx": "19.8.0",
"typescript": "~5.2.2"
"prismjs": "^1.29.0",
"typescript": "~5.2.2",
"utility-types": "^3.11.0"
},
"dependencies": {
"@docusaurus/core": "3.4.0",
Expand Down
44 changes: 2 additions & 42 deletions pkg/website/docs/fysh/manual.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,16 +6,13 @@ sidebar_position: 2

## 🐠 Chapter 1: Fysh Syntax

<details>
<summary>Click to expand</summary>

### 🐟 Variables

- Meet Steven, our fishy friend. In Fysh, variables like Steven are declared
with `><name>`. Every line of fysh ends with a wave `~`.

```fysh
><Steven> ~
><steven> ~
```

- Steven has binary scales. In Fysh, `}` represents `1` and `)` represents `0`.
Expand Down Expand Up @@ -65,7 +62,7 @@ sidebar_position: 2

- **Multiplying values:** Fysh often get lonely. This loneliness causes fysh to
meet new fysh and proliferate. This gives Steven a value of
`0b101010 = 0b110 * 0b111`. (42 = 6 * 7)
`0b101010 = 0b110 * 0b111`. (42 = 6 \* 7)

```fysh
><steven> = ><{{(°> <3 ><{{{°> ~
Expand Down Expand Up @@ -120,13 +117,8 @@ number that determines the doneness of the fysh.
><###> ~
```

</details>

## 📊 Chapter 2: Data Types

<details>
<summary>Click to expand</summary>

### 📏 Integers

- **Integer:** Steven is an integer represented using binary scales. They have
Expand Down Expand Up @@ -187,13 +179,8 @@ number that determines the doneness of the fysh.
><steven>[><(({°>] ~
```

</details>

## 🧠 Chapter 3: Fysh Logic and Operations

<details>
<summary>Click to expand</summary>

### 🤔 Logical Operations

- **`AND (&&)`, `OR (||)`, and `NOT (!!)`**: Steven is experiencing an
Expand Down Expand Up @@ -254,13 +241,8 @@ are represented by `~o` or `o~`. Here, we are checking if Steven is bigger than
><steven> ≈o ><{{{°>
```

</details>

## 🔄 Chapter 3: Control Structures

<details>
<summary>Click to expand</summary>

### 🔁 While Loops

- In the whirlpool of Fysh logic, the while loop, represented by `@` or `🌀`,
Expand Down Expand Up @@ -317,13 +299,8 @@ Conditional statements run based on how each Fysh feels
<><
```

</details>

## 🧑‍🔧 Chapter 4: Functions

<details>
<summary>Click to expand</summary>

### ✏️ Defining Functions

To define a function or SUBroutine, use a submarine `>(funcNameHere)` along with
Expand All @@ -349,13 +326,8 @@ of the 3 parameters.
[>(submarine) ><fysh1> - ><fysh2> - ><fysh3>] ~
```

</details>

## ⚓ Chapter 5: Output

<details>
<summary>Click to expand</summary>

### ⛓️ Output Value

When we finally reach our destination, we anchor ourselves. Anchors are used to
Expand All @@ -367,13 +339,8 @@ Here we're outputting `0b101` (5).
(+o ><{({°> ~
```

</details>

## 💬 Chapter 6: Comments

<details>
<summary>Click to expand</summary>

### 🔉 Single-line Comments

Navigator Fysh are used to guide the reader through the code. They are
Expand All @@ -397,13 +364,8 @@ How to grill a Fysh:
<*/><
```

</details>

## 📈 Examples

<details>
<summary>Click to expand</summary>

### ❗Factorial Example

This program calculates the factorial of number. In this case 5. The factorial
Expand Down Expand Up @@ -435,5 +397,3 @@ Let's break it down:
2. `<number><< ~` - Decrement the number.
3. Repeat until the number is 1.
4. `(+o ><factorial> ~` - Output the factorial.

</details>
33 changes: 33 additions & 0 deletions pkg/website/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
{
"name": "website",
"nx": {
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"projectType": "application",
"sourceRoot": "pkg/website/src",
"targets": {
"build": {
"executor": "@nx-extend/docusaurus:browser",
"options": {
"outputPath": "dist/pkg/website"
}
},
"serve": {
"executor": "@nx-extend/docusaurus:dev-server",
"options": {
"port": 3000
}
},
"deploy": {
"dependsOn": [
"build"
],
"executor": "nx:run-commands",
"options": {
"command": "go run pkg/website/cmd/main.go",
"cwd": "{workspaceRoot}"
}
}
},
"tags": []
}
}
29 changes: 0 additions & 29 deletions pkg/website/project.json

This file was deleted.

33 changes: 33 additions & 0 deletions pkg/website/src/theme/prism-fysh.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
Prism.languages.fysh = {
comment: [
{
pattern: /><\/\*>[\s\S]*?<\*\/></,
greedy: true,
},
{
pattern: /><\/\/>.*$/m,
greedy: true,
},
],
string: [
{
pattern: /\*[^*]*\*/,
greedy: true,
},
{
pattern: /🫧[^🫧]*🫧/,
greedy: true,
alias: 'special',
},
],
keyword: [
{
pattern: /><\(*[*^@]>/,
greedy: true,
},
{
pattern: /><\\\/>|<\\\/></,
alias: 'control-flow',
},
],
};
33 changes: 33 additions & 0 deletions pkg/website/src/theme/prism-include-languages.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
import siteConfig from '@generated/docusaurus.config';
import type * as PrismNamespace from 'prismjs';
import type {Optional} from 'utility-types';

export default function prismIncludeLanguages(
PrismObject: typeof PrismNamespace,
): void {
const {
themeConfig: {prism},
} = siteConfig;
const {additionalLanguages} = prism as {additionalLanguages: string[]};

// Prism components work on the Prism instance on the window, while prism-
// react-renderer uses its own Prism instance. We temporarily mount the
// instance onto window, import components to enhance it, then remove it to
// avoid polluting global namespace.
// You can mutate PrismObject: registering plugins, deleting languages... As
// long as you don't re-assign it
globalThis.Prism = PrismObject;

additionalLanguages.forEach((lang) => {
if (lang === 'php') {
// eslint-disable-next-line global-require
require('prismjs/components/prism-markup-templating.js');
}
// eslint-disable-next-line global-require, import/no-dynamic-require
require(`prismjs/components/prism-${lang}`);
});

require('./prism-fysh');

delete (globalThis as Optional<typeof globalThis, 'Prism'>).Prism;
}
11 changes: 11 additions & 0 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

0 comments on commit 32db10d

Please sign in to comment.