Freecodecamp: [beta] feature suggestion - "Previous Challenge" Hotkey

[no-stack-dub-sack]

I know everyone is swamped and there is a ton to do right now, but I thought I would bring this up...

With the removal of the foldaway map that we are all used to on the production site, navigating around challenges has become a bit more difficult. While the map loads very quickly, and is fairly easy to navigate around (although I wish it would save your spot when you navigate away from it — i.e. autoscroll you to the section from which you last clicked a challenge), sometimes, someone might just have a need to go back one challenge to look at a concept that ties in to the challenge they are working on (as many of our new challenges are now sequential).

@freeCodeCamp/moderators what do we think about adding a "Previous Challenge" button which would allow this? Shouldn't be all that crazy to implement, and I think it would mark a major improvement until further plans to improve navigation are implemented.

[dhcodes]

I actually thought about this the other day. I agree we should try to make this happen.

[no-stack-dub-sack]

@dhcodes sweet! Glad I'm not alone. In QAing these challenges, this would have been super useful, and QAing them is basically working through them like anyone else would, so I can see this being appreciated for the everyday FCC workflow

[HKuz]

Great suggestions @no-stack-dub-sack - I'm working on edits to fix sequencing issues in the catPhotoApp CSS challenges, and this would make checking my work a lot easier. I can imagine campers working through a set of challenges may want to pop back quickly to grab a method name, or check an example. 👍

[no-stack-dub-sack]

@HKuz Exactly! I'm experiencing the same thing in the sections I am working on. But I see this being useful beyond just our own work in fixing these up for the reasons you mentioned and more

[dhcodes]

Any reason not to also have a "next challenge" button?

[no-stack-dub-sack]

@dhcodes Well, the "Run Tests" button already basically is that. Still want campers to have to pass before proceeding I guess?

[no-stack-dub-sack]

I will attempt to implement the "Previous Challenge" button, but we'll see if I'm able. I will report back here once I've experimented a bit since I think we need a few more up-votes before committing to this officially

[QuincyLarson]

@no-stack-dub-sack rather than a previous and next challenge buttons, we are planning to re-implement the side-map, but make it a lot better. We want a searchable side map similar to devdocs.io's. I've built a crude wireframe here: http://codepen.io/freeCodeCamp/pen/qRmMEq

@benmcmahon100 is currently working on this.

I may have shown you all this interface before, but I'm curious what you all think of it and whether it would obviate the need for us to add next/previous buttons (my goal so far has been to minimize the number of buttons and elements to keep things clean and simple, instead opting to create hotkeys for power users).

[no-stack-dub-sack]

@QuincyLarson as I mentioned to @raisedadead when we were discussing this the other day, I think this is a great idea, and I can't wait to see it in action! However, I guess the concern is, will this be implemented by the time the rest of the curriculum update goes to production, or is this an improvement that we're looking at a while down the road?

Even if its not too far off, a hotkey at the minimum would be great for "previous challenge" functionality just for those of us working on QAing as I'm sure @HKuz can agree :smile: it would be a major workflow improvement

[systimotic]

@no-stack-dub-sack I'd like to see a hotkey for previous challenge as well. I think this would be useful for Ben too. We're going to need this functionality for that update anyway, so I think it would be good to focus on that here. 👍

[HKuz]

+1000 for a hot-key! It would definitely be a great QA workflow improvement 😄 . More importantly, I think it'd be a nice UX feature for campers (particularly keyboard users), especially in certain sections where concepts carry over several challenges. For example, (when the React challenges get ported in), someone may need to quickly go back and check how to write the constructor because they forgot the syntax. I can't wait to see the new map - if there's a quick way to jump in/out of it with the keyboard, that could help, too.

[no-stack-dub-sack]

@HKuz @systimotic @QuincyLarson ok, cool! I'll give this a try then, and see what I can come up. No promises I'll be able to do it, but I'll keep you guys posted here

EDIT: hmmm... I think I might be a bit out of my league with this one, I would guess there needs to be some redux work done to make this happen, and I'm not that great with redux just yet. There's a getNextChallenge function in common/app/routes/challenges/utils that is perhaps of some use if it can be refactored to get previous challenge instead, but I'm a little lost on how to implement this so that the hotkey correctly harnesses the right challenge. So far all I've been able to do is create a new hotkey (experimented by just setting it to navigate to the map).

I tried basing a solution off of the gnn hotkey for "next challenge", however it's worth noting that that hotkey is broken:

The challenge var in common/app/routes/challenges/redux/selectors.js is undefined and that seems to be the route of the issue.