Jump to content

alexpnd

Members
  • Posts

    11
  • Joined

  • Last visited

alexpnd's Achievements

Newbie

Newbie (1/7)

2

Reputation

  1. Change this document.getElementById("myTextArea").defaultValue += kp + " | " + d + " | " + "n";to thisdocument.getElementById("myTextArea").value += kp + " | " + d + " | " + "n";and for your numpad issue change onkeyup to onkeypress in your body (again). They seem to handle keycodes differently.
  2. I changed the event binding from onkeypress to onkeyup in order to capture the ESCAPE key as the default "stop logging" button. If you don't want to use the escape key then you can use a button and go back to keypress. I use a global "loggingEnabled" boolean to determine whether or not to log keys as they come in. Finally I detect to show the log using some style properties "block" can be thought of as "visible".Edit: I see you want notes interspersed as well. The trouble is now that you are mixing formats. You want two different outputs, one HTML and one CSV. The CSV you'll use for excel and HTML you'll use while your using the tool. I would log everything into an array interspersing notes and keystrokes data, and then I would create a function outputting notes + keystrokes data, and one for just keystrokes (for your Excel). PM if you need help. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta content="text/html; charset=utf-8" http-equiv="Content-Type" /><title>Key Events 01</title></head><body onkeyup="myFunction(event)"><p id="demo">The key pressed is is: null. The time is: 0:00:00 AM</p> <a href="#" id='show-log' onclick="toggleLogDisplay();">Toggle Log Display</a><pre id='log' style="display:none">key, timestamp<pre> <script>var loggingEnabled = true;function myFunction(event) { var kp = event.which || event.keyCode;//returns the unicode number if (kp == 27){//escape key to disable loggingEnabled = !loggingEnabled; document.getElementById("demo").innerHTML = "Disabled"; } if (!loggingEnabled){ return; } var kp = String.fromCharCode(kp);//converts the unicode number to the key value var d = new Date(); var d = d.toLocaleTimeString(); document.getElementById("demo").innerHTML = "The key pressed is is: " + kp + ". The time is: " + d; //Add to the log, since it's in a <pre> tag we can use newlines and they will be displayed as well document.getElementById("log").innerHTML += kp + "," + d + "n";}function toggleLogDisplay(event){ var el = document.getElementById('log'); var style = el.style.display; el.style.display = style == "block" ? "none" : "block"; event.preventDefault();//we don't want the browsers default link behavior}</script></body></html> ---www.introtojavascript.comwww.rapineda.com - software consulting
  3. Have you tried instead console.log()? --- www.introtojavascript.com
  4. You can use the localStorage API to store pages you've already visited. //set page to an empty array, simpler syntaxvar page = [];page[0]="spelopdracht1.html";page[1]="spelopdracht2.html";page[2]="spelopdracht3.html";page[3]="spelopdracht4.html";page[4]="spelopdracht5.html";page[5]="spelopdracht6.html";page[6]="spelopdracht7.html";page[7]="spelopdracht8.html";page[8]="spelopdracht9.html";page[9]="spelopdracht10.html";page[10]="spelopdracht11.html";page[11]="spelopdracht12.html";page[12]="spelopdracht13.html";page[13]="spelopdracht14.html";page[14]="spelopdracht15.html";page[15]="spelopdracht16.html";page[16]="spelopdracht17.html";page[17]="spelopdracht18.html";page[18]="spelopdracht19.html";page[19]="spelopdracht20.html";page[20]="spelopdracht21.html";//get our data from local storage, it's a stringvar pagesAlreadyVisited = window.localStorage.getItem('pagesAlreadyVisited');if (pagesAlreadyVisited){ //convert comma delimited list to array //eg. "4,5,9" to [4,5,9] pagesAlreadyVisited = pagesAlreadyVisited.split(","); //iterate through each page we already visited pagesAlreadyVisited.forEach( function(pageIndex){ //remove this page from pages since we don't want to visit it //splice removes it from the array completely //play around with splice to understand how it works, its tricky! page.splice(pageIndex,1); });} else { //if pagesAlreadyVisited is null, empty or undefined pagesAlreadyVisited = [];//set to empty array, we may use it later}//moved howMany down here, after all pages processing is completehowMany = page.length;function getRandPage(){ //get our random page, use Math.floor instead of parseInt. var randIndex = Math.floor(Math.random()*howMany); var randPage = page[randIndex]; //add page index to visited array pagesAlreadyVisited.push(randIndex); //convert array to string so we can store in localStorage var pagesAlreadyVisitedString = pagesAlreadyVisited.join(); window.localStorage.setItem('pagesAlreadyVisited',pagesAlreadyVisitedString); return randPage;}quox = getRandPage();window.location=(quox);console.log(pages.length);//number of unread pages remaining Browser compatibility for localStorage is great these days:http://caniuse.com/#feat=namevalue-storage More resources:https://developer.mozilla.org/en-US/docs/Web/API/Window/localStoragehttps://developer.mozilla.org/en-US/docs/Web/API/Web_Storage_API
  5. I'm looking for writers who wish to touch on topics on and around JavaScript. I take your work and add additional context to it. The goal of the site is not to be a reference directly but to use annotations for reference and further reinforcing of ideas. Articles are to be informal. If you are interested I can invite you to the platform. You can add your post signature including a picture of yourself, occupation and link to your website for each post that is successfully published. www.introtojavascript.com
  6. There is nothing special about those attributes. In HTML you are allowed to have whatever attributes you like ( not by the specification, but by the implementation). The data- type attributes are simply a way they are trying to standardize custom attributes. A standard attribute would be something like your "src". Non-standard or custom would be whatever you would like, eg. "data-ourtext". If you are working with web components you can do something internally with them, otherwise you'll need some JavaScript or JQuery to grab the attribute and do something with it. eg. in jQuery $('#myelement').data('ourtext'); in JavaScript document.querySelector('#myelement').getAttribute('data-ourtext'); Notice how jquery has a predefined data() method? It's for your convenience.
×
×
  • Create New...