Created
May 8, 2013 19:08
-
-
Save geoffmomin/5542808 to your computer and use it in GitHub Desktop.
SPAN: Simple Persistent Application for Note-taking. Download it and use it for whatever you want.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> <!--Sets the document type to HTML--> | |
<html> <!--Now we begin describing the web page--> | |
<script> <!-- We are using inline javascript. That is Javascript inside HTML //--> | |
var note, html, timeout; <!-- Set the variables //--> | |
window.addEventListener('load', function() { | |
note = document.getElementById('note'); | |
html = document.getElementsByTagName('html')[0]; | |
html.addEventListener('keyup', function(ev) { | |
if (timeout) clearTimeout(timeout); | |
timeout = setTimeout(saveNote, 100); | |
}); | |
restoreNote(); | |
note.focus(); | |
}); | |
function saveNote() { | |
localStorage.note = note.innerText; | |
timeout = null; | |
} | |
function restoreNote() { | |
note.innerText = localStorage.note || ''; | |
} | |
</script> | |
<h1>Quick Notepad</h1> | |
<p id="note" contenteditable></p> | |
<style> /*This begins our styling*/ | |
html,body { height: 100%; } /*Gives our page the maximum height*/ | |
#note { width: 100%; height: 100%; font-family: Garamond; text-align: left} /*Gives our note box a maximum height and width. Plus aligns text to the left and sets font to Garamond.*/ | |
h1 {text-align: center; font-family: Arial} /*Centers our title and sets font to Arial*/ | |
</style> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment