"TypeError: keyboard is undefined" error

[nhouse]

Hi Mottie,

I'm working on a hobby project using your keyboard and have run into an issue.

I have the following code when the keyboard is being created:

change : function(e, keyboard, el)
{
    checkWord(keyboard.$preview.val());
}

But sometimes Firebug shows the following error in the console:

TypeError: keyboard is undefined

And it points to the line of code inside the change callback.

I think this error is resulting the in the checkWord() function not being run, and it might also be causing another problem as well (when a number of divs are clicked, I have onclick handlers that have $("#keyboard").focus(); in them, but the focus isn't returned to the text input when the error shows up in the console).

Here is my page: http://tinyurl.com/bqddgjl

Do you have any idea why this might be happening?

[Mottie]

Hmm, I think the problem is that the change callback function is actually attached to the input, so when the built-in change event is fired, there is no keyboard object. I'll need to fix that =/

In the mean time, after looking at what you're trying to do, it might be better if you didn't use the preview window. So, set the usePreview option to false. Then inside your change function do this:

$(function(){
  var $kb = $('#keyboard').keyboard({
    layout       : 'custom',
    customLayout : {[ ... ]},
    alwaysOpen   : true,
    useCombos    : false,
    change : function(){
      checkWord( $kb.val() );
    }
  });
});

I'll fix the change callback function in the next update.

[nhouse]

Thanks for your help! That eliminated the javascript error, but adding the usePreview : false, option results in the keyboard covering up the input until either:

1. I click outside of the keyboard (anywhere else on the page) and then click a button on the keyboard, at which point the keyboard jumps down.
2. I start typing on my physical keyboard (while the input is still covered up), at which point the keyboard jumps down.

Demo: http://tinyurl.com/bqddgjl

[Mottie]

Hmm, that is weird too! LOL

Well, it seems that the jQuery UI position utility isn't positioning the keyboard in the right place, so I guess we could add this function to give it a little kick start. It's not ideal, but I don't have that much time right now to troubleshoot that problem.

$(function(){
  var $kb = $('#keyboard').keyboard({
    layout       : 'custom',
    customLayout : {[ ... ]},
    alwaysOpen   : true,
    useCombos    : false,
    change : function(){
      checkWord( $kb.val() );
    },
    initialized : function() {
      $(window).resize();
    }
  });
});