Code Monkey home page Code Monkey logo

apparatus's Introduction

Apparatus

Apparatus is a hybrid graphics editor / programming environment for creating interactive diagrams.

An interactive diagram can be an effective way to communicate a mental model, because it can convey a way of seeing a problem or system. Currently, to create an interactive diagram one must write code to procedurally draw the diagram and respond appropriately to user input. Writing this code can take hours or days. Apparatus aims to reduce the time to create an interactive diagram from hours to minutes.

The Apparatus editor runs in the browser. You can play with it, see examples, and watch tutorials on the Apparatus homepage.

Apparatus Usage

Building the project

First run npm install which will install all the dependencies for building Apparatus.

Then you can run npm run build which will compile the coffeescript files in src/ into dist/apparatus.js and the stylus files in style/ into dist/apparatus.css. Now you can open index.html in a browser to run the Apparatus editor.

For development, you can also run npm run dev which will set up a watcher for changes to src/ and style/ and also a livereload server. To use livereload, you will need to install an extension for your browser.

You can run npm run test to run all the tests in test/.

See all of the commands you can run in the scripts section of package.json.

Compiling the icon font

If you add an icon to the icon font (by putting an svg into the icons folder), you'll need to rebuild the icon font (the stuff in dist/font including dist/font/icons.css).

To do this you'll need to install fontcustom. Then in the terminal run:

fontcustom compile

Directory structure

  • dist contains the built javascript and CSS that npm run build will build.
  • doc contains some additional pictures and documentation on Apparatus.
  • icons contains SVG icons which are built into an icon font using fontcustom.
  • src contains the coffeescript source code for Apparatus.
  • style contains the stylus source code which is built into CSS.
  • test contains some tests for the model code. Run the tests with npm run test.
  • thirdparty contains some third party javascript libraries that are used by Apparatus.

apparatus's People

Contributors

david-crespo avatar electronicwhisper avatar joshuahhh avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.