diff --git a/.github/FUNDING.yml b/.github/FUNDING.yml index 40b2d4a3a..2824084fb 100644 --- a/.github/FUNDING.yml +++ b/.github/FUNDING.yml @@ -1 +1 @@ -github: [jackyzha0] +github: [jackyzha0] diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md index 189648d9c..5c8616f42 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -1,32 +1,32 @@ ---- -name: Bug report -about: Something about Quartz isn't working the way you expect -title: '' -labels: bug -assignees: '' - ---- - -**Describe the bug** -A clear and concise description of what the bug is. - -**To Reproduce** -Steps to reproduce the behavior: -1. Go to '...' -2. Click on '....' -3. Scroll down to '....' -4. See error - -**Expected behavior** -A clear and concise description of what you expected to happen. - -**Screenshots** -If applicable, add screenshots to help explain your problem. - -**Desktop (please complete the following information):** - - Device: [e.g. iPhone6] - - OS: [e.g. iOS] - - Browser [e.g. chrome, safari] - -**Additional context** -Add any other context about the problem here. +--- +name: Bug report +about: Something about Quartz isn't working the way you expect +title: '' +labels: bug +assignees: '' + +--- + +**Describe the bug** +A clear and concise description of what the bug is. + +**To Reproduce** +Steps to reproduce the behavior: +1. Go to '...' +2. Click on '....' +3. Scroll down to '....' +4. See error + +**Expected behavior** +A clear and concise description of what you expected to happen. + +**Screenshots** +If applicable, add screenshots to help explain your problem. + +**Desktop (please complete the following information):** + - Device: [e.g. iPhone6] + - OS: [e.g. iOS] + - Browser [e.g. chrome, safari] + +**Additional context** +Add any other context about the problem here. diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md index 2c9c226d9..80e19eff6 100644 --- a/.github/ISSUE_TEMPLATE/feature_request.md +++ b/.github/ISSUE_TEMPLATE/feature_request.md @@ -1,20 +1,20 @@ ---- -name: Feature request -about: Suggest an idea or improvement for Quartz -title: '' -labels: enhancement -assignees: '' - ---- - -**Is your feature request related to a problem? Please describe.** -A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] - -**Describe the solution you'd like** -A clear and concise description of what you want to happen. - -**Describe alternatives you've considered** -A clear and concise description of any alternative solutions or features you've considered. - -**Additional context** -Add any other context or screenshots about the feature request here. +--- +name: Feature request +about: Suggest an idea or improvement for Quartz +title: '' +labels: enhancement +assignees: '' + +--- + +**Is your feature request related to a problem? Please describe.** +A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] + +**Describe the solution you'd like** +A clear and concise description of what you want to happen. + +**Describe alternatives you've considered** +A clear and concise description of any alternative solutions or features you've considered. + +**Additional context** +Add any other context or screenshots about the feature request here. diff --git a/.github/workflows/deploy.yaml b/.github/workflows/deploy.yaml index ae31a27e2..daebdef14 100644 --- a/.github/workflows/deploy.yaml +++ b/.github/workflows/deploy.yaml @@ -1,37 +1,37 @@ -name: Deploy to GitHub Pages - -on: - push: - branches: - - hugo - -jobs: - deploy: - runs-on: ubuntu-18.04 - steps: - - uses: actions/checkout@v2 - - - name: Build Link Index - uses: jackyzha0/hugo-obsidian@v2.12 - with: - index: true - input: content - output: assets/indices - root: . - - - name: Setup Hugo - uses: peaceiris/actions-hugo@v2 - with: - hugo-version: '0.96.0' - extended: true - - - name: Build - run: hugo --minify - - - name: Deploy - uses: peaceiris/actions-gh-pages@v3 - with: - github_token: ${{ secrets.GITHUB_TOKEN }} - publish_dir: ./public - publish_branch: master # deploying branch - cname: jethughes.github.io +name: Deploy to GitHub Pages + +on: + push: + branches: + - hugo + +jobs: + deploy: + runs-on: ubuntu-18.04 + steps: + - uses: actions/checkout@v2 + + - name: Build Link Index + uses: jackyzha0/hugo-obsidian@v2.12 + with: + index: true + input: content + output: assets/indices + root: . + + - name: Setup Hugo + uses: peaceiris/actions-hugo@v2 + with: + hugo-version: '0.96.0' + extended: true + + - name: Build + run: hugo --minify + + - name: Deploy + uses: peaceiris/actions-gh-pages@v3 + with: + github_token: ${{ secrets.GITHUB_TOKEN }} + publish_dir: ./public + publish_branch: master # deploying branch + cname: jethughes.github.io diff --git a/.gitignore b/.gitignore index 4167682b5..957b1d91f 100644 --- a/.gitignore +++ b/.gitignore @@ -1,9 +1,9 @@ -.DS_Store -public -resources -.idea -content/203-mobile-app -content/.obsidian -.obsidian -assets/indices/linkIndex.json -assets/indices/contentIndex.json +.DS_Store +public +resources +.idea +content/203-mobile-app +content/.obsidian +.obsidian +assets/indices/linkIndex.json +assets/indices/contentIndex.json diff --git a/LICENSE.txt b/LICENSE.txt index 147e2ca14..77eeac6c3 100644 --- a/LICENSE.txt +++ b/LICENSE.txt @@ -1,21 +1,21 @@ -MIT License - -Copyright (c) 2021 jackyzha0 - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. +MIT License + +Copyright (c) 2021 jackyzha0 + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/Makefile b/Makefile index 9beee0f84..4310e9478 100644 --- a/Makefile +++ b/Makefile @@ -1,18 +1,18 @@ -.DEFAULT_GOAL := serve - -help: ## Show all Makefile targets - @grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | awk 'BEGIN {FS = ":.*?## "}; {printf "\033[36m%-30s\033[0m %s\n", $$1, $$2}' - -update: ## Update Quartz to the latest version on Github - @git remote show upstream || (echo "remote 'upstream' not present, setting 'upstream'" && git remote add upstream https://github.com/jackyzha0/quartz.git) - git fetch upstream - git log --oneline --decorate --graph ..upstream/hugo - git checkout -p upstream/hugo -- layouts .github Makefile assets/js assets/styles/base.scss assets/styles/darkmode.scss config.toml data - -update-force: ## Forcefully pull all changes and don't ask to patch - @git remote show upstream || (echo "remote 'upstream' not present, setting 'upstream'" && git remote add upstream https://github.com/jackyzha0/quartz.git) - git fetch upstream - git checkout upstream/hugo -- layouts .github Makefile assets/js assets/styles/base.scss assets/styles/darkmode.scss config.toml data - -serve: ## Serve Quartz locally - hugo-obsidian -input=content -output=assets/indices -index -root=. && hugo server --enableGitInfo +.DEFAULT_GOAL := serve + +help: ## Show all Makefile targets + @grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | awk 'BEGIN {FS = ":.*?## "}; {printf "\033[36m%-30s\033[0m %s\n", $$1, $$2}' + +update: ## Update Quartz to the latest version on Github + @git remote show upstream || (echo "remote 'upstream' not present, setting 'upstream'" && git remote add upstream https://github.com/jackyzha0/quartz.git) + git fetch upstream + git log --oneline --decorate --graph ..upstream/hugo + git checkout -p upstream/hugo -- layouts .github Makefile assets/js assets/styles/base.scss assets/styles/darkmode.scss config.toml data + +update-force: ## Forcefully pull all changes and don't ask to patch + @git remote show upstream || (echo "remote 'upstream' not present, setting 'upstream'" && git remote add upstream https://github.com/jackyzha0/quartz.git) + git fetch upstream + git checkout upstream/hugo -- layouts .github Makefile assets/js assets/styles/base.scss assets/styles/darkmode.scss config.toml data + +serve: ## Serve Quartz locally + hugo-obsidian -input=content -output=assets/indices -index -root=. && hugo server --enableGitInfo diff --git a/assets/js/darkmode.js b/assets/js/darkmode.js index d95a281ac..a9f170f30 100644 --- a/assets/js/darkmode.js +++ b/assets/js/darkmode.js @@ -1,29 +1,29 @@ -const userPref = window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark' -const currentTheme = localStorage.getItem('theme') ?? userPref - -if (currentTheme) { - document.documentElement.setAttribute('saved-theme', currentTheme); -} - -const switchTheme = (e) => { - if (e.target.checked) { - document.documentElement.setAttribute('saved-theme', 'dark') - localStorage.setItem('theme', 'dark') - } - else { - document.documentElement.setAttribute('saved-theme', 'light') - localStorage.setItem('theme', 'light') - } -} - -window.addEventListener('DOMContentLoaded', () => { - // Darkmode toggle - const toggleSwitch = document.querySelector('#darkmode-toggle') - - // listen for toggle - toggleSwitch.addEventListener('change', switchTheme, false) - - if (currentTheme === 'dark') { - toggleSwitch.checked = true - } -}) +const userPref = window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark' +const currentTheme = localStorage.getItem('theme') ?? userPref + +if (currentTheme) { + document.documentElement.setAttribute('saved-theme', currentTheme); +} + +const switchTheme = (e) => { + if (e.target.checked) { + document.documentElement.setAttribute('saved-theme', 'dark') + localStorage.setItem('theme', 'dark') + } + else { + document.documentElement.setAttribute('saved-theme', 'light') + localStorage.setItem('theme', 'light') + } +} + +window.addEventListener('DOMContentLoaded', () => { + // Darkmode toggle + const toggleSwitch = document.querySelector('#darkmode-toggle') + + // listen for toggle + toggleSwitch.addEventListener('change', switchTheme, false) + + if (currentTheme === 'dark') { + toggleSwitch.checked = true + } +}) diff --git a/assets/js/graph.js b/assets/js/graph.js index f0b1f7f6f..e5b42cd43 100644 --- a/assets/js/graph.js +++ b/assets/js/graph.js @@ -1,220 +1,220 @@ -async function drawGraph(url, baseUrl, pathColors, depth, enableDrag, enableLegend, enableZoom) { - const { index, links, content } = await fetchData - const curPage = url.replace(baseUrl, "") - - const parseIdsFromLinks = (links) => [...(new Set(links.flatMap(link => ([link.source, link.target]))))] - - const neighbours = new Set() - const wl = [curPage || "/", "__SENTINEL"] - if (depth >= 0) { - while (depth >= 0 && wl.length > 0) { - // compute neighbours - const cur = wl.shift() - if (cur === "__SENTINEL") { - depth-- - wl.push("__SENTINEL") - } else { - neighbours.add(cur) - const outgoing = index.links[cur] || [] - const incoming = index.backlinks[cur] || [] - wl.push(...outgoing.map(l => l.target), ...incoming.map(l => l.source)) - } - } - } else { - parseIdsFromLinks(links).forEach(id => neighbours.add(id)) - } - - const data = { - nodes: [...neighbours].map(id => ({ id })), - links: links.filter(l => neighbours.has(l.source) && neighbours.has(l.target)), - } - - const color = (d) => { - if (d.id === curPage || (d.id === "/" && curPage === "")) { - return "var(--g-node-active)" - } - - for (const pathColor of pathColors) { - const path = Object.keys(pathColor)[0] - const colour = pathColor[path] - if (d.id.startsWith(path)) { - return colour - } - } - - return "var(--g-node)" - } - - const drag = simulation => { - function dragstarted(event, d) { - if (!event.active) simulation.alphaTarget(1).restart(); - d.fx = d.x; - d.fy = d.y; - } - - function dragged(event, d) { - d.fx = event.x; - d.fy = event.y; - } - - function dragended(event, d) { - if (!event.active) simulation.alphaTarget(0); - d.fx = null; - d.fy = null; - } - - const noop = () => { } - return d3.drag() - .on("start", enableDrag ? dragstarted : noop) - .on("drag", enableDrag ? dragged : noop) - .on("end", enableDrag ? dragended : noop); - } - - const height = 250 - const width = document.getElementById("graph-container").offsetWidth - - const simulation = d3.forceSimulation(data.nodes) - .force("charge", d3.forceManyBody().strength(-30)) - .force("link", d3.forceLink(data.links).id(d => d.id)) - .force("center", d3.forceCenter()); - - const svg = d3.select('#graph-container') - .append('svg') - .attr('width', width) - .attr('height', height) - .attr("viewBox", [-width / 2, -height / 2, width, height]); - - if (enableLegend) { - const legend = [ - { "Current": "var(--g-node-active)" }, - { "Note": "var(--g-node)" }, - ...pathColors - ] - legend.forEach((legendEntry, i) => { - const key = Object.keys(legendEntry)[0] - const colour = legendEntry[key] - svg.append("circle").attr("cx", -width / 2 + 20).attr("cy", height / 2 - 30 * (i + 1)).attr("r", 6).style("fill", colour) - svg.append("text").attr("x", -width / 2 + 40).attr("y", height / 2 - 30 * (i + 1)).text(key).style("font-size", "15px").attr("alignment-baseline", "middle") - }) - } - - // draw links between nodes - const link = svg.append("g") - .selectAll("line") - .data(data.links) - .join("line") - .attr("class", "link") - .attr("stroke", "var(--g-link)") - .attr("stroke-width", 2) - .attr("data-source", d => d.source.id) - .attr("data-target", d => d.target.id) - - // svg groups - const graphNode = svg.append("g") - .selectAll("g") - .data(data.nodes) - .enter().append("g") - - // draw individual nodes - const node = graphNode.append("circle") - .attr("class", "node") - .attr("id", (d) => d.id) - .attr("r", (d) => { - const numOut = index.links[d.id]?.length || 0 - const numIn = index.backlinks[d.id]?.length || 0 - return 3 + (numOut + numIn) / 4 - }) - .attr("fill", color) - .style("cursor", "pointer") - .on("click", (_, d) => { - window.location.href = baseUrl + '/' + decodeURI(d.id).replace(/\s+/g, '-') - }) - .on("mouseover", function(_, d) { - d3.selectAll(".node") - .transition() - .duration(100) - .attr("fill", "var(--g-node-inactive)") - - const neighbours = parseIdsFromLinks([...(index.links[d.id] || []), ...(index.backlinks[d.id] || [])]) - const neighbourNodes = d3.selectAll(".node").filter(d => neighbours.includes(d.id)) - const currentId = d.id - const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId) - - // highlight neighbour nodes - neighbourNodes - .transition() - .duration(200) - .attr("fill", color) - - // highlight links - linkNodes - .transition() - .duration(200) - .attr("stroke", "var(--g-link-active)") - - // show text for self - d3.select(this.parentNode) - .select("text") - .raise() - .transition() - .duration(200) - .style("opacity", 1) - }).on("mouseleave", function(_, d) { - d3.selectAll(".node") - .transition() - .duration(200) - .attr("fill", color) - - const currentId = d.id - const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId) - - linkNodes - .transition() - .duration(200) - .attr("stroke", "var(--g-link)") - - d3.select(this.parentNode) - .select("text") - .transition() - .duration(200) - .style("opacity", 0) - }) - .call(drag(simulation)); - - // draw labels - const labels = graphNode.append("text") - .attr("dx", 12) - .attr("dy", ".35em") - .text((d) => content[d.id]?.title || d.id.replace("-", " ")) - .style("opacity", 0) - .style("pointer-events", "none") - .call(drag(simulation)); - - // set panning - - if (enableZoom) { - svg.call(d3.zoom() - .extent([[0, 0], [width, height]]) - .scaleExtent([0.25, 4]) - .on("zoom", ({ transform }) => { - link.attr("transform", transform); - node.attr("transform", transform); - labels.attr("transform", transform); - })); - } - - // progress the simulation - simulation.on("tick", () => { - link - .attr("x1", d => d.source.x) - .attr("y1", d => d.source.y) - .attr("x2", d => d.target.x) - .attr("y2", d => d.target.y) - node - .attr("cx", d => d.x) - .attr("cy", d => d.y) - labels - .attr("x", d => d.x) - .attr("y", d => d.y) - }); -} +async function drawGraph(url, baseUrl, pathColors, depth, enableDrag, enableLegend, enableZoom) { + const { index, links, content } = await fetchData + const curPage = url.replace(baseUrl, "") + + const parseIdsFromLinks = (links) => [...(new Set(links.flatMap(link => ([link.source, link.target]))))] + + const neighbours = new Set() + const wl = [curPage || "/", "__SENTINEL"] + if (depth >= 0) { + while (depth >= 0 && wl.length > 0) { + // compute neighbours + const cur = wl.shift() + if (cur === "__SENTINEL") { + depth-- + wl.push("__SENTINEL") + } else { + neighbours.add(cur) + const outgoing = index.links[cur] || [] + const incoming = index.backlinks[cur] || [] + wl.push(...outgoing.map(l => l.target), ...incoming.map(l => l.source)) + } + } + } else { + parseIdsFromLinks(links).forEach(id => neighbours.add(id)) + } + + const data = { + nodes: [...neighbours].map(id => ({ id })), + links: links.filter(l => neighbours.has(l.source) && neighbours.has(l.target)), + } + + const color = (d) => { + if (d.id === curPage || (d.id === "/" && curPage === "")) { + return "var(--g-node-active)" + } + + for (const pathColor of pathColors) { + const path = Object.keys(pathColor)[0] + const colour = pathColor[path] + if (d.id.startsWith(path)) { + return colour + } + } + + return "var(--g-node)" + } + + const drag = simulation => { + function dragstarted(event, d) { + if (!event.active) simulation.alphaTarget(1).restart(); + d.fx = d.x; + d.fy = d.y; + } + + function dragged(event, d) { + d.fx = event.x; + d.fy = event.y; + } + + function dragended(event, d) { + if (!event.active) simulation.alphaTarget(0); + d.fx = null; + d.fy = null; + } + + const noop = () => { } + return d3.drag() + .on("start", enableDrag ? dragstarted : noop) + .on("drag", enableDrag ? dragged : noop) + .on("end", enableDrag ? dragended : noop); + } + + const height = 250 + const width = document.getElementById("graph-container").offsetWidth + + const simulation = d3.forceSimulation(data.nodes) + .force("charge", d3.forceManyBody().strength(-30)) + .force("link", d3.forceLink(data.links).id(d => d.id)) + .force("center", d3.forceCenter()); + + const svg = d3.select('#graph-container') + .append('svg') + .attr('width', width) + .attr('height', height) + .attr("viewBox", [-width / 2, -height / 2, width, height]); + + if (enableLegend) { + const legend = [ + { "Current": "var(--g-node-active)" }, + { "Note": "var(--g-node)" }, + ...pathColors + ] + legend.forEach((legendEntry, i) => { + const key = Object.keys(legendEntry)[0] + const colour = legendEntry[key] + svg.append("circle").attr("cx", -width / 2 + 20).attr("cy", height / 2 - 30 * (i + 1)).attr("r", 6).style("fill", colour) + svg.append("text").attr("x", -width / 2 + 40).attr("y", height / 2 - 30 * (i + 1)).text(key).style("font-size", "15px").attr("alignment-baseline", "middle") + }) + } + + // draw links between nodes + const link = svg.append("g") + .selectAll("line") + .data(data.links) + .join("line") + .attr("class", "link") + .attr("stroke", "var(--g-link)") + .attr("stroke-width", 2) + .attr("data-source", d => d.source.id) + .attr("data-target", d => d.target.id) + + // svg groups + const graphNode = svg.append("g") + .selectAll("g") + .data(data.nodes) + .enter().append("g") + + // draw individual nodes + const node = graphNode.append("circle") + .attr("class", "node") + .attr("id", (d) => d.id) + .attr("r", (d) => { + const numOut = index.links[d.id]?.length || 0 + const numIn = index.backlinks[d.id]?.length || 0 + return 3 + (numOut + numIn) / 4 + }) + .attr("fill", color) + .style("cursor", "pointer") + .on("click", (_, d) => { + window.location.href = baseUrl + '/' + decodeURI(d.id).replace(/\s+/g, '-') + }) + .on("mouseover", function(_, d) { + d3.selectAll(".node") + .transition() + .duration(100) + .attr("fill", "var(--g-node-inactive)") + + const neighbours = parseIdsFromLinks([...(index.links[d.id] || []), ...(index.backlinks[d.id] || [])]) + const neighbourNodes = d3.selectAll(".node").filter(d => neighbours.includes(d.id)) + const currentId = d.id + const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId) + + // highlight neighbour nodes + neighbourNodes + .transition() + .duration(200) + .attr("fill", color) + + // highlight links + linkNodes + .transition() + .duration(200) + .attr("stroke", "var(--g-link-active)") + + // show text for self + d3.select(this.parentNode) + .select("text") + .raise() + .transition() + .duration(200) + .style("opacity", 1) + }).on("mouseleave", function(_, d) { + d3.selectAll(".node") + .transition() + .duration(200) + .attr("fill", color) + + const currentId = d.id + const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId) + + linkNodes + .transition() + .duration(200) + .attr("stroke", "var(--g-link)") + + d3.select(this.parentNode) + .select("text") + .transition() + .duration(200) + .style("opacity", 0) + }) + .call(drag(simulation)); + + // draw labels + const labels = graphNode.append("text") + .attr("dx", 12) + .attr("dy", ".35em") + .text((d) => content[d.id]?.title || d.id.replace("-", " ")) + .style("opacity", 0) + .style("pointer-events", "none") + .call(drag(simulation)); + + // set panning + + if (enableZoom) { + svg.call(d3.zoom() + .extent([[0, 0], [width, height]]) + .scaleExtent([0.25, 4]) + .on("zoom", ({ transform }) => { + link.attr("transform", transform); + node.attr("transform", transform); + labels.attr("transform", transform); + })); + } + + // progress the simulation + simulation.on("tick", () => { + link + .attr("x1", d => d.source.x) + .attr("y1", d => d.source.y) + .attr("x2", d => d.target.x) + .attr("y2", d => d.target.y) + node + .attr("cx", d => d.x) + .attr("cy", d => d.y) + labels + .attr("x", d => d.x) + .attr("y", d => d.y) + }); +} diff --git a/assets/js/popover.js b/assets/js/popover.js index a4b6852e3..93ae12275 100644 --- a/assets/js/popover.js +++ b/assets/js/popover.js @@ -1,35 +1,35 @@ -function htmlToElement(html) { - const template = document.createElement('template') - html = html.trim() - template.innerHTML = html - return template.content.firstChild -} - -function initPopover(baseURL) { - const basePath = baseURL.replace(window.location.origin, "") - document.addEventListener("DOMContentLoaded", () => { - fetchData.then(({ content }) => { - const links = [...document.getElementsByClassName("internal-link")] - links - .filter(li => li.dataset.src) - .forEach(li => { - const linkDest = content[li.dataset.src.replace(basePath, "")] - if (linkDest) { - const popoverElement = `
-

${linkDest.title}

-

${removeMarkdown(linkDest.content).split(" ", 20).join(" ")}...

-

${new Date(linkDest.lastmodified).toLocaleDateString()}

-
` - const el = htmlToElement(popoverElement) - li.appendChild(el) - li.addEventListener("mouseover", () => { - el.classList.add("visible") - }) - li.addEventListener("mouseout", () => { - el.classList.remove("visible") - }) - } - }) - }) - }) -} +function htmlToElement(html) { + const template = document.createElement('template') + html = html.trim() + template.innerHTML = html + return template.content.firstChild +} + +function initPopover(baseURL) { + const basePath = baseURL.replace(window.location.origin, "") + document.addEventListener("DOMContentLoaded", () => { + fetchData.then(({ content }) => { + const links = [...document.getElementsByClassName("internal-link")] + links + .filter(li => li.dataset.src) + .forEach(li => { + const linkDest = content[li.dataset.src.replace(basePath, "")] + if (linkDest) { + const popoverElement = `
+

${linkDest.title}

+

${removeMarkdown(linkDest.content).split(" ", 20).join(" ")}...

+

${new Date(linkDest.lastmodified).toLocaleDateString()}

