Skip to content

Commit

Permalink
v3.2.3-
Browse files Browse the repository at this point in the history 
   - changed new note div from relative to absolute to remove vertical shifting on note display
   - added "collapse all" & "expand all" buttons to options screen
   - centered new note input box
   - removed redundant CSS settings
   - correct punctuation typos on options screen
  • Loading branch information
@freginold
freginold authored Mar 3, 2017
1 parent cfaec93 commit 96fa6d5
Show file tree
Hide file tree
Showing 3 changed files with 94 additions and 34 deletions.
31 changes: 20 additions & 11 deletions _note.css
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
html {
body {
font-size: 1em;
font-family: serif;
color: black;
Expand All @@ -13,7 +13,7 @@ input[name=screenPos] {
button:hover,
input[type=button]:hover,
input[type=submit]:hover {
background: #dbdbdb;
background-color: #dbdbdb;
}
button[disabled]:hover {
background: #efefef;
Expand Down Expand Up @@ -149,6 +149,18 @@ button[disabled]:hover {
.uline {
text-decoration: underline;
}
.delBox {
position: relative;
float: right;
width: 110px;
padding-bottom: 4px;
}
.optionsButtonBox {
position: relative;
float: right;
width: 170px;
padding-bottom: 4px;
}
#noteList {
display: block;
margin: 5px;
Expand All @@ -171,29 +183,26 @@ button[disabled]:hover {
padding-bottom: 4px;
}
#newNoteDiv {
display: none;
position: absolute;
text-align: center;
top: 30%;
}
#newNoteForm {
position: relative;
}
#noteTitle {
text-align: center;
padding-bottom: 10px;
margin-top: 4px;
}
#inputDiv {
display: none;
margin-left: 10px;
}
#optionsDiv {
display: none;
font-family: serif;
font-size: 1em;
overflow: auto;
}
#delBox {
position: relative;
float: right;
width: 110px;
padding-bottom: 4px;
}
#aboutDiv {
padding-left: 10px;
margin-left: 25px;
Expand Down
75 changes: 63 additions & 12 deletions _note.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ var noteBody = document.getElementById('noteBody');
var inputDiv = document.getElementById('inputDiv');
var inputBox = document.getElementById('inputBox');
var newNoteDiv = document.getElementById('newNoteDiv');
var newNoteForm = document.getElementById('newNoteForm');
var noteTitle = document.getElementById('noteTitle');
var optionsDiv = document.getElementById('optionsDiv');
var aboutDiv = document.getElementById('aboutDiv');
Expand Down Expand Up @@ -74,6 +75,8 @@ var moveButtonsHTMLMid = "' onclick='MoveUp(this)'>&uarr;</button> <button class
var moveButtonsHTMLEnd = "' onclick='MoveDown(this)'>&darr;</button>";
var lineStartHTML = "<span class='serif'>&sdot; </span>";
var statusBarHTML = "&nbsp;";
var expandAllButtonHTML = "<button class='upperRightButton' id='expandAllButton' onclick='expandAll()'>&#9196; Expand All</button>";
var collapseAllButtonHTML = "<button class='upperRightButton' id='collapseAllButton' onclick='collapseAll();'>&#9195; Collapse All</button>";
var noteFont = 'serif';
var fgColor = 'black';
var firstCoordCheck = true;
Expand All @@ -90,6 +93,8 @@ var large = 1.3;
var aboutInterval = false;
var flip = false;
var defTextSize = 1;
var sectionsCollapsed = 0;
var sectionsTotal = 0;
var currentNote, dummyVar, bgColor, i, currentX, currentY, oldX, oldY, offsetX, offsetY;
var lastLine, itemToEdit, itemTotal, statusTimer, prevNote, aboutCounter;

