diff --git a/content/temp_index.json b/content/temp_index.json
new file mode 100644
index 0000000..65874e8
--- /dev/null
+++ b/content/temp_index.json
@@ -0,0 +1,93 @@
+{
+ "index": [
+ {
+ "permalink": "/heaviside-unit-step-function-lec-18.html",
+ "summary": "We got a joke! Heaviside (British electrician) was told during a …",
+ "tags": [
+ "\n#heaviside",
+ " #mouc",
+ " #voparam",
+ "\n#ex",
+ " #heaviside",
+ "\n#end"
+ ],
+ "thumbnail": "",
+ "title": "(Heaviside) Unit step function (lec 18)"
+ },
+ {
+ "permalink": "/bernoulli-equations-lec-3.html",
+ "summary": "Bernoulli's equation: $$\\frac{ dy }{ dx } +P(x)y=Q(x)y^n \\quad\\quad …",
+ "tags": [
+ " #de_b_type1",
+ " #de_s_type1",
+ "\n#ex",
+ "\n#end"
+ ],
+ "thumbnail": "",
+ "title": "Bernoulli equations (lec 3)"
+ },
+ {
+ "permalink": "/cauchy-euler-equations-lec-10-11.html",
+ "summary": "We know how to solve second order equations where a, b, c are …",
+ "tags": [
+ "\n#cauchy-euler",
+ " #remember",
+ "\n#ex",
+ " #second_order",
+ " #second_order_nonhomogenous",
+ " #cauchy-euler",
+ "\n#end",
+ " #start"
+ ],
+ "thumbnail": "",
+ "title": "Cauchy-Euler equations (lec 10-11)"
+ },
+ {
+ "permalink": "/convolution-lec-19-20.html",
+ "summary": "Convolution #convolution A convolution is an operation on two …",
+ "tags": [
+ "\n#convolution",
+ "\n#end",
+ " #start",
+ "\n#ex",
+ " #convolution",
+ " #inv_LT",
+ " #partial_fractions",
+ " #remember",
+ " #IVP",
+ " #integral-differential"
+ ],
+ "thumbnail": "",
+ "title": "Convolution (lec 19-20)"
+ },
+ {
+ "permalink": "/dirak-%CE%B4-function-lec-21.html",
+ "summary": "#start of lec 21 From newton's second law: $ma=F$ …",
+ "tags": [
+ "\n#start",
+ "\n#dirak_delta",
+ "\n#ex",
+ " #second_order_nonhomogenous",
+ " #dirak_delta",
+ " #IVP",
+ " #voparam"
+ ],
+ "thumbnail": "drawings/Drawing-2023-10-25-13.16.20.excalidraw.png",
+ "title": "Dirak δ-function (lec 21)"
+ },
+ {
+ "permalink": "/drawings/2023-12-06-13.14.28.excalidraw.html",
+ "summary": "==⚠ Switch to EXCALIDRAW VIEW in the MORE OPTIONS menu of this …",
+ "tags": [],
+ "thumbnail": "",
+ "title": "2023-12-06-13.14.28.excalidraw"
+ },
+ {
+ "permalink": "/drawings/2023-12-18-16.29.58.excalidraw.html",
+ "summary": "==⚠ Switch to EXCALIDRAW VIEW in the MORE OPTIONS menu of this …",
+ "tags": [],
+ "thumbnail": "",
+ "title": "2023-12-18-16.29.58.excalidraw"
+ }
+ ]
+}
\ No newline at end of file
diff --git a/themes/zettels/assets/js/search.js b/themes/zettels/assets/js/search.js
index 7feeed8..de51ea7 100644
--- a/themes/zettels/assets/js/search.js
+++ b/themes/zettels/assets/js/search.js
@@ -3,7 +3,7 @@ loadIndex()
// Highlight with jQuery
// from: https://stackoverflow.com/questions/41533785/how-to-highlight-search-text-in-html-with-the-help-of-js
// @todo: This is the only use of jQuery. Find a vanila JS way
-jQuery.fn.highlight = function(pat) {
+jQuery.fn.highlight = function (pat) {
function innerHighlight(node, pat) {
@@ -15,16 +15,16 @@ jQuery.fn.highlight = function(pat) {
if (pos >= 0) {
- var spannode = document.createElement('span');
+ var spannode = document.createElement('span');
spannode.className = 'highlighted';
- var middlebit = node.splitText(pos);
- var endbit = middlebit.splitText(pat.length);
- var middleclone = middlebit.cloneNode(true);
+ var middlebit = node.splitText(pos);
+ var endbit = middlebit.splitText(pat.length);
+ var middleclone = middlebit.cloneNode(true);
spannode.appendChild(middleclone);
middlebit.parentNode.replaceChild(spannode, middlebit);
- skip = 1;
+ skip = 1;
}
@@ -41,15 +41,15 @@ jQuery.fn.highlight = function(pat) {
}
- return this.each(function() {
+ return this.each(function () {
innerHighlight(this, pat.toUpperCase());
});
- };
+};
-jQuery.fn.removeHighlight = function() {
+jQuery.fn.removeHighlight = function () {
function newNormalize(node) {
@@ -71,7 +71,7 @@ jQuery.fn.removeHighlight = function() {
if (next == null || next.nodeType != 3) { continue; }
var combined_text = child.nodeValue + next.nodeValue;
- new_node = node.ownerDocument.createTextNode(combined_text);
+ new_node = node.ownerDocument.createTextNode(combined_text);
node.insertBefore(new_node, child);
node.removeChild(child);
@@ -83,7 +83,7 @@ jQuery.fn.removeHighlight = function() {
}
- return this.find("span.highlighted").each(function() {
+ return this.find("span.highlighted").each(function () {
var thisParent = this.parentNode;
thisParent.replaceChild(this.firstChild, this);
@@ -93,9 +93,9 @@ jQuery.fn.removeHighlight = function() {
};
-$(function() {
+$(function () {
- $('#search-input').bind('keyup change', function(ev) {
+ $('#search-input').bind('keyup change', function (ev) {
// pull in the new value
var searchTerm = $(this).val();
@@ -104,64 +104,72 @@ $(function() {
$('body').removeHighlight();
// disable highlighting if empty
- if ( searchTerm ) {
+ if (searchTerm) {
// highlight the new term
- $('body').highlight( searchTerm );
+ $('body').highlight(searchTerm);
}
-
});
-
});
///
var scrollTop = 0
-document.addEventListener("turbolinks:before-render", function() {
- var search_index = document.getElementById("search-results");
- var y = search_index.scrollTop;
- scrollTop = y
+document.addEventListener("turbolinks:before-render", function () {
+ var search_index = document.getElementById("search-results");
+ var y = search_index.scrollTop;
+ scrollTop = y
+
-
})
-document.addEventListener("turbolinks:render", function() {
+document.addEventListener("turbolinks:render", function () {
var search_index = document.getElementById("search-results");
search_index.scrollTop = scrollTop
})
-
-document.addEventListener("turbolinks:load", function() {
+
+document.addEventListener("turbolinks:load", function () {
setNoteWrapperState()
-
-
+
+
const current = window.location.href
-
- var els = document.getElementsByTagName("a");
- for (var i = 0, l = els.length; i < l; i++) {
- var el = els[i];
-
- if (el.href === current) {
- el.classList.add("selected")
- } else {
- el.classList.remove("selected")
- }
- }
+ var els = document.getElementsByTagName("a");
+ for (var i = 0, l = els.length; i < l; i++) {
+ var el = els[i];
+
+ if (el.href === current) {
+ el.classList.add("selected")
+ } else {
+ el.classList.remove("selected")
+ }
+ }
})
function loadIndex() {
- fetchJSON(function(response) {
-
+ // On localhost the root url is /MATH201
+ // On sasserisop the root url is /sasserisop
+ const localhost = true;
+ const root = localhost ? "" : "/MATH201";
+
+ fetchJSON(function (response) {
const notes = response;
const search_results = document.getElementById('search-results');
const tags = document.getElementById('tags');
const current_note = window.location.href;
- notes.index.forEach(note => {
- const title = '
'+ note.title + '
';
+
+ // sorted notes by lecture number
+ const lecture_notes = new Map();
+ const non_lecture_notes = [];
+
+ // Fixed a bug where the search results had unwanted notes.
+ // The notes are now filtered first.
+ notes.index.filter(n => !/^Drawing|^20/.test(n.title)).forEach(note => {
+ const title = '
' + note.title + '
';
const summary = '
' + note.summary + '
';
-
+
const permalink = note.permalink
-
+
var thumbnail = ""
if (note.thumbnail === "") {
thumbnail = ""
@@ -175,20 +183,42 @@ function loadIndex() {
// use lazy loading.
thumbnail = '@attachments'
}
-
+
const tags = '' + note.tags + ''
var list_content;
if (current_note === permalink) {
- list_content = '' + title + summary + ''
+ list_content = '' + title + summary + ''
} else {
- list_content = '' + title + summary + thumbnail + tags + ''
+ list_content = '' + title + summary + thumbnail + tags + ''
}
-
+
const child = document.createElement("li");
child.innerHTML = list_content;
- search_results.append(child)
+
+ // Add lecture notes to a dictionary, and then sort them by lecture number.
+ // second last character of the title may be first digit of lecture number
+ const d1 = note.title[note.title.length - 2];
+ // find the lecture number, if there is one
+ if (/\d/.test(d1)) {
+ // it has a lecture number
+ // if the third last character is a digit, then the lecture number is 2 digits
+ const d2 = note.title[note.title.length - 3];
+ const lecture_number = /\d/.test(d2) ? Number(d2 + d1) : Number(d1);
+ lecture_notes.set(lecture_number, child);
+ } else {
+ non_lecture_notes.push(child);
+ }
});
-
+ // sort notes by lecture number
+ const sorted_notes = new Map([...lecture_notes.entries()].sort((a, b) => (a[0] - b[0])));
+ // Add sorted notes first
+ sorted_notes.forEach(val => {
+ search_results.append(val);
+ });
+ non_lecture_notes.forEach(child => {
+ search_results.append(child);
+ })
+
// @todo: wip
// notes.tags.forEach(tag => {
// const child = document.createElement("li");
@@ -196,20 +226,19 @@ function loadIndex() {
// tags.append(child)
// });
//
- });
- }
-
-
-function fetchJSON(callback) {
-
- const requestURL = '/MATH201/index.json';
+ }, root);
+}
+
+
+function fetchJSON(callback, root) {
+ const requestURL = root + '/index.json';
const request = new XMLHttpRequest();
request.open('GET', requestURL, true);
request.responseType = 'json';
- request.onreadystatechange = function() {
- if (request.readyState === 4 && request.status === 200) {
- callback(request.response);
- }
+ request.onreadystatechange = function () {
+ if (request.readyState === 4 && request.status === 200) {
+ callback(request.response);
+ }
};
request.send(null);
}
@@ -217,76 +246,76 @@ function fetchJSON(callback) {
function focusTag(a) {
showNav()
performSearchWith(a.innerText)
-
+
}
function performSearchWith(query) {
-
- // document.getElementById('search-input').value = query
-
- var filter, ul, li, a, i, txtValue;
-
- filter = query.toLowerCase();
- filter = filter.replace('/[.*+?^${}()|[\]\\]/g', '\\$&');
-
- var re = new RegExp(filter, 'g');
-
- ul = document.getElementById("search-results");
- li = ul.getElementsByTagName('li');
- for (i = 0; i < li.length; i++) {
+ // document.getElementById('search-input').value = query
+
+ var filter, ul, li, a, i, txtValue;
+
+ filter = query.toLowerCase();
+ filter = filter.replace('/[.*+?^${}()|[\]\\]/g', '\\$&');
+
+ var re = new RegExp(filter, 'g');
+
+ ul = document.getElementById("search-results");
+ li = ul.getElementsByTagName('li');
+
+ for (i = 0; i < li.length; i++) {
a = li[i].getElementsByTagName("a")[0];
-
+
txtValue = a.textContent || a.innerText;
if (txtValue.toLowerCase().indexOf(filter) > -1) {
- li[i].style.display = "block";
-
+ li[i].style.display = "block";
+
} else {
- li[i].style.display = "none";
+ li[i].style.display = "none";
}
- }
+ }
}
function performSearch() {
-
- var input, filter, ul, li, a, i, txtValue;
- input = document.getElementById('search-input');
-
- filter = input.value.toLowerCase();
- filter = filter.replace('/[.*+?^${}()|[\]\\]/g', '\\$&');
-
- var re = new RegExp(filter, 'g');
-
- ul = document.getElementById("search-results");
- li = ul.getElementsByTagName('li');
- for (i = 0; i < li.length; i++) {
+ var input, filter, ul, li, a, i, txtValue;
+ input = document.getElementById('search-input');
+
+ filter = input.value.toLowerCase();
+ filter = filter.replace('/[.*+?^${}()|[\]\\]/g', '\\$&');
+
+ var re = new RegExp(filter, 'g');
+
+ ul = document.getElementById("search-results");
+ li = ul.getElementsByTagName('li');
+
+ for (i = 0; i < li.length; i++) {
a = li[i].getElementsByTagName("a")[0];
-
+
txtValue = a.textContent || a.innerText;
if (txtValue.toLowerCase().indexOf(filter) > -1) {
- li[i].style.display = "block";
-
+ li[i].style.display = "block";
+
} else {
- li[i].style.display = "none";
+ li[i].style.display = "none";
}
- }
+ }
}
// Keyboard shortcuts
-document.addEventListener('keydown', function(evt) {
-
+document.addEventListener('keydown', function (evt) {
+
if (evt.metaKey && evt.which === 75 || evt.ctrlKey && evt.which === 75) {
document.getElementById("search-input").focus();
handleNavVisibility()
}
-
+
if (evt.key === "Escape" || evt.key === "Esc" | evt.keyCode === 27) {
hideNav()
}
-
+
});
var nav_is_visible = false;
@@ -300,13 +329,13 @@ function handleNavVisibility() {
}
function showNav() {
-
+
document.getElementById("search").style.width = "300px";
document.getElementById("search").style.opacity = 1;
document.getElementById("search-header").style.opacity = 1;
document.getElementById("search-header").style.width = "299px";
pushNoteWrapper()
-
+
nav_is_visible = true;
}
@@ -315,9 +344,9 @@ function hideNav() {
document.getElementById("search-header").style.width = "0";
document.getElementById("search").style.opacity = 0;
document.getElementById("search-header").style.opacity = 0;
- document.getElementById("main").style.marginLeft= "0";
+ document.getElementById("main").style.marginLeft = "0";
pullNoteWrapper()
-
+
nav_is_visible = false;
}
@@ -344,54 +373,54 @@ const hoverTime = 300
const fetchers = {}
const doc = document.implementation.createHTMLDocument('prefetch')
-function fetchPage (url, success) {
- const xhr = new XMLHttpRequest()
- xhr.open('GET', url)
- xhr.setRequestHeader('VND.PREFETCH', 'true')
- xhr.setRequestHeader('Accept', 'text/html')
- xhr.onreadystatechange = () => {
- if (xhr.readyState !== XMLHttpRequest.DONE) return
- if (xhr.status !== 200) return
- success(xhr.responseText)
- }
- xhr.send()
+function fetchPage(url, success) {
+ const xhr = new XMLHttpRequest()
+ xhr.open('GET', url)
+ xhr.setRequestHeader('VND.PREFETCH', 'true')
+ xhr.setRequestHeader('Accept', 'text/html')
+ xhr.onreadystatechange = () => {
+ if (xhr.readyState !== XMLHttpRequest.DONE) return
+ if (xhr.status !== 200) return
+ success(xhr.responseText)
+ }
+ xhr.send()
}
-function prefetchTurbolink (url) {
- fetchPage(url, responseText => {
- doc.open()
- doc.write(responseText)
- doc.close()
- const snapshot = Turbolinks.Snapshot.fromHTMLElement(doc.documentElement)
- Turbolinks.controller.cache.put(url, snapshot)
- })
+function prefetchTurbolink(url) {
+ fetchPage(url, responseText => {
+ doc.open()
+ doc.write(responseText)
+ doc.close()
+ const snapshot = Turbolinks.Snapshot.fromHTMLElement(doc.documentElement)
+ Turbolinks.controller.cache.put(url, snapshot)
+ })
}
-function prefetch (url) {
- if (prefetched(url)) return
- prefetchTurbolink(url)
+function prefetch(url) {
+ if (prefetched(url)) return
+ prefetchTurbolink(url)
}
-function prefetched (url) {
- return location.href === url || Turbolinks.controller.cache.has(url)
+function prefetched(url) {
+ return location.href === url || Turbolinks.controller.cache.has(url)
}
-function prefetching (url) {
- return !!fetchers[url]
+function prefetching(url) {
+ return !!fetchers[url]
}
-function cleanup (event) {
- const element = event.target
- clearTimeout(fetchers[element.href])
- element.removeEventListener('mouseleave', cleanup)
+function cleanup(event) {
+ const element = event.target
+ clearTimeout(fetchers[element.href])
+ element.removeEventListener('mouseleave', cleanup)
}
document.addEventListener('mouseover', event => {
- if (!event.target.dataset.prefetch) return
- const url = event.target.href
- if (prefetched(url)) return
- if (prefetching(url)) return
- cleanup(event)
- event.target.addEventListener('mouseleave', cleanup)
- fetchers[url] = setTimeout(() => prefetch(url), hoverTime)
+ if (!event.target.dataset.prefetch) return
+ const url = event.target.href
+ if (prefetched(url)) return
+ if (prefetching(url)) return
+ cleanup(event)
+ event.target.addEventListener('mouseleave', cleanup)
+ fetchers[url] = setTimeout(() => prefetch(url), hoverTime)
})
diff --git a/themes/zettels/assets/js/thumbnails.js b/themes/zettels/assets/js/thumbnails.js
index 604e9b6..2b0125a 100644
--- a/themes/zettels/assets/js/thumbnails.js
+++ b/themes/zettels/assets/js/thumbnails.js
@@ -1,19 +1,13 @@
-var thumbnail_mode = false
-function imageMode() {
- const note_wrapper = document.getElementById('note-wrapper')
- const images = note_wrapper.getElementsByTagName('img')
-
- if (thumbnail_mode) {
- var els = note_wrapper.getElementsByTagName('img')
- for(var i = 0, all = els.length; i < all; i++){
- els[i].classList.remove('thumbnail');
- }
- thumbnail_mode = false
- } else {
- var els = note_wrapper.getElementsByTagName('img')
- for(var i = 0, all = els.length; i < all; i++){
- els[i].classList.add('thumbnail');
- }
- thumbnail_mode = true
- }
+// Resize images using an input range.
+function resizeImage() {
+ // make p tags wrapping img tags inline, to resize images correctly
+ $("#main p").has("img").css("display", "inline-block");
+
+ // toggle vectical input range
+ $("#toolbar input[type=range][orient=vertical]").slideToggle()
+
+ // resize image
+ $("#toolbar input[type=range][orient=vertical]").mouseup(function () {
+ $("#main p img").css("width", this.value + "%")
+ });
}
\ No newline at end of file
diff --git a/themes/zettels/layouts/partials/search.html b/themes/zettels/layouts/partials/search.html
index 33254ae..3c85f1c 100644
--- a/themes/zettels/layouts/partials/search.html
+++ b/themes/zettels/layouts/partials/search.html
@@ -6,130 +6,141 @@
- Focused current note
-->
+ color: var(--text-base-color);
+ border-bottom: 1px solid var(--separator-color);
+ border-left: 6px solid var(--background-search);
+
+ }
+
+ #search-results a:first-child:hover,
+ a:first-child:focus,
+ .selected {
+ outline: 0;
+ background-color: var(--note-table-cell-selected-color);
+ border-left: 6px solid var(--note-table-cell-ribbon-color) !important;
+ }
+
+ /* // Reseting default styles inside search component scope */
+ #search-results li {
+ text-indent: 0;
+ }
+
+ #search-results li:before,
+ #search-results h1:before,
+ #search-results h2:before,
+ #search-results h3:before,
+ #search-results h4:before,
+ #search-results h5:before,
+ #search-results h6:before {
+ content: "";
+ visibility: hidden;
+ display: none;
+ }
+
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/themes/zettels/layouts/partials/toolbar.html b/themes/zettels/layouts/partials/toolbar.html
index 2a95058..7b85e76 100644
--- a/themes/zettels/layouts/partials/toolbar.html
+++ b/themes/zettels/layouts/partials/toolbar.html
@@ -1,42 +1,57 @@
-
-
\ No newline at end of file
+
+
+
+
\ No newline at end of file