Giter Site home page Giter Site logo

johnmunsch / clearanddraw Goto Github PK

View Code? Open in Web Editor NEW
17.0 4.0 6.0 1.42 MB

The software which powers http://ClearAndDraw.com. Written in AngularJS, it allows for quick filtering of the cards available today and records your cards and dice information in localStorage of the browser.

JavaScript 36.42% ApacheConf 10.64% HTML 37.77% CSS 15.16%

clearanddraw's Introduction

ClearAndDraw README

Code Climate Test Coverage

Introduction

ClearAndDraw is a little AngularJS application I whipped up in a few evenings because I happen to like the card and dice game Marvel Dicemasters: Avengers vs. X-Men. As you enter in information about the cards and dice you have, it saves it in the browser's localStorage.

It needs a ton more features to be useful, including a central server to which you could save your catalog of info and the ability to create teams of cards and dice for play. But even without that it can prove an interesting example JavaScript or AngularJS project from which you can learn or even lift some code.

Installation

You don't really have to "install" anything to look at or use the code. But if you want to see it run locally or run the unit tests you'll need to do a few things. First off, make sure you've installed Node.js so you can run the Node Package Manager (npm). Then make sure you've installed both Grunt and Bower. I'm not going to tell you how to do all of that, but instead I'll just direct you to the Yeoman project where they tell you about installing all of these great JavaScript tools. Fortunately, npm makes it all pretty darn easy and installing Node.js is easy too.

With all the software you need installed, you can run a couple of commands in the root of the airquotes project to get installed what you need to run or test it locally:

bower install

npm install

Running

Then use Grunt to run a server and launch the web page in a browser where you can explore the working UI:

grunt serve

Testing

Or run the unit tests with:

grunt test

Look for the code coverage reports as index.html files under the "coverage" directory; there will be one for each browser under which the tests were run.

To-Do List

  • Re-layout of the card page
  • Get a list of all teams
  • Create a new named team
  • Edit/view a team
  • Add a mailing list signup (for release news)
  • Print collection or teams
  • Evaluate teams as they are built for conformance to tournament rules (# of cards, # of dice, dice less than max for card, cards must be different names, basic action cards)
  • Save collection and teams to the cloud
  • Support buying, selling, and trading
  • Promote the site on Reddit
  • Support drafting
  • API access
  • Share your teams for review and commentary
  • Collect links for the site
  • Take a picture for the site
  • Add tags to the cards
  • Filter based on tags (for example, show me only cards with global effects or those which do direct damage)
  • Add triggers as tags to the cards (for example, [trigger - when damaged] or [trigger - when fielded])

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.