Calchart Viewer

Motivation

The goal of Calchart Viewer is to provide an easy way for Cal Band members to prepare for a performance by watching a preview of the charting file generated by Calchart. We aim to do this by building a web app which has three main features:

1. Provide a preview of the show, rendered in a web page.
2. Allow users to highlight their spot and step through the show with music.
3. Allow users to generate a PDF printout of their specific continuity (moves) for the show.

Installing and building

1. Install nodejs. Node comes packaged together with npm ("node package manager") on windows and mac. For linux, please see this post.
2. Navigate to the project root in your terminal of choice.
3. npm install: this will install all the dependencies needed to compile the javascript in this project.
4. npm install -g grunt-cli: this will allow you to run grunt commands.
5. grunt build: this will compile the javascript into the build/js/application.js file. Webpack allows us to import things in javascript using the require function. See app/js/application.js and app/js/viewer/ApplicationController.js for an example. This will also compile the LESS code into the CSS files that the app needs to work.
6. Open app/index.html in your browser. Presto!

Developing

When you change a javascript file, you will have to compile build/js/application.js again by running grunt webpack:build. Same thing with when you change a .less file: you'll need to run grunt less to compile to CSS. You should run grunt watch from the project root: this will start a task that listens for changes to the javascript and less files and autocompiles build/js/application.js and all the CSS files on every save.

Contributing

Open issues and milestones are on the issues page. When you start work on an issue, assign yourself to it to make sure no two people work on the same thing at the same time. Please work on your own branch and submit a pull request when you're done so it can be reviewed for style: tag the person you want to review it in the pull request, but feel free to comment on any open pull request with questions/conerns. Noah will be responsible for merging the pull requests into master or not.

If you have an idea for a feature, general question, bug report, etc, open an issue about it! All issues will be triaged.

Architecture Diagram

You can find a very high level overview of how the code architecture should work and interact with the UI here.

Deploying

To push changes to http://calband.github.io/calchart-viewer, checkout the master branch and run source scripts/push.sh.