Lately i've been playing a lot of flight simulators, specifically X-Plane 11 and more recently Microsoft Flight Simulator 2020.
Some of these sims are very in-depth, what some people like to call 'study-level' sims. So i started taking notes on a paper, with a pen.
After a while, i organized my notes, into something that started resembling the checklists that pilots use in real life, but still, more related to the sim.
And after looking for about 5 minutes on google, i couldn't find a simple app to build checklists and go through them with my phone as a side screen to the sim.
So, what did i decided to do? i decided to write something myself, because it is good practice, because its something that i'll use it myself and because why not? and thus SimChecklists were born, as a small project to entertain myself, during lunchbreak, while i was trying to understand how to program the onboard computer on a Boeing 737-800.
I used PHP for most of the backend stuff, so sorting, parsing and delivering the checklists to the screen in a readable manner. With Vanilla Javascript for the frontend, interfacing with the user, i wanted to avoid using anything heavy, so no images (only SVG icons dynamically loaded with PHP) and no 'javascript frameworks' (remember: no
The main thing is that the checklists themselves are simple text files, i used a simple structure, using double dashs (--Foobar--) to denote a new sublist and foo=bar to denote items to do. A simple js script to cross and mark the items as done once i clicked them and after less than 1 hour, i had a version 1 ready to upload, which i did. I uploaded the app for myself, to use it on my own (this) domain. And i also uploaded the code to github, both to increase my portfolio and if anyone else wants to host it, modify or whatever, can feel free to.
I also showed a friend, which gave a few suggestions. So i started implementing them, and this is actually a good reminder, for me, of how much i prefer working with vanilla js over jquery, it as easy, but much faster and lighter weight and if'm honest, i think i did a good job. At this moment i have a webapp that while not fully featured is really not that bad:
- Theme support through appropriated .thm files.
- Auto detection and theme switching between light and dark modes.
- Hability for the user to upload their own checklists, files gets verified in both extension and mime type formats.
- Auto-scroll the checklist on the screen as the items are clicked.
- Hability to swipe left on a checked item to uncheck it.
- User can choose a theme and the result is saved on a php_session (i wanted to avoid saving anything and i wanted to do something simple with no database.
The live app is here: http://checklist.classicgames.com.br/
And you can check the code @ http://github.com/jflores82/simchecklists
This has been fun to do. And i've actually been using it. It reminds me of when i did Retroamp, so many years ago, but nowdays the core of the app isn't 'outsourced' to a library i haven't wrote, all the lines of the code are 100% written by me. :)