Skip to content

Commit

Permalink
v3.1.0:
Browse files Browse the repository at this point in the history 
   - fixed horizontal scroll bar resulting from long URLs or text strings
   - added clock to status bar
   - removed time stamp option
   - corrected timer action on option changes
   - changed custom coordinates display style
   - scroll position is saved when reloading same note
   - repositioned backup and undelete buttons on options screen
  • Loading branch information
@freginold
freginold authored Nov 18, 2016
1 parent 74a5434 commit bbf2eb1
Show file tree
Hide file tree
Showing 3 changed files with 87 additions and 39 deletions.
29 changes: 26 additions & 3 deletions _note.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,9 @@ h4 {
display: inline-block;
line-height: 1.1em;
margin-bottom: 0.4em;
hyphen: auto;
word-wrap: break-word;
word-break: break-word;
}
.optionsColumn {
margin-left: 5px;
Expand Down Expand Up @@ -120,6 +123,9 @@ h4 {
border-top: 4px solid white;
cursor: pointer;
}
.overflowClass {
word-break: break-all;
}
#noteList {
display: block;
margin: 5px;
Expand Down Expand Up @@ -170,21 +176,24 @@ h4 {
margin-left: 25px;
}
#optionsSpacer {
margin-top: 2em;
margin-top: 1em;
padding: 1px;
}
#backupButton {
margin: 1px 0px 3px 0px;
}
#statusBar {
display: inline-block;
font-size: 0.9em;
font-style: italic;
position: fixed;
bottom: 0px;
margin: 2px 2px 10px 1px;
width: 98%;
}
#statusBarText {
display: inline-block;
font-size: 0.9em;
font-style: italic;
}
#backupDiv {
padding-left: 10px;
margin-left: 25px;
Expand All @@ -199,3 +208,17 @@ h4 {
#backupText {
text-decoration: underline;
}
#clock {
display: inline-block;
font-size: 1em;
font-family: sans-serif;
position: fixed;
bottom: 0px;
right: 5px;
margin: 5px;
padding: 4px;
}
#clockText {
font-size: 0.8em;
font-family: serif;
}
82 changes: 56 additions & 26 deletions _note.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ var newNoteInputBox = document.getElementById('newNoteInputBox');
var coords = document.getElementById('coords');
var undeleteButton = document.getElementById('undeleteButton');
var statusBar = document.getElementById('statusBar');
var statusBarText = document.getElementById('statusBarText');
var localFontDiv = [
document.getElementById('localFontDiv0'),
document.getElementById('localFontDiv1'),
Expand Down Expand Up @@ -71,15 +72,18 @@ var moveButtonsHTMLBeg = "<button class='moveButtons smallFont uBut' id='u";
var moveButtonsHTMLMid = "' onclick='MoveUp(this)'>&uarr;</button> <button class='moveButtons smallFont dBut' id='d";
var moveButtonsHTMLEnd = "' onclick='MoveDown(this)'>&darr;</button>";
var lineStartHTML = "<span class='serif'>&sdot; </span>";
var statusBarHTML = "<hr>&nbsp;";
var statusBarHTML = "&nbsp;";
var noteFont = 'serif';
var fgColor = 'black';
var firstCoordCheck = true;
var selectedFlag = [false, false, false, false];
var uneditedString = '';
var currentVer = 'Note v' + Note.version + '\nPublic Domain';
var noteText, currentNote, dummyVar, bgColor, i, currentX, currentY, oldX, oldY, offsetX, offsetY;
var lastLine, itemToEdit, itemTotal, statusTimer;
var timer = 0;
var lastScrollPos = 0;
var currentNote, dummyVar, bgColor, i, currentX, currentY, oldX, oldY, offsetX, offsetY;
var lastLine, itemToEdit, itemTotal, statusTimer, prevNote;
var done;


// ------- declare functions ----------
Expand Down Expand Up @@ -119,6 +123,7 @@ function applyOptions() {
}
document.body.style.backgroundColor = bgColor;
document.body.style.color = fgColor;
document.getElementById('clock').style.color = fgColor;
switch (Opt3) {
case "uf0":
noteFont = Opt5;
Expand Down Expand Up @@ -150,9 +155,6 @@ function applyOptions() {

function saveOptions() {
// save options to disk on change
// option 1 - time stamp
if (document.getElementsByName('timeStamp')[1].checked) { Opt1='show'; }
else { Opt1 = 'hide'; }
// option 2 - background color
if (document.getElementsByName('bg')[0].checked) { Opt2 = 'gray' }
else if (document.getElementsByName('bg')[1].checked) { Opt2 = 'yellow'; }
Expand Down Expand Up @@ -214,8 +216,6 @@ function showOptions() {
document.getElementsByTagName('td')[i].style.width = (document.documentElement.clientWidth / 3);
}
}
if (Opt1 == 'show') { document.getElementsByName('timeStamp')[1].checked=true; }
else { document.getElementsByName('timeStamp')[0].checked=true; }
switch (Opt2) {
case "gray":
document.getElementsByName('bg')[0].checked=true;
Expand Down Expand Up @@ -298,17 +298,21 @@ function clearAll() {
}

function showNotes(cNote) {
// load note file
clearAll();
prevNote = currentNote;
currentNote = cNote;
editing = false;
window[currentNote].className='noteButton activeNote';
noteText='';
noteText = getLines(currentNote);
var currentNoteDisplay = currentNote;
if (currentNote == "&") { currentNoteDisplay = "&#38;"; } // to deal w/ & as only char in title
noteTitle.innerHTML = "<div id='delBox'>" + renButtonHTML + delButtonHTML + "</div>" + currentNoteDisplay;
noteBody.innerHTML = noteText;
noteBody.scrollTop = 0;
getLines(currentNote);
if (currentNote == prevNote) {
// if reloading the same note
noteBody.scrollTop = lastScrollPos;
}
else { noteBody.scrollTop = 0; }
var firstBut = document.getElementById('u0');
var lastBut = window['d' + (lastLine-1)];
if (firstBut != null) {
Expand All @@ -326,8 +330,8 @@ function showNotes(cNote) {
}

function getLines(thisNote) {
// loop through file, get each line from note and add X to it, return HTML as noteText
var notesHTML="<div><table id='itemTable'>";
// loop through file, get each line from note and add X and arrow buttons to it, wrap it in a <tr> and add it to the HTML
noteBody.innerHTML = noteBody.innerHTML + "<div><table id='itemTable'>";
var currentLine;
var noteNum = 0;
lastLine = 0;
Expand All @@ -345,14 +349,14 @@ function getLines(thisNote) {
// check input string for < or >, repl w/ &gt; or &lt;
currentLine = currentLine.replace(/</g, "&lt;");
currentLine = currentLine.replace(/>/g, "&gt;");
notesHTML = notesHTML + "<tr class='" + currentClasses + "' id='item" + noteNum + "'" + localFontHTML + "><td>" + xElBeg + noteNum + xElEnd + "&nbsp;&nbsp;" + moveButtonsHTMLBeg + noteNum + moveButtonsHTMLMid + noteNum + moveButtonsHTMLEnd + lineStartHTML + "</td><td id='text" + noteNum + "' ondblclick='goEdit(this);'>" + currentLine + "</td></tr>";
noteBody.innerHTML = noteBody.innerHTML + "<tr class='" + currentClasses + "' id='item" + noteNum + "'" + localFontHTML + "><td>" + xElBeg + noteNum + xElEnd + "&nbsp;&nbsp;" + moveButtonsHTMLBeg + noteNum + moveButtonsHTMLMid + noteNum + moveButtonsHTMLEnd + lineStartHTML + "</td><td id='text" + noteNum + "' ondblclick='goEdit(this);'>" + currentLine + "</td></tr>";
checkOverflow("item" + noteNum);
noteNum++;
}
}
itemTotal = noteNum;
CloseRFile(currentNote);
notesHTML=notesHTML + "</table></div>";
return notesHTML;
noteBody.innerHTML = noteBody.innerHTML + "</table></div>";
}

function onSubmitted(tempVar) {
Expand Down Expand Up @@ -469,7 +473,7 @@ function displayAbout() {
}

function checkCoords() {
// check current coordinates, also check current size to adjust div heights, also check status timer
// check current coordinates, also check current size to adjust div heights
if ((screen.availHeight > 650) && (document.documentElement.clientHeight > 380)) {
noteBody.style.height = document.documentElement.clientHeight - 350;
optionsDiv.style.height = document.documentElement.clientHeight - 300;
Expand Down Expand Up @@ -500,10 +504,18 @@ function checkCoords() {
}
}
else { firstCoordCheck = false; }
if ((Opt12 == 'show') && (statusBar.innerHTML != statusBarHTML)) {
}

function checkTimer() {
// check status timer & clock
if (statusBarText.innerHTML != statusBarHTML) {
statusTimer = statusTimer + 0.5;
if (statusTimer > 6.5) { clearStatus(); }
}
timer = timer + 0.5;
if (timer % 10 == 0) { getTime(); }
if (timer >= 1000) { timer = 0; }
checkCoords();
}

function getCoords() {
Expand All @@ -513,7 +525,7 @@ function getCoords() {

function showCoords() {
getCoords();
coords.innerText = "(x: " + (currentX - offsetX) + ", y: " + (currentY - offsetY) + ")";
coords.innerText = "[" + (currentX - offsetX) + ", " + (currentY - offsetY) + "]";
}

function getOffset() {
Expand Down Expand Up @@ -562,17 +574,15 @@ function insertItem() {
function showStatus(statusStr) {
// show a status message at bottom of window
if (Opt12 == 'show') {
statusBar.innerHTML = '<hr>' + statusStr;
statusBarText.innerHTML = statusStr;
statusTimer = 0;
}
}

function clearStatus() {
// clear status bar
if (Opt12 == 'show') {
statusBar.innerHTML = statusBarHTML;
statusTimer = 0;
}
statusBarText.innerHTML = statusBarHTML;
statusTimer = 0;
}

function focusInput() {
Expand Down Expand Up @@ -611,6 +621,22 @@ function abbrevBackup(rawText) {
return rawText.slice(0, 23) + " ... " + rawText.slice(rawText.length-24);
}

function getTime() {
// get current time & display it
var nowDate = new Date();
var nowTime = nowDate.toLocaleTimeString();
var timeSections = nowTime.split(":");
document.getElementById('clock').innerHTML = timeSections[0] + ":" + timeSections[1] + " " + "<span id='clockText'>" + timeSections[2].slice(-2) + "</span>";
}

function checkOverflow(thisLine) {
// check to see if just-added line causes horizontal scroll
if (noteBody.scrollWidth > noteBody.offsetWidth) {
document.getElementById(thisLine).className = document.getElementById(thisLine).className + " overflowClass";
}

}


// ----------- declare event handlers ----------

Expand Down Expand Up @@ -661,11 +687,15 @@ for (i=0;i<localFontBox.length;i++) {
}
}

// to get current scroll position:
noteBody.attachEvent('onscroll', function() { setTimeout(function(){lastScrollPos = noteBody.scrollTop;}, 250); });


// --------- execution -----------------

clearAll();
getOffset();
applyOptions();
setPos();
var checkCoordsInt = setInterval(checkCoords, 500);
var checkTimerInt = setInterval(checkTimer, 500);
getTime();
15 changes: 5 additions & 10 deletions note.hta
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@
Scroll = no
Icon = "note_icon.ico"
navigable = no
version = "3.0.4"
version = "3.1.0"
>
<title>Note</title>
<link href='_note.css' rel='stylesheet' type='text/css'>
Expand Down Expand Up @@ -54,10 +54,8 @@
<br />
<table><tr>
<td class='optionsColumn'>
<h4>Time Stamp:</h4>
<label><input type='radio' name='timeStamp' class='optionInput' value='Hide' /> Hide&nbsp;<span class='goItalic'>(default)</span></label><br />
<label><input type='radio' name='timeStamp' class='optionInput' value='Show' /> Show</label>
<br /><br />
<button id='undeleteButton' onclick='Undelete()' disabled=true>Restore last deleted item</button><br />
<button id='backupButton' onclick='dispBackupDiv();'>Backup...</button>
<h4>Background Color:</h4>
<label><input type='radio' name='bg' class='optionInput' value='gray' /> Gray &nbsp;<span class='goItalic'>(default)</span></label><br />
<label><input type='radio' name='bg' class='optionInput' value='yellow' /> Yellow</label><br />
Expand Down Expand Up @@ -125,14 +123,11 @@
<td class='optionsColumn'>
<h4>Screen Position:</h4>
<label><input type='radio' name='screenPos' class='optionInput' value='mm'> Centered &nbsp;<span class='goItalic'>(default)</span></label><br />
<label><input type='radio' name='screenPos' class='optionInput' value='cc'> Custom <span id='coords' class='smallFont'></span>
<label><input type='radio' name='screenPos' class='optionInput' value='cc'> Custom: <span id='coords' class='smallFont'></span>
<br /><span class='smallFont'>&ensp;&emsp;&emsp;(Drag to desired position)</span></label>
<h4>Status Bar:</h4>
<label><input type='radio' name='statusOption' class='optionInput' value='Hide' /> Hide</label><br />
<label><input type='radio' name='statusOption' class='optionInput' value='Show' /> Show&nbsp;<span class='goItalic'>(default)</span></label>
<div id='optionsSpacer'></div>
<button id='backupButton' onclick='dispBackupDiv();'>Backup...</button><br />
<button id='undeleteButton' onclick='Undelete()' disabled=true>Restore last deleted item</button>
</td>
</tr></table>
</div>
Expand All @@ -150,7 +145,7 @@
<button onclick='Backup()'>Backup</button><br />
</div>

<div id='statusBar'><hr>&nbsp;</div>
<div id='statusBar'><hr><div id='statusBarText'>&nbsp;</div><div id='clock'></div></div>

<script language='vbscript' src='_note.vbs'></script>
<script language='javascript' src='_note.js'></script>
Expand Down

0 comments on commit bbf2eb1

Please sign in to comment.