AUIML

From WoozleCodes
Jump to navigation Jump to search

Application User Interface Markup Language (AUIML) is a concept for replacing the current HTML+CSS+JavaScript klugefest with something designed from the ground up to properly support full user-interactivity[1] while preserving support for rich text and media and preserving the URL concept for addressing content.

I'm thinking there may actually be at least two variants of this:

  • a fully-interactive markup syntax
    • It may be useful a simpler sub-variant designed for form-based interaction, where components are requested but the client-app handles the layout. I'm thinking it might be easier to develop this as a way of getting started.
  • a markup syntax for terminal-style CLI interactions, but with formatting and links

Notes

This is probably a terrible design, but you have to start somewhere... (2026-06-10 I've had several additional thoughts since writing this in 2020-21, and need to include them.)

Concepts

  • Any given URL delivers a Document.
  • A Document contains one or more Views, equivalent to media type in CSS
    • <view [input] window=scroll/page>
      • attributes:
        • [input]: if present, the view accepts input (keyboard, mouse, touchscreen, media); if not, it is read-only (like a printout or slide)
        • window=scroll indicates that the view scrolls within the Document
        • window=page indicates that the view must be divided into fixed-size pages
      • <area> - a rectangular region within a Window
        • <layer> - stacked renderings within an Area
          • <widget type=... event=...>: display widget
            • type=... values:
              • type=text: displays text; can react to clicks or selections
              • type=image: displays an image; can react to clicks, drags
            • event=... values:
              • click events (sends both click and unclick events):
                • event=click.l - left-click
                • event=click.r - right-click
                • event=click.m - middle-click
              • event=drag - drag with whatever button was clicked
              • event=drop - something was dropped onto the widget (there's data)
              • keyboard events:
                • event=key.press - any key (not necessarily a character) pressed (also sends release)
                • event=key.change - a keypress caused a change in the text contents
  • To simplify constructing simple pages:
    • a Document is also an Area, so if you want to use the whole Document as an Area, you don't need an <area> tag
    • an Area is also a Layer, so if you only need one Layer you don't need to also define a <layer> tag

Archive

  • IOML was an earlier version of this idea.

Footnote

  1. ...by which I mean a user-experience equivalent to desktop GUI or specialized mobile "apps"