// ==UserScript==
// @name         Duolingo - add keyboard support to hiragana exercises
// @namespace    https://github.com/ciekawylogin/
// @version      0.2
// @description  add keyboard support to hiragana exercises, as requested here: https://www.reddit.com/r/duolingo/comments/7v9veq/duolingo_please_do_this_part_keyboard_compatible/
// @author       Michał Artur Krawczak (ciekawylogin@github)
// @match        https://www.duolingo.com/*
// @downloadURL none
// ==/UserScript==

function appendNum(elem, num) {
	var para = document.createElement("p");
	var node = document.createTextNode(num);
        para.className = "mk-keycode";
	para.appendChild(node);
	para.style.cssText = numberStyle;
	elem.style.cssText = buttonStyle;
	elem.appendChild(para);
}

keys = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "q", "w", "e", "r", "t", "y", "u", "i",
        "o", "p", "a", "s", "d", "f", "g", "h", "j", "k", "l", "z", "x", "c", "v", "b", "n", "m"]

function addNumbers() {
        var buttons = Array.from(document.getElementsByClassName("iNLw3"))

	for(i in buttons) {
	    button = buttons[i];
	    appendNum(button, keys[i])
	}
}

numberStyle = "position: absolute;top: 1px;right: 1px;font-size: 7pt;color: gray;padding: 1px 3px;border: 1px solid #ccc;"

buttonStyle = "position:relative;" 

function addEvent(element, eventName, callback) {
    if (element.addEventListener) {
        element.addEventListener(eventName, callback, false);
    } else if (element.attachEvent) {
        element.attachEvent("on" + eventName, callback);
    } else {
        element["on" + eventName] = callback;
    }
}

function simulateClick(control)
{
   // if (document.all)
   // {
        control.click();
   // }
  //  else
  //  {
  //      var evObj = document.createEvent('MouseEvents');
  //      evObj.initMouseEvent('click', true, true, window, 1, 12, 345, 7, 220, false, false, true, false, 0, null );
  //      control.dispatchEvent(evObj);
 //   }
}
addEvent(document, "keypress", function (e) {
    e = e || window.event;
    key = e.keyCode;
    var idx = keys.indexOf(String.fromCharCode((96 <= key && key <= 105)? key-48 : key).toLowerCase());
   
    var buttons = Array.from(document.getElementsByClassName("iNLw3"))

    simulateClick(buttons[idx]);
});

function addNumbersIfNotPresent() {
  var buttonsWithoutCodes = Array.from(document.getElementsByClassName("iNLw3"))
  var buttonsWithCodes = Array.from(document.getElementsByClassName("mk-keycode"))
  if(buttonsWithoutCodes.length > 0 && buttonsWithCodes.length == 0) { 
    addNumbers();
  } 
}

setInterval(addNumbersIfNotPresent, 250);