Skip to content

Widgets

lalBi94 edited this page Nov 11, 2026 · 5 revisions

Widgets

Les cartes spéciales sont adossées à un module caché normal. Elles partagent son identifiant, exposent des fonctions exportées et participent aux flèches de dépendance. Chaque carte propose une bascule aperçu / code du module. Les boutons, entrées typées et sélecteurs RGB/RGBA sont des cartes interactives distinctes, reliées à une fonction. Les widgets de plugin sont des cartes de présentation sans module source.

Screen

Grille de pixels (15×9 par défaut), redimensionnable. Le canvas de la carte se dimensionne sur la carte, avec un facteur entier pour éviter le flou.

  • Globales : SCREEN_SP3_GLOBAL_PIXELS_<N>, ..._WIDTH_<N>, ..._HEIGHT_<N>.
  • Exports : SCREEN_SP3_SET_PIXEL_<N>, GET_PIXEL_<N>, GET_WIDTH_<N>, GET_HEIGHT_<N>, SET_WIDTH_<N>, SET_HEIGHT_<N>, BLIT_<N>, PRESENT_<N>.
  • Tampon RGBA borné à 128×128.
  • Pendant Run : une image par PRESENT, sinon une par écriture ; lecture à 24 fps, boucle sur la période détectée.
  • Une séquence sans cycle relance la simulation pour renouveler les images.

Gauge

Anneau avec dégradé et halo, plage configurable.

  • Exports : GAUGE_SP3_SET_VALUE_<N>, ADD_VALUE_<N>, GET_VALUE_<N>, GET_MIN_<N>, GET_MAX_<N>, SET_RANGE_<N>, RESET_<N>.
  • Valeur double.

ProgressBar

Barre horizontale avec dégradé et halo.

  • Exports : PROGRESS_SP3_SET_VALUE_<N>, ADD_VALUE_<N>, GET_VALUE_<N>, SET_RANGE_<N>.
  • Valeur double, bornée à l’affichage.

BarChart

Graphique à barres signées.

  • Données : int[].
  • Exports : BARCHART_SP3_SET_VALUE_<N>(index, value), SET_DATA_<N>(values), CLEAR_<N>().
  • CLEAR remet les zéros sans changer la longueur.
  • 64 barres maximum affichées.

Heatmap

Grille fixe int[].

  • Dimensions par défaut 12×8, configurables de 1 à 32.
  • Exports : HEATMAP_SP3_SET_CELL_<N>(x, y, value), CLEAR_<N>().
  • Intensité relative à la plus grande cellule, du fond à la couleur primaire.
  • Pas de lecture à 24 fps : suit uniquement les pas Run/Debug.

LED

Voyant booléen.

  • Globale : LED_SP3_GLOBAL_VALUE_<N>.
  • Exports : LED_SP3_SET_VALUE_<N>(value), GET_VALUE_<N>(), TOGGLE_<N>().
  • Suit le focus de nœud pendant Run et le curseur en Debug.
  • Avec un Screen, un état par image à 24 fps.

RGB LED

Voyant piloté par trois canaux entiers 0–255.

  • Globales : RGBLED_SP3_GLOBAL_RED_<N>, ..._GREEN_<N>, ..._BLUE_<N>.
  • Exports : RGBLED_SP3_SET_COLOR_<N>(red, green, blue), GET_RED_<N>(), GET_GREEN_<N>(), GET_BLUE_<N>().
  • Halo sur le canal le plus lumineux ; valeurs affichées sous le voyant.
  • Suit les pas et les images d’écran.

Configuration des entrées

Les cartes d’entrée regroupent leur sélecteur de fonction dans un volet Configuration pliable, fermé par défaut, sur le même modèle que la carte de widget de plugin. L’aperçu et la valeur restent visibles ; un clic sur l’en-tête révèle le binding. Les anciens boutons isPress() sans callback n’affichent pas ce volet.

Boutons d’entrée

Un bouton est une carte interactive avec deux modes : toggle ou hold. Le module caché déclare INPUT_SP3_GLOBAL_ONCLICK_<N> de type (boolean) -> void, initialisée à une fonction vide. Le sélecteur de fonction est dans le volet Configuration de la carte ; le binding ajoute automatiquement l’import et l’export nécessaires.

Pendant le Run live, l’état du bouton est appliqué entre deux frames, sans relancer le programme. Le hold appelle la fonction une fois avec true à l’appui ; le toggle l’appelle immédiatement à l’activation, puis toutes les 500 ms tant qu’il reste actif, et une fois avec false à la désactivation. Un clic démarre le live si nécessaire. Les anciens boutons isPress() restent lisibles mais ne sont plus exportés. Voir l’exemple Simple → Input.

Entrées typées

