Your Web News in One Place

An Interest In:

Web News this Week

Search Archive

Some of Our Sources

View All Sources

Help Webnuz

Referal links:

Sign up for GreenGeeks web hosting
August 12, 2020 08:48 pm GMT

Object GUI - Psychedelic Waves Editor

Let's show how Object-GUI works, the component is the Editor, not the waves.

GitHub logo matteobruni / object-gui

Object GUI - Javascript Object GUI Editor

Object GUI - Javascript Object Editor

Object GUI is your fully customizable Javascript Object GUI Editor

Gitpod Ready-to-Code

Usage

You can see a working sample here: https://codepen.io/matteobruni/pen/oNxNvja

Installation

HTML / Vanilla JS

You need to include these files:

CSS

https://cdn.jsdelivr.net/npm/[email protected]/dist/css/object-gui.css

Javascript

https://cdn.jsdelivr.net/npm/[email protected]/dist/js/object-gui.min.js

ES 6 Imports

import { Editor } from "object-gui";

CommonJS / Node.js

const Editor = require("object-gui");

Usage

const code = document.getElementById("code");const data = {  prop1: "pluto",  prop2: 3,  group1: {    prop1: "paperino",    prop2: 0.3,  },  color1: "#ff0000",  select1: "Item 2",  alert: function () {    alert(JSON.stringify(data, null, 4));  },};const editor = new Editor("sample", "Sample", data);editor.top().right
View on GitHub

Original Link: https://dev.to/matteobruni/object-gui-psychedelic-waves-editor-1m5k

Share this article:    Share on Facebook
View Full Article

Dev To

An online community for sharing and discovering great ideas, having debates, and making friends

More About this Source Visit Dev To