Expand Down Expand Up @@ -241,9 +246,9 @@ function saveSize() {

function showOptions() {
clearAll();
noteBody.style.display='none';
noteTitle.innerText = 'Options:';
optionsDiv.style.display='block';
noteTitle.innerHTML = "<div class='optionsButtonBox'>" + expandAllButtonHTML + collapseAllButtonHTML + "</div>" + 'Options:';
checkCollapseExpandButtons();
optionsDiv.style.display = 'block';
for (i = 0; i<document.getElementsByTagName('td').length; i++) {
if (document.getElementsByTagName('td')[i].className == 'optionsColumn') {
document.getElementsByTagName('td')[i].style.width = (document.body.clientWidth / 3);
Expand Down Expand Up @@ -330,11 +335,11 @@ function clearAll() {
setTimeout(function(){ firstCall = true; } , 250);
GetFileList()
newNoteDiv.style.display = 'none';
optionsDiv.style.display='none';
optionsDiv.style.display = 'none';
inputDiv.style.display = 'none';
aboutDiv.style.display = 'none';
backupDiv.style.display = 'none';
noteBody.style.display='block';
noteBody.style.display = 'none';
noteBody.innerText = '';
noteTitle.innerText = '';
newNoteInputBox.value = '';
Expand All @@ -352,13 +357,14 @@ function clearAll() {
function showNotes(cNote) {
// load note file
clearAll();
noteBody.style.display = 'block';
prevNote = currentNote;
currentNote = cNote;
editing = false;
window[currentNote].className = 'noteButton activeNote';
var currentNoteDisplay = currentNote;
if (currentNote == "&") { currentNoteDisplay = "&#38;"; } // to deal w/ & as only char in title
noteTitle.innerHTML = "<div id='delBox'>" + renButtonHTML + delButtonHTML + "</div>" + currentNoteDisplay;
noteTitle.innerHTML = "<div class='delBox'>" + renButtonHTML + delButtonHTML + "</div>" + currentNoteDisplay;
getLines(currentNote);
if (currentNote == prevNote) {
// if reloading the same note
Expand All @@ -377,7 +383,7 @@ function showNotes(cNote) {
window['d' + (lastLine-1)].style.filter = "alpha(opacity = 25)";
window['d' + (lastLine-1)].style.opacity = .25;
}
inputDiv.style.display='block';
inputDiv.style.display = 'block';
inputBox.focus();
}

Expand Down Expand Up @@ -416,9 +422,9 @@ function onSubmitted(tempVar) {

function showNewNoteBox() {
clearAll();
noteBody.style.display='none';
noteTitle.innerText = 'Name for new note:';
newNoteDiv.style.display = 'block';
centerNewNoteForm();
newNoteInputBox.focus();
}

Expand All @@ -434,6 +440,11 @@ function createNewNote(newNoteName) {
else { newNoteInputBox.value = ''; }
}

function centerNewNoteForm() {
// manually center the input box on the new note screen
newNoteForm.style.left = document.documentElement.clientWidth / 2 - (newNoteForm.firstChild.size * 6 + 10);
}

function getLocalFont(n) {
localFontShow[n].style.display='none';
localFontDiv[n].style.display='inline';
Expand Down Expand Up @@ -505,7 +516,6 @@ function deleteNote() {
function displayAbout() {
// display license info/help file
clearAll();
noteBody.style.display='none';
noteTitle.innerText = "About Note";
aboutDiv.style.display = 'block';
document.getElementById('versionInfo').innerHTML = "<span id='line1'>" + currentVer + "</span><br><span id='line2'>" + license + "</span>";
Expand Down Expand Up @@ -700,7 +710,6 @@ function highlight(tempNum) {
function dispBackupDiv() {
// show backup div: backup button, current backup dir, button to change dir
clearAll();
noteBody.style.display='none';
noteTitle.innerText = "Backup";
backupDiv.style.display = 'block';
var Opt13Display = Opt13;
Expand Down Expand Up @@ -764,6 +773,7 @@ function checkSize() {
firstCall = true;
}
else { firstCall = true; }
if (newNoteDiv.style.display != "none") { centerNewNoteForm(); }
}

function getDefaultSize() {
Expand Down Expand Up @@ -834,13 +844,53 @@ function resetDefault() {
function collapse(num) {
// collapse options section
document.getElementById('section' + num).style.display = "none";
document.getElementById('symbol' + num).innerHTML = "&#10133;";
document.getElementById('symbol' + num).innerHTML = "&#9654;";
sectionsCollapsed++;
checkCollapseExpandButtons();
}

function expand(num) {
// expand options section
document.getElementById('section' + num).style.display = "inline";
document.getElementById('symbol' + num).innerHTML = "&#10134;";
document.getElementById('symbol' + num).innerHTML = "&#9662;";
sectionsCollapsed--;
checkCollapseExpandButtons();
}

function expandAll() {
// expand all options settings
for (var i = 0; i < document.getElementsByTagName('label').length; i++) {
var thisId = document.getElementsByTagName('label')[i].id;
if (thisId.slice(0, 6) === "header") {
var thisNum = thisId.slice(thisId.length - 2, thisId.length);
var thisSection = "section" + thisNum;
if (document.getElementById(thisSection).style.display == "none") { expand(thisNum); }
}
}
sectionsCollapsed = 0;
checkCollapseExpandButtons();
}

function collapseAll() {
// collapse all options settings
for (var i = 0; i < document.getElementsByTagName('label').length; i++) {
var thisId = document.getElementsByTagName('label')[i].id;
if (thisId.slice(0, 6) === "header") {
var thisNum = thisId.slice(thisId.length - 2, thisId.length);
var thisSection = "section" + thisNum;
if (document.getElementById(thisSection).style.display !== "none") { collapse(thisNum); }
}
}
sectionsCollapsed = sectionsTotal;
checkCollapseExpandButtons();
}

function checkCollapseExpandButtons() {
// if all options either collapsed or expanded, disable the corresponding button
if (sectionsCollapsed === sectionsTotal) { document.getElementById('collapseAllButton').disabled = true; }
else { document.getElementById('collapseAllButton').disabled = false; }
if (sectionsCollapsed === 0) { document.getElementById('expandAllButton').disabled = true; }
else { document.getElementById('expandAllButton').disabled = false; }
}


Expand Down Expand Up @@ -891,6 +941,7 @@ for (var i = 0; i < document.getElementsByTagName('label').length; i++) {
// add click handlers to option headings for expanding/collapsing
var thisId = document.getElementsByTagName('label')[i].id;
if (thisId.slice(0, 6) === "header") {
sectionsTotal++;
document.getElementById(thisId).onclick = function() {
var thisNum = this.id.slice(this.id.length - 2, this.id.length);
var thisSection = "section" + thisNum;
Expand Down
22 changes: 11 additions & 11 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.2.2"
version = "3.2.3"
>
<title>Note</title>
<link href='_note.css' rel='stylesheet' type='text/css'>
Expand All @@ -30,7 +30,7 @@
<div id='noteBody'></div>

<div id='newNoteDiv'>
<form name='newNoteForm' onsubmit='createNewNote(newNoteInputBox.value);' action='#' >
<form id='newNoteForm' name='newNoteForm' onsubmit='createNewNote(newNoteInputBox.value);' action='#' >
<input type='text' size=20 id='newNoteInputBox' />
<input type='submit' value='Create' />
</form>
Expand All @@ -55,7 +55,7 @@
<br />
<table><tr>
<td class='optionsColumn'>
<label id='header01'><h3><span id='symbol01'>&#10134;</span> <span class='uline'>Background Color:</span></h3></label>
<label id='header01'><h3><span id='symbol01'>&#9662;</span> <span class='uline'>Background Color</span></h3></label>
<div id='section01' class='optionSections'>
<label id='ltgrayL'><input type='radio' name='bg' class='optionInput' value='gray' /> Light Gray &nbsp;<span class='goItalic'>(default)</span> </label><br />
<label id='yellowL'><input type='radio' name='bg' class='optionInput' value='yellow' /> Yellow </label><br />
Expand All @@ -71,7 +71,7 @@
<label id='blackL'><input type='radio' name='bg' class='optionInput' value='black' /> Black </label></div>
</td>
<td class='optionsColumn'>
<label id='header02'><h3><span id='symbol02'>&#10134;</span> <span class='uline'>Note Font:</span></h3></label>
<label id='header02'><h3><span id='symbol02'>&#9662;</span> <span class='uline'>Note Font</span></h3></label>
<div id='section02' class='optionSections'>
<label><input type='radio' name='font' id='localFontCheckBox0' class='optionInput' value='uf0' />
<div id='localFontDiv0' class='localFontDiv'> <span class='smallFont'>Choose any local font:</span>
Expand Down Expand Up @@ -121,30 +121,30 @@
<label class='serif'><input type='radio' name='font' class='optionInput' value='p2' /> Serif &nbsp;<span class='goItalic'>(default)</span></label>
</div>
<br /><br /><br />
<label id='header03'><h3><span id='symbol03'>&#10134;</span> <span class='uline'>Note Font Size:</span></h3></label>
<label id='header03'><h3><span id='symbol03'>&#9662;</span> <span class='uline'>Note Font Size</span></h3></label>
<div id='section03' class='optionSections'>
<label class='smallFont'><input type='radio' name='textSize' class='optionInput' value='small'> Small</label><br />
<label class='mediumFont'><input type='radio' name='textSize' class='optionInput' value='medium'> Medium &nbsp;<span class='goItalic'>(default)</span></label><br />
<label class='largeFont'><input type='radio' name='textSize' class='optionInput' value='large'> Large</label>
</div>
</td>
<td class='optionsColumn'>
<label id='header04'><h3><span id='symbol04'>&#10134;</span> <span class='uline'>Size & Position</span></h3></label>
<label id='header04'><h3><span id='symbol04'>&#9662;</span> <span class='uline'>Size & Position</span></h3></label>
<div id='section04' class='optionSections'>
<input type='radio' name='screenPos' class='optionInput' value='mm'>
<input type='radio' name='screenPos' class='optionInput' value='cc'>
<button class='optButton' id='screenPosResetButton' onclick='resetPos();'>Reset Window Position</button><br />
<button class='optButton' id='screenSizeResetButton' onclick='resetSize();'>Reset Window Size</button>
</div>
<br /><br />
<label id='header05'><h3><span id='symbol05'>&#10134;</span> <span class='uline'>Backup / Restore</span></h3></label>
<br /><br /><br />
<label id='header05'><h3><span id='symbol05'>&#9662;</span> <span class='uline'>Backup / Restore</span></h3></label>
<div id='section05' class='optionSections'>
<button class='optButton' id='undeleteButton' onclick='Undelete()' disabled=true>Restore Last Deleted Item</button><br />
<button class='optButton' id='backupButton' onclick='dispBackupDiv();'>Backup...</button><br />
<button class='optButton' id='defaultButton' onclick='resetDefault();'>Restore All Default Settings</button>
<button class='optButton' id='defaultButton' onclick='resetDefault();'>Restore Default Settings</button>
</div>
<br /><br />
<label id='header06'><h3><span id='symbol06'>&#10134;</span> <span class='uline'>Status Bar:</span></h3></label>
<br /><br /><br />
<label id='header06'><h3><span id='symbol06'>&#9662;</span> <span class='uline'>Status Bar</span></h3></label>
<div id='section06' class='optionSections'>
<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><br />
Expand Down

0 comments on commit 96fa6d5

Please sign in to comment.