Skip to content

Latest commit

 

History

History
348 lines (320 loc) · 9.79 KB

File metadata and controls

348 lines (320 loc) · 9.79 KB

FROG logo

Example — Default Numeric Control Realization Package

Illustrative machine-readable .wfrog publication example for the default realization of frog.widgets.numeric_control
FROG — Free Open Graphical Language


Contents


1. Overview

This document provides an illustrative machine-readable .wfrog publication example for the default realization of frog.widgets.numeric_control.

It demonstrates a richer realization than the button example because it includes:

  • a value display surface,
  • increment and decrement public parts,
  • widget-level states,
  • part-level pressed states,
  • resource mappings at multiple levels.

2. Purpose of this Example

This example exists to show how a value-carrying standard widget with multiple public parts may be realized cleanly through a machine-readable package.

It demonstrates that:

  • the class law stays upstream,
  • part names stay stable,
  • state-specific resources may exist for subparts,
  • fallback remains explicit,
  • the runtime still remains only the interpreter of the publication.

3. Example JSON

{
  "wfrog_version": "1",
  "package_kind": "widget_realization_library",
  "package": {
    "id": "frog.realizations.default.numeric_control",
    "name": "FROG Default Numeric Control Realization",
    "namespace": "frog.realizations.default",
    "publisher": "FROG",
    "summary": "Default official realization for frog.widgets.numeric_control"
  },
  "imports": [],
  "exports": {
    "realizations": [
      "frog.realizations.default.numeric_control"
    ],
    "resources": [
      "numeric_control.value_display.normal.svg",
      "numeric_control.value_display.disabled.svg",
      "numeric_control.value_display.focused.svg",
      "numeric_control.increment_button.normal.svg",
      "numeric_control.increment_button.pressed.svg",
      "numeric_control.decrement_button.normal.svg",
      "numeric_control.decrement_button.pressed.svg",
      "numeric_control.frame.normal.svg",
      "numeric_control.frame.focused.svg"
    ]
  },
  "targets": [
    {
      "class_id": "frog.widgets.numeric_control"
    }
  ],
  "realizations": [
    {
      "id": "frog.realizations.default.numeric_control",
      "family": "default",
      "target_class": "frog.widgets.numeric_control",
      "parts": [
        "root",
        "label",
        "value_display",
        "increment_button",
        "decrement_button",
        "frame"
      ],
      "states": [
        "normal",
        "disabled",
        "focused"
      ],
      "part_states": [
        {
          "part": "increment_button",
          "states": [
            "normal",
            "pressed"
          ]
        },
        {
          "part": "decrement_button",
          "states": [
            "normal",
            "pressed"
          ]
        }
      ],
      "part_bindings": [
        {
          "part": "value_display",
          "binding_kind": "resource_layer",
          "binding_target": "value_display"
        },
        {
          "part": "increment_button",
          "binding_kind": "resource_layer",
          "binding_target": "increment_button"
        },
        {
          "part": "decrement_button",
          "binding_kind": "resource_layer",
          "binding_target": "decrement_button"
        },
        {
          "part": "frame",
          "binding_kind": "resource_layer",
          "binding_target": "frame"
        }
      ],
      "state_maps": [
        {
          "target_part": "value_display",
          "state": "normal",
          "resource_refs": [
            "numeric_control.value_display.normal.svg"
          ]
        },
        {
          "target_part": "value_display",
          "state": "disabled",
          "resource_refs": [
            "numeric_control.value_display.disabled.svg"
          ],
          "fallback": "normal"
        },
        {
          "target_part": "value_display",
          "state": "focused",
          "resource_refs": [
            "numeric_control.value_display.focused.svg"
          ],
          "fallback": "normal"
        },
        {
          "target_part": "increment_button",
          "state": "normal",
          "resource_refs": [
            "numeric_control.increment_button.normal.svg"
          ]
        },
        {
          "target_part": "increment_button",
          "state": "pressed",
          "resource_refs": [
            "numeric_control.increment_button.pressed.svg"
          ],
          "fallback": "normal"
        },
        {
          "target_part": "decrement_button",
          "state": "normal",
          "resource_refs": [
            "numeric_control.decrement_button.normal.svg"
          ]
        },
        {
          "target_part": "decrement_button",
          "state": "pressed",
          "resource_refs": [
            "numeric_control.decrement_button.pressed.svg"
          ],
          "fallback": "normal"
        },
        {
          "target_part": "frame",
          "state": "normal",
          "resource_refs": [
            "numeric_control.frame.normal.svg"
          ]
        },
        {
          "target_part": "frame",
          "state": "focused",
          "resource_refs": [
            "numeric_control.frame.focused.svg"
          ],
          "fallback": "normal"
        }
      ],
      "fallbacks": {
        "disabled": "normal",
        "focused": "normal",
        "increment_button.pressed": "increment_button.normal",
        "decrement_button.pressed": "decrement_button.normal"
      },
      "host_hints": {
        "supports_host_focus_ring": true,
        "supports_host_step_buttons": true,
        "preferred_scaling": "uniform"
      }
    }
  ],
  "resources": [
    {
      "id": "numeric_control.value_display.normal.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/value_display/normal.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "value_display",
      "target_state": "normal"
    },
    {
      "id": "numeric_control.value_display.disabled.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/value_display/disabled.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "value_display",
      "target_state": "disabled"
    },
    {
      "id": "numeric_control.value_display.focused.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/value_display/focused.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "value_display",
      "target_state": "focused"
    },
    {
      "id": "numeric_control.increment_button.normal.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/increment_button/normal.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "increment_button",
      "target_state": "normal"
    },
    {
      "id": "numeric_control.increment_button.pressed.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/increment_button/pressed.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "increment_button",
      "target_state": "pressed"
    },
    {
      "id": "numeric_control.decrement_button.normal.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/decrement_button/normal.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "decrement_button",
      "target_state": "normal"
    },
    {
      "id": "numeric_control.decrement_button.pressed.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/decrement_button/pressed.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "decrement_button",
      "target_state": "pressed"
    },
    {
      "id": "numeric_control.frame.normal.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/frame/normal.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "frame",
      "target_state": "normal"
    },
    {
      "id": "numeric_control.frame.focused.svg",
      "kind": "svg",
      "path": "./assets/numeric_control/frame/focused.svg",
      "target_class": "frog.widgets.numeric_control",
      "target_part": "frame",
      "target_state": "focused"
    }
  ]
}

4. Reading Notes

This example shows a richer realization posture than the button example.

In particular:

  • value_display has widget-level states normal, disabled, and focused,
  • increment_button and decrement_button each have their own pressed-state realization,
  • frame supports focused posture,
  • fallback remains explicit at both widget and part level.

This is exactly the kind of case that justifies a dedicated realization-publication layer rather than runtime-only conventions.


5. Summary

This example provides a complete first machine-readable publication model for the default realization of frog.widgets.numeric_control.

It is suitable as the reference pattern for other value-carrying widgets with stateful public parts.