patternjavascriptMinor
Notepad5, a simple HTML5, JavaScript notepad webapp
Viewed 0 times
simplejavascriptwebapphtml5notepadnotepad5
Problem
I made a simple notepad webapp, called Notepad5. You can use it to make notes while browsing the web and don't want to open up a separate application or extension to put the notes down and don't want to store them on an external server (more). Please review the code.
```
/*!
* Notepad5 v1.04
* https://github.com/uddhabh/Notepad5
*/
(function() {
"use strict";
function $(id) { // shortcut for document.getElementById
return document.getElementById(id);
}
// core variables
var customStyle = $("custom-style"),
textarea = $("textarea"),
statusBar = $("status-bar"),
fileInput = $("file-input"),
appname = "Notepad5",
isModified,
filename;
function skipSave() { // warning for saving doc
if (!isModified || !textarea.value || confirm("You have unsaved changes that will be lost.")) {
isModified = false;
return true;
}
}
function changeFilename(newFilename) {
filename = newFilename || "untitled.txt";
document.title = filename + " - " + appname;
}
function updateStatusBar() { // text stats
var text = textarea.value;
statusBar.value = "Words: " + (text.replace(/['";:,.?¿\-!¡]+/g, "").split(/\w+/).length - 1) +
" Characters: " + text.replace(/\s/g, "").length + " / " + text.length;
}
function newDoc(text, newFilename) {
if (skipSave()) {
textarea.value = text || "";
changeFilename(newFilename); // default "untitled.txt"
updateStatusBar();
}
}
function openDoc(event) {
var files = event.target.files || event.dataTransfer.files,
file = files[0],
reader = new FileReader();
if (file) {
event.preventDefault();
reader.addEventListener("load", function(event) {
newDoc(event.target.result, file.name);
});
reader.readAsText(file);
}
}
function saveDoc() {
var newFilename = prompt("Name this document:", filename);
if (newFilename !== null) {
if (newFilename === "") {
chang
```
/*!
* Notepad5 v1.04
* https://github.com/uddhabh/Notepad5
*/
(function() {
"use strict";
function $(id) { // shortcut for document.getElementById
return document.getElementById(id);
}
// core variables
var customStyle = $("custom-style"),
textarea = $("textarea"),
statusBar = $("status-bar"),
fileInput = $("file-input"),
appname = "Notepad5",
isModified,
filename;
function skipSave() { // warning for saving doc
if (!isModified || !textarea.value || confirm("You have unsaved changes that will be lost.")) {
isModified = false;
return true;
}
}
function changeFilename(newFilename) {
filename = newFilename || "untitled.txt";
document.title = filename + " - " + appname;
}
function updateStatusBar() { // text stats
var text = textarea.value;
statusBar.value = "Words: " + (text.replace(/['";:,.?¿\-!¡]+/g, "").split(/\w+/).length - 1) +
" Characters: " + text.replace(/\s/g, "").length + " / " + text.length;
}
function newDoc(text, newFilename) {
if (skipSave()) {
textarea.value = text || "";
changeFilename(newFilename); // default "untitled.txt"
updateStatusBar();
}
}
function openDoc(event) {
var files = event.target.files || event.dataTransfer.files,
file = files[0],
reader = new FileReader();
if (file) {
event.preventDefault();
reader.addEventListener("load", function(event) {
newDoc(event.target.result, file.name);
});
reader.readAsText(file);
}
}
function saveDoc() {
var newFilename = prompt("Name this document:", filename);
if (newFilename !== null) {
if (newFilename === "") {
chang
Solution
using something like this would shorten up your fullscreen stuff...
.. other than that, I don't see anything particularly wrong with it, though. Perhaps an assumption that it can't be used on mobile, and that it can't work on a browser that doesn't have File, might be a problem, but that's not with the code.
var fullScreen = {
request: elem.requestFullScreen || elem.msRequestFullScreen || elem.mozRequestFullScreen || elem.webkitRequestFullScreen,
exit: elem.exitFullScreen || elem.msExitFullScreen || elem.mozExitFullScreen || elem.webkitExitFullScreen
}.. other than that, I don't see anything particularly wrong with it, though. Perhaps an assumption that it can't be used on mobile, and that it can't work on a browser that doesn't have File, might be a problem, but that's not with the code.
Code Snippets
var fullScreen = {
request: elem.requestFullScreen || elem.msRequestFullScreen || elem.mozRequestFullScreen || elem.webkitRequestFullScreen,
exit: elem.exitFullScreen || elem.msExitFullScreen || elem.mozExitFullScreen || elem.webkitExitFullScreen
}Context
StackExchange Code Review Q#79625, answer score: 2
Revisions (0)
No revisions yet.