Giter VIP home page Giter VIP logo

sparrow's Introduction

Crane-Fit

Introduction

Crane-Fit is a web based application that allows a user to create workout plans and use their created templates during their workout with a timer to help through each exercise.

Crane0Fit is forked (with gratitude) from Team Sparrow's Sparrow Fit. The unique features of Crane-Fit are time series forecasting (with fbprophet) and data visualization (with D3).

How to Use

This will guide you through installing and opening the app, creating a workout and starting the workout assistant tool.

Step One: Install Dependencies

JavaScript and node

Running npm install from the root directory should satisfy all dependencies. N.B. You will need bower installed (npm install -g bower) for this to work correctly.

Python

fbprophet

Crane-Fit depends on fbprophet for its time-series forecasting. This is quite a new library which can perform relatively sophisticated analysis with simple parameters, highly accessible to the mathematically naive (such as ourselves). Being new, it has a couple of downsides: notably that it can be a little difficult to install.

Installation should be relatively painless with pip:

pip install fbprophet

Sometimes, however, it struggles to resolve all the dependencies correctly. In particular, you will need numpy>=1.10.0, which on certain platforms pip will not install by default. Crane-Fit is designed to be stable and should forecasting fail (e.g. if an older version of numpy is present), it will silently abandon forecasting. If you find you have no errors, but also no predictions, an old version of numpy or no installation fbprophet are likely the cause.

Those struggling to resolve all the dependencies may find it easiest to use Anaconda which will provide a workable environment with a recent version of numpy and Cython installed. Running the above pip install from within a conda shell should make fbprophet available to you. N.B In this case, you will also need to run npm start from within a conda shell to ensure that you use the correct Python distribution.

Python version

Crane-Fit is designed for Python 3.*, but there's not reason that it shouldn't work on 2.7.

Step Two: Start the Server

Next, run npm start, which will start the server on localhost:3002

Step Three: Authenticate

Our authentication system uses Auth0. Sign up for an account with Auth0 and create a client with which you will have access to a clientID (Auth0's way of idenfiying you) and domain. These will have to be added to the .env file as environment variables.

You can list the callback url in your Auth0 settings. Checkout the .env.example file and fill in the following sections to get it running. DOMAIN = CLIENT_ID = AUDIENCE = SECRET =

Note: DOMAIN and CLIENT_ID are passed from server to client via get request in src/app.js.

Step Four: Create Your First Workout

After logging in, a new bar should display in the top left corner. Click on Create Workout to get to the Create Workout page. Here, you can set a new workout with a name, default value for logging your workouts and unit by which to measure them.

You can log individual workouts in the Log Workouts section which saves records of individual sessions.

Finally, you can set a goal (perhaps you want to run a faster mile or squat a few extra kg) and track your progress in the Goals section. After a few workouts, you will start to see predictions of future performance and a notification of your likelihood of meeting your goal. These become more accurate the more information you give them, so remember to log every workout!

Program Structure

Crane-Fit is built using the MEAN stack along with some help for Auth0 and Bootstrap.

The Database

Crane-Fit's Mongo Database uses Mongoose as an ORM. It's code is built in the db folder containing two files. First, mongoose-schemas.js creates schemas for four different Database tables.

User stores information on individual users to the app. Template stores the workouts that are created a user. History stores the previous activity of a user. Goals stores information on goals the user sets for themselves.

/db also contains seed.js which clears and adds fake data to the database when run. Running node db/seed.js will drop and repopulate the database.

We have used mLab for our cloud database system which makes the following environment variable automagically available to node when working with some platforms (Such as Heroku): MONGO_DB_URI = If you are not using such a platform (or perhaps working locally), you should set this variable manually to mongodb://<username>:<password>@<host>:<port>/<db_name>.

The Server

The server's code is stored in /server/index.js, which creates an Express server to serve up the client-side code, check that a user is logged in, and make database queries when endpoints are reached.

The code in this file will show all of the possible GET and POST requests that can be made to the server and is where new ones can be added.

We are using morgan express middleware in server/index.js to log all incoming requests to the server. It logs the req.method, endpoint and a timestamp in your terminal.

The Client

Lastly, the src folder handles the client side code, containing the necessary dependencies, html, css and relevant javascript.

Along with more modularized folders, /src contains index.html, which is the main html file which the client will be loaded into, and which will load app.js to help with state-based routing. The other folders contain specific code for the different sections of the app to be loaded, most of which are contaiined inside of /src/client.

Inside of /src/client, /components contains the different aspects for the program, creating the view and code to create workouts, goals, and load and navigating through a workout. Each of these is taken care in its corresponding folder.

The other folder inside of client is services, which contains Angular services used throughout the program.

sparrow's People

Contributors

d-kang avatar ankit09osr avatar p-wm avatar shaikathaque avatar francisngo avatar briankim4311 avatar nickhattwick avatar nickparis11 avatar

Watchers

James Cloos avatar  avatar  avatar

sparrow's Issues

User should be able to perform a workout

User should be able to:
-view a list of created workouts
-select a workout
-see an expanded view/dialog for the selected workout
-input a number value for the workout (e.g. 30 (minutes))
-perform the workout

User should be able to set a goal (graph)

User should be able to see their set goals progress in form of graphs
User should be able to see predicted progress for their goal, based on past workout data, in the form of a graph.

User should be able to create a workout

Allow user to:
-enter workout name
-enter workout unit magnitude and unit
-click a create workout button that makes POST request to /API/workouts
-Let user know that button has been clicked

User should be able to set a goal (form)

User should be able to select a workout from a dropdown menu
User should be able to select a unit type of workout
User should be able to select start and end date
User should be able to click set goal button to submit (POST request to /API/goals)

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.