Giter Club home page Giter Club logo

todoomlist's Introduction

ToDoomList

To Doom List is an application modeled on Remember The Milk that allows villains, supervillains and all other sorts of evil folk to create schemes(lists) and add ploys(tasks) to those lists. It is written with a frontend using only vanilla Javascript and a backend using Express.js.

Documentation: Github Wiki

Landing page GIF:

Alt Text

App page view:

Alt Text

Features

  • Sign-up and login with credentials
  • Dynamic scrolling animation on splash page
  • Main app page is a single-page application
  • Easy to use interface
  • Logged in user can create and save lists
  • Logged in user can create and save tasks associated with a list
  • Logged in user can search for all their tasks
  • Logged in user can keep track of tasks in a list with dynamic summary on right-hand side of main page
  • Logged in user can edit and delete their lists and tasks

Technical Details

  • One challenge we faced was handling how the display of ploys(tasks) would refresh after making an action (ex. deleting, renaming a ploy). The ploys being displayed can either be the result of querying by the Scheme Id or by Search, and in order to refresh the display, we needed a way to track what the last query that was called so we can re-call it. To facilitate that, we added a PloyQuery class that acted as a middleman between a function querying for ploys to display and the actual DB query call. This class would be able to keep a history of what query was last called and replaying it when a refresh is needed.
  class PloyQuery{
    constructor(){
        let queryType = null;
        let queryData = null;
    };

    async makeNewQuery(type, data){
        this.queryType = type;
        this.queryData = data;

        if(type === "schemeId"){
            return await Ploys.getPloys(data);
        } else if(type === "search"){
            return await Ploys.searchPloys(data);
        } 
    }

    //Returns data from last call of makeNewQuery();
    getLastQuery(){
        return {queryType: this.queryType, queryData: this.queryData};
    }

    //Replays the last call of makeNewQuery
    async callLastQuery(){
        let prev = this.getLastQuery();
        return await this.makeNewQuery(prev.queryType, prev.queryData);
    }
  }

Todos

  • Add Calendar to allow for more customizeable due dates
  • Improve styling of main app page
  • Implement a 'select all' checkbox in app page for ploys to facilitate bulk delete and update.

Contributors

todoomlist's People

Contributors

bxue2 avatar casuallycaffeinated avatar codinginrhythm avatar nathanieldcooke avatar

Stargazers

 avatar  avatar  avatar

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.