+
` + const el = htmlToElement(popoverElement) + li.appendChild(el) + li.addEventListener("mouseover", () => { + el.classList.add("visible") + }) + li.addEventListener("mouseout", () => { + el.classList.remove("visible") + }) + } + }) + }) + }) +} diff --git a/assets/js/search.js b/assets/js/search.js index facebe56d..f155590b9 100644 --- a/assets/js/search.js +++ b/assets/js/search.js @@ -1,239 +1,239 @@ -// code from https://github.com/danestves/markdown-to-text -const removeMarkdown = ( - markdown, - options = { - listUnicodeChar: false, - stripListLeaders: true, - gfm: true, - useImgAltText: false, - preserveLinks: false, - } -) => { - let output = markdown || ""; - output = output.replace(/^(-\s*?|\*\s*?|_\s*?){3,}\s*$/gm, ""); - - try { - if (options.stripListLeaders) { - if (options.listUnicodeChar) - output = output.replace( - /^([\s\t]*)([\*\-\+]|\d+\.)\s+/gm, - options.listUnicodeChar + " $1" - ); - else output = output.replace(/^([\s\t]*)([\*\-\+]|\d+\.)\s+/gm, "$1"); - } - if (options.gfm) { - output = output - .replace(/\n={2,}/g, "\n") - .replace(/~{3}.*\n/g, "") - .replace(/~~/g, "") - .replace(/`{3}.*\n/g, ""); - } - if (options.preserveLinks) { - output = output.replace(/\[(.*?)\][\[\(](.*?)[\]\)]/g, "$1 ($2)") - } - output = output - .replace(/<[^>]*>/g, "") - .replace(/^[=\-]{2,}\s*$/g, "") - .replace(/\[\^.+?\](\: .*?$)?/g, "") - .replace(/\s{0,2}\[.*?\]: .*?$/g, "") - .replace(/\!\[(.*?)\][\[\(].*?[\]\)]/g, options.useImgAltText ? "$1" : "") - .replace(/\[(.*?)\][\[\(].*?[\]\)]/g, "$1") - .replace(/^\s{0,3}>\s?/g, "") - .replace(/(^|\n)\s{0,3}>\s?/g, "\n\n") - .replace(/^\s{1,2}\[(.*?)\]: (\S+)( ".*?")?\s*$/g, "") - .replace( - /^(\n)?\s{0,}#{1,6}\s+| {0,}(\n)?\s{0,}#{0,} {0,}(\n)?\s{0,}$/gm, - "$1$2$3" - ) - .replace(/([\*_]{1,3})(\S.*?\S{0,1})\1/g, "$2") - .replace(/([\*_]{1,3})(\S.*?\S{0,1})\1/g, "$2") - .replace(/(`{3,})(.*?)\1/gm, "$2") - .replace(/`(.+?)`/g, "$1") - .replace(/\n{2,}/g, "\n\n"); - } catch (e) { - console.error(e); - return markdown; - } - return output; -}; -// ----- - -(async function() { - const encoder = str => str.toLowerCase().split(/([^a-z]|[^\x00-\x7F])+/) - const contentIndex = new FlexSearch.Document({ - cache: true, - charset: "latin:extra", - optimize: true, - index: [{ - field: "content", - tokenize: "reverse", - encode: encoder, - }, { - field: "title", - tokenize: "forward", - encode: encoder, - }] - }) - - const { content } = await fetchData - for (const [key, value] of Object.entries(content)) { - contentIndex.add({ - id: key, - title: value.title, - content: removeMarkdown(value.content), - }) - } - - const highlight = (content, term) => { - const highlightWindow = 20 - const tokenizedTerm = term.split(/\s+/).filter(t => t !== "") - const splitText = content.split(/\s+/).filter(t => t !== "") - const includesCheck = (token) => tokenizedTerm.some(term => token.toLowerCase().startsWith(term.toLowerCase())) - - const occurrencesIndices = splitText - .map(includesCheck) - - // calculate best index - let bestSum = 0 - let bestIndex = 0 - for (let i = 0; i < Math.max(occurrencesIndices.length - highlightWindow, 0); i++) { - const window = occurrencesIndices.slice(i, i + highlightWindow) - const windowSum = window.reduce((total, cur) => total + cur, 0) - if (windowSum >= bestSum) { - bestSum = windowSum - bestIndex = i - } - } - - const startIndex = Math.max(bestIndex - highlightWindow, 0) - const endIndex = Math.min(startIndex + 2 * highlightWindow, splitText.length) - const mappedText = splitText - .slice(startIndex, endIndex) - .map(token => { - if (includesCheck(token)) { - return `${token}` - } - return token - }) - .join(" ") - .replaceAll(' ', " ") - return `${startIndex === 0 ? "" : "..."}${mappedText}${endIndex === splitText.length ? "" : "..."}` - } - - const resultToHTML = ({ url, title, content, term }) => { - const text = removeMarkdown(content) - const resultTitle = highlight(title, term) - const resultText = highlight(text, term) - return `` - } - - const redir = (id, term) => { - window.location.href = BASE_URL + `${id}#:~:text=${encodeURIComponent(term)}` - } - - const formatForDisplay = id => ({ - id, - url: id, - title: content[id].title, - content: content[id].content - }) - - const source = document.getElementById('search-bar') - const results = document.getElementById("results-container") - let term - source.addEventListener("keyup", (e) => { - if (e.key === "Enter") { - const anchor = document.getElementsByClassName("result-card")[0] - redir(anchor.id, term) - } - }) - source.addEventListener('input', (e) => { - term = e.target.value - const searchResults = contentIndex.search(term, [ - { - field: "content", - limit: 10, - }, - { - field: "title", - limit: 5, - } - ]) - const getByField = field => { - const results = searchResults.filter(x => x.field === field) - if (results.length === 0) { - return [] - } else { - return [...results[0].result] - } - } - const allIds = new Set([...getByField('title'), ...getByField('content')]) - const finalResults = [...allIds].map(formatForDisplay) - - // display - if (finalResults.length === 0) { - results.innerHTML = `` - } else { - results.innerHTML = finalResults - .map(result => resultToHTML({ - ...result, - term, - })) - .join("\n") - const anchors = document.getElementsByClassName("result-card"); - [...anchors].forEach(anchor => { - anchor.onclick = () => redir(anchor.id, term) - }) - } - }) - - - const searchContainer = document.getElementById("search-container") - - function openSearch() { - if (searchContainer.style.display === "none" || searchContainer.style.display === "") { - source.value = "" - results.innerHTML = "" - searchContainer.style.display = "block" - source.focus() - } else { - searchContainer.style.display = "none" - } - } - - function closeSearch() { - searchContainer.style.display = "none" - } - - document.addEventListener('keydown', (event) => { - if (event.key === "k" && (event.ctrlKey || event.metaKey)) { - event.preventDefault() - openSearch() - } - if (event.key === "Escape") { - event.preventDefault() - closeSearch() - } - }) - - const searchButton = document.getElementById("search-icon") - searchButton.addEventListener('click', (evt) => { - openSearch() - }) - searchButton.addEventListener('keydown', (evt) => { - openSearch() - }) - searchContainer.addEventListener('click', (evt) => { - closeSearch() - }) - document.getElementById("search-space").addEventListener('click', (evt) => { - evt.stopPropagation() - }) -})() - +// code from https://github.com/danestves/markdown-to-text +const removeMarkdown = ( + markdown, + options = { + listUnicodeChar: false, + stripListLeaders: true, + gfm: true, + useImgAltText: false, + preserveLinks: false, + } +) => { + let output = markdown || ""; + output = output.replace(/^(-\s*?|\*\s*?|_\s*?){3,}\s*$/gm, ""); + + try { + if (options.stripListLeaders) { + if (options.listUnicodeChar) + output = output.replace( + /^([\s\t]*)([\*\-\+]|\d+\.)\s+/gm, + options.listUnicodeChar + " $1" + ); + else output = output.replace(/^([\s\t]*)([\*\-\+]|\d+\.)\s+/gm, "$1"); + } + if (options.gfm) { + output = output + .replace(/\n={2,}/g, "\n") + .replace(/~{3}.*\n/g, "") + .replace(/~~/g, "") + .replace(/`{3}.*\n/g, ""); + } + if (options.preserveLinks) { + output = output.replace(/\[(.*?)\][\[\(](.*?)[\]\)]/g, "$1 ($2)") + } + output = output + .replace(/<[^>]*>/g, "") + .replace(/^[=\-]{2,}\s*$/g, "") + .replace(/\[\^.+?\](\: .*?$)?/g, "") + .replace(/\s{0,2}\[.*?\]: .*?$/g, "") + .replace(/\!\[(.*?)\][\[\(].*?[\]\)]/g, options.useImgAltText ? "$1" : "") + .replace(/\[(.*?)\][\[\(].*?[\]\)]/g, "$1") + .replace(/^\s{0,3}>\s?/g, "") + .replace(/(^|\n)\s{0,3}>\s?/g, "\n\n") + .replace(/^\s{1,2}\[(.*?)\]: (\S+)( ".*?")?\s*$/g, "") + .replace( + /^(\n)?\s{0,}#{1,6}\s+| {0,}(\n)?\s{0,}#{0,} {0,}(\n)?\s{0,}$/gm, + "$1$2$3" + ) + .replace(/([\*_]{1,3})(\S.*?\S{0,1})\1/g, "$2") + .replace(/([\*_]{1,3})(\S.*?\S{0,1})\1/g, "$2") + .replace(/(`{3,})(.*?)\1/gm, "$2") + .replace(/`(.+?)`/g, "$1") + .replace(/\n{2,}/g, "\n\n"); + } catch (e) { + console.error(e); + return markdown; + } + return output; +}; +// ----- + +(async function() { + const encoder = str => str.toLowerCase().split(/([^a-z]|[^\x00-\x7F])+/) + const contentIndex = new FlexSearch.Document({ + cache: true, + charset: "latin:extra", + optimize: true, + index: [{ + field: "content", + tokenize: "reverse", + encode: encoder, + }, { + field: "title", + tokenize: "forward", + encode: encoder, + }] + }) + + const { content } = await fetchData + for (const [key, value] of Object.entries(content)) { + contentIndex.add({ + id: key, + title: value.title, + content: removeMarkdown(value.content), + }) + } + + const highlight = (content, term) => { + const highlightWindow = 20 + const tokenizedTerm = term.split(/\s+/).filter(t => t !== "") + const splitText = content.split(/\s+/).filter(t => t !== "") + const includesCheck = (token) => tokenizedTerm.some(term => token.toLowerCase().startsWith(term.toLowerCase())) + + const occurrencesIndices = splitText + .map(includesCheck) + + // calculate best index + let bestSum = 0 + let bestIndex = 0 + for (let i = 0; i < Math.max(occurrencesIndices.length - highlightWindow, 0); i++) { + const window = occurrencesIndices.slice(i, i + highlightWindow) + const windowSum = window.reduce((total, cur) => total + cur, 0) + if (windowSum >= bestSum) { + bestSum = windowSum + bestIndex = i + } + } + + const startIndex = Math.max(bestIndex - highlightWindow, 0) + const endIndex = Math.min(startIndex + 2 * highlightWindow, splitText.length) + const mappedText = splitText + .slice(startIndex, endIndex) + .map(token => { + if (includesCheck(token)) { + return `${token}` + } + return token + }) + .join(" ") + .replaceAll(' ', " ") + return `${startIndex === 0 ? "" : "..."}${mappedText}${endIndex === splitText.length ? "" : "..."}` + } + + const resultToHTML = ({ url, title, content, term }) => { + const text = removeMarkdown(content) + const resultTitle = highlight(title, term) + const resultText = highlight(text, term) + return `` + } + + const redir = (id, term) => { + window.location.href = BASE_URL + `${id}#:~:text=${encodeURIComponent(term)}` + } + + const formatForDisplay = id => ({ + id, + url: id, + title: content[id].title, + content: content[id].content + }) + + const source = document.getElementById('search-bar') + const results = document.getElementById("results-container") + let term + source.addEventListener("keyup", (e) => { + if (e.key === "Enter") { + const anchor = document.getElementsByClassName("result-card")[0] + redir(anchor.id, term) + } + }) + source.addEventListener('input', (e) => { + term = e.target.value + const searchResults = contentIndex.search(term, [ + { + field: "content", + limit: 10, + }, + { + field: "title", + limit: 5, + } + ]) + const getByField = field => { + const results = searchResults.filter(x => x.field === field) + if (results.length === 0) { + return [] + } else { + return [...results[0].result] + } + } + const allIds = new Set([...getByField('title'), ...getByField('content')]) + const finalResults = [...allIds].map(formatForDisplay) + + // display + if (finalResults.length === 0) { + results.innerHTML = `` + } else { + results.innerHTML = finalResults + .map(result => resultToHTML({ + ...result, + term, + })) + .join("\n") + const anchors = document.getElementsByClassName("result-card"); + [...anchors].forEach(anchor => { + anchor.onclick = () => redir(anchor.id, term) + }) + } + }) + + + const searchContainer = document.getElementById("search-container") + + function openSearch() { + if (searchContainer.style.display === "none" || searchContainer.style.display === "") { + source.value = "" + results.innerHTML = "" + searchContainer.style.display = "block" + source.focus() + } else { + searchContainer.style.display = "none" + } + } + + function closeSearch() { + searchContainer.style.display = "none" + } + + document.addEventListener('keydown', (event) => { + if (event.key === "k" && (event.ctrlKey || event.metaKey)) { + event.preventDefault() + openSearch() + } + if (event.key === "Escape") { + event.preventDefault() + closeSearch() + } + }) + + const searchButton = document.getElementById("search-icon") + searchButton.addEventListener('click', (evt) => { + openSearch() + }) + searchButton.addEventListener('keydown', (evt) => { + openSearch() + }) + searchContainer.addEventListener('click', (evt) => { + closeSearch() + }) + document.getElementById("search-space").addEventListener('click', (evt) => { + evt.stopPropagation() + }) +})() + diff --git a/assets/styles/base.scss b/assets/styles/base.scss index 1be022933..68cbb213a 100644 --- a/assets/styles/base.scss +++ b/assets/styles/base.scss @@ -1,571 +1,571 @@ -:root { - --lt-colours-light: var(--light) !important; - --lt-colours-lightgray: var(--lightgray) !important; - --lt-colours-dark: var(--secondary) !important; - --lt-colours-secondary: var(--tertiary) !important; - --lt-colours-gray: var(--outlinegray) !important; -} - -h1, h2, h3, h4, h5, h6, ol, ul, thead { - font-family: Inter; - color: var(--dark); - font-weight: revert; - margin: revert; - padding: revert; -} - -p, ul, text { - font-family: 'Source Sans Pro', sans-serif; - color: var(--gray); - fill: var(--gray); - font-weight: revert; - margin: revert; - padding: revert; -} - -.mainTOC { - background: var(--lightgray); - border-radius: 5px; - padding: 0.75em 1em; -} - -.mainTOC details summary { - cursor: zoom-in; - font-family: Inter; - color: var(--dark); - font-weight: 700; -} - -.mainTOC details[open] summary { - cursor: zoom-out; -} - -#TableOfContents > ol { - counter-reset: section; - margin-left: 0em; - padding-left: 1.5em; - & > li { - counter-increment: section; - & > ol { - counter-reset: subsection; - & > li { - counter-increment: subsection; - &::marker { - content: counter(section) "." counter(subsection) " "; - } - } - } - } - - & > li::marker { - content: counter(section) " "; - } - - & > li::marker, & > li > ol > li::marker { - font-family: Source Sans Pro; - font-weight: 700; - } -} - -table { - width: 100%; -} - -img { - width: 100%; - border-radius: 3px; - margin: 1em 0; -} - -p>img+em { - display: block; - transform: translateY(-1em); -} - -sup { - line-height: 0 -} - -p, tbody, li { - font-family: Source Sans Pro; - color: var(--gray); - line-height: 1.5em; -} - -blockquote { - margin-left: 0em; - border-left: 3px solid var(--secondary); - padding-left: 1em; - transition: border-color 0.2s ease; - - &:hover { - border-color: var(--tertiary); - } -} - -table { - padding: 1.5em; -} - -td, th { - padding: 0.1em 0.5em; -} - -.footnotes p { - margin: 0.5em 0; -} - -.pagination { - list-style: none; - padding-left: 0; - display: flex; - margin-top: 2em; - gap: 1.5em; - justify-content: center; - - .disabled { - opacity: 0.2; - } - - & > li { - text-align: center; - display: inline-block; - - & a { - background-color: transparent !important; - } - - & a[href$="#"] { - opacity: 0.2; - } - } -} - -.section { - & h3 > a { - font-weight: 700; - font-family: Inter; - margin: 0; - } - & p { - margin-top: 0; - } -} - -article { - & > .meta { - margin: -1.5em 0 1em 0; - opacity: 0.7; - } - - & > .tags { - list-style: none; - padding-left: 0; - - & .meta { - & > h1 { - margin: 0; - } - & > p { - margin: 0; - } - } - - & > li { - display: inline-block; - } - & > li > a { - border-radius: 8px; - border: var(--outlinegray) 1px solid; - padding: 0.2em 0.5em; - &::before { - content: "#"; - margin-right: 0.3em; - color: var(--outlinegray); - } - } - } - - & a { - font-family: Source Sans Pro; - font-weight: 600; - - &.internal-link { - text-decoration: none; - background-color: transparentize(#8f9fa9, 0.85); - padding: 0 0.1em; - margin: auto -0.1em; - border-radius: 3px; - - &.broken { - opacity: 0.5; - background-color: transparent; - } - } - } - - & p { - overflow-wrap: anywhere; - } -} - -.backlinks a { - font-weight: 600; - font-size: 0.9rem; -} - -sup > a { - text-decoration: none; - padding: 0 0.1em 0 0.2em; -} - -a { - font-family: Inter, sans-serif; - font-size: 1em; - font-weight: 700; - text-decoration: none; - transition: all 0.2s ease; - color: var(--secondary); - - &:hover { - color: var(--tertiary) !important; - } -} - -pre { - font-family: 'Fira Code'; - padding: 0.75em; - border-radius: 3px; - overflow-x: scroll; -} - -code { - font-family: 'Fira Code'; - font-size: 0.85em; - padding: 0.15em 0.3em; - border-radius: 5px; - background: var(--lightgray); -} - -html { - scroll-behavior: smooth; - - &:lang(ar) { - & p, & h1, & h2, & h3, article { - direction: rtl; - text-align: right; - } - } -} - -body { - margin: 0; - height: 100vh; - width: 100vw; - //overflow-x: hidden; - max-width: 100%; - box-sizing: border-box; - background-color: var(--light); -} - -@keyframes fadeIn { - 0% {opacity:0;} - 100% {opacity:1;} -} - -footer { - margin-top: 4em; - text-align: center; - & ul { - padding-left: 0; - } -} - -hr { - width: 25%; - margin: 4em auto; - height: 2px; - border-radius: 1px; - border-width: 0; - color: var(--dark); - background-color: var(--dark); -} - -.singlePage { - padding: 4em 30vw; - - @media all and (max-width: 1200px) { - padding: 25px 5vw; - } -} - -.page-end { - display: flex; - flex-direction: row; - gap: 2em; - - @media all and (max-width: 780px) { - flex-direction: column; - } - - & > * { - flex: 1 0 0; - } - - & > .backlinks-container { - & > ul { - list-style: none; - padding-left: 0; - - & > li { - margin: 0.5em 0; - padding: 0.25em 1em; - border: var(--outlinegray) 1px solid; - border-radius: 5px - } - } - } - - & #graph-container { - border: var(--outlinegray) 1px solid; - border-radius: 5px; - } -} - -.centered { - margin-top: 30vh; -} - -article > h1 { - font-size: 2em; -} - -header { - display: flex; - flex-direction: row; - align-items: center; - - & > h1 { - font-size: 2em; - } - - & > nav { - @media all and (max-width: 600px) { - display: none; - } - } - - & > .spacer { - flex: 1 1 auto; - } - - & > svg { - cursor: pointer; - width: 18px; - min-width: 18px; - margin: 0 1em; - - &:hover .search-path { - stroke: var(--tertiary); - } - - .search-path { - stroke: var(--gray); - stroke-width: 2px; - transition: stroke 0.5s ease; - } - } -} - -#search-container { - position: fixed; - z-index: 9999; - left: 0; - top: 0; - width: 100vw; - height: 100%; - overflow: scroll; - display: none; - backdrop-filter: blur(4px); - -webkit-backdrop-filter: blur(4px); - - & > div { - width: 50%; - margin-top: 15vh; - margin-left: auto; - margin-right: auto; - - @media all and (max-width: 1200px) { - width: 90%; - } - - & > * { - width: 100%; - border-radius: 4px; - background: var(--light); - box-shadow: 0 14px 50px rgba(27, 33, 48, 0.12), 0 10px 30px rgba(27, 33, 48, 0.16); - margin-bottom: 2em; - } - - & > input { - box-sizing: border-box; - padding: 0.5em 1em; - font-family: Inter, sans-serif; - color: var(--dark); - font-size: 1.1em; - border: 1px solid var(--outlinegray); - - &:focus { - outline: none; - } - } - - & > #results-container { - & > .result-card { - padding: 1em; - cursor: pointer; - transition: background 0.2s ease; - border: 1px solid var(--outlinegray); - border-bottom: none; - width: 100%; - - // normalize button props - font-family: inherit; - font-size: 100%; - line-height: 1.15; - margin: 0; - overflow: visible; - text-transform: none; - text-align: left; - background: var(--light); - outline: none; - - &:hover, &:focus { - background: rgba(180, 180, 180, 0.15); - } - - &:first-of-type { - border-top-left-radius: 5px; - border-top-right-radius: 5px; - } - - &:last-of-type { - border-bottom-left-radius: 5px; - border-bottom-right-radius: 5px; - border-bottom: 1px solid var(--outlinegray); - } - - & > h3, & > p { - margin: 0; - } - - & .search-highlight { - background-color: #afbfc966; - padding: 0.05em 0.2em; - border-radius: 3px; - } - } - } - } -} - -.section-ul { - list-style: none; - padding-left: 0; - - & > li { - border: 1px solid var(--outlinegray); - border-radius: 5px; - padding: 0 1em; - margin-bottom: 1em; - - & h3 { - opacity: 1; - font-weight: 700; - margin-bottom: 0em; - } - - & .meta { - opacity: 0.6; - } - } -} - -@keyframes dropin { - 0% { - display: none; - opacity: 0; - visibility: hidden; - } - 1% { - display: inline-block; - opacity: 0; - transform: translate(-50%, 40%); - } - 100% { - opacity: 1; - visibility: visible; - transform: translate(-50%, 20%); - } -} - -.popover { - z-index: 999; - position: absolute; - width: 20em; - display: none; - background-color: var(--light); - padding: 1em; - border: 1px solid var(--outlinegray); - border-radius: 5px; - transform: translate(-50%, 40%); - pointer-events: none; - transition: opacity 0.2s ease, transform 0.2s ease; - user-select: none; - overflow-wrap: anywhere; - box-shadow: 6px 6px 36px 0px rgba(0,0,0,0.25); - - @media all and (max-width: 600px) { - display: none; - } - - &.visible { - opacity: 1; - visibility: visible; - transform: translate(-50%, 20%); - display: inline-block; - animation: dropin 0.2s ease; - } - - & > h3 { - font-size: 1rem; - margin: 0.25em 0; - } - - & > .meta { - margin-top: 0.25em; - opacity: 0.5; - font-family: "JetBrains Mono", monospace; - font-size: 0.8rem; - } - - & > p { - margin: 0; - font-weight: 400; - user-select: none; - } -} - - - -#contact_buttons ul { - list-style-type: none; - - li { - display: inline-block; - } - - li a { - padding: 0 1em; - } -} +:root { + --lt-colours-light: var(--light) !important; + --lt-colours-lightgray: var(--lightgray) !important; + --lt-colours-dark: var(--secondary) !important; + --lt-colours-secondary: var(--tertiary) !important; + --lt-colours-gray: var(--outlinegray) !important; +} + +h1, h2, h3, h4, h5, h6, ol, ul, thead { + font-family: Inter; + color: var(--dark); + font-weight: revert; + margin: revert; + padding: revert; +} + +p, ul, text { + font-family: 'Source Sans Pro', sans-serif; + color: var(--gray); + fill: var(--gray); + font-weight: revert; + margin: revert; + padding: revert; +} + +.mainTOC { + background: var(--lightgray); + border-radius: 5px; + padding: 0.75em 1em; +} + +.mainTOC details summary { + cursor: zoom-in; + font-family: Inter; + color: var(--dark); + font-weight: 700; +} + +.mainTOC details[open] summary { + cursor: zoom-out; +} + +#TableOfContents > ol { + counter-reset: section; + margin-left: 0em; + padding-left: 1.5em; + & > li { + counter-increment: section; + & > ol { + counter-reset: subsection; + & > li { + counter-increment: subsection; + &::marker { + content: counter(section) "." counter(subsection) " "; + } + } + } + } + + & > li::marker { + content: counter(section) " "; + } + + & > li::marker, & > li > ol > li::marker { + font-family: Source Sans Pro; + font-weight: 700; + } +} + +table { + width: 100%; +} + +img { + width: 100%; + border-radius: 3px; + margin: 1em 0; +} + +p>img+em { + display: block; + transform: translateY(-1em); +} + +sup { + line-height: 0 +} + +p, tbody, li { + font-family: Source Sans Pro; + color: var(--gray); + line-height: 1.5em; +} + +blockquote { + margin-left: 0em; + border-left: 3px solid var(--secondary); + padding-left: 1em; + transition: border-color 0.2s ease; + + &:hover { + border-color: var(--tertiary); + } +} + +table { + padding: 1.5em; +} + +td, th { + padding: 0.1em 0.5em; +} + +.footnotes p { + margin: 0.5em 0; +} + +.pagination { + list-style: none; + padding-left: 0; + display: flex; + margin-top: 2em; + gap: 1.5em; + justify-content: center; + + .disabled { + opacity: 0.2; + } + + & > li { + text-align: center; + display: inline-block; + + & a { + background-color: transparent !important; + } + + & a[href$="#"] { + opacity: 0.2; + } + } +} + +.section { + & h3 > a { + font-weight: 700; + font-family: Inter; + margin: 0; + } + & p { + margin-top: 0; + } +} + +article { + & > .meta { + margin: -1.5em 0 1em 0; + opacity: 0.7; + } + + & > .tags { + list-style: none; + padding-left: 0; + + & .meta { + & > h1 { + margin: 0; + } + & > p { + margin: 0; + } + } + + & > li { + display: inline-block; + } + & > li > a { + border-radius: 8px; + border: var(--outlinegray) 1px solid; + padding: 0.2em 0.5em; + &::before { + content: "#"; + margin-right: 0.3em; + color: var(--outlinegray); + } + } + } + + & a { + font-family: Source Sans Pro; + font-weight: 600; + + &.internal-link { + text-decoration: none; + background-color: transparentize(#8f9fa9, 0.85); + padding: 0 0.1em; + margin: auto -0.1em; + border-radius: 3px; + + &.broken { + opacity: 0.5; + background-color: transparent; + } + } + } + + & p { + overflow-wrap: anywhere; + } +} + +.backlinks a { + font-weight: 600; + font-size: 0.9rem; +} + +sup > a { + text-decoration: none; + padding: 0 0.1em 0 0.2em; +} + +a { + font-family: Inter, sans-serif; + font-size: 1em; + font-weight: 700; + text-decoration: none; + transition: all 0.2s ease; + color: var(--secondary); + + &:hover { + color: var(--tertiary) !important; + } +} + +pre { + font-family: 'Fira Code'; + padding: 0.75em; + border-radius: 3px; + overflow-x: scroll; +} + +code { + font-family: 'Fira Code'; + font-size: 0.85em; + padding: 0.15em 0.3em; + border-radius: 5px; + background: var(--lightgray); +} + +html { + scroll-behavior: smooth; + + &:lang(ar) { + & p, & h1, & h2, & h3, article { + direction: rtl; + text-align: right; + } + } +} + +body { + margin: 0; + height: 100vh; + width: 100vw; + //overflow-x: hidden; + max-width: 100%; + box-sizing: border-box; + background-color: var(--light); +} + +@keyframes fadeIn { + 0% {opacity:0;} + 100% {opacity:1;} +} + +footer { + margin-top: 4em; + text-align: center; + & ul { + padding-left: 0; + } +} + +hr { + width: 25%; + margin: 4em auto; + height: 2px; + border-radius: 1px; + border-width: 0; + color: var(--dark); + background-color: var(--dark); +} + +.singlePage { + padding: 4em 30vw; + + @media all and (max-width: 1200px) { + padding: 25px 5vw; + } +} + +.page-end { + display: flex; + flex-direction: row; + gap: 2em; + + @media all and (max-width: 780px) { + flex-direction: column; + } + + & > * { + flex: 1 0 0; + } + + & > .backlinks-container { + & > ul { + list-style: none; + padding-left: 0; + + & > li { + margin: 0.5em 0; + padding: 0.25em 1em; + border: var(--outlinegray) 1px solid; + border-radius: 5px + } + } + } + + & #graph-container { + border: var(--outlinegray) 1px solid; + border-radius: 5px; + } +} + +.centered { + margin-top: 30vh; +} + +article > h1 { + font-size: 2em; +} + +header { + display: flex; + flex-direction: row; + align-items: center; + + & > h1 { + font-size: 2em; + } + + & > nav { + @media all and (max-width: 600px) { + display: none; + } + } + + & > .spacer { + flex: 1 1 auto; + } + + & > svg { + cursor: pointer; + width: 18px; + min-width: 18px; + margin: 0 1em; + + &:hover .search-path { + stroke: var(--tertiary); + } + + .search-path { + stroke: var(--gray); + stroke-width: 2px; + transition: stroke 0.5s ease; + } + } +} + +#search-container { + position: fixed; + z-index: 9999; + left: 0; + top: 0; + width: 100vw; + height: 100%; + overflow: scroll; + display: none; + backdrop-filter: blur(4px); + -webkit-backdrop-filter: blur(4px); + + & > div { + width: 50%; + margin-top: 15vh; + margin-left: auto; + margin-right: auto; + + @media all and (max-width: 1200px) { + width: 90%; + } + + & > * { + width: 100%; + border-radius: 4px; + background: var(--light); + box-shadow: 0 14px 50px rgba(27, 33, 48, 0.12), 0 10px 30px rgba(27, 33, 48, 0.16); + margin-bottom: 2em; + } + + & > input { + box-sizing: border-box; + padding: 0.5em 1em; + font-family: Inter, sans-serif; + color: var(--dark); + font-size: 1.1em; + border: 1px solid var(--outlinegray); + + &:focus { + outline: none; + } + } + + & > #results-container { + & > .result-card { + padding: 1em; + cursor: pointer; + transition: background 0.2s ease; + border: 1px solid var(--outlinegray); + border-bottom: none; + width: 100%; + + // normalize button props + font-family: inherit; + font-size: 100%; + line-height: 1.15; + margin: 0; + overflow: visible; + text-transform: none; + text-align: left; + background: var(--light); + outline: none; + + &:hover, &:focus { + background: rgba(180, 180, 180, 0.15); + } + + &:first-of-type { + border-top-left-radius: 5px; + border-top-right-radius: 5px; + } + + &:last-of-type { + border-bottom-left-radius: 5px; + border-bottom-right-radius: 5px; + border-bottom: 1px solid var(--outlinegray); + } + + & > h3, & > p { + margin: 0; + } + + & .search-highlight { + background-color: #afbfc966; + padding: 0.05em 0.2em; + border-radius: 3px; + } + } + } + } +} + +.section-ul { + list-style: none; + padding-left: 0; + + & > li { + border: 1px solid var(--outlinegray); + border-radius: 5px; + padding: 0 1em; + margin-bottom: 1em; + + & h3 { + opacity: 1; + font-weight: 700; + margin-bottom: 0em; + } + + & .meta { + opacity: 0.6; + } + } +} + +@keyframes dropin { + 0% { + display: none; + opacity: 0; + visibility: hidden; + } + 1% { + display: inline-block; + opacity: 0; + transform: translate(-50%, 40%); + } + 100% { + opacity: 1; + visibility: visible; + transform: translate(-50%, 20%); + } +} + +.popover { + z-index: 999; + position: absolute; + width: 20em; + display: none; + background-color: var(--light); + padding: 1em; + border: 1px solid var(--outlinegray); + border-radius: 5px; + transform: translate(-50%, 40%); + pointer-events: none; + transition: opacity 0.2s ease, transform 0.2s ease; + user-select: none; + overflow-wrap: anywhere; + box-shadow: 6px 6px 36px 0px rgba(0,0,0,0.25); + + @media all and (max-width: 600px) { + display: none; + } + + &.visible { + opacity: 1; + visibility: visible; + transform: translate(-50%, 20%); + display: inline-block; + animation: dropin 0.2s ease; + } + + & > h3 { + font-size: 1rem; + margin: 0.25em 0; + } + + & > .meta { + margin-top: 0.25em; + opacity: 0.5; + font-family: "JetBrains Mono", monospace; + font-size: 0.8rem; + } + + & > p { + margin: 0; + font-weight: 400; + user-select: none; + } +} + + + +#contact_buttons ul { + list-style-type: none; + + li { + display: inline-block; + } + + li a { + padding: 0 1em; + } +} diff --git a/assets/styles/custom.scss b/assets/styles/custom.scss index 612b80a61..c26888efa 100644 --- a/assets/styles/custom.scss +++ b/assets/styles/custom.scss @@ -1,24 +1,24 @@ -// Add your own CSS here! -:root { - --light: #faf8f8; - --dark: #141021; - --secondary: #284b63; - --tertiary: #84a59d; - --visited: #afbfc9; - --primary: #f28482; - --gray: #4e4e4e; - --lightgray: #f0f0f0; - --outlinegray: #dadada; -} - -[saved-theme="dark"] { - --light: #1e1e21 !important; - --dark: #fbfffe !important; - --secondary: #6b879a !important; - --visited: #4a575e !important; - --tertiary: #84a59d !important; - --primary: #f58382 !important; - --gray: #d4d4d4 !important; - --lightgray: #292633 !important; - --outlinegray: #343434 !important; +// Add your own CSS here! +:root { + --light: #faf8f8; + --dark: #141021; + --secondary: #284b63; + --tertiary: #84a59d; + --visited: #afbfc9; + --primary: #f28482; + --gray: #4e4e4e; + --lightgray: #f0f0f0; + --outlinegray: #dadada; +} + +[saved-theme="dark"] { + --light: #1e1e21 !important; + --dark: #fbfffe !important; + --secondary: #6b879a !important; + --visited: #4a575e !important; + --tertiary: #84a59d !important; + --primary: #f58382 !important; + --gray: #d4d4d4 !important; + --lightgray: #292633 !important; + --outlinegray: #343434 !important; } \ No newline at end of file diff --git a/assets/styles/darkmode.scss b/assets/styles/darkmode.scss index 61967d797..dc293b66c 100644 --- a/assets/styles/darkmode.scss +++ b/assets/styles/darkmode.scss @@ -1,44 +1,44 @@ -.darkmode { - float: right; - padding: 1em; - min-width: 30px; - position: relative; - - @media all and (max-width: 450px) { - padding: 1em; - } - - & > .toggle { - display: none; - box-sizing: border-box; - } - - & svg { - opacity: 0; - position: absolute; - width: 20px; - height: 20px; - top: calc(50% - 10px); - margin: 0 7px; - fill: var(--gray); - transition: opacity 0.1s ease; - } -} - -.toggle:checked ~ label { - & > #dayIcon { - opacity: 0; - } - & > #nightIcon { - opacity: 1; - } -} - -.toggle:not(:checked) ~ label { - & > #dayIcon { - opacity: 1; - } - & > #nightIcon { - opacity: 0; - } +.darkmode { + float: right; + padding: 1em; + min-width: 30px; + position: relative; + + @media all and (max-width: 450px) { + padding: 1em; + } + + & > .toggle { + display: none; + box-sizing: border-box; + } + + & svg { + opacity: 0; + position: absolute; + width: 20px; + height: 20px; + top: calc(50% - 10px); + margin: 0 7px; + fill: var(--gray); + transition: opacity 0.1s ease; + } +} + +.toggle:checked ~ label { + & > #dayIcon { + opacity: 0; + } + & > #nightIcon { + opacity: 1; + } +} + +.toggle:not(:checked) ~ label { + & > #dayIcon { + opacity: 1; + } + & > #nightIcon { + opacity: 0; + } } \ No newline at end of file diff --git a/assets/styles/syntax.scss b/assets/styles/syntax.scss index bada47ab5..089f6dc4f 100644 --- a/assets/styles/syntax.scss +++ b/assets/styles/syntax.scss @@ -1,99 +1,99 @@ -/* Background */ .chroma { color: #f8f8f2; background-color: #282a36; overflow: hidden } -/* Other */ .chroma .x { } -/* Error */ .chroma .err { } -/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } -/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; } -/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc } -/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } -/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } -/* Keyword */ .chroma .k { color: #ff79c6 } -/* KeywordConstant */ .chroma .kc { color: #ff79c6 } -/* KeywordDeclaration */ .chroma .kd { color: #8be9fd; font-style: italic } -/* KeywordNamespace */ .chroma .kn { color: #ff79c6 } -/* KeywordPseudo */ .chroma .kp { color: #ff79c6 } -/* KeywordReserved */ .chroma .kr { color: #ff79c6 } -/* KeywordType */ .chroma .kt { color: #8be9fd } -/* Name */ .chroma .n { } -/* NameAttribute */ .chroma .na { color: #50fa7b } -/* NameBuiltin */ .chroma .nb { color: #8be9fd; font-style: italic } -/* NameBuiltinPseudo */ .chroma .bp { } -/* NameClass */ .chroma .nc { color: #50fa7b } -/* NameConstant */ .chroma .no { } -/* NameDecorator */ .chroma .nd { } -/* NameEntity */ .chroma .ni { } -/* NameException */ .chroma .ne { } -/* NameFunction */ .chroma .nf { color: #50fa7b } -/* NameFunctionMagic */ .chroma .fm { } -/* NameLabel */ .chroma .nl { color: #8be9fd; font-style: italic } -/* NameNamespace */ .chroma .nn { } -/* NameOther */ .chroma .nx { } -/* NameProperty */ .chroma .py { } -/* NameTag */ .chroma .nt { color: #ff79c6 } -/* NameVariable */ .chroma .nv { color: #8be9fd; font-style: italic } -/* NameVariableClass */ .chroma .vc { color: #8be9fd; font-style: italic } -/* NameVariableGlobal */ .chroma .vg { color: #8be9fd; font-style: italic } -/* NameVariableInstance */ .chroma .vi { color: #8be9fd; font-style: italic } -/* NameVariableMagic */ .chroma .vm { } -/* Literal */ .chroma .l { } -/* LiteralDate */ .chroma .ld { } -/* LiteralString */ .chroma .s { color: #f1fa8c } -/* LiteralStringAffix */ .chroma .sa { color: #f1fa8c } -/* LiteralStringBacktick */ .chroma .sb { color: #f1fa8c } -/* LiteralStringChar */ .chroma .sc { color: #f1fa8c } -/* LiteralStringDelimiter */ .chroma .dl { color: #f1fa8c } -/* LiteralStringDoc */ .chroma .sd { color: #f1fa8c } -/* LiteralStringDouble */ .chroma .s2 { color: #f1fa8c } -/* LiteralStringEscape */ .chroma .se { color: #f1fa8c } -/* LiteralStringHeredoc */ .chroma .sh { color: #f1fa8c } -/* LiteralStringInterpol */ .chroma .si { color: #f1fa8c } -/* LiteralStringOther */ .chroma .sx { color: #f1fa8c } -/* LiteralStringRegex */ .chroma .sr { color: #f1fa8c } -/* LiteralStringSingle */ .chroma .s1 { color: #f1fa8c } -/* LiteralStringSymbol */ .chroma .ss { color: #f1fa8c } -/* LiteralNumber */ .chroma .m { color: #bd93f9 } -/* LiteralNumberBin */ .chroma .mb { color: #bd93f9 } -/* LiteralNumberFloat */ .chroma .mf { color: #bd93f9 } -/* LiteralNumberHex */ .chroma .mh { color: #bd93f9 } -/* LiteralNumberInteger */ .chroma .mi { color: #bd93f9 } -/* LiteralNumberIntegerLong */ .chroma .il { color: #bd93f9 } -/* LiteralNumberOct */ .chroma .mo { color: #bd93f9 } -/* Operator */ .chroma .o { color: #ff79c6 } -/* OperatorWord */ .chroma .ow { color: #ff79c6 } -/* Punctuation */ .chroma .p { } -/* Comment */ .chroma .c { color: #6272a4 } -/* CommentHashbang */ .chroma .ch { color: #6272a4 } -/* CommentMultiline */ .chroma .cm { color: #6272a4 } -/* CommentSingle */ .chroma .c1 { color: #6272a4 } -/* CommentSpecial */ .chroma .cs { color: #6272a4 } -/* CommentPreproc */ .chroma .cp { color: #ff79c6 } -/* CommentPreprocFile */ .chroma .cpf { color: #ff79c6 } -/* Generic */ .chroma .g { } -/* GenericDeleted */ .chroma .gd { color: #8b080b } -/* GenericEmph */ .chroma .ge { text-decoration: underline } -/* GenericError */ .chroma .gr { } -/* GenericHeading */ .chroma .gh { font-weight: bold } -/* GenericInserted */ .chroma .gi { font-weight: bold } -/* GenericOutput */ .chroma .go { color: #44475a } -/* GenericPrompt */ .chroma .gp { } -/* GenericStrong */ .chroma .gs { } -/* GenericSubheading */ .chroma .gu { font-weight: bold } -/* GenericTraceback */ .chroma .gt { } -/* GenericUnderline */ .chroma .gl { text-decoration: underline } -/* TextWhitespace */ .chroma .w { } - -.lntd:first-of-type > .chroma { - padding-right: 0; -} - -.chroma code { - font-family: 'Fira Code' !important; - font-size: 0.85em; - line-height: 1em; - background: none; - padding: 0; -} - -.chroma { - border-radius: 3px; - margin: 0; +/* Background */ .chroma { color: #f8f8f2; background-color: #282a36; overflow: hidden } +/* Other */ .chroma .x { } +/* Error */ .chroma .err { } +/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; } +/* LineTable */ .chroma .lntable { border-spacing: 0; padding: 0; margin: 0; border: 0; width: auto; overflow: auto; display: block; } +/* LineHighlight */ .chroma .hl { display: block; width: 100%;background-color: #ffffcc } +/* LineNumbersTable */ .chroma .lnt { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } +/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f } +/* Keyword */ .chroma .k { color: #ff79c6 } +/* KeywordConstant */ .chroma .kc { color: #ff79c6 } +/* KeywordDeclaration */ .chroma .kd { color: #8be9fd; font-style: italic } +/* KeywordNamespace */ .chroma .kn { color: #ff79c6 } +/* KeywordPseudo */ .chroma .kp { color: #ff79c6 } +/* KeywordReserved */ .chroma .kr { color: #ff79c6 } +/* KeywordType */ .chroma .kt { color: #8be9fd } +/* Name */ .chroma .n { } +/* NameAttribute */ .chroma .na { color: #50fa7b } +/* NameBuiltin */ .chroma .nb { color: #8be9fd; font-style: italic } +/* NameBuiltinPseudo */ .chroma .bp { } +/* NameClass */ .chroma .nc { color: #50fa7b } +/* NameConstant */ .chroma .no { } +/* NameDecorator */ .chroma .nd { } +/* NameEntity */ .chroma .ni { } +/* NameException */ .chroma .ne { } +/* NameFunction */ .chroma .nf { color: #50fa7b } +/* NameFunctionMagic */ .chroma .fm { } +/* NameLabel */ .chroma .nl { color: #8be9fd; font-style: italic } +/* NameNamespace */ .chroma .nn { } +/* NameOther */ .chroma .nx { } +/* NameProperty */ .chroma .py { } +/* NameTag */ .chroma .nt { color: #ff79c6 } +/* NameVariable */ .chroma .nv { color: #8be9fd; font-style: italic } +/* NameVariableClass */ .chroma .vc { color: #8be9fd; font-style: italic } +/* NameVariableGlobal */ .chroma .vg { color: #8be9fd; font-style: italic } +/* NameVariableInstance */ .chroma .vi { color: #8be9fd; font-style: italic } +/* NameVariableMagic */ .chroma .vm { } +/* Literal */ .chroma .l { } +/* LiteralDate */ .chroma .ld { } +/* LiteralString */ .chroma .s { color: #f1fa8c } +/* LiteralStringAffix */ .chroma .sa { color: #f1fa8c } +/* LiteralStringBacktick */ .chroma .sb { color: #f1fa8c } +/* LiteralStringChar */ .chroma .sc { color: #f1fa8c } +/* LiteralStringDelimiter */ .chroma .dl { color: #f1fa8c } +/* LiteralStringDoc */ .chroma .sd { color: #f1fa8c } +/* LiteralStringDouble */ .chroma .s2 { color: #f1fa8c } +/* LiteralStringEscape */ .chroma .se { color: #f1fa8c } +/* LiteralStringHeredoc */ .chroma .sh { color: #f1fa8c } +/* LiteralStringInterpol */ .chroma .si { color: #f1fa8c } +/* LiteralStringOther */ .chroma .sx { color: #f1fa8c } +/* LiteralStringRegex */ .chroma .sr { color: #f1fa8c } +/* LiteralStringSingle */ .chroma .s1 { color: #f1fa8c } +/* LiteralStringSymbol */ .chroma .ss { color: #f1fa8c } +/* LiteralNumber */ .chroma .m { color: #bd93f9 } +/* LiteralNumberBin */ .chroma .mb { color: #bd93f9 } +/* LiteralNumberFloat */ .chroma .mf { color: #bd93f9 } +/* LiteralNumberHex */ .chroma .mh { color: #bd93f9 } +/* LiteralNumberInteger */ .chroma .mi { color: #bd93f9 } +/* LiteralNumberIntegerLong */ .chroma .il { color: #bd93f9 } +/* LiteralNumberOct */ .chroma .mo { color: #bd93f9 } +/* Operator */ .chroma .o { color: #ff79c6 } +/* OperatorWord */ .chroma .ow { color: #ff79c6 } +/* Punctuation */ .chroma .p { } +/* Comment */ .chroma .c { color: #6272a4 } +/* CommentHashbang */ .chroma .ch { color: #6272a4 } +/* CommentMultiline */ .chroma .cm { color: #6272a4 } +/* CommentSingle */ .chroma .c1 { color: #6272a4 } +/* CommentSpecial */ .chroma .cs { color: #6272a4 } +/* CommentPreproc */ .chroma .cp { color: #ff79c6 } +/* CommentPreprocFile */ .chroma .cpf { color: #ff79c6 } +/* Generic */ .chroma .g { } +/* GenericDeleted */ .chroma .gd { color: #8b080b } +/* GenericEmph */ .chroma .ge { text-decoration: underline } +/* GenericError */ .chroma .gr { } +/* GenericHeading */ .chroma .gh { font-weight: bold } +/* GenericInserted */ .chroma .gi { font-weight: bold } +/* GenericOutput */ .chroma .go { color: #44475a } +/* GenericPrompt */ .chroma .gp { } +/* GenericStrong */ .chroma .gs { } +/* GenericSubheading */ .chroma .gu { font-weight: bold } +/* GenericTraceback */ .chroma .gt { } +/* GenericUnderline */ .chroma .gl { text-decoration: underline } +/* TextWhitespace */ .chroma .w { } + +.lntd:first-of-type > .chroma { + padding-right: 0; +} + +.chroma code { + font-family: 'Fira Code' !important; + font-size: 0.85em; + line-height: 1em; + background: none; + padding: 0; +} + +.chroma { + border-radius: 3px; + margin: 0; } \ No newline at end of file diff --git a/config.toml b/config.toml index e4e06bc77..2317b8719 100644 --- a/config.toml +++ b/config.toml @@ -1,30 +1,30 @@ -baseURL = "https://jethughes.github.io/quartz/" -languageCode = "en-us" -googleAnalytics = "G-XYFD95KB4J" -pygmentsUseClasses = true -relativeURLs = false -disablePathToLower = true -ignoreFiles = [ - "/content/templates/*", - "/content/private/*", -] -summaryLength = 20 -paginate = 10 -enableGitInfo = true - -[markup] - [markup.tableOfContents] - endLevel = 3 - ordered = true - startLevel = 2 - [markup.highlight] - anchorLineNos = false - codeFences = true - guessSyntax = true - hl_Lines = "" - lineAnchors = "" - lineNoStart = 1 - lineNos = true - lineNumbersInTable = true - style = "dracula" - tabWidth = 4 +baseURL = "https://jethughes.github.io/quartz/" +languageCode = "en-us" +googleAnalytics = "G-XYFD95KB4J" +pygmentsUseClasses = true +relativeURLs = false +disablePathToLower = true +ignoreFiles = [ + "/content/templates/*", + "/content/private/*", +] +summaryLength = 20 +paginate = 10 +enableGitInfo = true + +[markup] + [markup.tableOfContents] + endLevel = 3 + ordered = true + startLevel = 2 + [markup.highlight] + anchorLineNos = false + codeFences = true + guessSyntax = true + hl_Lines = "" + lineAnchors = "" + lineNoStart = 1 + lineNos = true + lineNumbersInTable = true + style = "dracula" + tabWidth = 4 diff --git a/content/.obsidian.vimrc b/content/.obsidian.vimrc index be6f253f7..d3ba6d49b 100644 --- a/content/.obsidian.vimrc +++ b/content/.obsidian.vimrc @@ -1,4 +1,4 @@ -nmap j gj -nmap k gk - +nmap j gj +nmap k gk + unmap \ No newline at end of file diff --git a/content/_index.md b/content/_index.md index 47bda97e5..e50cbe4ac 100644 --- a/content/_index.md +++ b/content/_index.md @@ -11,4 +11,21 @@ title: "Jet Hughes" # 2 Other -- [templates](notes/templates.md) \ No newline at end of file +- [templates](notes/templates.md) + +# 3 Projects + +- [bug-tracker](notes/bug-tracker.md) +- + +# 5 Independent Learning + +- [networks](notes/networks.md) +- random + - [propogation-of-ideas](notes/propogation-of-ideas.md) + - [model-view-controller-pattern](notes/model-view-controller-pattern.md) + - [dotnet](notes/dotnet.md) + +# 6 Books + +- The book of illusions diff --git a/content/cheatsheets/bash-tricks.md b/content/cheatsheets/bash-tricks.md index 1af48dccd..310dab042 100644 --- a/content/cheatsheets/bash-tricks.md +++ b/content/cheatsheets/bash-tricks.md @@ -1,3 +1,5 @@ +#cheatsheet + **Busy waiting ``` diff --git a/content/daily_notes/2022-04-12.md b/content/daily_notes/2022-04-12.md index 09be75df9..eefb4d3c8 100644 --- a/content/daily_notes/2022-04-12.md +++ b/content/daily_notes/2022-04-12.md @@ -11,7 +11,7 @@ Synchronicity - The Police - spotify:album:28eOriEfl7IGbQDNvWIWXK - [ ] info 201 lab 04 - [ ] info 201 lab 06 - [ ] change testing of contrast and brightness andie -- [ ] fix 203 notes for disability services +- [x] upload 203 notes for disability services - [ ] work through 202 labs - [ ] 04 - [ ] 05 @@ -21,8 +21,8 @@ Synchronicity - The Police - spotify:album:28eOriEfl7IGbQDNvWIWXK - [x] 10:00 Info203 Lecture - [x] 11:00 Cosc201 Lecture -- [ ] 13:00 Info201 Lecture -- [ ] 14:00 Cosc202 Lab +- [x] 13:00 Info201 Lecture +- [x] 14:00 Cosc202 Lab ## Assignments - Mobile app diff --git a/content/daily_notes/2022-04-13.md b/content/daily_notes/2022-04-13.md new file mode 100644 index 000000000..238b1a863 --- /dev/null +++ b/content/daily_notes/2022-04-13.md @@ -0,0 +1,47 @@ +[[notes/daily-notes]] + +--- + +# 2022-04-13 + +Listen Without Prejudice Vol. 1 - George Michael - spotify:album:4lGS8HxU3NYaQxfU0wx2r1 + +## Todos +- [ ] remote desktop for IT work +- [ ] info 201 lab 04 +- [ ] info 201 lab 06 +- [ ] change testing of contrast and brightness andie +- [ ] work through 202 labs + - [ ] 04 + - [ ] 05 + - [ ] 06 + +## Lecture/Labs + +- [x] 10:00 Info203 Lecture +- [ ] 14:00 Info203 Tutorial +- [ ] 16:00 Cosc201 Tutorial + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) diff --git a/content/daily_notes/2022-04-14.md b/content/daily_notes/2022-04-14.md new file mode 100644 index 000000000..09da82958 --- /dev/null +++ b/content/daily_notes/2022-04-14.md @@ -0,0 +1,49 @@ +[[notes/daily-notes]] + +--- + +# 2022-04-14 + +Happy Sad - Tim Buckley - spotify:album:20CYfxjKvqXkCXBhAgOE39 + +## Todos +- [ ] remote desktop for IT work +- [ ] info 201 lab 04 +- [ ] info 201 lab 06 +- [ ] change testing of contrast and brightness andie +- [ ] work through 202 labs + - [ ] 04 + - [ ] 05 + - [ ] 06 +- [ ] 14:00 Info203 Tutorial +- [ ] 16:00 Cosc201 Tutorial + +## Lecture/Labs + +- [ ] 11:00 Cosc202 Lecture +- [ ] 12:00 Cosc201 Lab +- [ ] 16:00 Info201 Lecture + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) diff --git a/content/daily_notes/2022-04-15.md b/content/daily_notes/2022-04-15.md new file mode 100644 index 000000000..ae40d15c6 --- /dev/null +++ b/content/daily_notes/2022-04-15.md @@ -0,0 +1,49 @@ +[[notes/daily-notes]] + +--- + +# 2022-04-15 + +Smile - Brian Wilson - spotify:album:4Uc6YCjpfyjj02rZfg2EUv + +## Todos +- [ ] remote desktop for IT work +- [ ] info 201 lab 04 +- [ ] info 201 lab 06 +- [ ] change testing of contrast and brightness andie +- [ ] work through 202 labs + - [ ] 04 + - [ ] 05 + - [ ] 06 +- [ ] 14:00 Info203 Tutorial +- [ ] 16:00 Cosc201 Tutorial +- [ ] 11:00 Cosc202 Lecture +- [ ] 12:00 Cosc201 Lab +- [ ] 16:00 Info201 Lecture + +## Lecture/Labs + + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-16.md b/content/daily_notes/2022-04-16.md new file mode 100644 index 000000000..b72304db3 --- /dev/null +++ b/content/daily_notes/2022-04-16.md @@ -0,0 +1,50 @@ +[[notes/daily-notes]] + +--- + +# 2022-04-16 + +No Sleep 'Til Hammersmith (Live) - Mot�rhead - spotify:album:6DJEPyUk9Vqvq5Rh8HD7D8 + +## Todos +- [ ] remote desktop for IT work +- [ ] info 201 lab 04 +- [ ] info 201 lab 06 +- [ ] change testing of contrast and brightness andie +- [ ] work through 202 labs + - [ ] 04 + - [ ] 05 + - [ ] 06 +- [ ] 14:00 Info203 Tutorial +- [ ] 16:00 Cosc201 Tutorial +- [ ] 11:00 Cosc202 Lecture +- [ ] 12:00 Cosc201 Lab +- [ ] 16:00 Info201 Lecture + +## Lecture/Labs + + + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-18.md b/content/daily_notes/2022-04-18.md new file mode 100644 index 000000000..ed2558835 --- /dev/null +++ b/content/daily_notes/2022-04-18.md @@ -0,0 +1,50 @@ +[[notes/daily-notes]] + +--- + +# 2022-04-18 + +Tonight's The Night - Neil Young - spotify:album:5FTx6W84UUU14n29QV4saY + +## Todos +- [ ] remote desktop for IT work +- [ ] info 201 lab 04 +- [ ] info 201 lab 06 +- [ ] change testing of contrast and brightness andie +- [ ] work through 202 labs + - [ ] 04 + - [ ] 05 + - [ ] 06 +- [ ] 14:00 Info203 Tutorial +- [ ] 16:00 Cosc201 Tutorial +- [ ] 11:00 Cosc202 Lecture +- [ ] 12:00 Cosc201 Lab +- [ ] 16:00 Info201 Lecture + +## Lecture/Labs + +- [ ] 11:00 Cosc202 Lecture +- [ ] 12:00 Cosc201 lab + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- bug-tracker + - + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-19.md b/content/daily_notes/2022-04-19.md new file mode 100644 index 000000000..e4a38071c --- /dev/null +++ b/content/daily_notes/2022-04-19.md @@ -0,0 +1,42 @@ +[2022-04-18](daily_notes/2022-04-18) << [[notes/daily-notes]] >> [2022-04-20](daily_notes/2022-04-20) + +--- + +# 2022-04-19 + +Giant Steps - The Boo Radleys - spotify:album:6347aGYak5Dsi0hwPMMpmj + +## Todos +- [ ] info 201 lab 04 +- [ ] info 201 lab 06 +- [ ] work through 202 labs + - [ ] 04 + - [ ] 05 + - [ ] 06 +- [ ] 16:00 Cosc201 Tutorial + +## Lecture/Labs + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-20.md b/content/daily_notes/2022-04-20.md new file mode 100644 index 000000000..383cfbd12 --- /dev/null +++ b/content/daily_notes/2022-04-20.md @@ -0,0 +1,42 @@ +[2022-04-19](daily_notes/2022-04-19) << [[notes/daily-notes]] >> [2022-04-21](daily_notes/2022-04-21) + +--- + +# 2022-04-20 + +Giant Steps - The Boo Radleys - spotify:album:6347aGYak5Dsi0hwPMMpmj + +## Todos +- [ ] info 201 lab 04 +- [ ] info 201 lab 06 +- [ ] work through 202 labs + - [ ] 04 + - [ ] 05 + - [ ] 06 +- [ ] 16:00 Cosc201 Tutorial + +## Lecture/Labs + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-21.md b/content/daily_notes/2022-04-21.md new file mode 100644 index 000000000..afa419424 --- /dev/null +++ b/content/daily_notes/2022-04-21.md @@ -0,0 +1,37 @@ +[2022-04-22](daily_notes/2022-04-22) << [daily-notes](notes/daily-notes.md) >> [2022-04-24](daily_notes/2022-04-24) + +--- + +# 23-04-22 + +John Barleycorn Must Die - Traffic - spotify:album:2TjodugH6rA5ZHPsWVErmw + +## Todos + +## Lecture/Labs + + + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-23.md b/content/daily_notes/2022-04-23.md new file mode 100644 index 000000000..bd5d584c4 --- /dev/null +++ b/content/daily_notes/2022-04-23.md @@ -0,0 +1,33 @@ +[2022-04-22](daily_notes/2022-04-22) << [daily-notes](notes/daily-notes.md) >> [2022-04-24](daily_notes/2022-04-24) + +--- + +# 2022-04-23 + +## Todos + +## Lecture/Labs + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-24.md b/content/daily_notes/2022-04-24.md new file mode 100644 index 000000000..82241b40f --- /dev/null +++ b/content/daily_notes/2022-04-24.md @@ -0,0 +1,37 @@ +[2022-04-22](daily_notes/2022-04-22) << [daily-notes](notes/daily-notes.md) >> [2022-04-24](daily_notes/2022-04-25) + +--- + +# 23-04-22 + +John Barleycorn Must Die - Traffic - spotify:album:2TjodugH6rA5ZHPsWVErmw + +## Todos + +## Lecture/Labs + + + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Timetable + +![[Pasted image 20220311102444.png]] + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-25.md b/content/daily_notes/2022-04-25.md new file mode 100644 index 000000000..7be7d998f --- /dev/null +++ b/content/daily_notes/2022-04-25.md @@ -0,0 +1,36 @@ +[2022-04-25](daily_notes/2022-04-25) << [daily-notes](notes/daily-notes.md) >> [2022-04-27](daily_notes/2022-04-27) + +--- + +# 26-04-22 + +Selected Ambient Works 85-92 - Aphex Twin - spotify:album:7aNclGRxTysfh6z0d8671k + +## Todos + +## Lecture/Labs + +- [ ] 10:00 Info203 Lecture +- [ ] 11:00 Cosc201 Lecture +- [ ] 13:00 Info201 Lecture +- [ ] 14:00 Cosc202 Lab + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-26.md b/content/daily_notes/2022-04-26.md new file mode 100644 index 000000000..d9f1b24e4 --- /dev/null +++ b/content/daily_notes/2022-04-26.md @@ -0,0 +1,39 @@ +[2022-04-24](daily_notes/2022-04-24) << [daily-notes](notes/daily-notes.md) >> [2022-04-27](daily_notes/2022-04-27) + +--- + +# 26-04-22 + +Selected Ambient Works 85-92 - Aphex Twin - spotify:album:7aNclGRxTysfh6z0d8671k + +## Todos +- book (or not) flights for holiday +- watch 203 videos +- [Plan](private/Plan.md) + +## Lecture/Labs + +- [x] 10:00 Info203 Lecture +- [x] 11:00 Cosc201 Lecture +- [x] 13:00 Info201 Lecture +- [ ] 14:00 Cosc202 Lab + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review +- CI notes site +- my own password manager + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-27.md b/content/daily_notes/2022-04-27.md new file mode 100644 index 000000000..409462d59 --- /dev/null +++ b/content/daily_notes/2022-04-27.md @@ -0,0 +1,36 @@ +[2022-04-26](daily_notes/2022-04-26) << [daily-notes](notes/daily-notes.md) >> [2022-04-28](daily_notes/2022-04-28) + +--- + +# 27-04-22 + +Cee-Lo Green... Is The Soul Machine - Cee Lo Green - spotify:album:0wdleLMeNmGUHChsmx9svt + +## Todos +- [ ] 14:00 Cosc202 Lab +- [ ] use 1001 albums api + +## Lecture/Labs + +- [x] 10:00 Info203 Lecture +- [x] 14:00 Info203 Tutorial +- [x] 16:00 Cosc201 Tutorial + +## Assignments +- Mobile app +* c201 ass +* i201 ass + +## Projects +- python ai weekly review + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/daily_notes/2022-04-28.md b/content/daily_notes/2022-04-28.md new file mode 100644 index 000000000..c8536211c --- /dev/null +++ b/content/daily_notes/2022-04-28.md @@ -0,0 +1,35 @@ +[2022-04-27](daily_notes/2022-04-27) << [daily-notes](notes/daily-notes.md) >> [2022-04-29](daily_notes/2022-04-29) + +--- + +# 28-04-22 + +Dr. Octagonecologyst - Dr. Octagon - spotify:album:23DJ3KNE5JXi61G31T2Kni + +## Todos +- [ ] 14:00 Cosc202 Lab +- [ ] use 1001 albums api + +## Lecture/Labs + +- [ ] 11:00 Cosc202 Lecture +- [ ] 12:00 Cosc201 Lab +- [ ] 16:00 Info201 Lecture + +## Assignments +- Mobile app + - Brainstorming + +## Projects +- python ai weekly review + +## Links + +### cosc 202 + +[lab book](https://cosc202.cspages.otago.ac.nz/lab-book/COSC202LabBook.pdf) + +### info 201 + +- [cousework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) +- [Assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/INFO201_Assignments.html) \ No newline at end of file diff --git a/content/notes/03-agile-methodologies.md b/content/notes/03-agile-methodologies.md new file mode 100644 index 000000000..45a967874 --- /dev/null +++ b/content/notes/03-agile-methodologies.md @@ -0,0 +1,29 @@ +--- +title: "03-agile-methodologies" +aliases: +tags: +- info201 +- lecture +sr-due: 2022-05-17 +sr-interval: 24 +sr-ease: 290 +--- + +> guilding philosphy to develop info systems in unkown, rapidly changing evnironments + +"Chaordic" + +[The agile manifesto](https://www.agilealliance.org/agile101/the-agile-manifesto) + +# 1 [scrum](notes/scrum.md) +Development is split into many short (~30 day) "sprints" of intense focus where the entire team is involved + +# 2 [Extreme Programming](notes/extreme-programming.md) (XP) +taking current industry practices to the extreme + +# 3 [Unified Processes](notes/unified-processes.md) (UP) +Interative and incremental architecture-centric which has four main phases +- inception +- elaboration +- construction +- transition diff --git a/content/notes/04-evaluation-methods-birth-of-hci.md b/content/notes/04-evaluation-methods-birth-of-hci.md new file mode 100644 index 000000000..0266e83cb --- /dev/null +++ b/content/notes/04-evaluation-methods-birth-of-hci.md @@ -0,0 +1,20 @@ +--- +title: "04-evaluation-methods-birth-of-hci" +sr-due: 2022-05-22 +sr-interval: 40 +sr-ease: 230 +aliases: +tags: +- info203 +- lecture +--- + +- [evaluating-designs](notes/evaluating-designs.md) +- [birth-of-hci](notes/birth-of-hci.md) + +Possible exam questions +- Define User Experience! +- Difference User Experience - Usability +- Describe applications where the subject’s satisfaction is of less importance than effectiveness and efficiency +- Compare the advantages and disadvantages of a laboratory based and a field based evaluation of a user interface? +- Describe the different characteristics of quantitative and qualitative measurements in HCI! \ No newline at end of file diff --git a/content/notes/04-requirements.md b/content/notes/04-requirements.md index bc3c2a5cb..4b8fb9e12 100644 --- a/content/notes/04-requirements.md +++ b/content/notes/04-requirements.md @@ -3,9 +3,9 @@ title: "04-requirements" tags: - info201 - lecture -sr-due: 2022-04-13 -sr-interval: 2 -sr-ease: 230 +sr-due: 2022-05-29 +sr-interval: 32 +sr-ease: 250 --- [requirements](notes/requirements.md) diff --git a/content/notes/07-mergesort-1.md b/content/notes/07-mergesort-1.md index bbb896961..c28c4c800 100644 --- a/content/notes/07-mergesort-1.md +++ b/content/notes/07-mergesort-1.md @@ -1,36 +1,15 @@ --- title: "07-mergesort-1" -sr-due: 2022-04-26 -sr-interval: 23 +sr-due: 2022-06-22 +sr-interval: 57 sr-ease: 250 tags: - cosc201 - lecture --- -[mergeosrt](notes/mergeosrt.md) +[mergesort](notes/mergesort.md) -#unfinished +[quicksort](notes/quicksort.md) -# 1 Divide and conquer - -1. pre ⇒ break apartinto two or more smaller problems whose size add up to at most n -2. Rec ⇒ solve those problems recursively -3. post ⇒ combine solutions into a solution of the original problem - -## 1.1 quicksort - -pre ⇒ select pivot and split the array - -rec ⇒ apply quicksort to the partitions - -post ⇒ not much - -designeds when sorting inplace was important - -works best of primitive types as they can be stored in the fastest memory location - -- memory access can be localised and the comparisions are direct -- those advantages are limited when sorting objects of reference type -- i that case each element of the array is just a reference to where the object really is -- so there are no local access advantages \ No newline at end of file +[divide-and-conquer](notes/divide-and-conquer.md) diff --git a/content/notes/08-business-patterns.md b/content/notes/08-business-patterns.md index 969bdc380..d43649346 100644 --- a/content/notes/08-business-patterns.md +++ b/content/notes/08-business-patterns.md @@ -1,8 +1,11 @@ --- title: "08-business-patterns" +sr-due: 2022-05-19 +sr-interval: 37 +sr-ease: 270 tags: - info201 - lecture --- -[[notes/entity-relationship-diagrams]] +[entity-relationship-diagrams](notes/entity-relationship-diagrams.md) \ No newline at end of file diff --git a/content/notes/08-mergesort-2.md b/content/notes/08-mergesort-2.md index d7cb7dc2d..309af509b 100644 --- a/content/notes/08-mergesort-2.md +++ b/content/notes/08-mergesort-2.md @@ -8,4 +8,4 @@ tags: - lecture --- -[mergeosrt](notes/mergeosrt.md) +[mergesort](notes/mergesort.md) diff --git a/content/notes/09-data-modelling-and-normalisation.md b/content/notes/09-data-modelling-and-normalisation.md index 329931074..abbe6bc7f 100644 --- a/content/notes/09-data-modelling-and-normalisation.md +++ b/content/notes/09-data-modelling-and-normalisation.md @@ -3,6 +3,13 @@ title: "09-data-modelling-and-normalisation" tags: - info201 - lecture +sr-due: 2022-04-30 +sr-interval: 3 +sr-ease: 250 --- +- [redundancy-and-anomalies](notes/redundancy-and-anomalies.md) +- [dependencies](notes/dependencies.md) +- [normalisation](notes/normalisation.md) + diff --git a/content/notes/09-documentation.md b/content/notes/09-documentation.md index 7e8413b61..14ba433f1 100644 --- a/content/notes/09-documentation.md +++ b/content/notes/09-documentation.md @@ -3,6 +3,9 @@ title: "09-documentation" tags: - cosc202 - lecture +sr-due: 2022-05-21 +sr-interval: 28 +sr-ease: 290 --- -[[notes/documentation]] +[documentation](notes/documentation.md) \ No newline at end of file diff --git a/content/notes/09-paper-prototypes-wiz-of-oz-video-prototypes.md b/content/notes/09-paper-prototypes-wiz-of-oz-video-prototypes.md index d3653f7f9..eab1f8abb 100644 --- a/content/notes/09-paper-prototypes-wiz-of-oz-video-prototypes.md +++ b/content/notes/09-paper-prototypes-wiz-of-oz-video-prototypes.md @@ -3,6 +3,9 @@ title: "09-paper-prototypes-wiz-of-oz-video-prototypes" tags: - info203 - lecture +sr-due: 2022-05-23 +sr-interval: 26 +sr-ease: 270 --- - [wizard-of-oz](notes/wizard-of-oz.md) diff --git a/content/notes/10-heaps-and-heapsort.md b/content/notes/10-heaps-and-heapsort.md index ee0a99c2c..d7504635f 100644 --- a/content/notes/10-heaps-and-heapsort.md +++ b/content/notes/10-heaps-and-heapsort.md @@ -1,8 +1,8 @@ --- title: "10-heaps-and-heapsort" -sr-due: 2022-04-18 -sr-interval: 9 -sr-ease: 250 +sr-due: 2022-06-04 +sr-interval: 42 +sr-ease: 270 tags: - cosc201 - lecture @@ -11,7 +11,6 @@ tags: [heaps-and-heapsort](notes/heaps-and-heapsort.md) - ## 0.1 Overview [[notes/heap]] @@ -66,7 +65,7 @@ So both loops do most Ο(lg n) ### 0.2.4 Storage ![](https://i.imgur.com/04qVrGQ.png#invert) - - Array +- Array - root at position 0 and children at 1 and 2 - children of 1 to in 3 and 4, children of 2 go in 5 and 6 diff --git a/content/notes/11-class-diagrams.md b/content/notes/11-class-diagrams.md new file mode 100644 index 000000000..82fb81766 --- /dev/null +++ b/content/notes/11-class-diagrams.md @@ -0,0 +1,145 @@ +--- +title: "11-class-diagrams" +aliases: Class Diagrams +tags: +- info201 +- lecture +sr-due: 2022-05-05 +sr-interval: 20 +sr-ease: 250 +--- + +[Class Diagrams](notes/11-class-diagrams.md) + +e.g., ![](https://i.imgur.com/rFmUs5r.png) +![](https://i.imgur.com/1kO9BDk.png) + + +## 1 Stereotypes +add further meaning to fields and methods +- e.g., << unique >>, << abstrat >>, << interface >>, + +## 2 Packages +group classes together +break system to logical chunks +package diagram, a class diagram with nothing but packages + +![](https://i.imgur.com/UiXZeha.png) + +## 3 Associations +UML anaglogue of ERD relationsips +- multiplicity +- realtionshpa nd role names + +PlUS +- naviagability --> instances of one class can pass messages to instances of another +- several differnt types, e.g., composition, aggregation, associateive classes + +### 3.1 multuplicity +![](https://i.imgur.com/1dSergW.png) +![](https://i.imgur.com/4TKsBKd.png) + +ERDsd effectively only do zero one many +UML can to any non negative integer +default is 1 + +### 3.2 association names +![](https://i.imgur.com/btif86K.png) + +- usuallya verb phrase like "assings", "manages", "enrols in" ... +- more useful is conpetual level diagrams +- optional arrow head () + +### 3.3 Role names +![](https://i.imgur.com/3HEG9yN.png) + +At conceptual level, indicates role of class in association. + +At implementation level: +- implies a field in class at opposite end +- should include visibility +- closely related to navigability + +### 3.4 Navigability +![](https://i.imgur.com/beoNmcQ.png) + +specifies whether we can "navigate from one end of an association to another" +affects how we code access paths between objects + +e.g., +- loan instance can see loanitem instances it contains via private field items +- a loanitem instance can't see loan instance that contains it +- must alwasy include relevant role names +- no arrows = two arrows = bidirectional + +#### 3.4.1 why not always bidirectional + +- more complex code --> many references/collections to manage +- navigation paths are not all equally important + - e.g., "what items are in this loan" vs "what loans does this item appear in" + - determined by requrements and typical usage +- some classes are more "central" + - usually at the "one" end of accociations + - often represent transactional entities e.g., loan, sale, order + - navigability readiates outwards from them + +there are exceptions as always e.g., patron <-> item + + +### 3.5 Aggregation +![](https://i.imgur.com/FI21bfD.png) + +one class is made up of one or more other classes +container and content instances _can_ exist separately +usually implied by multiplicity and navigability + +e.g., +- computer is made u of several components +- library catalogue is made up of many items + + +### 3.6 Composition +![](https://i.imgur.com/2ryJXSM.png) + +stonger form of aggregation +container and content _cannot_ exist separately +usually implied by multiplicity and navigability + +e.g., +- building contains many rooms +- loan includes several items + +- coicident lifetime +- multiplicity at least 1 at both ends +- deleting an containter must also delete all associated contents +- creating a container should also create some contents + + +### 3.7 Associative classes +![](https://i.imgur.com/Rq91xGx.png) +![](https://i.imgur.com/zzOlLV1.png) + +- used for conceptual design +- similar to associative entities + - many to many relationship with additional independent fields + - resolved into class at implementation level + +### 3.8 Specialisation generalisation +![](https://i.imgur.com/kfI2YSe.png) + +class inheritance +- e.g., book and disc are subclasses of (specialise) Item +- inherit all public fields and methods of superclass +- can add their own fields and methods +- Compare with specialisation of actors and use cases + +## 4 Domain class model\ +![](https://i.imgur.com/JFHQOFA.png) + +only modles the associations among concepts from problem domain + +can be at conceptual level or implementation level + +## 5 System class model +![](https://i.imgur.com/KsQuCd5.png) +Models associations among domain objects and system components; implementation level only diff --git a/content/notes/11-continuous-integration-2.md b/content/notes/11-continuous-integration-2.md index e2c34d95b..b8936d81f 100644 --- a/content/notes/11-continuous-integration-2.md +++ b/content/notes/11-continuous-integration-2.md @@ -1,14 +1,14 @@ --- title: "11-continuous-integration-2" -sr-due: 2022-04-19 -sr-interval: 10 -sr-ease: 250 +sr-due: 2022-06-06 +sr-interval: 44 +sr-ease: 270 tags: - cosc202 - lecture --- -1. Apprecitae that GitLab is a complex software +1. Appreciate that GitLab is a complex software 2. Understand where CI jobs scripts get run 3. explain why repository servers can host websites 4. Understand how gitblab dternmimines awhen a CI script failed diff --git a/content/notes/11-design-heuristics-2.md b/content/notes/11-design-heuristics-2.md index c01cf2173..e6208f66d 100644 --- a/content/notes/11-design-heuristics-2.md +++ b/content/notes/11-design-heuristics-2.md @@ -3,49 +3,12 @@ title: "11-design-heuristics-2" tags: - info203 - lecture +sr-due: 2022-05-01 +sr-interval: 16 +sr-ease: 280 --- -## 1 Show system status -- show system stats - -- feedback depends on response time - - <1s just show outcome - - ~1s feedback that activity is underway - - >>1s show fractional progress time - -- 0.1 seconds --> feels instantaneusly -- 1 second --> about the limit for flow to be uinteruippted -- 10 seeconds --> the limit for keeping users attention - -when: -- when action is requried -- show storage space -- making changes -- next steps --> user input required -- completion --> some task has finished - -![](https://i.imgur.com/QzHRh9Z.png) - -## 2 familiar metaphors and language -![](https://i.imgur.com/sdNv98E.png) -![](https://i.imgur.com/IbIBK5t.png) - -imitating familiar real life - -Categories -- good - - ![](https://i.imgur.com/7wRRBii.png) -- bad - - ![](https://i.imgur.com/vDKOuOo.png) - -## 3 user freedom and control - -wan tt ogive th user the feelin thtey can freelyi explore the app -and the freeodm to control i it - -- general flow -- undo/redo - -e.g., ![](https://i.imgur.com/zF5LDVx.png) -e.g., ![](https://i.imgur.com/eqfs1D6.png) +- [Show System Status](notes/show-system-status.md) +- [Familiar Metaphors And Language](notes/familiar-metaphors-and-language.md) +- [User Freedom And Control](notes/user-freedom-and-control.md) diff --git a/content/notes/11-sets-maps-trees.md b/content/notes/11-sets-maps-trees.md index 2143041f0..5a2b9ae49 100644 --- a/content/notes/11-sets-maps-trees.md +++ b/content/notes/11-sets-maps-trees.md @@ -3,13 +3,13 @@ title: "11-sets-maps-trees" tags: - cosc201 - lecture -sr-due: 2022-04-12 -sr-interval: 3 -sr-ease: 250 +sr-due: 2022-05-26 +sr-interval: 33 +sr-ease: 270 --- -A [set](notes/set.md) is a collection of elements with no repetition allowed +A [set](notes/set.md) is :: a collection of elements with no repetition allowed -A [hash-map](notes/hash-map.md) is a set of key value pairs +A [hash-map](notes/hash-map.md) is :: a set of key value pairs -A [tree](notes/tree.md) is a general concept of a way of organising data. \ No newline at end of file +A [tree](notes/tree.md) is :: a general concept of a way of organising data. diff --git a/content/notes/11-trees-and-ordered-sets.md b/content/notes/11-trees-and-ordered-sets.md deleted file mode 100644 index b4c96d6fb..000000000 --- a/content/notes/11-trees-and-ordered-sets.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: "11-trees-and-ordered-sets" -tags: -- cosc201 -- lecture ---- - - - diff --git a/content/notes/12-automation.md b/content/notes/12-automation.md index 3fccb2925..4507c787e 100644 --- a/content/notes/12-automation.md +++ b/content/notes/12-automation.md @@ -3,9 +3,9 @@ title: "12-automation" tags: - cosc202 - lecture -sr-due: 2022-04-20 -sr-interval: 9 -sr-ease: 250 +sr-due: 2022-05-30 +sr-interval: 37 +sr-ease: 270 --- links: [cosc-202-lectures](notes/cosc-202-lectures.md), [slides](https://cosc202.cspages.otago.ac.nz/lectures/L12-automation.pdf) diff --git a/content/notes/12-binary-search-tree-operations.md b/content/notes/12-binary-search-tree-operations.md index f262c200e..64bcf7f7b 100644 --- a/content/notes/12-binary-search-tree-operations.md +++ b/content/notes/12-binary-search-tree-operations.md @@ -3,9 +3,9 @@ title: "12-binary-search-tree-operations" tags: - cosc201 - lecture -sr-due: 2022-04-12 -sr-interval: 3 -sr-ease: 250 +sr-due: 2022-05-27 +sr-interval: 34 +sr-ease: 270 --- Recall [binary-search-tree](notes/binary-search-tree.md) diff --git a/content/notes/12-design-heuristics-3.md b/content/notes/12-design-heuristics-3.md index bdee8e18a..b3ce31f4c 100644 --- a/content/notes/12-design-heuristics-3.md +++ b/content/notes/12-design-heuristics-3.md @@ -3,118 +3,13 @@ title: "12-design-heuristics-3" tags: - info203 - lecture +sr-due: 2022-05-20 +sr-interval: 27 +sr-ease: 290 --- -# 1 Consistency and standards - -![](https://i.imgur.com/H8rlxo7.png) - -good and bad -- standards (user interface guidelines) are always chaning - -differ between platforms -evolve over time - -e.g., menus - -![](https://i.imgur.com/IfaMADw.png) -![](https://i.imgur.com/HqYzadh.png) - -general look of webpages evolves over time - -### 1.1 Naming and teminology - -![](https://i.imgur.com/3PwEOmn.png) - -this is bad -you can ask users which categories they understand/know about - -### 1.2 Data loss -![](https://i.imgur.com/23IxWiN.png) - -standard to minimise loss - -## 2 Error Prevention - -### 2.1 Bad input - -![](https://i.imgur.com/54tVH7B.png) - -correct human errors -auto completion - -### 2.2 helpful constraints - -![](https://i.imgur.com/n4HT5L9.png) - -### 2.3 Suggestions and autocorrection - -![](https://i.imgur.com/c2l9MWy.png) - -heavily abused by industry -- they can influence suggestions - -### 2.4 Forgiving formatting - -![](https://i.imgur.com/ldZUMer.png) - -- reduce errors -- - -## 3 recognition over recall - -### 3.1 avoid codes - -![](https://i.imgur.com/B8sJxd6.png) - -### 3.2 Recognition with previews or icons - -![](https://i.imgur.com/UBmJl6Y.png) - -### 3.3 use icons that promote recognition - -![](https://i.imgur.com/adjt5nv.png) - -## 4 Flexibility and efficiency - -### 4.1 Choices - -![](https://i.imgur.com/lUBB7EN.png#invert) -![](https://i.imgur.com/1OaTaPg.png#invert) -![](https://i.imgur.com/8KaFDme.png#invert) - -something with immediate effect can use switch -![](https://i.imgur.com/COR8E7w.png#invert) - -![](https://i.imgur.com/EQbB1Ep.png#invert) -![](https://i.imgur.com/QhFssbP.png#invert) -![](https://i.imgur.com/PG2Iu9a.png#invert) - -good defaults - -![](https://i.imgur.com/pj5Ztij.png) - -4.2 shortcuts and advanced options - -![](https://i.imgur.com/0OG7qRx.png) - -ambient information - -![](https://i.imgur.com/s2zyIws.png) - -proactivity - -![](https://i.imgur.com/gmDLWMO.png) -![](https://i.imgur.com/Izu8bQX.png) -![](https://i.imgur.com/hiGeXW3.png) - -## 5 aesthetic and minimalistic design - -![](https://i.imgur.com/Oywxwgq.png) -![](https://i.imgur.com/xgfgEtm.png) - -signal to noise - -![](https://i.imgur.com/6bLaHS6.png) -![](https://i.imgur.com/qF21SST.png) - +- [Consistency And Standards](notes/consistency-and-standards.md) +- [Error Prevention](notes/error-prevention.md) +- [Recognition Over Recall](notes/recognition-over-recall.md) +- [flexibility-and-efficiency](notes/flexibility-and-efficiency.md) +- [Aesthetic and Minimalist Design](notes/aesthetic-and-minimalist-design.md) diff --git a/content/notes/12-modelling-behaviour.md b/content/notes/12-modelling-behaviour.md index ecea35fda..89c4d9841 100644 --- a/content/notes/12-modelling-behaviour.md +++ b/content/notes/12-modelling-behaviour.md @@ -1,19 +1,36 @@ --- title: "12-modelling-behaviour" tags: -- cosc201 +- info201 - lecture -sr-due: 2022-04-13 -sr-interval: 2 -sr-ease: 230 +sr-due: 2022-05-28 +sr-interval: 31 +sr-ease: 250 --- [slides](https://blackboard.otago.ac.nz/bbcswebdav/pid-2892846-dt-content-rid-18407618_1/courses/INFO201_S1DNIE_2022/2022/lectures/lecture_12_slides.pdf) +[modelling-behaviour](notes/modelling-behaviour.md) + - method signatures - inheritance of behaviour - lower level sequencing and flow of control - compartmentalisation into "subsystems" +1. Compare and contrast the two typical approaches to inheriting behaviour in OO systems. +2. What does it mean to “program to an interface” and why is this important? +3. Compare and contrast “rich” versus “anaemic” domain models with regards to behaviour. +4. Give an example of a “processor” in the context of OO system design and explain why these are useful. + + + + + + + + + + +# Garbage Notes # 1 Example of Linked UML (not realistic) ![](https://i.imgur.com/SAp9l60.png) @@ -181,11 +198,4 @@ Anything coded to work with Collection will accept *any* Java collection type. ( - programming to an interface - Domain models can be “rich” or “anaemic”. - anaemic more common -- use “processors” to encapsulate “plumbing” code - -# 5 Revision questions - -1. Compare and contrast the two typical approaches to inheriting behaviour in OO systems. -2. What does it mean to “program to an interface” and why is this important? -3. Compare and contrast “rich” versus “anaemic” domain models with regards to behaviour. -4. Give an example of a “processor” in the context of OO system design and explain why these are useful. \ No newline at end of file +- use “processors” to encapsulate “plumbing” code \ No newline at end of file diff --git a/content/notes/13-UML-sequence-diagrams.md b/content/notes/13-UML-sequence-diagrams.md new file mode 100644 index 000000000..cfb1fbc03 --- /dev/null +++ b/content/notes/13-UML-sequence-diagrams.md @@ -0,0 +1,157 @@ +--- +title: "13-UML-sequence-diagrams" +aliases: +tags: +- info201 +- lecture +sr-due: 2022-05-17 +sr-interval: 24 +sr-ease: 270 +--- + +sequence diagrams document a *sequence* of particpant interactions required to carry out a use case +- actor <-> object + - actors are outside the system + - objects are otside the system + - via a method call + - might get a result +- object <-> object +- lifetime of interactions and objects + - when they are created updated destroyed +- time is a key aspect + - [use-case-diagrams](notes/use-case-diagrams.md) dont have order + +These diagrams are: +- detailed, low level, bottom up +- behavioural diagram + - not structural +- common in industry + - along with class diagrams +- need to be designed and read alongside corresponding class diagrams + - e.g., class diagrams with inform sequences diagrams and vice versa + - back and forth process + + +General overview example: [annotated example](https://i.imgur.com/1myG3rU.png) +- time goes from top to bottom + - however no specific time units +- can have actors as participants + - but not usually + - existence of actor usualy indicates a sequence is owned by a use case +- interactions are indicated by messages (solid arrows) + - e.g. actor to main menu + - actor clicks a button + - menu reacts + - etc + - messges are synchronous + - i.e., thing sending message must wait for result + - always method calls (or something that equated to a method call) +- participants are supposed to be instances of classes + - however we are usually more interested in the class name +- the dashed lines are lifelines + - can also be solid + - basically indicate the existenc of something + - e.g., Thingform gets destroyed, thingfinder and thing remain throughout +- the rectangles (activation bars) indicate when an a thing is doing somethin + - caused by incoming message + - ended by a return + - these can have sub activations + - i.e., nested + - these can be self-activations + - implcit: not all methods return something + +relevant slide: +![300](https://i.imgur.com/txdVhrV.png) + + +# Messages +[example](https://i.imgur.com/XedVmng.png) +- direction + - <- or -> + - easier to under stand if most messages are -> + - however this is not always possible + - same object used by multiple other objects + - an object calls back to the object that called it +- can be conditions (guards) [example](https://i.imgur.com/yWTcD1F.png) + - only sent if condition is true + - able to approximate if-then-else using multiple branches with exclusive conditions + - this is better done in activity diagram +- looping messages [example](https://i.imgur.com/tcFZ4bb.png) + - an asterisk idicated looping + - repeat message until condition id false + - send messge to each object in a collection + - may also be better in activity diagram + +# Interaction frames (UML 2.x) +[example](https://i.imgur.com/V1Jhnd2.png) +- loop frame + - any kind of loop + - replaces * notation +- opt frame + - optional or conditional processing + - can replace [] notation +- alt frame + - if-then-else + - can replace [] notation + +one thing that can cause complications is +- when something can a top level loop which is waiting for input. +- a cancel anytime option + + +# Basic process of creation + +- identity participants of a use case (dont always need to use a use-case diagram) + - use use case to create first version of the activity diagram. as you implement the code update the class and activity diagrams +- identify messges required to carry out use case +- for each message + - it is always sent + - is it sent conditionally + - is it sent multiple times +- assemble messages in correct sequence and attach to relevant lifelines/activations +- add returns where necessary + +# Case study ATM + +bank is developing a new ATM system for their customers + +scope and requirements +- each customer has one or mor accounts +- transaction types are + - view balance + - withdraw cash + - deposit funds +- the customer can cancel at any point before final confirmation +- customer authenticates by inserting bank card and entering four digit pin + +process +- choose account +- choose amount +- check customer funds +- check amount in cash dipenser +- results + - withdraw amount + - dispense amount + - remind user + +![use case diagram |500](https://i.imgur.com/O2mE91J.png) + +this diagam is probably too general for this case + +![class model](https://i.imgur.com/3kX68dm.png) + +note navigability of domain + +sequence diagram + +- [part 1](https://i.imgur.com/PJJBZav.png) +- [part 2](https://i.imgur.com/M3jRM8g.png) +- [part 3](https://i.imgur.com/PhCYWsy.png) +- [part 4](https://i.imgur.com/L0h4nb8.png) + + + + +[full diagram](https://blackboard.otago.ac.nz/bbcswebdav/pid-2894257-dt-content-rid-18429333_1/courses/INFO201_S1DNIE_2022/2022/lectures/lecture_13_atm-withdraw-sequence-full.pdf) + + diff --git a/content/notes/13-bst-traversals-and-balance.md b/content/notes/13-bst-traversals-and-balance.md index ef385a13f..fb0630145 100644 --- a/content/notes/13-bst-traversals-and-balance.md +++ b/content/notes/13-bst-traversals-and-balance.md @@ -4,9 +4,9 @@ aliases: tags: - cosc201 - lecture -sr-due: 2022-04-15 -sr-interval: 3 -sr-ease: 250 +sr-due: 2022-05-18 +sr-interval: 25 +sr-ease: 270 --- # Traversals diff --git a/content/notes/13-code-librarires.md b/content/notes/13-code-librarires.md index 526c6f3c6..e1ef196cb 100644 --- a/content/notes/13-code-librarires.md +++ b/content/notes/13-code-librarires.md @@ -4,9 +4,9 @@ aliases: code libraries, libraries, software library tags: - cosc202 - lecture -sr-due: 2022-04-14 -sr-interval: 3 -sr-ease: 250 +sr-due: 2022-05-25 +sr-interval: 30 +sr-ease: 270 --- # what is a software library diff --git a/content/notes/14-balancing-bsts.md b/content/notes/14-balancing-bsts.md new file mode 100644 index 000000000..a8dd1f8fd --- /dev/null +++ b/content/notes/14-balancing-bsts.md @@ -0,0 +1,86 @@ +--- +title: "14-balancing-bsts" +aliases: +tags: +- cosc201 +- lecture +sr-due: 2022-04-29 +sr-interval: 3 +sr-ease: 250 +--- + +the height of a [BST](notes/binary-search-tree.md) is the length of its longest chain. Most operations are $O(n)$ where n is the height of the tree. In an Ideal situation each layer of the tree is full. The height of the tree is logarithmic to the number of nodes. + +When a tree is being used only occainsonally, we can afford to simply rebalance is periodically. However when it is in constant use we cannot afford this cost + +# Rotations + +![](https://i.imgur.com/vjvMVM3.png) +sometimes two rotations are needed + +## When to rotate and how to do them + +basic idea is to modify the add and delete operations fo the BST to be somewhat self-balancing. This does not need to be perfect + +We need a rule to decide when the tree is "balanced enough" and also strategies for fixing problems when the rule is violated. + +We only need to fix the area local to the add or delete operations + +# 1 - AVL tree +most basic and obvious. + +each node contains some extra information: the difference between the height of its right and left subtee. balance is maintained by ensuring that at every node this always at most 1 + +What is the least possible number of nodes in AVL tree of height k? + +in general + +$A_k= 1 + A_{k-1} + A_{k-2}$ + +we need a root 1, on one side a amallest possible tree of height $A_{k-1}$ then the other side must have height at least to $k-2$ to satisfy the rule, so we need at least $A_{k-2}$ more nodes. + +The size if exponential in its height, and therefore its height is logarithmic in the size. + +the operations are the same, but for each one we need to check and fix any excess imbalance along a single path from the affected leaf node up to the root. + +for insertions, at most three rotations are rquired, for deletions the worst case is $O(lg\ n)$ + +# 2 - Red Black trees +most used current one. Used in java treemap + +each node is either red or black + +the rules are: +- the root node is black (optional) +- all null nodes are _considered_ black (convention) +- A red node may not have a red child +- Every path from a node to a descendant null node contains the same number of black nodes + +These guarantee that the longest path frm root to null (which could alternate red and black) is at most twice as long as the shortest path (which could be all black) + +the tree is full up to half its height - growing at least as fast as $2^{h/2}$ + +the height is logarithmic in the size sinhce th tree must be complete to the depth of half the height + +Operations that mnodify the tree require in the worst case $O(lg\ n)$ recolourings and (on average a constant number) and not more than three rotations + +## Strategy +- do an insertio and color the node red. +- recolor and rotate nodes to fix violation +- there are four scenarios + - + +# 3 - Treaps +Link betwen heaps and trees that uses randomisation + +I we are added items to a bst in random order then an unbalanced situation would be possible but highly unlikely. + +a treap (portmanteau of tree and heap) is designed to achieve this even in the elements are not added in random order + +when we add an element, we give it a random priority. Then after doing normal BST insertion we perform a series of rotations to fix the heap-ordering issues + +the effect is that the elements look as if they were inserted in decending order of priority. SInce the priorities were randomly chosen, that means that at any time we see a BST which "thinks" that is elements were added in random order + +# 4 - B-trees +not actually a bst, but can be used for the same purpose + diff --git a/content/notes/14-direct-manipulation-and-mental-models.md b/content/notes/14-direct-manipulation-and-mental-models.md new file mode 100644 index 000000000..f95ff05b9 --- /dev/null +++ b/content/notes/14-direct-manipulation-and-mental-models.md @@ -0,0 +1,41 @@ +--- +title: "14-direct-manipulation-and-mental-models" +aliases: +tags: +- info203 +- lecture +sr-due: 2022-05-24 +sr-interval: 31 +sr-ease: 270 +--- + + +Command line vs UI +[table](https://i.imgur.com/DW8jnGz.png) + +# Object action models + +object action model: user selects an object then selects the action to perform on the objct + +action object model: user first selects an action to be perdormed and then selects the objects on which this action will be performed + +object action model maps to real life environment + +the designer needs to create mapping from the real world unicers ofb objects and intentios to the intrefac world universe of metaphors and plans + +# fits law +time to point to something depends on its size and distance: +$$ +MT = C1 + C2\ log_2(2A/W) +$$ where C1 and C2 are contstants that depend on the device. A is the distance that users have to move and W is the target size. + +- buttons and othe controls should be of reasonable size + - things done more often should a assigned a larger button + - or closer to the average position of the users cursor +- edges and coreners are easier to reach as the pointer is "caught" (infinite width) +- popup menus can usually be open faster than pull-down menus, since the user avoids movement +- pie menu items are typically selected faster and have a lower error rate than linear meny items as they scale with distance + + +# Combining inputs +often multiple ways of doing one thing \ No newline at end of file diff --git a/content/notes/15-containers.md b/content/notes/15-containers.md new file mode 100644 index 000000000..3d2bdeddd --- /dev/null +++ b/content/notes/15-containers.md @@ -0,0 +1,107 @@ +--- +title: "15-containers" +aliases: +tags: +- cosc202 +- lecture +--- + +* Describe what software containers are +- Explain why containers are useful +- Outline the role of container registries +- Contrast different ways to interact with containers +- Understand security risks inherent in container use + + +# What are (software) containers? + +- Containers encapsulate a computing environment +- Facilitates portable and reproducible use of software +- Can wrap up application code and data, and much of OS +- Containers are lightweight virtual machines +- You need to boot them up, as for any OS +- . . . but containers start up very quickly + +# What containers do and don’t include +- Containers are generally Linux (virtual) machines +- Even when hosted on Windows, containers are usually Linux +- Microsoft Windows containers do exist though +- Containers include the OS user space +- e.g., distributions: Ubuntu, Debian, Arch. . . +- Containers do not include Linux kernel +- ... because all containers share one instance of the Linux kernel +- Containers can’t themselves include hardware device drivers + +# Using containers +- We won’t explore how containers are hosted +- COSC349 explores how the lightweight virtualisation works +- We focus on using others’ containers +- Making containers usable involves: +- Management tools to control containers +- Means for interacting with the containerised software +- Somewhere from which to get their starter material. . . + +# Container registries +- Containers’ start up from an image +- Think of images as a hard disk template +- Images efficiently overlay layers of files and folders +- Container registries store and share images: e.g., +- Docker Hub is a popular container registry +- GitHub Container Registry (public; launched 2020) +- GitLab Container Registry (private) +- All major cloud providers provide registries +- You can run on-site, private registry too + +# Example container interacting with files +- Let’s build the containers lab website +- Input: Markdown files +- Output: HTML website +- Can use this container within CI +- Active container can rebuild ‘live’: +- source files are watched for changes +- changes trigger rebuilding target files +- can reload browser to see changes rapidly +- Note: this example is an optional part of containers lab + - docker run −−rm −−mount \ type=bind , source=$ {PWD} , ta rge t=/ s r v / j e k y l l \ j e k y l l / j e k y l l : pages j e k y l l bu i ld + +# Example container interacting over network +- Lesson builder can host an internal web server +- Point browser running on host computer to network URL +- Thus test built website, not just opening HTML files within it +- Container framework can share container’s network +- Typically expose key network ports of container on host +- Connections routed through to container +- Usually connections limited to interactions with the host OS +- . . . but containers can support internet-facing servers + - docker run −−rm − i t −−mount \ type=bind , source=$ {PWD} , ta rge t=/ s r v / j e k y l l \ −p 1 2 7. 0. 0. 1: 4 0 0 0: 4 0 0 0 \ j e k y l l / j e k y l l : 3 j e k y l l se rve + +# Inter-container interactions + - Can build apps by composing multiple containers + - Either or both of file/network-based sharing commonly used + - Need to consider how to orchestrate containers + - Container orchestration is a COSC349 topic + - e.g., coordinating multi-container start up + - Kubernetes is the de facto container orchestrator + - Creates reliable, scalable services from containers + - Supported on all major cloud providers + + # FYI: example multi-container application + - Example: say you need to chart time-series data + - InfluxDB is a dedicated time-series database + - Grafana is a dedicated web-based charting system + - Both are large, complex software products + - Containers allow using them together + - . . . without needing to figure out how to install them + - e.g., use Docker Compose tool; there are examples on GitHub + - Managing more than a few containers? + - Switch over to a container orchestration tool! + + # Managing containerised applications + - Containers can (do!) suffer security vulnerabilities + - Thus, need management just like any other OS + - Many services can notify you about security flaws + - e.g., your dependencies may have been patched + - Can easily upgrade containers to include security fixes + - Upgrading live containers may break applications + - Common: whole container-based app is rebuilt & relaunched + - Container frameworks themselves also get hacked \ No newline at end of file diff --git a/content/notes/15-from-models-to-code-and-back.md b/content/notes/15-from-models-to-code-and-back.md new file mode 100644 index 000000000..6d973aadb --- /dev/null +++ b/content/notes/15-from-models-to-code-and-back.md @@ -0,0 +1,142 @@ +--- +title: "15-from-models-to-code-and-back" +aliases: +tags: +- info201 +- lecture +sr-due: 2022-04-29 +sr-interval: 3 +sr-ease: 250 +--- + +# Round trip engineering + +going from models like UML to code, or ERD's to SQL + +the idea is to try and keep the diagrams and code semantivally equivalent + +foward - diagrams to code +reverse - code to diagrams + +former is more common, but both do occur. + +MDA (model driven architecture) is when code is comletely derived from the diagrams. However this is not that easy + +foward engineering can be used to create skeleton code much more easily + +fully representing code is UML is tricks as code is more difficult. It is hard to maintain consistency. This is easier with erds and sql than other types as these dont have to worry about behaviour. so the mappping is more simple. With uml and java is gets complex fast + +this idea sounds good but in practice is not practical. THere is an qgument hat code is part of the design anyway. Code is a detailed form of a model. + +# UML - java + +similar to ERD to sql. + +use case diagrams - more about system structure and features +**class diagram - java class +- doesn't have to be java +- could be any oop language +sequence, activity, state etc, may or may not be useful. +some code can be automatically generated. + +custom methods cannot be generated automatically. things like getters and setters can be generated automatically. + +## Steps +1. uml class -> java class (in its own file) (dont overdo it) (e.g., librarian) + 1. use conceptual vs implementation level diagrams +2. assign data types to explicit class fields +3. add fields implied by associations + 1. unidir ⇒ field in class at tail of --> + 2. bidir ⇒ field in class at both ends <--> + 3. multi = 1 ⇒ simple field (e.g., string) + 4. multi > 1 ⇒ appropraite collection type (e.g., arraylist, hashmap etc) +4. field visibilty normally private (should match class diagram) +5. add constructors if needed +6. add public getter and setter methods (trivial, can be auto generated) +7. add remaining public or private methods (includilng implemented interfaces) + +## aside on visibilty +![](https://i.imgur.com/0xM09La.png) + +## use case diagrams + +each use case represents a feature. often items in a menu. sub cases can be sub menu items (extnd, include, require) (sometimes). + +actors *can* correspond to domain classes. + +one use case might require/use several classes. e.g., UI, processor, or data classes. + +## other behavioural diagrams + +**sequence: +- could be used for looping and branching +**activity: +- low level in particular +- can be used to generate some code +- would require discipline in diagram conventions + - by this point you are basically writing code in graphical form anyway + - might as well just write the code anyway +**state: +- most useful/likely to be use for code + - states machines are tedious + - [finite-state-machine](notes/finite-state-machine.md) +- often translate to some kind of lookup mechanism +- fairly easy to generate correspoding code +- boils down to some kind of index. +- however these are not used very often +- once this code is generated is hard to fix manually + - better to just change the diagam and regenerate the code + + +## subclasses +[employe diagram example](https://i.imgur.com/EAiVEkt.png) +[eployee code example](https://i.imgur.com/bighWWJ.png) +[code continued](https://i.imgur.com/Hxcho66.png) + +- this example is contrived + +- salariedemployee and wagedemployee inherit all public and protected methods of employee (including getters and setters, not including constructors) +- salariedEmpoyee and waged employee each have thier own computePay method + +## Interfaces +[diagram](https://i.imgur.com/pN660p0.png) +[code](https://i.imgur.com/iDyoeSE.png) + +- generally preffered to subclasses +- both salaried and waged employees must implement the computePay method + + +# Domain class model vs ERD structure + +- erd are about long term storage. data persistence +- domain models are about application process, temporary storage. +- database and class structures dont need to be the same +- but you do need to be able to map between them + +[domain class model vs erd structure](https://i.imgur.com/feN6a9W.png) + +# Example: Library system + +e.g., +[library example uml diagram](https://i.imgur.com/u4CNXOb.png) +the five horizontal items could be meny items. there will be some kind of authorisation for senior librarians. we probably wouldn't make seniour and junior librarian as differnce classes. there is not really any benefit, doing this would be overkill. We should use a single librarian class with `type` field. this field can be used for authorisation. The apply fine use case is an optional sub task. It could be implemented in many ways: checkbox on return form, sub menu item, automatic. shelve item is a differnt, its more of a business process. only thing need in the code it the change the status of the item. + +![class diagram](https://i.imgur.com/VjyvYPe.png) + +[code part 1 Loan class](https://i.imgur.com/6VoV54C.png) +[code part 2 Loan class 2](https://i.imgur.com/Q8yptdE.png) +[code part 2 Loan class 3](https://i.imgur.com/4Xst3ys.png) + + +## Multiplicity +![](https://i.imgur.com/yJIH7dK.png) + +mih multiplicity of - ⇒ can create instances of Loan withou providing any associated LoanItem instances + +min multiplicity 1 ⇒ must provide associated Loan instand when creating a LoanItem instance +1. create loan and loanItem then use LoanItem.setLoan() +2. use a custom LoanItem constructor to pass Loan object + +[multiplicity code ](https://i.imgur.com/RKa9NBy.png) + +unidirectional association are preffered as here we need to link things birdirectionally. this example is contrived, in real life it would not be done this way. \ No newline at end of file diff --git a/content/notes/15-mental-models-representation-matters-distributing-cognition.md b/content/notes/15-mental-models-representation-matters-distributing-cognition.md new file mode 100644 index 000000000..07605e2a6 --- /dev/null +++ b/content/notes/15-mental-models-representation-matters-distributing-cognition.md @@ -0,0 +1,66 @@ +--- +title: "15-mental-models-representation-matters-distributing-cognition" +aliases: +tags: +- info203 +- lecture +sr-due: 2022-04-29 +sr-interval: 3 +sr-ease: 250 +--- + + +doors are simple. But they are still done wrong very often. Incorrect labelling can give the user a wrong mental model - widening the "gulf of execution". Signifiers like handles, can create a certain mental model making you pull it. These are easier to process than labels like push and pull. Our brains are lazy, we will choose the easiest option. + +Door is very simple compared to computer interface. Yet they are still done wrong. + +"A conceptial model mismatch (use has the wrong mental model)" +"Increases the Gulf of Execution (suporting the right model narrows it)" + +![500](https://i.imgur.com/dv6LH0O.png#invert) + +# Mental Models +- mental models are created by experience, metaphors, and analogical reasoning +- these models are developed further through interaction with the system +- designers (wrongly) often expect the users model to be the same as theirs + +A mental model mistach leads to: +- slow performance +- errors +- frustration + +[participant-observation](notes/participant-observation.md) appretiships (and other techniques such as [evaluating-designs](notes/evaluating-designs.md)) can uncover these mismatches. + +## Slips vs mistakes + +| Slip | Mistake | +|:-----------|:----------------------------------| +| accidental | on purpose (due to model mistach) | + + +## How to create good mental models +- [Direct Manipulation](notes/direct-manipulation-video.md) + - leveraging real world metphors + - this gives is a good idea of how each object works and how to control it + +# Representation Matters and Distributing cognition + +use representatio nthat does not require user to memoreise things. + +"solving a problem simply means representing it so as to make the solution transparent" - Herbert Simon, The sciences of the Artificial + +memory games make finding pairs hard by introducing rules. This often happens in computers interfaces needlessly difficult to use + +depeding o nhow you represent a problem, you can make is easy or hard. + +## Working memory + +users have a working memory (2±2 limit). You shouldn't require users to remember anything that you could put on a screen. + +If something takes a lot of time. You wil get distracted, and forget something. + + +## Naturalness principle + +- experiemental cognition is raised when the properties of the representation match the properties of the thing being represented +- \ No newline at end of file diff --git a/content/notes/16-distributing-cognition-and-visual-design-typography.md b/content/notes/16-distributing-cognition-and-visual-design-typography.md new file mode 100644 index 000000000..ed56cabef --- /dev/null +++ b/content/notes/16-distributing-cognition-and-visual-design-typography.md @@ -0,0 +1,114 @@ +--- +title: "16-distributing-cognition-and-visual-design-typography" +aliases: +tags: +- info203 +- lecture +sr-due: 2022-04-30 +sr-interval: 3 +sr-ease: 250 +--- + +# Dist cognition + +when interfaces help people disribute cognition it can +- exourage experimentsation +- scaffold learning and reuce errors through reduncdancy +- show (only) differences that matter +- convert slow calculation into fast perception +- support chunking, especially by experts +- increase effieciency +- facilitate collaboration + +good representation shows only relevant information and enables: +- comparison +- exploration +- problem solving + +deep vs shallow interface + +# Visual design + +combine text and graphics. how to represent? + +- whitespace for grouping +- size contrasts for heiarchy +- variable scale and weight +- colors + + +three goals +- guide +- pace +- message + +Three tools +- typography +- layout +- colour + +# Typography + +most common +- gill sans +- helvetica +- calibri +- arial +- times + +three types +- serif +- sans serif +- handwritten + +point size +![100](https://i.imgur.com/9lMGK1g.png) + +leading depends on the font and the user setting but usually is 20% of the font +![100](https://i.imgur.com/eABpxfK.png) + +x height depends on the font. +- smaller x height adds "elegance" +- larger x height isbettwe to low res displays +![250](https://i.imgur.com/BvPCazi.png) + +ascenders and descender usually correlates with x height (small x-height > large ascenders and descenders) +![400](https://i.imgur.com/Iv7FK4F.png) + +weight: usually regullar and bold, also light semibold, ultrabold +![400](https://i.imgur.com/YboKpT7.png) + +sans serifs have less line width variation +![400](https://i.imgur.com/3GkpMf3.png) + +some fonts provide small caps and lowercase numbers +![](https://i.imgur.com/lEYKFl8.png) + + + +- serif hypothesis + - serif fonts are easier to read + - preferable for long stretches of text because serifs provide anchors and guide the eye + - not proven + +more info on the top than the botton +![300](https://i.imgur.com/XEF8nlr.png) + +expectation plays an important role +![300](https://i.imgur.com/Uu6B2bQ.png) + + + +## which font to use? +- depends on context +- recoomentations + - slides and posters sans serif + - printed text serif + - web sans serif + - sans serif is better in lower resolutions + - combinations: (header sans, text serif) + - comic sans good for dyslexia + - logos should catch the eye + + +![300](https://i.imgur.com/T80gQOA.png) diff --git a/content/notes/Untitled.md b/content/notes/Untitled.md index e69de29bb..f8fb8a79a 100644 --- a/content/notes/Untitled.md +++ b/content/notes/Untitled.md @@ -0,0 +1,8 @@ +--- +title: "<% tp.file.cursor(1) %>Untitled" +aliases: <% tp.file.cursor(2) %> +tags: +- <% tp.file.cursor(3) %> +--- + +<% tp.file.cursor(4) %> diff --git a/content/notes/aesthetic-and-minimalist-design.md b/content/notes/aesthetic-and-minimalist-design.md new file mode 100644 index 000000000..27eefa663 --- /dev/null +++ b/content/notes/aesthetic-and-minimalist-design.md @@ -0,0 +1,16 @@ +--- +title: "aesthetic-and-minimalist-design" +aliases: Aesthetic and Minimalist Design +tags: +- info203 +--- + +![](https://i.imgur.com/Oywxwgq.png) +![](https://i.imgur.com/xgfgEtm.png) + +signal to noise + +![](https://i.imgur.com/6bLaHS6.png) +![](https://i.imgur.com/qF21SST.png) + + diff --git a/content/notes/andie.md b/content/notes/andie.md deleted file mode 100644 index fe5caee0e..000000000 --- a/content/notes/andie.md +++ /dev/null @@ -1,18 +0,0 @@ ---- -title: "Untitled" -tags: -- cosc202 -- assignment ---- - -Todo - -- [ ] todo - -Issues - -- [ ] "no obs file" popup when opening new image - - - - diff --git a/content/notes/ass-01-what-is-usability.md b/content/notes/ass-01-what-is-usability.md deleted file mode 100644 index 7b850987e..000000000 --- a/content/notes/ass-01-what-is-usability.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: "ass-01-what-is-usability" -tags: -- info203 ---- - - diff --git a/content/notes/ass-02-heuristic-evaluation.md b/content/notes/ass-02-heuristic-evaluation.md deleted file mode 100644 index 045640a74..000000000 --- a/content/notes/ass-02-heuristic-evaluation.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: "ass-02-heuristic-evaluation" -tags: -- info203 ---- - - diff --git a/content/notes/aymptotic-notation.md b/content/notes/aymptotic-notation.md index 30774dd47..e036c2bb1 100644 --- a/content/notes/aymptotic-notation.md +++ b/content/notes/aymptotic-notation.md @@ -1,5 +1,6 @@ --- title: "asymptotic-notation" +aliases: Big O, Big Theta, Algorithm Analysis tags: - cosc201 - analysis-of-algorithms @@ -10,7 +11,7 @@ Asymptotic notations are used in computer science to classify algorithms based h # big O notation -Big O defines a bound for the *upper* bound of the running time (or space) of a algorithm. However, it is possible that the actual running time is much less as it does not take into account special cases +Big O defines a bound for the *upper* bound of the running time (or space) of a algorithm. However, it is possible that the actual running time is much less as it does not take into account special cases ^fb2c3f ## 1 Formal definition diff --git a/content/notes/bst-operations.md b/content/notes/bst-operations.md index d6f8b63f9..a818b281c 100644 --- a/content/notes/bst-operations.md +++ b/content/notes/bst-operations.md @@ -112,20 +112,4 @@ private void delete(Node n) { # Traversal -Visit each node in the tree once. So we need to visit n, all the nodes in L, and all the nodes in R. We can do this in three different ways - -preorder -- visit n -- traverse L -- traverse R - -Inorder. -- traverse L -- visit n -- traverse R -Creating an BST from an array using the add operation then doing an inorder traversal is effectively a [quicksort](notes/quicksort) - -postorder -- traverse L -- traverse R -- visit n \ No newline at end of file +[tree-traversal](notes/tree-traversal.md) \ No newline at end of file diff --git a/content/notes/bug-tracker.md b/content/notes/bug-tracker.md new file mode 100644 index 000000000..910342b44 --- /dev/null +++ b/content/notes/bug-tracker.md @@ -0,0 +1,60 @@ +--- +title: "bug-tracker" +aliases: Bug Tracker +tags: +- project +--- + +link: https://youtu.be/oC483DTjRXU + +potential employer needs to now i + +need to target toward the dev/hiring manager. built wha the need/want to see. They should be able to instantly recognise if its what they want. + +doesn't matter what tools you use. Try to build a project that uses the same stack as the company you are applying for. + +Should built an app not 1 hour a day. Should do in large blocks. e.g., spend one saturday. + +# The Project + +Should: +- follow a design pattern + - e.g., for web apps: mvc: model view controller [MVC](notes/model-view-controller-pattern.md) +- clean professional UI + - mobile and desktop + - people are "visual buyers" + - use a bootstrap template +- database + - must perform all of CRUD operations +- security + - authorisation --> giving people permissions once they are logged in + - authentication --> logging in + - use a third party service like auth zero +- solve a business problem + - i.e., not a toy app (tic tac toe, etc) + + +## Bug/Issue Tracker +- e.g., JIRA, etc +- This can be easily adjusted to fit different industries. + +# Building the Project + +## 1 SRS +- compile the requirements +- divide these into sprints. + - these are the blocks discussed earlier +- blocks rabbit holes + +## 2 Track your progress +- keeps details +- use the bug tracker you are building +- show this to the interviewer + +# Common Mistakes + +- Build using .NET, ASP.net mvc, C#. This is the most common. +- Dont start with a small program +- Show the project to people + - Show to recruiters + - Demo in interviews \ No newline at end of file diff --git a/content/notes/class-diagrams.md b/content/notes/class-diagrams.md deleted file mode 100644 index 11c34f2a4..000000000 --- a/content/notes/class-diagrams.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: "class-diagrams" -aliases: class diagrams, Class Diagrams -tags: -- info201 ---- - -[slides](https://blackboard.otago.ac.nz/bbcswebdav/pid-2891358-dt-content-rid-18381804_1/xid-18381804_1) - diff --git a/content/notes/conceptual-vs-ipmlementation-models.md b/content/notes/conceptual-vs-ipmlementation-models.md index 2b8c67e9d..1e2455956 100644 --- a/content/notes/conceptual-vs-ipmlementation-models.md +++ b/content/notes/conceptual-vs-ipmlementation-models.md @@ -6,12 +6,12 @@ tags: Models like ERDs are used to represent a high level conceptual overview of a system, or to as a lower level specification that can drive the implementation of the database. -** Conceptual +**Conceptual - Abstract/big-picture - Useful in inital design stages and for communication -** Implementation +**Implementation - Concrete/detailed - Useful in documenting and specifying structure (for devs etc) diff --git a/content/notes/consistency-and-standards.md b/content/notes/consistency-and-standards.md new file mode 100644 index 000000000..7e42cf794 --- /dev/null +++ b/content/notes/consistency-and-standards.md @@ -0,0 +1,33 @@ +--- +title: "consistency-and-standards" +aliases: Consistency And Standards +tags: +- info203 +--- + +![](https://i.imgur.com/H8rlxo7.png) + +good and bad +- standards (user interface guidelines) are always chaning + +differ between platforms +evolve over time + +e.g., menus + +![](https://i.imgur.com/IfaMADw.png) +![](https://i.imgur.com/HqYzadh.png) + +general look of webpages evolves over time + +### 1.1 Naming and teminology + +![](https://i.imgur.com/3PwEOmn.png) + +this is bad +you can ask users which categories they understand/know about + +### 1.2 Data loss +![](https://i.imgur.com/23IxWiN.png) + +standard to minimise loss diff --git a/content/notes/cosc-201-lectures.md b/content/notes/cosc-201-lectures.md index 9a0d01e9c..d0347b93d 100644 --- a/content/notes/cosc-201-lectures.md +++ b/content/notes/cosc-201-lectures.md @@ -12,4 +12,5 @@ links: [[notes/cosc-201]] - [10-heaps-and-heapsort](notes/10-heaps-and-heapsort.md) - [11-sets-maps-trees](notes/11-sets-maps-trees.md) - [12-binary-search-tree-operations](notes/12-binary-search-tree-operations.md) -- \ No newline at end of file +- [13-bst-traversals-and-balance](notes/13-bst-traversals-and-balance.md) +- [14-balancing-bsts](notes/14-balancing-bsts.md) \ No newline at end of file diff --git a/content/notes/cosc-201-outline.md b/content/notes/cosc-201-outline.md index 31eaa1db4..242662c4e 100644 --- a/content/notes/cosc-201-outline.md +++ b/content/notes/cosc-201-outline.md @@ -14,4 +14,6 @@ links: [[notes/cosc-201]] - [[notes/sorting]] - [[notes/heapsort]] - [[notes/mergesort]] -- [[notes/quicksort]] \ No newline at end of file +- [[notes/quicksort]] +- [divide-and-conquer](notes/divide-and-conquer.md) +- [unite-and-conquer](notes/unite-and-conquer.md) \ No newline at end of file diff --git a/content/notes/cosc-201.md b/content/notes/cosc-201.md index 8aeb65fff..df90bdabd 100644 --- a/content/notes/cosc-201.md +++ b/content/notes/cosc-201.md @@ -11,7 +11,7 @@ links: [_index](_index.md) - [cosc-201-outline](notes/cosc-201-outline.md) - [cosc-201-lectures](notes/cosc-201-lectures.md) -## 0.1 Assignments +# 0.1 Assignments - [[notes/assignment-01]] - [[notes/assignment-02]] \ No newline at end of file diff --git a/content/notes/cosc-202-lectures.md b/content/notes/cosc-202-lectures.md index 1bbe3cbf9..8cc10fc82 100644 --- a/content/notes/cosc-202-lectures.md +++ b/content/notes/cosc-202-lectures.md @@ -6,6 +6,7 @@ tags: --- links: [cosc-202](notes/cosc-202.md) +- - [07-testing](notes/07-testing.md) - [08-debugging](notes/08-debugging.md) - [09-documentation](notes/09-documentation.md) diff --git a/content/notes/daily-notes.md b/content/notes/daily-notes.md index 80a635f1c..62cf0fa88 100644 --- a/content/notes/daily-notes.md +++ b/content/notes/daily-notes.md @@ -2,4 +2,4 @@ title: "daily-notes" --- -# daily-notes \ No newline at end of file +# daily-notes diff --git a/content/notes/dependencies.md b/content/notes/dependencies.md new file mode 100644 index 000000000..9494135af --- /dev/null +++ b/content/notes/dependencies.md @@ -0,0 +1,93 @@ +--- +title: "dependencies-among-attributes" +aliases: dependencies among attributes +tags: +- info201 +--- + +# 1 Functional Depenencies (FDs) +For any given value of attribute A there is _exactly one_ associated value of attribute B, then A _functionally determines_ B (loosely) + +This is the theoretical basis for normalisation, and uniqueness property of PK (A is unique with respect to B) + +- one to one +- Written as: A --> B +- Equivalently, "B is functionally dependent on A" +- Within a single relation only +- every attribute functionally dependent of primary key (PK) + +## 1.1 Example 1 +- consdier a specific student ID e.g., 123346 +- this student ID is alwasys associated witha single studnet name (e.g., jane smith) +- even it the students name changes, that student ID will still be asociated with the name of only that on student +- _The value of studnet id dtermines the value of student name_ + +## 1.2 Other examples +- student ID --> student name (but not vice versa) +- car registration --> car owner (but not vice versa) + - rego --> VIN + - VIN --> rego +- student ID --> name, semester address, mobile number +- car rego --> owener name +- IRD number + year --> tax payable +- product ID + order no --> quantity ordered + +## 1.3 Anti examples +- student ID + name --> birth date (ovekill, partial dependency) +- home address --> student name +- name --> birth date + +e.g., +![](https://i.imgur.com/J0FzURg.png) +![](https://i.imgur.com/EMSOMmC.png) + + +## 1.4 Using Functional dependencies +To determine them: +- need detailed knowledge of thebusiness rules +- examine existing data sets + - not always practical when these are large or unknown + +Can be represented using funcitonal dependency diagrams (FDDs) + +Bottom up approach +- ERD is "top-down" +- FD best used as a design validation tool + +## 1.5 Types of functional dependencies +### 1.5.1 Dependencies on more that one attribute +non primary attributes that are dependent on two or more attributes +always arise with composite PKs +e.g., +![](https://i.imgur.com/d4fUeRD.png) + +### 1.5.2 Partial Dependency +Subset of left hand side determines right hand side +"extra attributes" + +e.g., +![](https://i.imgur.com/clpV0eU.png) +![Uploading file...mfewm]() + +### 1.5.3 Transitive dependency + +e.g., +- part num determines supplier number +- supplier number determines supplier name +- part number determines supplier name + +BUT 3 is already implied by 1 & 2 --> redundant supplier names +![](https://i.imgur.com/VZbxVff.png) +![](https://i.imgur.com/df0D7Lc.png) + +### 1.5.4 Multivalued dependencies (MVDs) +if for any given value of attribute A there is a _set_ of associated values of attribute S, the a _Multidetermines_ S (loosely) + +- one to many +- written: A ↠ S +- equivalently, "S is multiply dependent on A" +- Generalistion of FDs: all FDs are MVDs, but not vice versa +- A is still unique with respect to S + +## 1.6 Examples +![](https://i.imgur.com/938t9Kd.png) \ No newline at end of file diff --git a/content/notes/design-heuristics.md b/content/notes/design-heuristics.md new file mode 100644 index 000000000..8084833d8 --- /dev/null +++ b/content/notes/design-heuristics.md @@ -0,0 +1,16 @@ +--- +title: "design-heuristics" +aliases: Design Heuristics +tags: +- info203 +--- + +- [show-system-status](notes/show-system-status.md) +- [familiar-metaphors-and-language](notes/familiar-metaphors-and-language.md) +- [consistency-and-standards](notes/consistency-and-standards.md) +- [user-freedom-and-control](notes/user-freedom-and-control.md) +- [error-prevention](notes/error-prevention.md) +- [recognition-over-recall](notes/recognition-over-recall.md) +- [flexibility-and-efficiency](notes/flexibility-and-efficiency.md) +- [aesthetic-and-minimalist-design](notes/aesthetic-and-minimalist-design.md) +- diff --git a/content/notes/direct-manipulation-video.md b/content/notes/direct-manipulation-video.md index 6cc240f3b..f2cd950d5 100644 --- a/content/notes/direct-manipulation-video.md +++ b/content/notes/direct-manipulation-video.md @@ -1,6 +1,6 @@ --- title: "direct-manipulation-video" -aliases: +aliases: Direct Manipulation tags: - info203 - video diff --git a/content/notes/divide-and-conquer.md b/content/notes/divide-and-conquer.md new file mode 100644 index 000000000..b089ab04c --- /dev/null +++ b/content/notes/divide-and-conquer.md @@ -0,0 +1,13 @@ +--- +title: "divide-and-conquer" +aliases: Divide and Conquer +tags: +- cosc201 +- paradigm +--- + +Divide an conquer algorithms have three parts: + +1. pre ⇒ break apartinto two or more smaller problems whose size add up to at most n +2. Rec ⇒ solve those problems recursively +3. post ⇒ combine solutions into a solution of the original problem diff --git a/content/notes/docker-containers.md b/content/notes/docker-containers.md new file mode 100644 index 000000000..0a60e17d2 --- /dev/null +++ b/content/notes/docker-containers.md @@ -0,0 +1,30 @@ +--- +title: "docker-containers" +aliases: Docker Containers +tags: +- video +- networks +--- + +link:https://www.youtube.com/watch?v=eGz9DS-aIeY + +where virtual machines virtualise hardware, docker virtualises OSs. Each of the containers uses the same underlying kernel. This is why its so fast. It is also why you cant run a windows OS and a Linux OS at the same time - because they use different kernels. + +Crontrol groups control how much OS resources each container can use. + +VM: +- hardware + - hypervisor + - windows + - ubuntu + - debian + - etc + +Docker +- hardware + - ubuntu + - docker + - debian + - ubuntu + - windows + - etc diff --git a/content/notes/dotnet.md b/content/notes/dotnet.md new file mode 100644 index 000000000..fe5f58a04 --- /dev/null +++ b/content/notes/dotnet.md @@ -0,0 +1,24 @@ +--- +title: "dotnet" +aliases: .NET +tags: +- framework +--- + +.NET is an open source developer platform for building different types of apps. + +A developer framework is Langages and libraries that you use. + +You can use: +- c# +- f# +- VB + +on: +- .NET core for Windows, Linux, and macOS +- .NEt framework for websites, services, and apps on windows +- Xamarin/Mono for mobile. +- .NET Standard --> the shared set of libraries for the above. + + +ASP.NET is an open source web framework for building webapps within .NET. It is cross platform \ No newline at end of file diff --git a/content/notes/entity-relationship-diagrams.md b/content/notes/entity-relationship-diagrams.md index 8b0aacd7c..4f32d5890 100644 --- a/content/notes/entity-relationship-diagrams.md +++ b/content/notes/entity-relationship-diagrams.md @@ -1,5 +1,6 @@ --- title: "entity-relationship-diagrams" +aliases: ERDs, ERD, entity relationship diagram, Entity Relationship Diagram tags: - info201 --- diff --git a/content/notes/error-prevention.md b/content/notes/error-prevention.md new file mode 100644 index 000000000..cbe85d434 --- /dev/null +++ b/content/notes/error-prevention.md @@ -0,0 +1,31 @@ +--- +title: "error-prevention" +aliases: Error Prevention +tags: +- info203 +--- + +### 2.1 Bad input + +![](https://i.imgur.com/54tVH7B.png) + +correct human errors +auto completion + +### 2.2 helpful constraints + +![](https://i.imgur.com/n4HT5L9.png) + +### 2.3 Suggestions and autocorrection + +![](https://i.imgur.com/c2l9MWy.png) + +heavily abused by industry +- they can influence suggestions + +### 2.4 Forgiving formatting + +![](https://i.imgur.com/ldZUMer.png) + +- reduce errors +- diff --git a/content/notes/evaluating-designs.md b/content/notes/evaluating-designs.md index 85b3b118e..57f052f6d 100644 --- a/content/notes/evaluating-designs.md +++ b/content/notes/evaluating-designs.md @@ -1,8 +1,5 @@ --- title: "evaluating-designs" -sr-due: 2022-04-07 -sr-interval: 10 -sr-ease: 210 tags: - info203 --- diff --git a/content/notes/extreme-programming.md b/content/notes/extreme-programming.md new file mode 100644 index 000000000..fef15fd6e --- /dev/null +++ b/content/notes/extreme-programming.md @@ -0,0 +1,28 @@ +--- +title: "extreme-programming" +aliases: extreme programming, xp, XP, Extreme Programming +tags: +- info201 +--- + +take current industry practices to the extreme +- focus of proven industry practices +- combine them innovatively to get better results + +# 1 Values and principles +communication, simplicity, feedback, courage. +- Planning -> based on user stories +- Testing -> thorough testing at every step +- Pair programming -> watch, inspect, and trade off +- Simple designs -> based on agile modelling principles +- Refactoring -> redo and clean up as you go +- Collective code ownership -> egoless development, anyone can review and improve code +- Continuous integration -> grow the software continuously +- On-site customer -> get sign-off as you go +- System metaphor -> what should the final system look like? Small releases given to users frequently +- Forty-hour work week -> don’t overload the developers +- Coding standards -> follow industry standards for code + +# 2 Three ring project approach + +![](https://i.imgur.com/Rl5Wuwm.png) diff --git a/content/notes/familiar-metaphors-and-language.md b/content/notes/familiar-metaphors-and-language.md new file mode 100644 index 000000000..c117038ae --- /dev/null +++ b/content/notes/familiar-metaphors-and-language.md @@ -0,0 +1,18 @@ +--- +title: "familiar-metaphors-and-language" +aliases: Familiar Metaphors And Language +tags: +- info203 +--- + +![](https://i.imgur.com/sdNv98E.png) +![](https://i.imgur.com/IbIBK5t.png) + +imitating familiar real life + +Categories +- good + - ![](https://i.imgur.com/7wRRBii.png) +- bad + - ![](https://i.imgur.com/vDKOuOo.png) + diff --git a/content/notes/flexibility-and-efficiency.md b/content/notes/flexibility-and-efficiency.md new file mode 100644 index 000000000..058a5dd04 --- /dev/null +++ b/content/notes/flexibility-and-efficiency.md @@ -0,0 +1,38 @@ +--- +title: "flexibility-and-efficiency" +aliases: Flexibility and Efficiency +tags: +- info203 +--- + +### 4.1 Choices + +![](https://i.imgur.com/lUBB7EN.png#invert) +![](https://i.imgur.com/1OaTaPg.png#invert) +![](https://i.imgur.com/8KaFDme.png#invert) + +something with immediate effect can use switch +![](https://i.imgur.com/COR8E7w.png#invert) + +![](https://i.imgur.com/EQbB1Ep.png#invert) +![](https://i.imgur.com/QhFssbP.png#invert) +![](https://i.imgur.com/PG2Iu9a.png#invert) + +good defaults + +![](https://i.imgur.com/pj5Ztij.png) + +4.2 shortcuts and advanced options + +![](https://i.imgur.com/0OG7qRx.png) + +ambient information + +![](https://i.imgur.com/s2zyIws.png) + +proactivity + +![](https://i.imgur.com/gmDLWMO.png) +![](https://i.imgur.com/Izu8bQX.png) +![](https://i.imgur.com/hiGeXW3.png) + diff --git a/content/notes/info-201-lectures.md b/content/notes/info-201-lectures.md index 271c064bf..58853ccb3 100644 --- a/content/notes/info-201-lectures.md +++ b/content/notes/info-201-lectures.md @@ -5,6 +5,7 @@ tags: --- links: [[notes/info-201]] +- - [04-requirements](notes/04-requirements) - [06-business-functions-and-use-cases](notes/06-business-functions-and-use-cases.md) - [07-business-process-modelling](notes/07-business-process-modelling.md) @@ -12,4 +13,6 @@ links: [[notes/info-201]] - [09-data-modelling-and-normalisation](notes/09-data-modelling-and-normalisation.md) - [10-oop-concepts-and-uml](notes/10-oop-concepts-and-uml.md) - [11-class-diagrams](notes/11-class-diagrams.md) -- [12-modelling-behaviour](notes/12-modelling-behaviour.md) \ No newline at end of file +- [12-modelling-behaviour](notes/12-modelling-behaviour.md) +- [13-UML-sequence-diagrams](notes/13-UML-sequence-diagrams.md) +- [14-direct-manipulation-and-mental-models](notes/14-direct-manipulation-and-mental-models.md) \ No newline at end of file diff --git a/content/notes/info-201-outline.md b/content/notes/info-201-outline.md index a926bcdd7..20d444692 100644 --- a/content/notes/info-201-outline.md +++ b/content/notes/info-201-outline.md @@ -6,11 +6,13 @@ tags: links: [[notes/info-201]] - [version-control-system](notes/version-control-system.md) +- [stakeholders](notes/stakeholders.md) - [business-analyst](notes/business-analyst.md) - [developer](notes/developer.md) - [models](notes/models.md) - [systems-development-life-cycle](notes/systems-development-life-cycle.md) - [agile-development](notes/agile-development.md) +- [scrum](notes/scrum.md) - [predictive-adaptive-spectrum](notes/predictive-adaptive-spectrum.md) - [requirements](notes/requirements.md) - [requirements-document](notes/requirements-document.md) @@ -24,4 +26,9 @@ links: [[notes/info-201]] - [business-process-model](notes/business-process-model.md) - [business-process-model-and-notation](notes/business-process-model-and-notation.md) - [UML](notes/UML.md) -- [entity-relationship-diagrams](notes/entity-relationship-diagrams.md) \ No newline at end of file +- [entity-relationship-diagrams](notes/entity-relationship-diagrams.md) +- [modelling behaviour](notes/modelling-behaviour.md) +- [conceptual-vs-ipmlementation-models](notes/conceptual-vs-ipmlementation-models.md) +- [redundancy-and-anomalies](notes/redundancy-and-anomalies.md) +- [dependencies](notes/dependencies.md) +- [normalisation](notes/normalisation.md) diff --git a/content/notes/info-201.md b/content/notes/info-201.md index 9e6feb04c..93723a062 100644 --- a/content/notes/info-201.md +++ b/content/notes/info-201.md @@ -11,8 +11,6 @@ links: [_index](_index.md) - [info-201-lectures](notes/info-201-lectures.md) - [info-201-outline](notes/info-201-outline.md) -- - - [coursework tiddlywiki](https://isgb.otago.ac.nz/infosci/INFO201/labs_release/raw/master/output/info201_labs.html#) - [assignments tiddlywiki](https://isgb.otago.ac.nz/info201/shared/assignments_release/raw/master/output/info201_assignments.html) - [labs folder](file:///"C:/Users/Jet%20Hughes/Documents/Personal/courses/info-201/Labs") diff --git a/content/notes/info-203-lectures.md b/content/notes/info-203-lectures.md index e5b0c81f7..b1871b5a1 100644 --- a/content/notes/info-203-lectures.md +++ b/content/notes/info-203-lectures.md @@ -5,9 +5,14 @@ tags: --- link: [[notes/info-203]] +- [04-evaluation-methods-birth-of-hci](notes/04-evaluation-methods-birth-of-hci.md) - [07-heuristic-evaluation-cont](notes/07-heuristic-evaluation-cont.md) - [08-personas-and-scenarios](notes/08-personas-and-scenarios.md) - [09-paper-prototypes-wiz-of-oz-video-prototypes](notes/09-paper-prototypes-wiz-of-oz-video-prototypes.md) - [10-design-heuristics-1](notes/10-design-heuristics-1.md) - [11-design-heuristics-2](notes/11-design-heuristics-2.md) - [12-design-heuristics-3](notes/12-design-heuristics-3.md) +- [13-design-heuristics-4](notes/13-design-heuristics-4.md) +- [14-direct-manipulation-and-mental-models](notes/14-direct-manipulation-and-mental-models.md) +- [15-mental-models-representation-matters-distributing-cognition](notes/15-mental-models-representation-matters-distributing-cognition.md) +- [16-distributing-cognition-and-visual-design-typography](notes/16-distributing-cognition-and-visual-design-typography.md) \ No newline at end of file diff --git a/content/notes/info-203-outline.md b/content/notes/info-203-outline.md index 0a79a9312..43f8d5c91 100644 --- a/content/notes/info-203-outline.md +++ b/content/notes/info-203-outline.md @@ -7,13 +7,22 @@ links: [[notes/info-203]] - [big-picture](notes/big-picture.md) - [birth-of-hci](notes/birth-of-hci.md) +- [user-experience](notes/user-experience.md) +- [usbability](notes/usbability.md) - [prototyping](notes/prototyping.md) - [evaluating-designs](notes/evaluating-designs.md) +- [Design Heuristics](notes/design-heuristics.md) + - [error-prevention](notes/error-prevention.md) + - [flexibility-and-efficiency](notes/flexibility-and-efficiency.md) + - [aesthetic-and-minimalist-design](notes/aesthetic-and-minimalist-design.md) + - [consistency-and-standards](notes/consistency-and-standards.md) + - [recognition-over-recall](notes/recognition-over-recall.md) + - [user-freedom-and-control](notes/user-freedom-and-control.md) + - [familiar-metaphors-and-language](notes/familiar-metaphors-and-language.md) + - [show-system-status](notes/show-system-status.md) - [needfinding](notes/needfinding.md) - [participant-observation](notes/participant-observation.md) - [interviewing](notes/interviewing.md) -- [user-experience](notes/user-experience.md) -- [usbability](notes/usbability.md) - [storyboards](notes/storyboards.md) - [personas-and-scenarios](notes/personas-and-scenarios.md) - \ No newline at end of file diff --git a/content/notes/info-203-videos.md b/content/notes/info-203-videos.md index 7a4e1eb31..9afe6a73b 100644 --- a/content/notes/info-203-videos.md +++ b/content/notes/info-203-videos.md @@ -9,4 +9,6 @@ links: [[notes/info-203]] - [storyboards-mockups-paper-prototypes](notes/storyboards-mockups-paper-prototypes.md) - [wizard-of-oz](notes/wizard-of-oz.md) - [video-prototyping](notes/video-prototyping.md) -- [] +- [direct-manipulation-video](notes/direct-manipulation-video.md) +- [mental-models-video](notes/mental-models-video.md) +* [visual-design-video](notes/visual-design-video.md) \ No newline at end of file diff --git a/content/notes/info-203.md b/content/notes/info-203.md index 823673c26..eed0ffc58 100644 --- a/content/notes/info-203.md +++ b/content/notes/info-203.md @@ -10,4 +10,6 @@ links:[_index](_index.md) - [info-203-outline](notes/info-203-outline.md) - [info-203-lectures](notes/info-203-lectures.md) -- [info-203-videos](notes/info-203-videos.md) \ No newline at end of file +- [info-203-videos](notes/info-203-videos.md) + +- [mobile-app-ass-03](203-mobile-app/mobile-app-ass-03.md) \ No newline at end of file diff --git a/content/notes/mental-models-video.md b/content/notes/mental-models-video.md new file mode 100644 index 000000000..416434380 --- /dev/null +++ b/content/notes/mental-models-video.md @@ -0,0 +1,41 @@ +--- +title: "mental-models-video" +aliases: +tags: +- info203 +- video +--- + +The users mental model is how the user thinks the interface works. + +for example the fridge with two dials, or the doors. + +The goal is for the design to create the correct mental model in the user. Designers often expect the user to have the same mental model as them, but this is not always the true. The users model is developed through iteraction with the system + +This is why its important to have other people test the system. + +A conceptual model mistach can lead to slow performance, erros, and frustration. + +Mental models arise from experience, metaphor, and analogical reasoning. We can leverage what people have learnt from old interfaces to inform new ones. Our mental models are iconsistent, unstable in time, and often rife with superstition. + +# Slips vs Mistakes + +A slip is when you have the right model but accidentally do the wrong thing. + +A mistake is when you do what you intended, by you have the wrong mental model. + +Slips with be prevented by improving ergonomics or visual design. + +Mistakes can be prevented by providing better feedback and making options more clear. + +re using existing designs reduced mistakes. + + +# World in miniature interface + +for example the seat interface +[](https://i.imgur.com/J8d9Q0N.png) + +> "Is technology is providing an advantage, the correspondance to the real world must break down at some point" - Jonathan Grudin + +We should minimise the gap between current technology and new technology. diff --git a/content/notes/mergeosrt.md b/content/notes/mergesort.md similarity index 98% rename from content/notes/mergeosrt.md rename to content/notes/mergesort.md index 9741b8200..3126667b6 100644 --- a/content/notes/mergeosrt.md +++ b/content/notes/mergesort.md @@ -26,7 +26,6 @@ e.g., 0 1 2 3 4 4 6 7 8 9 # 1 Implementation - ## 1.1 Merge Given: a and b are sorted arrays. m is an array whose size is the sum of their sizes @@ -153,4 +152,4 @@ The bottom-up version does exactly the same thing as the top-down version, just # 2 Variations of Mergesort -[[unite and conquer]] #unfinished +[unite and conquer](notes/unite-and-conquer.md) diff --git a/content/notes/milestone-2.md b/content/notes/milestone-2.md deleted file mode 100644 index 4d5e0c4ca..000000000 --- a/content/notes/milestone-2.md +++ /dev/null @@ -1,9 +0,0 @@ ---- -title: "milestone-2" -aliases: -tags: -- assignment -- info201 ---- - - diff --git a/content/notes/model-view-controller-pattern.md b/content/notes/model-view-controller-pattern.md new file mode 100644 index 000000000..0c0294a19 --- /dev/null +++ b/content/notes/model-view-controller-pattern.md @@ -0,0 +1,15 @@ +--- +title: "model-view-controller-pattern" +aliases: MVC +tags: +- pattern +--- + +**Model:** An object carrying data +- handles data logiv +- interacts with database + +**View**: The visualisation of the data that model contains +- rendered dynamically + +**Controller:** Controls the data flow into model object and updates the view whenever data changes. Keeps view and model separate. diff --git a/content/notes/modelling-behaviour.md b/content/notes/modelling-behaviour.md index 0e5cde176..34ce50460 100644 --- a/content/notes/modelling-behaviour.md +++ b/content/notes/modelling-behaviour.md @@ -6,16 +6,15 @@ tags: - info201 --- -[relevant slides](https://blackboard.otago.ac.nz/bbcswebdav/pid-2892846-dt-content-rid-18407618_1/courses/INFO201_S1DNIE_2022/2022/lectures/lecture_12_slides.pdf), [lecture recording](https://echo360.net.au/lesson/3807232c-e251-4818-a098-c61f6a6b455a/classroom#sortDirection=desc) +[relevant slides](https://blackboard.otago.ac.nz/bbcswebdav/pid-2892846-dt-content-rid-18407618_1/courses/INFO201_S1DNIE_2022/2022/lectures/lecture_12_slides.pdf), [lecture recording](https://echo360.net.au/lesson/3807232c-e251-4818-a098-c61f6a6b455a/classroom#sortDirection=desc), [relevant article](https://thevaluable.dev/anemic-domain-model/) -Modelling behaviour is more complex than modelling the structure of OOP systems (e.g., [class-diagrams](notes/class-diagrams.md). There are more digrams types, it more general, and more complicated. +Modelling behaviour is more complex than modelling the structure of OOP systems (e.g., [class-diagrams](notes/class-diagrams.md). There are more diagram types, they are more general, and more complicated. -Although class diagrams specify some behaviour (public vs private, method signature and implementations, api (what methods are available), inheritance and behaviour). +Class do diagrams specify *some* behaviour (public vs private, method signature and implementations, api (what methods are available), inheritance and behaviour). Models of system and object behaviour cover these and also lower level sequencing and flow of control, and compartmentalisation into "subsystems" # 1 Inheritance - ## 1.1 Via Specialisation Inheritance via specialisation is when something is subclass of something else. Subclasses inherit all public members of their parents. They are able to replace or customise inherited existing methods and add their own specialsed methods (including constructors). [example class diagram](https://i.imgur.com/Nul5ECp.png), [example java code](https://i.imgur.com/D7nZ2ON.png) @@ -59,6 +58,27 @@ in Java: - subclass or implement this to create specific implementations - use the top-level class or interface everywhere you would otherwise use the specialised implementations + # 2 Behaviour +## 2.1 Anaemic domain models +In an anaemic domain model the **domain objects** also called **Models** contain (mostly) only data, and very little logic. + +The **services** set the properties of the models via getters and setters. This defines the logic of the application + +[anaemic example](https://i.imgur.com/PeaBhnX.png) + +**Processor objects** are often used in anaemic systems to move data between objects. Also called **services** + +[processor example](https://i.imgur.com/jw3Xbc1.png) + + +## 2.2 Rich domain models +In a rich domain model logic is contained within **real domain models**. And the service layer thin and used only for third party services. + +This means that the behaviour of the domain models is encapsulated within them + +[rich example](https://i.imgur.com/eHmda7A.png) + + #unfinished \ No newline at end of file diff --git a/content/notes/networks.md b/content/notes/networks.md new file mode 100644 index 000000000..b5b93b139 --- /dev/null +++ b/content/notes/networks.md @@ -0,0 +1,10 @@ +--- +title: "networks" +aliases: Networks +tags: +- +--- + +- [docker-containers](notes/docker-containers.md) +- [virtual-machines](notes/virtual-machines.md) +- [SSH](notes/ssh.md) diff --git a/content/notes/normalisation.md b/content/notes/normalisation.md new file mode 100644 index 000000000..ca99b83bb --- /dev/null +++ b/content/notes/normalisation.md @@ -0,0 +1,32 @@ +--- +title: "normalisation" +aliases: +tags: +- info201 +--- + +formal process of eliminanting unnecessary redundancy in relations by splitting relations into smaller chunks + +bottom up approach +- functional dependencies ⇒ normalised relations +- requirements ⇒ conceptual ≫ logical is "top down" +- use normalisation to verify your logical design + - to ensure you haven't missed anything + +# 1 Pros ans cons + ++ frees from anomalies ++ separates data the belong to different entities ++ reduces data redundancy ++ doesn't bias db design infaour of certain queries at the expense of others + +- more relations required +- more complex queries can imply slower performance in some DBMSs + +# 2 Normal forms +- 1NF ⇒ Single valued attributes only +- 2NF ⇒ all on-key attibutes fully dependent on PK (i.e., no dependencies on part of the PK) (no partial dependencies) +- 3NF/BCNF ⇒ no non-key transitive dependencies +- 4NF ⇒ no multivalued dependencies +- 5NF ⇒ all join dependencies implied by Composite key (CKs) +- 6NF ⇒ irreducible relations diff --git a/content/notes/personas-and-scenarios.md b/content/notes/personas-and-scenarios.md index cacd8f1ee..ba7657d94 100644 --- a/content/notes/personas-and-scenarios.md +++ b/content/notes/personas-and-scenarios.md @@ -34,7 +34,7 @@ Why they want to accomplish end goals /long term desires/self-image - activities ⇒ what the user does, frequency and volume - attitudes ⇒ how the uers thinks about the product domian and knowledge -- aptitudes ⇒ what education and trainging the user has +- aptitudes ⇒ what education and training the user has - motivations - why the user is engaged in the product domain - skills @@ -65,4 +65,6 @@ Have a good story to tell ![](https://i.imgur.com/TQRKPdi.png) ![](https://i.imgur.com/YcxfAbX.png) -![](https://i.imgur.com/r3kTI8W.png) \ No newline at end of file +![](https://i.imgur.com/r3kTI8W.png) + +![](https://i.imgur.com/4EKI6Dm.png) diff --git a/content/notes/propogation-of-ideas.md b/content/notes/propogation-of-ideas.md new file mode 100644 index 000000000..318cf1fde --- /dev/null +++ b/content/notes/propogation-of-ideas.md @@ -0,0 +1,25 @@ +--- +title: "Untitled 2" +aliases: Memes and the Eploitation of Imagination +tags: +- article +- philosophy +- art +--- + +link:https://ase.tufts.edu/cogstud/dennett/papers/memeimag.htm + +The david and miriam mandel lecture +american society for aesthetics +oct 27 1989 + +How (or whether) are promotes human evolution or development + +# What is a Meme +Richard Dawkins defines a meme as: a unit of cultural transmission, or a unit of imitation + +**Art:** all artifice, all human invention + +The paper compares memes to genes and explores the way they evolve similar to genes + + diff --git a/content/notes/quicksort.md b/content/notes/quicksort.md new file mode 100644 index 000000000..92c7deaef --- /dev/null +++ b/content/notes/quicksort.md @@ -0,0 +1,22 @@ +--- +title: "quicksort" +aliases: Quicksort +tags: +- cosc201 +- algorithm +--- + +pre ⇒ select pivot and split the array + +rec ⇒ apply quicksort to the partitions + +post ⇒ not much + +designeds when sorting inplace was important + +works best of primitive types as they can be stored in the fastest memory location + +- memory access can be localised and the comparisions are direct +- those advantages are limited when sorting objects of reference type +- i that case each element of the array is just a reference to where the object really is +- so there are no local access advantages diff --git a/content/notes/recognition-over-recall.md b/content/notes/recognition-over-recall.md new file mode 100644 index 000000000..431c1d08c --- /dev/null +++ b/content/notes/recognition-over-recall.md @@ -0,0 +1,18 @@ +--- +title: "recognition-over-recall" +aliases: Recognition Over Recall +tags: +- info203 +--- + +### 3.1 avoid codes + +![](https://i.imgur.com/B8sJxd6.png) + +### 3.2 Recognition with previews or icons + +![](https://i.imgur.com/UBmJl6Y.png) + +### 3.3 use icons that promote recognition + +![](https://i.imgur.com/adjt5nv.png) diff --git a/content/notes/redundancy-and-anomalies.md b/content/notes/redundancy-and-anomalies.md new file mode 100644 index 000000000..c43ded3b1 --- /dev/null +++ b/content/notes/redundancy-and-anomalies.md @@ -0,0 +1,42 @@ +--- +title: "redundancy-and-anomalies" +aliases: redundancy and anomalies +tags: +- info201 +--- + +### 0.1 Redundancy +when values are stored repetitively in database relations +- usually in poorly designed relations +- - potential for anomalous data to be stored +e.g., ![](https://i.imgur.com/8RdSNZt.png) + +#### 0.1.1 How it arises +- ad hoc database + - flat file + - spreadsheet (no contraints) +- Poor database design + - poor analysis + - poorly designed ERDs (not thinkiing properly about the relationships) +- modifications to existing systems + - "bolting on" new attributes + - schema evolution over time + +### 0.2 Anomalies +#### 0.2.1 Update anomaly +An anomaly that occurs follows an UPDATE operation +e.g., +![](https://i.imgur.com/fBMd8W3.png) + +#### 0.2.2 Delete anomaly +An anomly that occurs following a DELETE operation +e.g., +![](https://i.imgur.com/fUGVR98.png) +![](https://i.imgur.com/yp6KdYg.png) + +#### 0.2.3 Insert anomaly +An anomly that occurs following a INSERT operation +e.g., +![](https://i.imgur.com/hM1VlGs.png) +![](https://i.imgur.com/SkdKTLP.png) +Causes the process of putting johnson in system is delayed diff --git a/content/notes/scrum.md b/content/notes/scrum.md new file mode 100644 index 000000000..4c420c00d --- /dev/null +++ b/content/notes/scrum.md @@ -0,0 +1,27 @@ +--- +title: "scrum" +aliases: SCRUM +tags: +- info201 +--- + +Intense effort involving entire team for defined period of time +Product backlog - prioritied list of requirements +Product owner - cllient stakeholder who controls backlog +Scrum master - project manager + +# 1 Scrum sprint +A time controlled mini-project to implement part of the system + +![](https://i.imgur.com/R3biN9h.png) + +# 2 Scrum practices +scope of sprint is frozen + - can reduce + - cannot expand +time period is kept constant + +daily scrum meeting +- what have you done since last scrum +- what whill you do by next scrum +- what kept you or is keeping you from compeleting your work diff --git a/content/notes/set.md b/content/notes/set.md index fe8bdf585..ccaf96559 100644 --- a/content/notes/set.md +++ b/content/notes/set.md @@ -1,4 +1,5 @@ --- +number headings: auto, first-level 1, max 6, 1.1 title: "set" aliases: sets, Set, Sets tags: @@ -20,13 +21,13 @@ This gives us the methods: - `Remove(x)` - `Contains(x)` -Binary search trees are data types that supprts this ddata type when there is an ordering on the runderlying elements' +Binary search trees are data types that supprts this data type when there is an ordering on the underlying elements +A [binary search tree](notes/binary-search-tree.md) can be used to implement a set when there is no order. [hash sets and hash maps](notes/hash-map.md) can be used when there is order. -[hash sets and hash maps](notes/hash-map.md) do the same when there is no order. +# 1 Implementations +## 1.1 Basic set -## 0.1 Basic set - -Simplest way would be to use a list or an array. +Simplest way to implement a set is using an array. [Code for basic set](https://blackboard.otago.ac.nz/bbcswebdav/pid-2890167-dt-content-rid-18354837_1/courses/COSC201_S1DNIE_2022/BasicSet.java) @@ -38,11 +39,11 @@ Simplest way would be to use a list or an array. All three operations are $O(n)$ as they must all iterate over the entire set -## 0.2 Ordered set +## 1.2 Ordered set A set with some underlying "natural" order. E.g., dictionary order for `string` objects. -We would also like to be able to do a in order *traversal* +We would also like to be able to do an in order traversal of an ordered set If the set is static - store using sorted array @@ -55,4 +56,6 @@ But then: This is fine if we dont expect to use the dynamic operations a lot. -Another approach might be to maintain a `main` array and a subsidary `add` and `remove` arrays and only periodically do the updates to the main array. but this gets complicated very quickly \ No newline at end of file +Another approach might be to maintain a `main` array and a subsidary `add` and `remove` arrays and only periodically do the updates to the main array. but this gets complicated very quickly + +A better way of doing this is using a [binary search tree](notes/binary-search-tree.md) \ No newline at end of file diff --git a/content/notes/show-system-status.md b/content/notes/show-system-status.md new file mode 100644 index 000000000..9c0ef063e --- /dev/null +++ b/content/notes/show-system-status.md @@ -0,0 +1,26 @@ +--- +title: "show-system-status" +aliases: Show System Status, System Status +tags: +- info203 +--- + +This is the first of neilsens ten usability heuristics. fr + +- feedback depends on response time + - <1s just show outcome + - ~1s feedback that activity is underway + - >>1s show fractional progress time + +- 0.1 seconds --> feels instantaneusly +- 1 second --> about the limit for flow to be uinteruippted +- 10 seeconds --> the limit for keeping users attention + +when: +- when action is requried +- show storage space +- making changes +- next steps --> user input required +- completion --> some task has finished + +![](https://i.imgur.com/QzHRh9Z.png) \ No newline at end of file diff --git a/content/notes/ssh.md b/content/notes/ssh.md new file mode 100644 index 000000000..d58ecb919 --- /dev/null +++ b/content/notes/ssh.md @@ -0,0 +1,26 @@ +--- +title: "ssh" +aliases: SSH +tags: +- networks +--- + +# What is it +telnet was a set of protocols for one xomputer to control another. This was not secure + +Telnet then spawned secure shell (SSH). This encytped + +The computer to be controlled needs to be running an SSH server. + +To connect to and control the device with the server we need to install SSH software on the device we will use to connect + +to login: ssh username@ip-address then enter password + +# Where is it used. + +While users access a server by TLS or HTTP(S), admins access a server using SSH via the command line. + +It can also be used for automated operations. Usually this will also invole file transfer using SCP for SFTP + + +0 juyt \ No newline at end of file diff --git a/content/notes/stakeholders.md b/content/notes/stakeholders.md new file mode 100644 index 000000000..4eaffbf9e --- /dev/null +++ b/content/notes/stakeholders.md @@ -0,0 +1,27 @@ +--- +title: "stakeholders" +aliases: Stakeholders +tags: +- info201 +- info203 +--- + +People with interest in successful implementation + +three primary groups +- users +- clients -> pay for and own systems +- technical staff -> ensure system operation + +Analyst should id every type of stakeholder during [systems-development-life-cycle](notes/systems-development-life-cycle.md) + +### 0.2 users as stakeholders +horizontal user roles -> information flow across dept's +- ? + +vertical user roles ->information needs of staff, middle management, senior execs +- business users perform day to day operations +- information users need current information +- mangement users need summary information +- executive users need strategic information +- external users may have access to the systems diff --git a/content/notes/storyboards.md b/content/notes/storyboards.md index 6db5fc754..55b12bde4 100644 --- a/content/notes/storyboards.md +++ b/content/notes/storyboards.md @@ -15,6 +15,21 @@ short and concise low fidelity not about pretty picures. ⇒ about communicating ideas +Shows: +- setting + - people + - environment + - task being done +- sequence + - what steps + - what leads someone to the app + - task task +- satisfaction + - what is the users motivation + - what does it enable people to accomplish + - what need does the system fill + + ![](https://i.imgur.com/dyZIPH9.png) ![](https://i.imgur.com/YE27hWp.png) ![](https://i.imgur.com/uOqAl4o.png) @@ -42,18 +57,4 @@ simplify and develop vocabulary/your own style using tracing and templates -![](https://i.imgur.com/wwf7ab3.png) - - -- setting - - people - - environment - - task being done -- sequence - - what steps - - what leads someone to the app - - task task -- satisfaction - - what is the users motivation - - what does it enable people to accomplish - - what need does the system fill +![](https://i.imgur.com/wwf7ab3.png) \ No newline at end of file diff --git a/content/notes/systems-development-life-cycle.md b/content/notes/systems-development-life-cycle.md index 0ad32169a..1053568f8 100644 --- a/content/notes/systems-development-life-cycle.md +++ b/content/notes/systems-development-life-cycle.md @@ -1,7 +1,69 @@ --- title: "systems-development-life-cycle" +aliases: SDLC, sdlc, Systems Development Life Cycle, Systems Development Lifecycle tags: - info201 --- +Provides overall framework for managing the systems +There are many methodologies to help guide us through this cycle +Each methodology sits on the [predictive-adaptive-spectrum](notes/predictive-adaptive-spectrum.md) +A very common methodology at the moment is [agile-development](notes/agile-development.md) + +## 1 Phases +### 1.1 Analysis +^2d7976 +- Lots of communication with [stakeholders](notes/stakeholders.md) +- Gather detailed information +- define system requirements +- prioritise requirements (what is risky, what brings value to business) -> increase proability of success +- develop UI dialogs ([prototyping](notes/prototyping.md)' where the user can interact with the system) +- evaluate requirments +- review reccomendations with management + +## 2 Business process re-engineering +method of organising company +- streamline processes to be efficient and efffective +- question basic assumptions + +use ICT to help with BPR + +sys analyst may find opportunites to improve processes +- any project can include components of BPR + +simpler business processes -> simpler requirements -> simpler system + +## 3 Requirements +- [requirements](notes/requirements.md) +- [requirements-elicitation](notes/requirements-elicitation.md) +- Something the system should do +- Some constraint the system should have +- Can be functional or non functional +- Good requirements prevent failure + +## 4 SDLC Variations +- different terminology +- change focus on people +- change speed of development + - [prototyping](notes/prototyping.md) + - Rapid application development (RAD) + +## 5 Failure +main goal: Avoid project failure +- complete fail implies nothing delivered +- Types of fail + - cost overruns + - sw quality issues + - missed deadlines + - unhappy [stakeholders](notes/stakeholders.md) + +Suprisingly very common with large projects + +reasons for fail: +![](https://i.imgur.com/Q091Xtg.png) + + +**coding rarely causes problems** + +![](https://i.imgur.com/N36Cd0E.png) diff --git a/content/notes/templates.md b/content/notes/templates.md index 4c9df38eb..96b57729c 100644 --- a/content/notes/templates.md +++ b/content/notes/templates.md @@ -7,4 +7,7 @@ tags: - [[templates/Day]] - [[templates/note-header]] - [[templates/course]] -- [[templates/post]] \ No newline at end of file +- [[templates/post]] +- [date-day](private/templates/date-day.md) +- [DailyTemplate](private/templates/DailyTemplate.md) +- [induction-proof-template](private/templates/induction-proof-template.md) \ No newline at end of file diff --git a/content/notes/tree-traversal.md b/content/notes/tree-traversal.md new file mode 100644 index 000000000..11561ea08 --- /dev/null +++ b/content/notes/tree-traversal.md @@ -0,0 +1,30 @@ +--- +title: "tree-traversal" +aliases: traversal +tags: +- cosc201 +--- + +Visit each node in the tree once. So we need to visit n, all the nodes in L, and all the nodes in R. We can do this in four different ways + +preorder +- visit n +- traverse L +- traverse R + +Inorder. +- traverse L +- visit n +- traverse R +Creating an BST from an array using the add operation then doing an inorder traversal is effectively a [quicksort](notes/quicksort) + +postorder +- traverse L +- traverse R +- visit n + +level order +- vist the root +- visit the roots children +- visit their children +- etc diff --git a/content/notes/tree.md b/content/notes/tree.md index dc37ee246..6664fc34b 100644 --- a/content/notes/tree.md +++ b/content/notes/tree.md @@ -2,7 +2,6 @@ title: "tree" tags: - cosc201 -- datastructure --- not so much a data type. More of a data concept of a way in which data can be organised @@ -14,7 +13,7 @@ The type required for the ordered [set](notes/set.md) data type is the binary tr Trees in general: - Consists of *Nodes* - One node is distinguished and called the *root* -- Each node, except the root, has a uniquw *parent* +- Each node, except the root, has a unique *parent* - Any chain that moves from a mnode to its parent , its grandparent etc, eventually reaches the root. - The *children* of a nore arll the nodes of which it is the parent - Nodes may (and usually do) have additional data associated to them. (does not affect the structure) diff --git a/content/notes/unified-processes.md b/content/notes/unified-processes.md new file mode 100644 index 000000000..a2464baa7 --- /dev/null +++ b/content/notes/unified-processes.md @@ -0,0 +1,56 @@ +--- +title: "unified-processes" +aliases: Unified Processes, UP +tags: +- info201 +--- + +oop development +uses UML for modelling +four phase life cycle +- inception +- elaboration +- construction +- transition + +![](https://i.imgur.com/wV46UVm.png) + +##### best practices +- develop iteratively +- define and mange system requirements + - effectively managing changes in requirements +- use component architectures +- create visual models (UML) +- verify quality +- Control changes + +##### Values and principles +Values: +- **individuals and interactions** over processes and tools +- **working software** over comprehensive documentation +- **customer collaboration** over contract negotiation +- **responding to change** over following a plan + +Twelve modelling principles: + +> Build only necessary models that are useful and at the right level of detail + +- Software is your primary goal — don’t get distracted by +documentation or models. +- The next effort is your secondary goal — be aware of next +step versions or revisions. +- Minimise modelling — only build what helps move the project +forward. +- Embrace change, change incrementally — take small steps +that keep you on track and that can be reversed if necessary. +- Model with a purpose — to understand and communicate. +- Build multiple models — look at problems from different +perspectives. +- Build high-quality models and get feedback — from [stakeholders](stakeholders), other developers. +- Focus on content, not representation — always focus on stakeholder needs; informal hand-drawn models are often fine. +- Communicate and learn from each other. +- Know your models and how to use them. +- Adapt to specific project needs. +- Maximise stakeholder ROI. + +![](https://i.imgur.com/feq3EQ3.png) diff --git a/content/notes/unite-and-conquer.md b/content/notes/unite-and-conquer.md index 3b3fdcbef..d5f51e121 100644 --- a/content/notes/unite-and-conquer.md +++ b/content/notes/unite-and-conquer.md @@ -1,11 +1,10 @@ --- title: "unite-and-conquer" +aliases: unite and conquer tags: - cosc201 --- -unite and conquer - 5 | 8 | 2 | 3 | 4 | 1 | 7 | 6 5 8 | 2 3 | 1 4 | 6 7 @@ -14,6 +13,7 @@ unite and conquer 1 2 3 4 5 6 7 8 + ```java public static void mergeSort(int[] a) { int blockSize = 1; diff --git a/content/notes/user-freedom-and-control.md b/content/notes/user-freedom-and-control.md new file mode 100644 index 000000000..f3c68aaca --- /dev/null +++ b/content/notes/user-freedom-and-control.md @@ -0,0 +1,15 @@ +--- +title: "user-freedom-and-control" +aliases: User Freedom And Control +tags: +- info203 +--- + +want to give the user the feeling they can freely explore the app +and the freedomto control it + +- general flow +- undo/redo + +e.g., ![](https://i.imgur.com/zF5LDVx.png) +e.g., ![](https://i.imgur.com/eqfs1D6.png) diff --git a/content/notes/virtual-machines.md b/content/notes/virtual-machines.md new file mode 100644 index 000000000..c9156eb5e --- /dev/null +++ b/content/notes/virtual-machines.md @@ -0,0 +1,27 @@ +--- +title: "virtual-machines" +aliases: Virtual Machines +tags: +- video +- networks +--- + +link: https://www.youtube.com/watch?v=wX75Z-4MEoM + + +# What is a virtual Machine +A computer inside a computer. A computer contains hardware, cpu, ram , storage, etc. To use it we must install an OS. You think that to use another OS, you need another computer. But you can actually but this "computer" inside your existing computer. This is done using a hyper visor + +# What is a Hypervisor +This is a fancy word for an application you install. A good one to use is called virtualbox. The job of the hypervisor is to control computers inside you computers. These virtual computers "think" they are real computers. + +## Type 1 +Installed on the hardware. e.g., VMware. Can be installed on any computer. Typically used in companies on large servers. + +## Type 2 +Installed on a "host OS". Vitual machines use "guest" OSs. + +# Why would you want a hyper visor +- safe and secure for learning hacking +- to learn different operating systems +- to try breaking stuff \ No newline at end of file diff --git a/content/notes/visual-design-video.md b/content/notes/visual-design-video.md new file mode 100644 index 000000000..9aec1b37c --- /dev/null +++ b/content/notes/visual-design-video.md @@ -0,0 +1,24 @@ +--- +title: "visual-design-video" +aliases: +tags: +- info203 +- video +--- + +whitespace conveys grouping + +size contrasts indicate heirarchy + +try to make informatio that matters conme through clearly + +- guide - convery structure, relative importanct relatiosnhps +- pace - draw people in, help orient, provide hooks to dive deep +- mesage - express meaning and style, breathe life into the content. + +Three basic tools +- typography +- layout +- colour + + diff --git a/content/private/Plan.md b/content/private/Plan.md new file mode 100644 index 000000000..bf50837ec --- /dev/null +++ b/content/private/Plan.md @@ -0,0 +1,36 @@ +# 1 Plan + +Goal - summer internship doing actual coding. + +Options: +- Company-x + - Ideal +- Not company-x + - 2nd option + +Method + +# 2 - Impress dilan +Over deliver +Under promise +No mistakes +- track them +Do something extra + +# 3 - Engage with the company-x team +1 Message per week. + +# 4 - Make an app that show that I can do actual development +Web app: +- database +- design pattern +- Good UI +- solves an actual problem +- Using a stack that is useful. + + +# Things to ask + +- What stack does company-x use +- How do I show that I can be useful +- \ No newline at end of file diff --git a/content/private/templates/DailyTemplate.md b/content/private/templates/DailyTemplate.md index cc7012945..f5d9c390e 100644 --- a/content/private/templates/DailyTemplate.md +++ b/content/private/templates/DailyTemplate.md @@ -1,8 +1,8 @@ -[[notes/daily-notes]] +[<% tp.date.yesterday("YYYY-MM-DD") %>](daily_notes/<% tp.date.yesterday("YYYY-MM-DD") %>) << [daily-notes](notes/daily-notes.md) >> [<% tp.date.tomorrow("YYYY-MM-DD") %>](daily_notes/<% tp.date.tomorrow("YYYY-MM-DD") %>) --- -# {{date}} +# <% tp.date.now("DD-MM-YY") %> <% tp.user.getAOTD() %> @@ -39,12 +39,6 @@ break; ## Projects - python ai weekly review -- CI notes site -- my own password manager - -## Timetable - -![[Pasted image 20220311102444.png]] ## Links diff --git a/content/private/templates/Scripts/loadClasses.js b/content/private/templates/Scripts/loadClasses.js index fb2021ab8..ca65dc749 100644 --- a/content/private/templates/Scripts/loadClasses.js +++ b/content/private/templates/Scripts/loadClasses.js @@ -1,5 +1,5 @@ -function my_function (tR) { - const day = new Date().getDay(); - tR += day -} +function my_function (tR) { + const day = new Date().getDay(); + tR += day +} module.exports = my_function; \ No newline at end of file diff --git a/data/config.yaml b/data/config.yaml index 7a9e5a7bc..1662870eb 100644 --- a/data/config.yaml +++ b/data/config.yaml @@ -1,12 +1,12 @@ -name: Jet Hughes -enableToc: true -openToc: false -enableLinkPreview: true -enableLatex: true -description: - My University Notes -page_title: - "Jet Hughes" -links: - - link_name: Github - link: https://github.com/jethughes +name: Jet Hughes +enableToc: true +openToc: false +enableLinkPreview: true +enableLatex: true +description: + My University Notes +page_title: + "Jet Hughes" +links: + - link_name: Github + link: https://github.com/jethughes diff --git a/data/graphConfig.yaml b/data/graphConfig.yaml index 3f8d3fb6b..7ab89bf80 100644 --- a/data/graphConfig.yaml +++ b/data/graphConfig.yaml @@ -1,6 +1,6 @@ -enableLegend: false -enableDrag: true -enableZoom: true -depth: -1 # set to -1 to show full graph -paths: +enableLegend: false +enableDrag: true +enableZoom: true +depth: -1 # set to -1 to show full graph +paths: - /moc: "#4388cc" \ No newline at end of file diff --git a/layouts/404.html b/layouts/404.html index 424839502..27f2ab857 100644 --- a/layouts/404.html +++ b/layouts/404.html @@ -1,16 +1,16 @@ - - -{{ partial "head.html" . }} - - -
- {{partial "darkmode.html" .}} -
-

404.

-

Hey! You look a little lost. This page doesn't exist (or may be private).

- ↳ Let's get you home. -
-
- - - + + +{{ partial "head.html" . }} + + +
+ {{partial "darkmode.html" .}} +
+

404.

+

Hey! You look a little lost. This page doesn't exist (or may be private).

+ ↳ Let's get you home. +
+
+ + + diff --git a/layouts/_default/_markup/render-image.html b/layouts/_default/_markup/render-image.html index ff4e8b39c..1ae86075c 100644 --- a/layouts/_default/_markup/render-image.html +++ b/layouts/_default/_markup/render-image.html @@ -1,8 +1,8 @@ -{{$src := .Destination | safeURL }} -{{$external := strings.HasPrefix $src "http" }} -{{- if $external -}} -{{ .Text }} -{{- else -}} -{{$fixedUrl := (cond (hasPrefix $src "/") $src (print "/" $src)) | urlize}} -{{ .Text }} -{{- end -}} +{{$src := .Destination | safeURL }} +{{$external := strings.HasPrefix $src "http" }} +{{- if $external -}} +{{ .Text }} +{{- else -}} +{{$fixedUrl := (cond (hasPrefix $src "/") $src (print "/" $src)) | urlize}} +{{ .Text }} +{{- end -}} diff --git a/layouts/_default/_markup/render-link.html b/layouts/_default/_markup/render-link.html index cdacfc134..0cb588371 100644 --- a/layouts/_default/_markup/render-link.html +++ b/layouts/_default/_markup/render-link.html @@ -1,16 +1,16 @@ -{{$trimmed := strings.TrimSuffix ".md" (.Destination | safeURL)}} -{{$dashedurl := replace $trimmed "%20" "-" }} -{{$external := strings.HasPrefix $dashedurl "http" }} -{{- if $external -}} -{{ .Text | safeHTML }} -{{- else -}} -{{$spacedurl := replace $trimmed "%20" " " }} -{{$fixedUrl := (cond (hasPrefix $spacedurl "/") $spacedurl (print "/" $spacedurl)) | urlize}} -{{$nonexistent := eq (.Page.GetPage $spacedurl).RelPermalink ""}} -{{$rooted := default $spacedurl (strings.TrimRight "/" (.Page.GetPage $spacedurl).RelPermalink) }} -{{- .Text | safeHTML -}} - -{{- end -}} +{{$trimmed := strings.TrimSuffix ".md" (.Destination | safeURL)}} +{{$dashedurl := replace $trimmed "%20" "-" }} +{{$external := strings.HasPrefix $dashedurl "http" }} +{{- if $external -}} +{{ .Text | safeHTML }} +{{- else -}} +{{$spacedurl := replace $trimmed "%20" " " }} +{{$fixedUrl := (cond (hasPrefix $spacedurl "/") $spacedurl (print "/" $spacedurl)) | urlize}} +{{$nonexistent := eq (.Page.GetPage $spacedurl).RelPermalink ""}} +{{$rooted := default $spacedurl (strings.TrimRight "/" (.Page.GetPage $spacedurl).RelPermalink) }} +{{- .Text | safeHTML -}} + +{{- end -}} diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index ccb3b93ac..90d44cda6 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -1,10 +1,10 @@ - - -{{ block "head" . }} -{{ end }} - - -{{ block "main" . }} -{{ end }} - + + +{{ block "head" . }} +{{ end }} + + +{{ block "main" . }} +{{ end }} + \ No newline at end of file diff --git a/layouts/_default/section.html b/layouts/_default/section.html index 1a4aae058..783aa2332 100644 --- a/layouts/_default/section.html +++ b/layouts/_default/section.html @@ -1,25 +1,25 @@ - - -{{ partial "head.html" . }} - - -{{partial "search.html" .}} -
- -
-

{{ .Site.Data.config.page_title }}

- Search IconIcon to open search -
- {{partial "darkmode.html" .}} -
-
-

All {{.Title}}

- {{partial "page-list.html" .Paginator.Pages.ByLastmod.Reverse }} - {{ template "_internal/pagination.html" .}} -
- {{partial "contact.html" .}} -
-{{partial "popover.html" .}} - - - + + +{{ partial "head.html" . }} + + +{{partial "search.html" .}} +
+ +
+

{{ .Site.Data.config.page_title }}

+ Search IconIcon to open search +
+ {{partial "darkmode.html" .}} +
+
+

All {{.Title}}

+ {{partial "page-list.html" .Paginator.Pages.ByLastmod.Reverse }} + {{ template "_internal/pagination.html" .}} +
+ {{partial "contact.html" .}} +
+{{partial "popover.html" .}} + + + diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 88a859c3b..cfaea7100 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -1,33 +1,33 @@ - - -{{ partial "head.html" . }} - - -{{partial "search.html" .}} -
- -
-

{{ .Site.Data.config.page_title }}

- Search IconIcon to open search -
- {{partial "darkmode.html" .}} -
-
- {{if .Title}}

{{ .Title }}

{{end}} -

- Last updated {{if ne .Date .Lastmod}}{{ .Lastmod.Format "January 2, 2006" }}{{else}}Unknown{{end}} -

- - {{partial "toc.html" .}} - {{partial "textprocessing.html" . }} -
- {{partial "footer.html" .}} - {{partial "popover.html" .}} -
- - - + + +{{ partial "head.html" . }} + + +{{partial "search.html" .}} +
+ +
+

{{ .Site.Data.config.page_title }}

+ Search IconIcon to open search +
+ {{partial "darkmode.html" .}} +
+
+ {{if .Title}}

{{ .Title }}

{{end}} +

+ Last updated {{if ne .Date .Lastmod}}{{ .Lastmod.Format "January 2, 2006" }}{{else}}Unknown{{end}} +

+ + {{partial "toc.html" .}} + {{partial "textprocessing.html" . }} +
+ {{partial "footer.html" .}} + {{partial "popover.html" .}} +
+ + + diff --git a/layouts/_default/taxonomy.html b/layouts/_default/taxonomy.html index b7a45b10f..be7532237 100644 --- a/layouts/_default/taxonomy.html +++ b/layouts/_default/taxonomy.html @@ -1,34 +1,34 @@ - - -{{ partial "head.html" . }} - - -{{partial "search.html" .}} -
- -
-

{{ .Site.Data.config.page_title }}

- Search IconIcon to open search -
- {{partial "darkmode.html" .}} -
-
-

All {{.Title}}

-
- {{ range .Site.Taxonomies.tags.ByCount }} -
-

{{ .Page.Title }}

-

{{ .Count }} notes with this tag {{if gt .Count 2}}(showing first 2 results){{end}}

-
- {{ with ($.Site.GetPage (printf "/tags/%s" .Page.Title)) }} - {{partial "page-list.html" (first 2 .Pages.ByLastmod.Reverse)}} - {{ end }} - {{ end }} -
-
- {{partial "contact.html" .}} -
-{{partial "popover.html" .}} - - - + + +{{ partial "head.html" . }} + + +{{partial "search.html" .}} +
+ +
+

{{ .Site.Data.config.page_title }}

+ Search IconIcon to open search +
+ {{partial "darkmode.html" .}} +
+
+

All {{.Title}}

+
+ {{ range .Site.Taxonomies.tags.ByCount }} +
+

{{ .Page.Title }}

+

{{ .Count }} notes with this tag {{if gt .Count 2}}(showing first 2 results){{end}}

+
+ {{ with ($.Site.GetPage (printf "/tags/%s" .Page.Title)) }} + {{partial "page-list.html" (first 2 .Pages.ByLastmod.Reverse)}} + {{ end }} + {{ end }} +
+
+ {{partial "contact.html" .}} +
+{{partial "popover.html" .}} + + + diff --git a/layouts/_default/term.html b/layouts/_default/term.html index 16ea85cf8..7b897ec34 100644 --- a/layouts/_default/term.html +++ b/layouts/_default/term.html @@ -1,25 +1,25 @@ - - -{{ partial "head.html" . }} - - -{{partial "search.html" .}} -
- -
-

{{ .Site.Data.config.page_title }}

- Search IconIcon to open search -
- {{partial "darkmode.html" .}} -
-
-

Tag: {{.Title | humanize}}

- {{partial "page-list.html" .Paginator.Pages}} - {{ template "_internal/pagination.html" . }} -
- {{partial "contact.html" .}} -
-{{partial "popover.html" .}} - - - + + +{{ partial "head.html" . }} + + +{{partial "search.html" .}} +
+ +
+

{{ .Site.Data.config.page_title }}

+ Search IconIcon to open search +
+ {{partial "darkmode.html" .}} +
+
+

Tag: {{.Title | humanize}}

+ {{partial "page-list.html" .Paginator.Pages}} + {{ template "_internal/pagination.html" . }} +
+ {{partial "contact.html" .}} +
+{{partial "popover.html" .}} + + + diff --git a/layouts/index.html b/layouts/index.html index ee33d7cc8..cffe3b21c 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -1,24 +1,24 @@ - - -{{ partial "head.html" . }} - - -{{partial "search.html" .}} -
- -
-

{{if .Title}}{{ .Title }}{{else}}Untitled{{end}}

- Search IconIcon to open search -
- {{partial "darkmode.html" .}} -
-
- {{partial "toc.html" .}} - {{partial "textprocessing.html" . }} -
- {{partial "footer.html" .}} - {{partial "popover.html" .}} -
- - - + + +{{ partial "head.html" . }} + + +{{partial "search.html" .}} +
+ +
+

{{if .Title}}{{ .Title }}{{else}}Untitled{{end}}

+ Search IconIcon to open search +
+ {{partial "darkmode.html" .}} +
+
+ {{partial "toc.html" .}} + {{partial "textprocessing.html" . }} +
+ {{partial "footer.html" .}} + {{partial "popover.html" .}} +
+ + + diff --git a/layouts/partials/backlinks.html b/layouts/partials/backlinks.html index 425ec67cf..45187b575 100644 --- a/layouts/partials/backlinks.html +++ b/layouts/partials/backlinks.html @@ -1,24 +1,24 @@ -

Backlinks

- +

Backlinks

+ diff --git a/layouts/partials/contact.html b/layouts/partials/contact.html index 7fb991e9d..9eaa87faa 100644 --- a/layouts/partials/contact.html +++ b/layouts/partials/contact.html @@ -1,14 +1,14 @@ - -
-
-

Made by {{ $.Site.Data.config.name }} using Quartz, © {{ dateFormat "2006" now }}

-
    - {{ if not .IsHome }} -
  • Home
    • - {{end}} - {{- range $.Site.Data.config.links -}} -
  • {{.link_name}}
    • - {{- end -}} -
-
-
+ +
+
+

Made by {{ $.Site.Data.config.name }} using Quartz, © {{ dateFormat "2006" now }}

+
    + {{ if not .IsHome }} +
  • Home
    • + {{end}} + {{- range $.Site.Data.config.links -}} +
  • {{.link_name}}
    • + {{- end -}} +
+
+
diff --git a/layouts/partials/darkmode.html b/layouts/partials/darkmode.html index d7540c22a..3dec38f1e 100644 --- a/layouts/partials/darkmode.html +++ b/layouts/partials/darkmode.html @@ -1,15 +1,15 @@ -
- - - +
+ + +
\ No newline at end of file diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index 6d4ef17b9..cc891362c 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -1,11 +1,11 @@ -
-
-
- {{partial "backlinks.html" .}} -
-
- {{partial "graph.html" .}} -
-
- +
+
+
+ {{partial "backlinks.html" .}} +
+
+ {{partial "graph.html" .}} +
+
+ {{partial "contact.html" .}} \ No newline at end of file diff --git a/layouts/partials/graph.html b/layouts/partials/graph.html index ca379689b..6be8c0651 100644 --- a/layouts/partials/graph.html +++ b/layouts/partials/graph.html @@ -1,25 +1,25 @@ - -

Interactive Graph

-
- -{{ $js := resources.Get "js/graph.js" | resources.Fingerprint "md5" }} - - + +

Interactive Graph

+
+ +{{ $js := resources.Get "js/graph.js" | resources.Fingerprint "md5" }} + + diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 195cade44..d3be2a606 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -1,46 +1,46 @@ - - - - - {{ if .Title }}{{ .Title }}{{ else }}{{ $.Site.Data.config.page_title }}{{ end }} - - - - - - {{$sass := resources.Match "styles/[!_]*.scss" }} - {{$css := slice }} - {{range $sass}} - {{$scss := . | resources.ToCSS (dict "outputStyle" "compressed") }} - {{$css = $css | append $scss}} - {{end}} - {{$finalCss := $css | resources.Concat "styles.css" | resources.Fingerprint "md5" | resources.Minify }} - - - {{ $darkMode := resources.Get "js/darkmode.js" | resources.Fingerprint "md5" | resources.Minify }} - - {{partial "katex.html" .}} - - - {{$linkIndex := resources.Get "indices/linkIndex.json" | resources.Fingerprint "md5" | resources.Minify | }} - {{$contentIndex := resources.Get "indices/contentIndex.json" | resources.Fingerprint "md5" | resources.Minify }} - - -{{ template "_internal/google_analytics.html" . }} + + + + + {{ if .Title }}{{ .Title }}{{ else }}{{ $.Site.Data.config.page_title }}{{ end }} + + + + + + {{$sass := resources.Match "styles/[!_]*.scss" }} + {{$css := slice }} + {{range $sass}} + {{$scss := . | resources.ToCSS (dict "outputStyle" "compressed") }} + {{$css = $css | append $scss}} + {{end}} + {{$finalCss := $css | resources.Concat "styles.css" | resources.Fingerprint "md5" | resources.Minify }} + + + {{ $darkMode := resources.Get "js/darkmode.js" | resources.Fingerprint "md5" | resources.Minify }} + + {{partial "katex.html" .}} + + + {{$linkIndex := resources.Get "indices/linkIndex.json" | resources.Fingerprint "md5" | resources.Minify | }} + {{$contentIndex := resources.Get "indices/contentIndex.json" | resources.Fingerprint "md5" | resources.Minify }} + + +{{ template "_internal/google_analytics.html" . }} diff --git a/layouts/partials/katex.html b/layouts/partials/katex.html index e11c4f14e..06ef1c969 100644 --- a/layouts/partials/katex.html +++ b/layouts/partials/katex.html @@ -1,16 +1,16 @@ -{{if $.Site.Data.config.enableLatex}} - - - - -{{end}} +{{if $.Site.Data.config.enableLatex}} + + + + +{{end}} diff --git a/layouts/partials/page-list.html b/layouts/partials/page-list.html index bdfcd59ce..e2c01e315 100644 --- a/layouts/partials/page-list.html +++ b/layouts/partials/page-list.html @@ -1,15 +1,15 @@ -
    - {{- range . -}} -
  • -
    -
    -

    {{- .Title -}}

    -

    {{- .Summary -}}{{if .Truncated}}...{{end}}

    -
    -

    - {{ .ReadingTime }} minute read. Last updated {{if ne .Date .Lastmod}}{{ .Lastmod.Format "January 2, 2006" }}{{else}}Unknown{{end}} -

    -
    -
    • - {{- end -}} +
      + {{- range . -}} +
    • +
      +
      +

      {{- .Title -}}

      +

      {{- .Summary -}}{{if .Truncated}}...{{end}}

      +
      +

      + {{ .ReadingTime }} minute read. Last updated {{if ne .Date .Lastmod}}{{ .Lastmod.Format "January 2, 2006" }}{{else}}Unknown{{end}} +

      +
      +
      • + {{- end -}}
    \ No newline at end of file diff --git a/layouts/partials/popover.html b/layouts/partials/popover.html index 1d1662282..4d35c0f38 100644 --- a/layouts/partials/popover.html +++ b/layouts/partials/popover.html @@ -1,7 +1,7 @@ -{{if $.Site.Data.config.enableLinkPreview}} -{{ $js := resources.Get "js/popover.js" | resources.Fingerprint "md5" | resources.Minify }} - - +{{if $.Site.Data.config.enableLinkPreview}} +{{ $js := resources.Get "js/popover.js" | resources.Fingerprint "md5" | resources.Minify }} + + {{end}} \ No newline at end of file diff --git a/layouts/partials/search.html b/layouts/partials/search.html index f727184a6..bee0ba687 100644 --- a/layouts/partials/search.html +++ b/layouts/partials/search.html @@ -1,10 +1,10 @@ -
    -
    - -
    -
    -
    -
    - -{{ $js := resources.Get "js/search.js" | resources.Fingerprint "md5" | resources.Minify }} - +
    +
    + +
    +
    +
    +
    + +{{ $js := resources.Get "js/search.js" | resources.Fingerprint "md5" | resources.Minify }} + diff --git a/layouts/partials/textprocessing.html b/layouts/partials/textprocessing.html index 2312aa461..868d626ac 100644 --- a/layouts/partials/textprocessing.html +++ b/layouts/partials/textprocessing.html @@ -1,56 +1,56 @@ -{{ $content := .Content }} -{{ $raw := .RawContent }} -{{ $page := .Page }} - -{{/* Escape slashes for Latex to fix line breaks */}} -{{$latex := findRE "\\$\\$([^\\$]+)\\$\\$" $content}} -{{range $latex}} - {{$fixed := replaceRE "\\\\(?: +|\\n)" "\\\\" .}} - {{$content = replace $content . $fixed}} -{{end}} - -{{/* Wikilinks */}} -{{$wikilinks := $content | findRE "!?\\[\\[\\S[^\\[\\]\\|]*(?:\\|[^\\[\\]]*)?\\S\\]\\]" }} -{{$codefences := $raw | findRE "\\x60[^\\x60\\n]+\\x60"}} -{{$codeblocks := $raw | findRE "\\x60{3}[^\\x60]+\\x60{3}"}} -{{$code := union $codefences $codeblocks}} -{{range $wikilinks}} - {{$cur := .}} - {{$incode := false}} - {{range $code}} - {{if (in . $cur)}} - {{$incode = true}} - {{end}} - {{end}} - {{if not $incode}} - {{if (hasPrefix . "!")}} - {{$inner := . | strings.TrimPrefix "![[" | strings.TrimSuffix "]]" }} - {{$split := split $inner "|"}} - {{$path := index $split 0 | relURL}} - {{$reference := split $path "#"}} - {{$title := index $reference 0}} - {{$display := default $title (index $split 1)}} - {{$img := printf "" $path $display}} - {{$content = replace $content . $img}} - {{else}} - {{$inner := . | strings.TrimPrefix "[[" | strings.TrimSuffix "]]" }} - {{$split := split $inner "|"}} - {{$path := index $split 0}} - {{$reference := split $path "#"}} - {{$title := index $reference 0}} - {{$block := default "" (index $reference 1)}} - {{$block = strings.TrimRight "/" (cond (eq $block "") $block (printf "#%s" $block))}} - {{$href := strings.TrimRight "/" ($page.GetPage $title).RelPermalink}} - {{$display := default $title (index $split 1)}} - {{if not $href}} - {{$link := printf "%s" $display}} - {{$content = replace $content . $link}} - {{else}} - {{$fullhref := printf "%s%s" $href $block }} - {{$link := printf "%s" $fullhref $href $display}} - {{$content = replace $content . $link}} - {{end}} - {{end}} - {{end}} -{{end}} -{{ $content | safeHTML }} +{{ $content := .Content }} +{{ $raw := .RawContent }} +{{ $page := .Page }} + +{{/* Escape slashes for Latex to fix line breaks */}} +{{$latex := findRE "\\$\\$([^\\$]+)\\$\\$" $content}} +{{range $latex}} + {{$fixed := replaceRE "\\\\(?: +|\\n)" "\\\\" .}} + {{$content = replace $content . $fixed}} +{{end}} + +{{/* Wikilinks */}} +{{$wikilinks := $content | findRE "!?\\[\\[\\S[^\\[\\]\\|]*(?:\\|[^\\[\\]]*)?\\S\\]\\]" }} +{{$codefences := $raw | findRE "\\x60[^\\x60\\n]+\\x60"}} +{{$codeblocks := $raw | findRE "\\x60{3}[^\\x60]+\\x60{3}"}} +{{$code := union $codefences $codeblocks}} +{{range $wikilinks}} + {{$cur := .}} + {{$incode := false}} + {{range $code}} + {{if (in . $cur)}} + {{$incode = true}} + {{end}} + {{end}} + {{if not $incode}} + {{if (hasPrefix . "!")}} + {{$inner := . | strings.TrimPrefix "![[" | strings.TrimSuffix "]]" }} + {{$split := split $inner "|"}} + {{$path := index $split 0 | relURL}} + {{$reference := split $path "#"}} + {{$title := index $reference 0}} + {{$display := default $title (index $split 1)}} + {{$img := printf "" $path $display}} + {{$content = replace $content . $img}} + {{else}} + {{$inner := . | strings.TrimPrefix "[[" | strings.TrimSuffix "]]" }} + {{$split := split $inner "|"}} + {{$path := index $split 0}} + {{$reference := split $path "#"}} + {{$title := index $reference 0}} + {{$block := default "" (index $reference 1)}} + {{$block = strings.TrimRight "/" (cond (eq $block "") $block (printf "#%s" $block))}} + {{$href := strings.TrimRight "/" ($page.GetPage $title).RelPermalink}} + {{$display := default $title (index $split 1)}} + {{if not $href}} + {{$link := printf "%s" $display}} + {{$content = replace $content . $link}} + {{else}} + {{$fullhref := printf "%s%s" $href $block }} + {{$link := printf "%s" $fullhref $href $display}} + {{$content = replace $content . $link}} + {{end}} + {{end}} + {{end}} +{{end}} +{{ $content | safeHTML }} diff --git a/layouts/partials/toc.html b/layouts/partials/toc.html index acda23d6d..a3b1ec0ec 100644 --- a/layouts/partials/toc.html +++ b/layouts/partials/toc.html @@ -1,8 +1,8 @@ -{{ if (and $.Site.Data.config.enableToc (ne .Params.enableToc false) (gt .WordCount 250)) }} - -{{end}} +{{ if (and $.Site.Data.config.enableToc (ne .Params.enableToc false) (gt .WordCount 250)) }} + +{{end}}