Code Monkey home page Code Monkey logo

dotfiles's People

Watchers

 avatar  avatar

dotfiles's Issues

Frontend for todo app's view subparser

The todo app has a view subparser, which starts a WSGI server, and opens the webbrowser at that address.

The front-end is written in plain javascript in a jinja2 Template named todo.html.jinja in the same folder.

Each feature of the todo app should be accessible from the Web UI, and the Web UI is limited to that single HTML Template (no other dependancy should be required). The template should be plain JS, CSS3 and HTML5, compatible with Firefox and Chrome (who uses Edge or IE anymore?). The only external dependancies should be optional dependancies (the frontend has to work properly regardless if the host PC has an internet connection or not). So far, the only dependancy is to fontawesome.com for the icons (I'd like to find a better way though, probably by using a custom CSS3 font)

The features of the TODO App so far :

  • You can add tasks to lists (add subparser), tasks can be encrypted on the fly if the user is logged in. There should be that option in the web ui as well.
  • You can purge old tasks from lists
  • You can export tasks from the list into json, md, csv or sync them with google keep.
  • You can mark tasks as done/not done
  • You can login to the app, and that login enables the todo tasks to be encrypted/decrypted on the fly
    • Only decrypted/plaintext tasks should be viewable in the webview
  • You can move tasks from one list to another

The planned features of the app :

  • You will be able to import tasks from google keep, or a local json, csv, md, or sqlite db file
  • There will be a way to add reminders at specific times of day
  • There will be a search feature
    • The search parser will take a single argument, the query_string, which will be formatted as such
      • expressions in double quotes will be searched literally "todo tasks" will return all the tasks whose text contain the string "todo tasks" exactly
      • from:, to: will allow to specify a range of time for when the task was created
      • + or - at the start of the query string will only search tasks which are done or not done respectively
      • any lose words will be treated as keywords todo search todo tasks will return all the tasks which contain the words 'todo' and 'tasks' in whatever order

The front should have :

  • A modern UI, i.e. responsive (mobile-friendly), with good styling
  • all the aforementionned features
  • any missing backend routes can be added as necessary (contact @Dogeek )
  • There already is a semi-working UI for the app, changes should be made according to this spec, but some features already work
  • Ideally, remove the dependency on fontawesome, but still keep icons for the various buttons (for clarity, and because it looks better). Some icons don't even show up though, making a custom font is a possibility, and would be the only extra file I'd be willing to add to the project, but having it all done in html (possibly through a path) would be better.
  • No javascript libraries. At all. No Vue, no Angular, no Node, just plain js, in a single <script> tag. The CSS should also be in the <style> tag in the of the document.
  • An help page (accessible through an icon with a ? inside a circle, top-right of the screen) with details about how to use the UI, how to search for tasks etc (that last one can be ripped from this very message, but formatted properly)
  • The navbar should be fixed at the top of the screen, and the scrollwheel should only scroll the box below it
  • The theme should be in shades of grey, and have a toggleable dark mode/theme. (colors will be reversed hence why the shadees of grey)

On mobile :

  • The navbar should turn into a sliding menu from the left of the device, accessible through a drag from the left, or through a menu button (three horizontal stripes icon)
  • all the real estate should be dedicated to showing the tab content
  • The checkboxes should be hidden, and show up when the user performs a long press on a task (to allow multiple task selection)
  • There should be buttons for marking tasks as done, not done, or moving tasks when one or more task is selected by the user.

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.