This week I finished up the vue.js port of the rubik's cube trainer I started last week, and I must say, it's better :)

I'm starting to suspect basically all of the problems (minus some confusion) with angular have to do with my ignorance of the module system/packer they were using in the tutorials. But in either case, the "get up and go and don't feel like an idiot" experience was much better with vue, especially due to their cli templates (in particular, I went with the webpack template). The framework felt lighter-weight, and I found it a bit easier to understand how the various bits fit together. I think that also had to do with the fact that it was all done in plain JS (or ES6, rather); not that typescript was much of a leap linguistically, but some of the extra env setup required messed with my head a bit for sure.

It wasn't without problems, though. For example, deploying the app on github pages was an issue with both frameworks. In the end, for asset resolving, I ended up hacking a bit in the vue template to get assets to resolve both locally and in a "subdir" on gh-pages (see this github comment for more info), and I also had some trouble with the "magic reactivity" that vue provides. That boiled down to "you need to use the property for it to be computed" more or less, which sounds pretty familiar to me coming from working on Fuse and it's Observable-based databinding system, but it was pretty frustrating, as that piece of information didn't seem to be mentioned anywhere in the doc's, and because a lot of the reactive stuff in vue is automatic, it was pretty tough to understand what was going on and nail it down. Finally, doing any sort of routing was basically out of the question without some nasty hacks due to page resolving on gh-pages being pretty gimped, so I ended up just dumping all the components in the main page all the time and toggling their visibility. This has a couple added benefits; it's fast as hell to switch pages (no routing/re-rooting necessary), everything's preloaded, the server-side setup is basically nonexistent, and views are guaranteed to preserve state when navigation between them (something I actually have no idea about when using vue-router), and the code to do it wasn't that bad, so it worked out pretty well. It did, however, mean that getting input events to the right view for the alg practice components was a bit harder, but it worked out in the end.

So it was a bit of a journey, but alas, I was triumphant, and she's live! Check out my assistant :) Other than the obvious lack of "how the fuck do I use this text" it's pretty nice for me to use, and that's what counts!

Basically, the whole thing is a trainer for the algorithms required to use CFOP. Over the course of the last few years I've hammered on these a few times, and now thanks to this trainer, I'm really close to finally having them all internalized :)

The Algorithms view just shows all of the algorithms. The OLL and PLL practice views work like this:

• User presses spacebar
• Seconds countdown from 3 starts
• When there's 1 second left, an image representing an algorithm is shown
• When the counter reaches 0, it starts counting up instead. At this point, the user performs the algorithm on their own cube
• When the user finished performing the algorithm, they hit spacebar again to stop the timer
• The timer freezes, displaying the time taken to perform the algorithm, and the algorithm details are shown below. This is helpful especially in cases where the user couldn't actually remember the algorithm properly and/or got a bad time, then they can practice as much as they want with it before moving on.
• Hitting spacebar again repeats the process.

The idea behind the practice views is to get the user to practice random algorithms, not just their favorite ones or any of them in a particular order. I've found this technique to be extremely effective, and actually gets more effective as more algorithms are memorized, because it really helps internalize them.

Also, our company had an internal hackathon this week, so I went ahead and implemented a mobile version as well! You can see that here. It's source-only for now; perhaps if I add more to it/rebrand with all-original assets which I own I can put it up on the stores etc, but for now this will do for me, which is still the important bit :)

I also got myself moved into our company's new Palo Alto house, which is a big improvement over the apartment we had previously, but more importantly, was exhausting and sucked up a ton of time this week. Nevertheless, feels great to still get something done and another project "out the door" so to speak, and by door I mean my headspace, or something, I think :)

Last Edited on Mon Jun 20 2016 01:52:37 GMT-0400 (EDT)