Trois cartes : numberInput (int), floatInput (float) et stringInput (string). Le module caché déclare INPUT_SP3_GLOBAL_ONCHANGE_<n> de type (int|float|string) -> void, initialisée à INPUT_SP3_GLOBAL_NOOP_<n>. Le sélecteur de fonction, de la même signature, est dans le volet Configuration pliable.

Les nombres ont un champ stylé avec pas −/+ (1 pour int, 0,1 pour float) et une saisie clavier ; le texte utilise un champ entre guillemets. Chaque changement valide appelle la fonction liée avec la nouvelle valeur. La valeur et la vue sont conservées dans la présentation du workspace ; le dashboard exporté reprend la valeur et le callback. La transpilation JavaScript/Python est refusée (TRANSPILE_INPUT_NUMBER_UNSUPPORTED pour int/float, TRANSPILE_INPUT_STRING_UNSUPPORTED pour string).

Sélecteurs RGB/RGBA

rgbPicker et rgbaPicker conservent trois ou quatre entiers 0..255. Le module caché déclare RGB_PICKER_SP3_GLOBAL_ONCHANGE_<n> ou RGBA_PICKER_SP3_GLOBAL_ONCHANGE_<n> de type (int[]) -> void. La carte propose une roue chromatique (teinte/saturation), une luminosité, un champ hexadécimal court ou long, des champs R/G/B/A, des couleurs prédéfinies, un canal alpha pour RGBA et une bascule aperçu/code. Le binding, dans le volet Configuration, n’accepte qu’une fonction (int[]) -> void.

Le dashboard exporté reprend les deux sélecteurs avec la roue et les champs hexadécimal/alpha. La transpilation est refusée (TRANSPILE_RGB_PICKER_UNSUPPORTED, TRANSPILE_RGBA_PICKER_UNSUPPORTED).

XY plot

Traceur 2D interactif basé sur Mafs.

  • Exports : XYPLOT_SP3_SET_FUNCTION_<N>(fn), SET_RANGE_<N>(xMin, xMax), CLEAR_<N>().
  • La fonction doit avoir la signature (double) -> double.
  • L’échantillonnage suit le pas courant ; Mafs gère le déplacement et le zoom.
  • Rendu local dans l’application ; le dashboard exporté reprend le traceur avec uPlot.

Oscilloscope

Instrument multicanal basé sur uPlot.

  • Exports : OSCILLOSCOPE_SP3_ADD_CHANNEL_<N>(fn), SET_CHANNEL_<N>(id, fn), REMOVE_CHANNEL_<N>(id), SET_RANGE_<N>(xMin, xMax), CLEAR_<N>().
  • Jusqu’à six canaux échantillonnés sur une fenêtre commune.
  • uPlot gère le tracé et le zoom ; le dashboard exporté l’embarque.

Widgets de plugin

Un widget de plugin est une carte pluginWidget de présentation, sans module source ni AST. Il apparaît dans la quatrième colonne Plugins du menu de création lorsque des plugins actifs en fournissent. La carte bascule entre le widget et sa définition déclarative JSON en lecture seule.

Les entrées sont liées à une variable visible ; les sorties à une fonction (T) -> void. Les liaisons produisent des flèches depuis les modules qui déclarent la variable ou la fonction vers la carte du widget. Un widget dont le plugin est absent conserve ses données et affiche un diagnostic. Voir Plugins.

Transpilation

La présence d’un widget ou d’une entrée interactive rend le programme non transpilable vers JavaScript/Python/C. Les codes sont explicites (TRANSPILE_SCREEN_UNSUPPORTED, TRANSPILE_XY_PLOT_UNSUPPORTED, TRANSPILE_OSCILLOSCOPE_UNSUPPORTED, TRANSPILE_INPUT_BUTTON_UNSUPPORTED, TRANSPILE_INPUT_NUMBER_UNSUPPORTED, TRANSPILE_INPUT_STRING_UNSUPPORTED, TRANSPILE_RGB_PICKER_UNSUPPORTED, TRANSPILE_RGBA_PICKER_UNSUPPORTED, etc.). Les widgets restent simulables et exportables en SVG comme cartes.

Dashboard exporté

Les widgets, les commentaires KaTeX et les contrats peuvent être embarqués dans un fichier HTML autonome. Voir Dashboard exporté.

Limites

  • Pas de nouveau type logique : ce sont des modules ordinaires, sauf les widgets de plugin qui restent hors source logique.
  • Les widgets ne sont pas des entrées interactives ; seuls les boutons, entrées typées et sélecteurs RGB/RGBA le sont.
  • Les widgets de plugin sont déclaratifs : pas de composant React ou JavaScript tiers, pas de HTML ni de ressource distante.
  • BarChart/Heatmap/XY plot/Oscilloscope ne sont pas des composants UI tiers dans l’application : rendu local et thème de l’application ; le dashboard exporté embarque Mafs/uPlot selon le cas.

Clone this wiki locally