Le dépôt des composants de Flow : 146 composants, le catalogue et le testeur
totaljs/flowstreamcomponents contient les composants open source que propose l’éditeur de Flow. Dans la révision documentée ici (e34d283), il compte 146 composants dans components/, 32 plus anciens conservés dans archived/, le générateur du catalogue (db.js), le catalogue lui-même (db.json) et un testeur.
Ce que couvre le catalogue
Les composants sont organisés en groupes. Quelques-uns des plus importants :
| Groupe | Composants (exemples) |
|---|---|
| Common (40) | delay, print, counter, switch, merge, code, request, throttle, transform, macro, modify, stringoperations |
| Total.js (17) | taction, troute, tschema, tcors, tresponse, tauthtoken, twebsocketroute, tuploadedfiles, tsql, querybuilderpg |
| Total.js API Services (13) | tapiocrapi, tapigeoipapi, tapiweatherapi, tapismsapi, tapichatgptapi, tapiinvoiceparserapi, tapicheckvatapi, tapiprintapi |
| Databases (8) | postgresql, mysql, sqlite3, mongodb-query, mongodb-insert, influxdb, nosql, localstorage |
| Triggers (7) | timer, trigger, crontab, minutely, notify |
| Files (6) | filewriter, filewatcher, fileswatcher, fsrename, fstouch, fsunlink |
| Flow, FlowStream, Stats, Checks, Security... | debug, flowstats, input, output, publish, subscribe, stopwatch, checkurl, checklog, checkfreespace, totp, iplimiter |
| MQTT, AI, Ollama | mqtt-broker, mqtt-publish, mqtt-subscribe, aiagent, aitool, aicontext, chatgpt, ollamaprompt, ollamals, ollamawebsearch |
Il y a aussi des composants pour l’analyse (xmlparser, dataparser, csvdataset, cheerio), les dates et fuseaux horaires (date, timezone, duration), le texte et les modèles (tangular, qrcode), OAuth2 (oauth2), les téléchargements (downloader, urldownload), les notifications (sms, rssreader, openweather, googlesearch) et le matériel de Linux (nvidiasmi). Le dossier archived/ conserve pour référence la génération précédente de la famille (GPIO et I2C de Raspberry Pi, RabbitMQ, métriques système).
Comment Flow les trouve : db.json
Flow ne télécharge pas le HTML de chaque composant. Il télécharge un catalogue, un fichier JSON (par défaut https://cdn.totaljs.com/flowstream/webcomponents/db.json, défini dans les réglages) avec une entrée par composant :
{
"id": "taction",
"group": "Total.js",
"name": "Action",
"url": "https://cdn.totaljs.com/flowstream/webcomponents/taction.html",
"author": "Peter Širka | Total.js",
"icon": "ti ti-totaljs",
"color": "",
"version": "2",
"kind": "",
"readme": "This component creates similar functionality as Total.js Actions. ..."
}L’éditeur affiche la liste avec le readme et télécharge l’url du composant quand vous l’ajoutez. Pour proposer vos propres composants à côté des officiels, publiez vos fichiers HTML et un db.json à vous et écrivez son adresse dans le réglage components2.
db.js génère le catalogue : il lit chaque fichier de components/, prend group, name, author, icon, color, version et kind dans ses exports, prend le texte de <readme>, construit l’url sur le CDN et écrit db.json trié par nom. Exécutez-le avec Node.js après avoir ajouté ou modifié un composant.
Le testeur
tester.js exécute un composant sans l’éditeur et tests/ contient des exemples (counter.js, example.js, example-multiple.js, influxdb.js, sqlite3.js, trigger.js) et un readme.md avec toutes les options. Un test ressemble à ceci :
require('../tester')(async function(describe, done) {
await describe(function(test, next) {
let messages = 0;
let status = 0;
test.status = function(data) {
status = data;
};
test.input('Hello World!');
messages++;
setTimeout(function() {
test.ok(status === messages, 'Counting');
next();
}, 2000);
});
done();
});describe charge le composant, test.input(data) lui envoie un message, test.output et test.message reçoivent ce qu’il envoie, test.configure({...}) change sa configuration, test.trigger() appelle son trigger et test.ok() et test.fail() marquent le résultat. Pour exécuter tous les tests : cd flowstreamcomponents, npm install total4 une fois, puis node tester.js. Le testeur de cette révision est écrit pour Total.js 4 (require('total4')), comme le dit son readme.
Contribuer
Le dépôt demande de suivre les normes et directives de code de Total.js, que son readme référence ; le contact est info@totaljs.com. Pour écrire un composant, voir écrire un composant.