You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/development/add-new-message-type.md
+7-7Lines changed: 7 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -1,32 +1,32 @@
1
1
# Adding New Message Types
2
2
3
-
Before adding a new message type, you should study the [packages documentation](/development/packages.md) and the source code for an existing package that handles a message type. The [Vote](https://github.com/soapdog/patchfox/tree/master/src/packages/vote) package, which handles _likes_, is the simplest place to start.
3
+
Before adding a new message type, you should study the [packages documentation](/development/packages.md) and the source code for an existing package that handles a message type. The [Vote](https://github.com/soapdog/patchfox/tree/master/ui/packages/vote) package, which handles _likes_, is the simplest place to start.
4
4
5
5
The `messageTypes` array in the `patchfox.package()` declaration signals the handling of a message type. Each item in `messageTypes` includes a _message type_ field and a _card view_. On startup, Patchfox assembles the data from all loaded packages into a large array. When it needs to render a message, it iterates through that array, checking to see which _card view_ from which package can handle the given type.
6
6
7
-
> The order of the imports in `src/packages/packages.js` matters because Patchfox will append them to the _message type handler array_ in the same order. If two packages handle the same type, Patchfox will use the package that comes **first** in the array. For this reason, you don't need to delete any code from the Patchfox source tree when experimenting with a new _message type handler_. You can simply move its package above the current handler in `packages.js`.
7
+
> The order of the imports in `ui/packages/packages.js` matters because Patchfox will append them to the _message type handler array_ in the same order. If two packages handle the same type, Patchfox will use the package that comes **first** in the array. For this reason, you don't need to delete any code from the Patchfox source tree when experimenting with a new _message type handler_. You can simply move its package above the current handler in `packages.js`.
8
8
9
9
## The `messageTypes` array
10
10
11
11
A package can declare itself the handler for as many message types as it wants. Each message type needs to be an individual object inside the `messageTypes` array. Let's look at the package declaration for the `Vote` package.
12
12
13
13
```
14
-
const Vote = require("./Vote.svelte")
14
+
const VoteView = require("./Vote.js")
15
15
16
16
patchfox.package({
17
17
name: "vote",
18
18
messageTypes: [
19
19
{
20
20
type: "vote",
21
-
card: Vote,
21
+
card: VoteView,
22
22
short: true
23
23
}
24
24
]
25
25
})
26
26
```
27
27
28
28
*`type` is a string that represents the message type. It will be matched against incoming messages.
29
-
*`card` tells Patchfox which Svelte view to use to render the message.
29
+
*`card` tells Patchfox which Mithril component to use to render the message.
30
30
*`short` is a boolean value that determines the styling of the card. `true` causes Patchfox to display a short card with no background, and `false` displays as a normal card.
31
31
32
32
There is another field that is not represented in the above example. `validator` is a function that can be run to further refine the match. If the `type` matches and a `validator` function is present, the card will only be used if `validator` returns `true`. This is because there are some message types that are _overloaded_ in SSB. An example is the `about` message type, which might refer to a _profile being updated_ or a _gathering being updated_, or one of many other actions.
Copy file name to clipboardExpand all lines: docs/development/app-development.md
+2-2Lines changed: 2 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -5,7 +5,7 @@ Apps are self-contained [packages](/development/packages.md). They are accessibl
5
5
6
6
_Application Launcher_
7
7
8
-
Before you can create a new mini-app, you should study the [packages documentation](/development/packages.md) and the source code for one of the included mini-apps. The [Books](https://github.com/soapdog/patchfox/tree/master/src/packages/books) mini-app is a good place to start because it has many of the features you might want to learn how to implement.
8
+
Before you can create a new mini-app, you should study the [packages documentation](/development/packages.md) and the source code for one of the included mini-apps. The [Books](https://github.com/soapdog/patchfox/tree/master/ui/packages/books) mini-app is a good place to start because it has many of the features you might want to learn how to implement.
9
9
10
10
What makes a package a mini-app is the inclusion of: `app: true` in its `patchfox.package()` declaration. This will place it on the _Launcher_.
11
11
@@ -15,4 +15,4 @@ What makes a package a mini-app is the inclusion of: `app: true` in its `patchfo
15
15
2. Don't forget to include `app: true` in the `patchfox.package()` declaration.
16
16
3. Create a _default view_ for your package. It should be a Svelte view. Add it with `view: myDefaultView` in the declaration. This is the view that the _Launcher_ loads when a user launches your app.
17
17
4. Include a nice icon. :-)
18
-
5. Only packages added to `src/packages/packages.js` will be loaded.
18
+
5. Only packages added to `ui/packages/packages.js` will be loaded.
Copy file name to clipboardExpand all lines: docs/development/building.md
+6-60Lines changed: 6 additions & 60 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -32,67 +32,16 @@ To run Patchfox.
32
32
33
33
## Setup inside Patchfox
34
34
35
-
Once Patchfox is running, it needs your _remote_ and _secret_. You can click the "browse" button on the setup screen and select your SSB secret file, usually located at `~/.ssb/secret`. Patchfox will use the data inside your secret file to derive your remote address. Remember to click save.
35
+
Once patchfox is running, it needs to learn your _remote_ and _secret_, you can just click the "browse" button on the setup screen and select your `.ssb/secret` file. Patchfox will use the data inside your secret file to derive your remote address. Remember to click save.
36
36
37
-
> **macOS Users:** By default, your Mac will not display _hidden files_. Every file or folder that starts with a period is considered _hidden_. This means that the `.ssb/` folder in your home folder might not be visible to you. You can alter that by going to the Finder settings menu, or by pressing `Command + Shift + .`.
38
-
>
39
-
> The macOS _file selection dialog_ also allows you to visit any folder with the `Command + Shift + G` keyboard shortcut. You'll see a text field where you can type `~/.ssb` and it will take you directly to the correct folder.
40
-
41
-
After saving, Patchfox will attempt to load your public feed. You need to have a running _sbot_ for it to work.
37
+
After saving Patchfox will then try loading your public feed. You need to have a running _sbot_ for it to work.
42
38
43
39
## Other NPM scripts
44
40
45
-
Patchfox contains many granular NPM scripts. I originally created Patchfox on a Microsoft Surface Go with a Pentium CPU, so breaking the scripts into small, discrete actions made development faster.
46
-
47
-
As Patchfox is an extension rather than a regular web app, there is no _watch & rebuild_ script.
48
-
49
-
### Cleaning scripts
50
-
These scripts are used to delete files and folders. You rarely need to run these.
51
-
52
-
***clean** deletes the `dist/` folder.
53
-
***really-clean** deletes `node_modules/` - used when debugging Windows on ARM vs Windows on x86 emulation on the same machine. You can ignore it.
54
-
55
-
### Copying scripts
56
-
A significant part of the build process is copying files around. An example is the script that copies the documentation you're reading into `dist/docs`. You're unlikely to need these commands During day-to-day development. The most common use-case is when changing the documentation, which happens for each release.
57
-
58
-
***copy:manifest** copies `manifest.json` to `dist/`. This is the control file used by the browser that contains the metadata and configuration for the add-on.
59
-
***copy:static** copies the static resources.
60
-
***copy:augmented-ui** copies the cute cyberpunk-inspired CSS library that Patchfox uses.
61
-
***copy:tribute-css** copies the CSS from [Tribute](https://www.npmjs.com/package/tributejs).
62
-
***copy:spectre-icons-css** copies the Spectre icons CSS.
63
-
***copy:browser-polyfill** copies the [browser polyfill](https://github.com/mozilla/webextension-polyfill).
64
-
***copy:docs-folders** copies the documentation.
65
-
***copy:docs-root** copies the root folder of the documentation (don't forget to run this!).
66
-
***copy:index** copies `index.html`
67
-
***copy:package-assets** is a tricky one. During development, the _assets_ used by packages are in a folder called `assets`, but in the build they need to be in a directory closer to the packages.
68
-
***copy:package-docs** is similar to the previous script. During development, each package's documentation lives in a folder inside it. In the build process, these docs need to be copied to `dist/docs`.
69
-
***copy:browserAction** copies `browserAction.html`. This is the menu you see when you click the Patchfox icon in your browser's toolbar.
70
-
71
-
### Build scripts
72
-
These scripts deal with all the transpiling and JS juggling used by our crazy ecosystem to turn the fantasy Javascript and Svelte code into something that the browser understands.
73
-
74
-
***build:browserAction** builds the [_browser action_](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action) JS used by the menu you see on the browser toolbar.
75
-
***build:background** builds the [background script](https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/background) for the add-on.
76
-
***build:addon** builds the main bundle, including packages.
77
-
***build:platform-ssb** builds the _SSB core_.
78
-
79
-
### Development build scripts
80
-
These are the same as the previous build scripts but include sourcemaps. We can't use them to ship the add-on because the sourcemaps take up a lot of disk space, which would negatively affect end-users.
81
-
82
-
***dev:browserAction**
83
-
***dev:background**
84
-
***dev:addon**
85
-
***dev:platform-ssb**
86
-
87
-
### Convenience scripts
88
-
These are useful convenience scripts that combine multiple scripts from above. Once you're familiar with the ones above, these scripts can be a more convenient alternative.
89
-
90
-
***dev:both** runs dev:platform-ssb and dev:addon
91
-
***build** runs all scripts from the `copy` and `build` categories
92
-
***dev** runs all scripts from the `copy` and `dev` categories
93
-
***clean-build** runs `clean` and then the above `build` convenience script
94
-
***clean-dev** runs `clean` and then the above `dev` convenience script
95
-
***nuke** runs `really-clean`, `clean`, and the `dev` convenience script
41
+
*`npm run css`: builds the CSS. Every time you add a new CSS rule that you haven't used before, you need to run this again. The CSS is built with [Tailwind CSS](tailwindcss.com/) and [Daisy UI](daisyui.com/).
42
+
*`npm run builder:*` many different scripts to build binaries for each platform.
43
+
*`npm run docs`: builds the documentation.
44
+
*`npm run localbuild`: builds the CSS, the docs, and binaries for various platforms on your local machine.
96
45
97
46
# Testing the protocol schemas
98
47
@@ -104,7 +53,4 @@ After installing and configuring Patchfox, try visiting:
104
53
105
54
If you're interested in learning more about the technologies behind Patchfox, check out:
106
55
107
-
*[MDN Web Docs - WebExtensions](https://developer.mozilla.org/en-US/Add-ons/WebExtensions/).
0 commit comments