-
Notifications
You must be signed in to change notification settings - Fork 310
Clockwork V2 Dev Guide
This page is a work in progress! Info may change or be inaccurate, so be ready.
Apps work by simply embedding a webpage inside Clockwork. Apps are written in JSON and are really easy to make:
{
"name": "Example",
"desc": "An example app",
"longDesc": "A looooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong description for my example app. With [b]BBCode![/b]"
"url": "urlhere.com",
"encodedUrl": "no",
"icon": "https://redstone-nw.netlify.app/assets/icon.png",
"author": "You",
"version": "v1.0.0",
"finderTerms": ["term","cool","epic"],
"permissions": []
}
The proper name of your app.
A short description shown in Clockwork and the Store.
A longer description shown on your app's page in the Clockwork Store. Not shown in Clockwork itself. Allows [b], [i], [u], [s], [h1-3], [hr] and [br] BBCodes.
The url to the app.
If encoded with ClockworkEncode (found in Settings > Developer Tools) set to true/yes, otherwise set to false/no. If you don't know what this does then just set it to false.
The url to the icon image. Images should be square.
The url to the image for the banner, only shown on your app page in the Store. In development...
The creator of the app. This must be your username if uploading to the Clockwork Store.
The version of your app.
An array containing alternative searchable text for the Finder tool. Just put an array of alternative names if you don't know what this is.
Add permissions here. If not given, it will give no permissions. Valid permissions are:
notifications - allow sendNotification(), addPanel(), editPanel(), deletePanel(), getPanels() [IN DEVELOPMENT]
installApp - allow installApp()
installTheme - allow installTheme() [IN DEVELOPMENT]
unsafePermissions - allow unsafeEval(), factoryReset(), installPlugin() [IN DEVELOPMENT]
As of beta16 (UNRELEASED UPDATE), Clockwork now has a developer mode where you can sideload apps and themes, and run Javascript code. To enter developer mode, go to the /os/?dev=true on the Clockwork instance's website. To turn it back off, just replace true with false.
Clockwork has lots of cool functions for apps to use, but you might be wondering how you're supposed to be able to use them. Well, we've made a JS library which will hopefully make your life way easier. To add it to your app, put the following code in the <body>
element:
<script src="https://cdn.jsdelivr.net/gh/red-stone-network/clockwork@latest/tools/clockwork.js"></script>
To start, you'll need to create a new Clockwork communicator:
const cw = new Clockwork()
Then, you can use all the functions of Clockwork from there (if your app has the permissions for it).
const cw = new Clockwork();
if (cw.isEmbedded) {
cw.installApp("https://example.com/app.json");
} else {
alert("You aren't using Clockwork!");
};
NOTE: cw.isEmbedded cannot tell if it is embedded in Clockwork or another website.
const cw = new Clockwork();
if (cw.isEmbedded) {
cw.sendNotification(prompt("Type a message."));
}
There's plenty more you can do with clockwork.js! You can look here for a full documentation.
- Try to host the icon for your app on the app's website, so users can know if it's blocked without having to download it
- Make your apps accessible to users! We have users with dyslexia and colorblindness, and having features that make your apps easier to use for these groups does wonders for both your app and Clockwork.
- Don't host your apps on Replit. Replit is a steaming pile of garbage for Clockwork apps most of the time - use Glitch, Render, Cyclic, Railway, or literally anything else.
The website that you're hosting the .json file of your app on are not giving the correct Content-Type
headers. Make sure it's set to application/json
, or if you don't know how to do that, try hosting it one one of these services:
JSDelivr (through github repo)
- Try purging the cache of the clockwork.js script here if you're using JSDelivr.
- Try removing and re-adding the
script
tag for clockwork.js. - If that doesn't work, ask for help in the Discussions tab or in the Discord.
Clockwork © 2022 Redstone Network