var ixcursor = 0; var idCursorObject; function scrollToMakeVisible0 (idObjToMakeVisible) { //your mission --> fill in the body of this routine //it should scroll vertically, if necessary, to make the cursor object fully visible } function scrollToMakeVisible1 (idObjToMakeVisible) { //thanks to ouchiko for this solution -- //https://github.com/scripting/Scripting-News/issues/116#issuecomment-489785801 var el = document.getElementById (idObjToMakeVisible); var t = el.offsetTop; var h = el.offsetHeight; var j = parseInt (window.scrollY) + parseInt (window.innerHeight); if (t < window.scrollY) { window.scrollTo (0, (window.scrollY - h)); } else { if ((t+h) >= j) { window.scrollTo (0, (window.scrollY + h)); } } } function scrollToMakeVisible (idObjToMakeVisible) { //thanks to tommy-carlier for this solution -- //https://github.com/scripting/Scripting-News/issues/116#issuecomment-489985995 var el = document.getElementById (idObjToMakeVisible); el.scrollIntoView ({ behavior: "smooth", block: "nearest"}); } function viewCardList () { var ixcard = 0; var htmltext = "", indentlevel = 0; function add (s) { htmltext += filledString ("\t", indentlevel) + s + "\n"; } function addSuit (suitletter) { //S, H, D, C for spades, hearts, diamonds, clubs function addCard (cardletter) { var fname = "images/" + cardletter + suitletter + ".png", cursorclass = "", id = "img" + ixcard; console.log (fname); if (ixcard == ixcursor) { cursorclass = " divCursorImg "; idCursorObject = id; } var clickscript = "moveCursorTo (" + ixcard + ")"; add ("
"); ixcard++; } addCard ("2") addCard ("3") addCard ("4") addCard ("5") addCard ("6") addCard ("7") addCard ("8") addCard ("9") addCard ("10") addCard ("J") addCard ("Q") addCard ("K") addCard ("A") } addSuit ("S"); addSuit ("H"); addSuit ("D"); addSuit ("C"); $("#idCardList").html (htmltext); } function moveCursorTo (ix) { ixcursor = ix; viewCardList (); //also sets idCursorObject scrollToMakeVisible (idCursorObject); } function moveCursorDown () { if (ixcursor >= 51) { speakerBeep (); } else { moveCursorTo (ixcursor + 1); } } function moveCursorUp () { if (ixcursor <= 0) { speakerBeep (); } else { moveCursorTo (ixcursor - 1); } } function startup () { console.log ("startup"); viewCardList (); $("body").keydown (function (ev) { console.log ("keydown == " + ev.which); switch (ev.which) { case 38: //up arrow moveCursorUp (); break; case 40: //down arrow moveCursorDown (); break; } ev.stopPropagation (); ev.preventDefault (); }); }