@pangenerator/vui

1.2.0 • Public • Published

VUI

VUE.js GUI plugin for creative coding and generative design. Work in progress.

Setup

npm install @pangenerator/vui --save

Using

Just a moment...

Settings file

{
  "toggleCodes": [9, 72, 104],
  "width": 300,
  "padding": 10,
  "visible": true,
  "values": true,
  "theme": {
    "background": "#222222",
    "f_high": "#ffffff",
    "f_med": "#affec7",
    "f_low": "#888888",
    "f_inv": "#000000",
    "b_high": "#555555",
    "b_med": "#333333",
    "b_low": "#111111",
    "b_inv": "#affec7"
  },
  "controllers": [
    {
      "name": "size",
      "type": "slider",
      "min": 0,
      "max": 300,
      "value": 100,
      "precision": 0
    },
    {
      "name": "opacity",
      "type": "slider",
      "min": 0,
      "max": 1,
      "value": 1.0,
      "precision": 2
    },
    {
      "name": "sides",
      "type": "slider",
      "min": 3,
      "max": 10,
      "value": 3,
      "precision": 0
    },
    {
      "name": "border",
      "type": "toggle",
      "value": true
    },
    {
      "name": "text",
      "type": "text",
      "value": "String content"
    },
    {
      "name": "color",
      "type": "color",
      "value": "#ffc800"
    },
    {
      "name": "square",
      "type": "button"
    }
  ]
}

License

MIT License

TODO

  • [x] textfield
  • [x] toggle
  • [x] set
  • [x] onchange events
  • [x] button
  • [ ] color selector
  • [ ] switch
  • [ ] group
  • [ ] dropdown
  • [ ] save
  • [ ] load
  • [ ] connect npm publish with git tag
  • [ ] paper.js example
  • [ ] d3 example
  • [ ] svg example
  • [ ] theme.svg [?]

Package Sidebar

Install

npm i @pangenerator/vui

Weekly Downloads

0

Version

1.2.0

License

(MIT OR Apache-2.0)

Unpacked Size

34.9 kB

Total Files

4

Last publish

Collaborators

  • jkozniewski
  • kgolinski