expangine-vue

A Vue & Vuetify component library for expangine, a visual development framework.

You can test out the sandbox here, where you can define the structure of your program input, populate the program input, and develop the program. If you would like to download an example program here's HelloWorld, FizzBuzz, Fibonacci, FindLeapYears, and PrimeGenerator. Import it via File > Import.

Features of this example:

• Import / Export your structure, data, program, and functions as JSON.
• Use JSON or JS code to detect the data determine its types.
• Undo / Redo history saved to your localStorage.
• Add / Edit / Remove re-usable functions.
• Run your program and see it's output. If your program would update your data see the data before, after, and the diff.
• Debug your program and step through your program in any direction looking at the result of the current expression and the current state of your data.

expangine

Expangine is a visual programming framework that allows you to create programs. You design the structure of your data, some test data to work on, and finally a program which processes that data. Expangine is fully customizable, so you can add your own data types and operations.

The predefined expangine types:

• Any (user can select which type & value they want)
• Boolean (true / false)
• Color (RGBA)
• Date
• Enum (has label-value pairs for the user to select from)
• Function (has definition (input type), and implementation)
• List (ie array)
• Many (can be one of many defined types, user chooses which type & value)
• Map (key-value pairs)
• Null
• Number
• Object (with defined set of property names & types)
• Optional (an optional subtype)
• Text
• Tuple (an array of fixed size where each element can have it's own type)

Future Types

What can I do with this?

This project is a sandbox to show you what comes with expangine currently. You could use the system to create your own Game maker, CMS, or API management console. For example, if you want to create game maker you would need to:

1. Create new types: Point, Game, Scene, Sprite, Particles, etc
2. Create new operations: Distance between points, create sprite instance, rotate sprite, emit particles, goto scene, etc.
3. Create visuals: Something that allows you to define your game, all the possible scenes, all sprite templates, etc.
4. Program: What happens on your custom events? When the game starts, is paused, when a sprite is clicked on, when a sprite intersects with another, etc.

Once you get to step 3, you now have a tool that can create a game. Step 4 is actually giving your game it's appearance and behavior. What is generated is simple JSON, but could be compiled right down to code that doesn't even require expangine as a dependency.

Adding your own Type

1. Implement Type (example)
2. Define operations for your type (example)
3. Add operation type information for your type (example and more complex example)
4. Add operation implementation for your runtimes (example)
5. Add your type to the defs (import { defs } from 'expangine-runtime'; defs.addType(MyType);)
6. Add your type & operation visuals (type visuals and operation visuals)
7. Use your new types in your expangine programs!

Preview

Example Type View Data View Program View Execution Debugger Detect Types from Data Function Definition Function Implementation

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Run your tests

npm run test