"use strict";
(function() {
  function domReady(callback) {
      document.readyState === "interactive" || document.readyState === "complete" ? callback() : document.addEventListener("DOMContentLoaded", callback);
  };

  function kaiosPadNav (e) {
    var childElem = document.querySelectorAll('div, a, input, button, select, textarea,li');
    function nav(num) {
      var currentIndex = childElem[num];
      var next = currentIndex + num;
      var items = document.querySelectorAll('.items');
      var targetElement = items[next];
      targetElement.focus();
      console.log("My value: ", targetElement);
    }
    for (var i = 0, len = childElem.length; i < len; i++) {
      childElem[i].className += " items";
      childElem[i].setAttribute('tabindex', i);
      nav(i);
    }

    var handleKeydown = function(e) {
      switch(e.key) {
        case 'ArrowUp':
          nav(-1);
          break;
        case 'ArrowDown':
          nav(1);
          break;
        case 'ArrowRight':
          nav(1);
          break;
        case 'ArrowLeft':
          nav(-1);
          break;
      }
    };
    document.activeElement.addEventListener('keydown', handleKeydown);
  };

  var softkeyCallback = {
    left: function() { /*console.log('You click on SoftLeft')*/ },
    center: function() { /*console.log('You click on Enter')*/ },
    right: function() { /*console.log('You click on SoftRight')*/ }
  };
  function handleKeyDownEvent(evt) {
    switch (evt.key) {
        case 'SoftLeft':
            // Action case press left key
            softkeyCallback.left();
        break;

        case 'SoftRight':
            // Action case press right key
            softkeyCallback.right();
        break;

        case 'Enter':
            // Action case press center key
            softkeyCallback.center();
        break;
    }
  };

  domReady(function() {
    kaiosPadNav();
    document.addEventListener('keydown', handleKeyDownEvent);
  });
})();

@@ -564,62 +564,14 @@
 ();%0A
-      console.log(%22My value: %22, targetElement);%0A
     %7D%0A
+
     
@@ -832,32 +832,79 @@
        nav(-1);%0A
+          console.log('You click on ArrowUp');%0A
           break;
@@ -940,32 +940,80 @@
         nav(1);%0A
+          console.log('You click on ArrowDown')%0A
           break;
@@ -1050,32 +1050,81 @@
         nav(1);%0A
+          console.log('You click on ArrowRight')%0A
           break;
@@ -1161,32 +1161,80 @@
        nav(-1);%0A
+          console.log('You click on ArrowLeft')%0A
           break;
@@ -1367,34 +1367,32 @@
 t: function() %7B 
-/*
 console.log('You
@@ -1411,18 +1411,16 @@
 ftLeft')
-*/
  %7D,%0A    
@@ -1432,34 +1432,32 @@
 r: function() %7B 
-/*
 console.log('You
@@ -1473,18 +1473,16 @@
  Enter')
-*/
  %7D,%0A    
@@ -1505,10 +1505,8 @@
 ) %7B 
-/*
 cons
@@ -1542,10 +1542,8 @@
 ht')
-*/
  %7D%0A 

update keypad console log print