Setup

Here are instructions to get the code working on your computer (based on instructions originally written by John Sarracino).

EDDIE depends on node.js and several npm libraries, typescript and cassowary.

Install node.js

Install node.js, following the instructions on their website. I recommend using your OS's package manager, either homebrew on Macs or apt on linux. (Note, if you're on a Mac, you might need to install homebrew before you can use it.)

For a mac:

brew install node

Here are the step that I (Ben) did on a Mac that already had homebrew and node:

brew update
brew upgrade node
brew link --overwrite node
npm install -g npm

Note: I first did chown -R $USER /usr/local because my permissions were a bit messed up.

Note: I had to run brew link --overwrite node because I (think) I had a previously installed non-homebrew version of node.

Install Typescript

npm install -g typescript

Get the EDDIE code

1. Clone EDDIE to a stable place on your computer (i.e., not tmp): git clone https://github.com/UCSD-PL/ed-vis-gen
2. Change to the develop branch:

cd ed-vis-gen
git checkout develop

Install Cassowary

Unfortunately, we can't use npm's version of cassowary and instead must build it locally and tell npm to link it.

1. Clone cassowary to a stable place on your computer (i.e., not tmp): git clone https://github.com/slightlyoff/cassowary.js/
2. Add cassowary to homebrew by running the following commands:
   1. cd <directory-of-cassowary-code>
   2. npm link
   3. cd <directory-of-eddie-repo>/src
   4. npm link cassowary

Set up EDDIE's dependencies

In the ed-vis-gen directory, run the following command: npm run-script initialize

Building

Every time you update the code, run

npm run-script build

This will run tsc, browserify,and several rsyncs, and will place everything in new/target/.

Running

If you open new/target/html/index.html with chrome, you should see EDDIE. Firefox should work as well, but Safari is broken because it doesn't support ES6. I haven't tested IE/Edge and don't intend to unless I have to :).

Directory structure:

The directories "src/model", "src/view", "src/controller", "src/static/html/", and "src/util" contain stuff worth looking at: of particular interest are "src/main.ts" and "src/static/html/index.html"/ "src/static/html/style.css", as they're the most visible code.

Two things to keep in mind:

1. the typescript compiler (tsc) puts the javascript translation of a typescript file in place e.g. after running tsc, "src/main.js" is the translation of "src/main.ts".

2. changes to src files aren't reflected until you run "npm run-script build".