Backspace logic could be improved with a loop or "each" function

[joejohnmurphy]

In talker.js, there is code to move focus to the previous button with Backspace is pressed. This could be made a lot tidier and transportable if there is some looping logic to apply, or maybe use of the each() function that @plbrownrti suggested. I haven't been able to figure out anything better than the following type of setup to this point:

// Go back using Backspace - see if this can be made into a loop
            if (evt.keyCode == 8) {
                fired = true;
                    evt.preventDefault();

                if ($(':focus').hasClass('b')) {
                    $('.a').focus();
                }

                if ($(':focus').hasClass('c')) {
                    $('.b').focus();
                }

                if ($(':focus').hasClass('d')) {
                    $('.c').focus();
                }

[Drizej]

Hi Joe, I have come up for a solution for this in calc.js, which can be used in talker.js as well. However I do not have permissions to add a new branch. Can you give me permissions to push to a new branch?

[Drizej]

Also, I had a question. Is there a reason why we can't use the tabindexes in the talker pages in numerical order like we are doing on the calculator page? That would be a good solution for the backspace problem on those pages. There are other solutions if this change would break other things though.

[joejohnmurphy]

Hi, Andrzej - I reviewed the code and remember why I moved away from iterating the tabindex and just made them all tabindex=1 (except for the "up" button which is tabindex=0). The reason was that when focus is on the "up" button and the user hits Backspace I wanted it to go back to the previous button, regardless of what tabindex it had. By making them all 1, they still get focus in order when pressing Tab and then the reference to tabindex=1 (line 339 in talker.js) in the following code doesn't need to change because it just goes the the last button with tabindex=1:

if ($(':focus').hasClass('up')) {
                    $('.btn[tabindex=1]').focus();

But I'm sure there's a better way to do this! Looking forward to seeing your solution!

[Drizej]

Hi Joe, I added a fix for this on the calculator and talker pages to the develop branch. I am using an ordered tabindex. You can see how I am handling the backspace press event in calc.js and talker.js

Let me know if this causes any issues to either the talker or calculator!

[joejohnmurphy]

Backspace press event with ordered tabindex seems to work perfectly!