Giter VIP home page Giter VIP logo

storyboard's Introduction

Storyboard

Drawing app for the second group project of Rutgers Coding Bootcamp.

LIVE PREVIEW --> https://storyboard-sketch.herokuapp.com/

Screenshots

Login/Signup Sketch
Login/Signup Form Image Sketch Form Image
Sketch 1 Sketch 2 Sketch 3 Sketch 4
Sketch 1 Image Sketch 2 Image Sketch 3 Image Sketch 4 Image

Final

Final Image

Technologies used

  • Node.JS
    • Express
    • Handlebars
    • Sequelize
    • Socketio
    • Sketch.JS
    • Cookie Parser
    • Body Parser
    • Favicon
    • Logger
    • Method Override
    • Passport
  • MySql
  • Amazon S3
  • Lucidchart

Prerequisities

  • Node.JS - visit nodejs.org and download...
  • MySql: brew install mysql (Mac) or visit mysql.com for MSI (Windows)

Getting Started

When you download the repo, run the following command to get all the dependencies

npm i

To Start the Server:

npm run serve

Built With

  • Sublime Text
  • Node Package Manager

Deployed With

  • Heroku
  • JawsDB

Walk throughs of code

Here is a section of code that selects the 5 recent groups and checks to see if user is any of the groups so a join button can be added if they are not.

// Create obj for rendering
var hbsObject = {
    username: req.user.username,
    recentGroups: [],
    userGroups: []
};

// Find most recently created groups
models.Group.findAll({
    limit: 5,
    order: 'id DESC'
})

// Create a loop through function that is called recursively
.then(function loopThrough(recentGroups, counter) {

    // Set counter
    if (counter === undefined) counter = 0;
    if (counter >= recentGroups.length) {
        cb() // Callback function to get out of recursive loop and continue
        return
    }

    // Get groupname and totalusers
    var obj = {
        groupname: recentGroups[counter].dataValues.groupname,
        totalusers: recentGroups[counter].dataValues.totalusers
    }

    // Check if total users is reached
    if (obj.totalusers === 4) {

        obj.joined = true; // Even though not actually joined, it does not display ability to join

        // Push obj to recent groups
        hbsObject.recentGroups.push(obj);

        // Recursion
        counter++;
        loopThrough(recentGroups, counter)

    } 
    
    // If user can be added
    else {

        // Check if user is in group
        recentGroups[counter].getUsers({where : {username: req.user.username}})

        .then(function(results) {

            // If no result, user is not in group
            if (results.length === 0)
                obj.joined = false;
            else
                obj.joined = true;

            // Push obj to recent groups
            hbsObject.recentGroups.push(obj);

            // Recursion
            counter++;
            loopThrough(recentGroups, counter)

        });
    }               

});

Authors

See also the list of contributors who participated in this project.

License

This project is licensed under the MIT License - see the LICENSE.md file for details

Acknowledgments

  • Hat tip to anyone who's code was used
  • All those times in elementary school where you tried to play this game on pieces of paper

storyboard's People

Watchers

James Cloos avatar Matt Bajorek avatar Edwin Rivera avatar Stefanie Centi avatar

storyboard's Issues

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.