mirror of
https://github.com/jackyzha0/quartz.git
synced 2025-12-24 05:14:06 -06:00
update
This commit is contained in:
Jet Hughes
parent
f4269a4849
commit
eec8badee0
2
.github/FUNDING.yml
vendored
2
.github/FUNDING.yml
vendored
@ -1 +1 @@
|
|||||||
github: [jackyzha0]
|
github: [jackyzha0]
|
||||||
|
|||||||
64
.github/ISSUE_TEMPLATE/bug_report.md
vendored
64
.github/ISSUE_TEMPLATE/bug_report.md
vendored
@ -1,32 +1,32 @@
|
|||||||
---
|
---
|
||||||
name: Bug report
|
name: Bug report
|
||||||
about: Something about Quartz isn't working the way you expect
|
about: Something about Quartz isn't working the way you expect
|
||||||
title: ''
|
title: ''
|
||||||
labels: bug
|
labels: bug
|
||||||
assignees: ''
|
assignees: ''
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
**Describe the bug**
|
**Describe the bug**
|
||||||
A clear and concise description of what the bug is.
|
A clear and concise description of what the bug is.
|
||||||
|
|
||||||
**To Reproduce**
|
**To Reproduce**
|
||||||
Steps to reproduce the behavior:
|
Steps to reproduce the behavior:
|
||||||
1. Go to '...'
|
1. Go to '...'
|
||||||
2. Click on '....'
|
2. Click on '....'
|
||||||
3. Scroll down to '....'
|
3. Scroll down to '....'
|
||||||
4. See error
|
4. See error
|
||||||
|
|
||||||
**Expected behavior**
|
**Expected behavior**
|
||||||
A clear and concise description of what you expected to happen.
|
A clear and concise description of what you expected to happen.
|
||||||
|
|
||||||
**Screenshots**
|
**Screenshots**
|
||||||
If applicable, add screenshots to help explain your problem.
|
If applicable, add screenshots to help explain your problem.
|
||||||
|
|
||||||
**Desktop (please complete the following information):**
|
**Desktop (please complete the following information):**
|
||||||
- Device: [e.g. iPhone6]
|
- Device: [e.g. iPhone6]
|
||||||
- OS: [e.g. iOS]
|
- OS: [e.g. iOS]
|
||||||
- Browser [e.g. chrome, safari]
|
- Browser [e.g. chrome, safari]
|
||||||
|
|
||||||
**Additional context**
|
**Additional context**
|
||||||
Add any other context about the problem here.
|
Add any other context about the problem here.
|
||||||
|
|||||||
40
.github/ISSUE_TEMPLATE/feature_request.md
vendored
40
.github/ISSUE_TEMPLATE/feature_request.md
vendored
@ -1,20 +1,20 @@
|
|||||||
---
|
---
|
||||||
name: Feature request
|
name: Feature request
|
||||||
about: Suggest an idea or improvement for Quartz
|
about: Suggest an idea or improvement for Quartz
|
||||||
title: ''
|
title: ''
|
||||||
labels: enhancement
|
labels: enhancement
|
||||||
assignees: ''
|
assignees: ''
|
||||||
|
|
||||||
---
|
---
|
||||||
|
|
||||||
**Is your feature request related to a problem? Please describe.**
|
**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 [...]
|
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
|
||||||
|
|
||||||
**Describe the solution you'd like**
|
**Describe the solution you'd like**
|
||||||
A clear and concise description of what you want to happen.
|
A clear and concise description of what you want to happen.
|
||||||
|
|
||||||
**Describe alternatives you've considered**
|
**Describe alternatives you've considered**
|
||||||
A clear and concise description of any alternative solutions or features you've considered.
|
A clear and concise description of any alternative solutions or features you've considered.
|
||||||
|
|
||||||
**Additional context**
|
**Additional context**
|
||||||
Add any other context or screenshots about the feature request here.
|
Add any other context or screenshots about the feature request here.
|
||||||
|
|||||||
74
.github/workflows/deploy.yaml
vendored
74
.github/workflows/deploy.yaml
vendored
@ -1,37 +1,37 @@
|
|||||||
name: Deploy to GitHub Pages
|
name: Deploy to GitHub Pages
|
||||||
|
|
||||||
on:
|
on:
|
||||||
push:
|
push:
|
||||||
branches:
|
branches:
|
||||||
- hugo
|
- hugo
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
deploy:
|
deploy:
|
||||||
runs-on: ubuntu-18.04
|
runs-on: ubuntu-18.04
|
||||||
steps:
|
steps:
|
||||||
- uses: actions/checkout@v2
|
- uses: actions/checkout@v2
|
||||||
|
|
||||||
- name: Build Link Index
|
- name: Build Link Index
|
||||||
uses: jackyzha0/hugo-obsidian@v2.12
|
uses: jackyzha0/hugo-obsidian@v2.12
|
||||||
with:
|
with:
|
||||||
index: true
|
index: true
|
||||||
input: content
|
input: content
|
||||||
output: assets/indices
|
output: assets/indices
|
||||||
root: .
|
root: .
|
||||||
|
|
||||||
- name: Setup Hugo
|
- name: Setup Hugo
|
||||||
uses: peaceiris/actions-hugo@v2
|
uses: peaceiris/actions-hugo@v2
|
||||||
with:
|
with:
|
||||||
hugo-version: '0.96.0'
|
hugo-version: '0.96.0'
|
||||||
extended: true
|
extended: true
|
||||||
|
|
||||||
- name: Build
|
- name: Build
|
||||||
run: hugo --minify
|
run: hugo --minify
|
||||||
|
|
||||||
- name: Deploy
|
- name: Deploy
|
||||||
uses: peaceiris/actions-gh-pages@v3
|
uses: peaceiris/actions-gh-pages@v3
|
||||||
with:
|
with:
|
||||||
github_token: ${{ secrets.GITHUB_TOKEN }}
|
github_token: ${{ secrets.GITHUB_TOKEN }}
|
||||||
publish_dir: ./public
|
publish_dir: ./public
|
||||||
publish_branch: master # deploying branch
|
publish_branch: master # deploying branch
|
||||||
cname: jethughes.github.io
|
cname: jethughes.github.io
|
||||||
|
|||||||
18
.gitignore
vendored
18
.gitignore
vendored
@ -1,9 +1,9 @@
|
|||||||
.DS_Store
|
.DS_Store
|
||||||
public
|
public
|
||||||
resources
|
resources
|
||||||
.idea
|
.idea
|
||||||
content/203-mobile-app
|
content/203-mobile-app
|
||||||
content/.obsidian
|
content/.obsidian
|
||||||
.obsidian
|
.obsidian
|
||||||
assets/indices/linkIndex.json
|
assets/indices/linkIndex.json
|
||||||
assets/indices/contentIndex.json
|
assets/indices/contentIndex.json
|
||||||
|
|||||||
42
LICENSE.txt
42
LICENSE.txt
@ -1,21 +1,21 @@
|
|||||||
MIT License
|
MIT License
|
||||||
|
|
||||||
Copyright (c) 2021 jackyzha0
|
Copyright (c) 2021 jackyzha0
|
||||||
|
|
||||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
of this software and associated documentation files (the "Software"), to deal
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
in the Software without restriction, including without limitation the rights
|
in the Software without restriction, including without limitation the rights
|
||||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
copies of the Software, and to permit persons to whom the Software is
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
furnished to do so, subject to the following conditions:
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
The above copyright notice and this permission notice shall be included in all
|
The above copyright notice and this permission notice shall be included in all
|
||||||
copies or substantial portions of the Software.
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
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
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
SOFTWARE.
|
SOFTWARE.
|
||||||
|
|||||||
36
Makefile
36
Makefile
@ -1,18 +1,18 @@
|
|||||||
.DEFAULT_GOAL := serve
|
.DEFAULT_GOAL := serve
|
||||||
|
|
||||||
help: ## Show all Makefile targets
|
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}'
|
@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
|
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 remote show upstream || (echo "remote 'upstream' not present, setting 'upstream'" && git remote add upstream https://github.com/jackyzha0/quartz.git)
|
||||||
git fetch upstream
|
git fetch upstream
|
||||||
git log --oneline --decorate --graph ..upstream/hugo
|
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
|
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
|
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 remote show upstream || (echo "remote 'upstream' not present, setting 'upstream'" && git remote add upstream https://github.com/jackyzha0/quartz.git)
|
||||||
git fetch upstream
|
git fetch upstream
|
||||||
git checkout upstream/hugo -- layouts .github Makefile assets/js assets/styles/base.scss assets/styles/darkmode.scss config.toml data
|
git checkout upstream/hugo -- layouts .github Makefile assets/js assets/styles/base.scss assets/styles/darkmode.scss config.toml data
|
||||||
|
|
||||||
serve: ## Serve Quartz locally
|
serve: ## Serve Quartz locally
|
||||||
hugo-obsidian -input=content -output=assets/indices -index -root=. && hugo server --enableGitInfo
|
hugo-obsidian -input=content -output=assets/indices -index -root=. && hugo server --enableGitInfo
|
||||||
|
|||||||
@ -1,29 +1,29 @@
|
|||||||
const userPref = window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark'
|
const userPref = window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark'
|
||||||
const currentTheme = localStorage.getItem('theme') ?? userPref
|
const currentTheme = localStorage.getItem('theme') ?? userPref
|
||||||
|
|
||||||
if (currentTheme) {
|
if (currentTheme) {
|
||||||
document.documentElement.setAttribute('saved-theme', currentTheme);
|
document.documentElement.setAttribute('saved-theme', currentTheme);
|
||||||
}
|
}
|
||||||
|
|
||||||
const switchTheme = (e) => {
|
const switchTheme = (e) => {
|
||||||
if (e.target.checked) {
|
if (e.target.checked) {
|
||||||
document.documentElement.setAttribute('saved-theme', 'dark')
|
document.documentElement.setAttribute('saved-theme', 'dark')
|
||||||
localStorage.setItem('theme', 'dark')
|
localStorage.setItem('theme', 'dark')
|
||||||
}
|
}
|
||||||
else {
|
else {
|
||||||
document.documentElement.setAttribute('saved-theme', 'light')
|
document.documentElement.setAttribute('saved-theme', 'light')
|
||||||
localStorage.setItem('theme', 'light')
|
localStorage.setItem('theme', 'light')
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
window.addEventListener('DOMContentLoaded', () => {
|
window.addEventListener('DOMContentLoaded', () => {
|
||||||
// Darkmode toggle
|
// Darkmode toggle
|
||||||
const toggleSwitch = document.querySelector('#darkmode-toggle')
|
const toggleSwitch = document.querySelector('#darkmode-toggle')
|
||||||
|
|
||||||
// listen for toggle
|
// listen for toggle
|
||||||
toggleSwitch.addEventListener('change', switchTheme, false)
|
toggleSwitch.addEventListener('change', switchTheme, false)
|
||||||
|
|
||||||
if (currentTheme === 'dark') {
|
if (currentTheme === 'dark') {
|
||||||
toggleSwitch.checked = true
|
toggleSwitch.checked = true
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@ -1,220 +1,220 @@
|
|||||||
async function drawGraph(url, baseUrl, pathColors, depth, enableDrag, enableLegend, enableZoom) {
|
async function drawGraph(url, baseUrl, pathColors, depth, enableDrag, enableLegend, enableZoom) {
|
||||||
const { index, links, content } = await fetchData
|
const { index, links, content } = await fetchData
|
||||||
const curPage = url.replace(baseUrl, "")
|
const curPage = url.replace(baseUrl, "")
|
||||||
|
|
||||||
const parseIdsFromLinks = (links) => [...(new Set(links.flatMap(link => ([link.source, link.target]))))]
|
const parseIdsFromLinks = (links) => [...(new Set(links.flatMap(link => ([link.source, link.target]))))]
|
||||||
|
|
||||||
const neighbours = new Set()
|
const neighbours = new Set()
|
||||||
const wl = [curPage || "/", "__SENTINEL"]
|
const wl = [curPage || "/", "__SENTINEL"]
|
||||||
if (depth >= 0) {
|
if (depth >= 0) {
|
||||||
while (depth >= 0 && wl.length > 0) {
|
while (depth >= 0 && wl.length > 0) {
|
||||||
// compute neighbours
|
// compute neighbours
|
||||||
const cur = wl.shift()
|
const cur = wl.shift()
|
||||||
if (cur === "__SENTINEL") {
|
if (cur === "__SENTINEL") {
|
||||||
depth--
|
depth--
|
||||||
wl.push("__SENTINEL")
|
wl.push("__SENTINEL")
|
||||||
} else {
|
} else {
|
||||||
neighbours.add(cur)
|
neighbours.add(cur)
|
||||||
const outgoing = index.links[cur] || []
|
const outgoing = index.links[cur] || []
|
||||||
const incoming = index.backlinks[cur] || []
|
const incoming = index.backlinks[cur] || []
|
||||||
wl.push(...outgoing.map(l => l.target), ...incoming.map(l => l.source))
|
wl.push(...outgoing.map(l => l.target), ...incoming.map(l => l.source))
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
parseIdsFromLinks(links).forEach(id => neighbours.add(id))
|
parseIdsFromLinks(links).forEach(id => neighbours.add(id))
|
||||||
}
|
}
|
||||||
|
|
||||||
const data = {
|
const data = {
|
||||||
nodes: [...neighbours].map(id => ({ id })),
|
nodes: [...neighbours].map(id => ({ id })),
|
||||||
links: links.filter(l => neighbours.has(l.source) && neighbours.has(l.target)),
|
links: links.filter(l => neighbours.has(l.source) && neighbours.has(l.target)),
|
||||||
}
|
}
|
||||||
|
|
||||||
const color = (d) => {
|
const color = (d) => {
|
||||||
if (d.id === curPage || (d.id === "/" && curPage === "")) {
|
if (d.id === curPage || (d.id === "/" && curPage === "")) {
|
||||||
return "var(--g-node-active)"
|
return "var(--g-node-active)"
|
||||||
}
|
}
|
||||||
|
|
||||||
for (const pathColor of pathColors) {
|
for (const pathColor of pathColors) {
|
||||||
const path = Object.keys(pathColor)[0]
|
const path = Object.keys(pathColor)[0]
|
||||||
const colour = pathColor[path]
|
const colour = pathColor[path]
|
||||||
if (d.id.startsWith(path)) {
|
if (d.id.startsWith(path)) {
|
||||||
return colour
|
return colour
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return "var(--g-node)"
|
return "var(--g-node)"
|
||||||
}
|
}
|
||||||
|
|
||||||
const drag = simulation => {
|
const drag = simulation => {
|
||||||
function dragstarted(event, d) {
|
function dragstarted(event, d) {
|
||||||
if (!event.active) simulation.alphaTarget(1).restart();
|
if (!event.active) simulation.alphaTarget(1).restart();
|
||||||
d.fx = d.x;
|
d.fx = d.x;
|
||||||
d.fy = d.y;
|
d.fy = d.y;
|
||||||
}
|
}
|
||||||
|
|
||||||
function dragged(event, d) {
|
function dragged(event, d) {
|
||||||
d.fx = event.x;
|
d.fx = event.x;
|
||||||
d.fy = event.y;
|
d.fy = event.y;
|
||||||
}
|
}
|
||||||
|
|
||||||
function dragended(event, d) {
|
function dragended(event, d) {
|
||||||
if (!event.active) simulation.alphaTarget(0);
|
if (!event.active) simulation.alphaTarget(0);
|
||||||
d.fx = null;
|
d.fx = null;
|
||||||
d.fy = null;
|
d.fy = null;
|
||||||
}
|
}
|
||||||
|
|
||||||
const noop = () => { }
|
const noop = () => { }
|
||||||
return d3.drag()
|
return d3.drag()
|
||||||
.on("start", enableDrag ? dragstarted : noop)
|
.on("start", enableDrag ? dragstarted : noop)
|
||||||
.on("drag", enableDrag ? dragged : noop)
|
.on("drag", enableDrag ? dragged : noop)
|
||||||
.on("end", enableDrag ? dragended : noop);
|
.on("end", enableDrag ? dragended : noop);
|
||||||
}
|
}
|
||||||
|
|
||||||
const height = 250
|
const height = 250
|
||||||
const width = document.getElementById("graph-container").offsetWidth
|
const width = document.getElementById("graph-container").offsetWidth
|
||||||
|
|
||||||
const simulation = d3.forceSimulation(data.nodes)
|
const simulation = d3.forceSimulation(data.nodes)
|
||||||
.force("charge", d3.forceManyBody().strength(-30))
|
.force("charge", d3.forceManyBody().strength(-30))
|
||||||
.force("link", d3.forceLink(data.links).id(d => d.id))
|
.force("link", d3.forceLink(data.links).id(d => d.id))
|
||||||
.force("center", d3.forceCenter());
|
.force("center", d3.forceCenter());
|
||||||
|
|
||||||
const svg = d3.select('#graph-container')
|
const svg = d3.select('#graph-container')
|
||||||
.append('svg')
|
.append('svg')
|
||||||
.attr('width', width)
|
.attr('width', width)
|
||||||
.attr('height', height)
|
.attr('height', height)
|
||||||
.attr("viewBox", [-width / 2, -height / 2, width, height]);
|
.attr("viewBox", [-width / 2, -height / 2, width, height]);
|
||||||
|
|
||||||
if (enableLegend) {
|
if (enableLegend) {
|
||||||
const legend = [
|
const legend = [
|
||||||
{ "Current": "var(--g-node-active)" },
|
{ "Current": "var(--g-node-active)" },
|
||||||
{ "Note": "var(--g-node)" },
|
{ "Note": "var(--g-node)" },
|
||||||
...pathColors
|
...pathColors
|
||||||
]
|
]
|
||||||
legend.forEach((legendEntry, i) => {
|
legend.forEach((legendEntry, i) => {
|
||||||
const key = Object.keys(legendEntry)[0]
|
const key = Object.keys(legendEntry)[0]
|
||||||
const colour = legendEntry[key]
|
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("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")
|
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
|
// draw links between nodes
|
||||||
const link = svg.append("g")
|
const link = svg.append("g")
|
||||||
.selectAll("line")
|
.selectAll("line")
|
||||||
.data(data.links)
|
.data(data.links)
|
||||||
.join("line")
|
.join("line")
|
||||||
.attr("class", "link")
|
.attr("class", "link")
|
||||||
.attr("stroke", "var(--g-link)")
|
.attr("stroke", "var(--g-link)")
|
||||||
.attr("stroke-width", 2)
|
.attr("stroke-width", 2)
|
||||||
.attr("data-source", d => d.source.id)
|
.attr("data-source", d => d.source.id)
|
||||||
.attr("data-target", d => d.target.id)
|
.attr("data-target", d => d.target.id)
|
||||||
|
|
||||||
// svg groups
|
// svg groups
|
||||||
const graphNode = svg.append("g")
|
const graphNode = svg.append("g")
|
||||||
.selectAll("g")
|
.selectAll("g")
|
||||||
.data(data.nodes)
|
.data(data.nodes)
|
||||||
.enter().append("g")
|
.enter().append("g")
|
||||||
|
|
||||||
// draw individual nodes
|
// draw individual nodes
|
||||||
const node = graphNode.append("circle")
|
const node = graphNode.append("circle")
|
||||||
.attr("class", "node")
|
.attr("class", "node")
|
||||||
.attr("id", (d) => d.id)
|
.attr("id", (d) => d.id)
|
||||||
.attr("r", (d) => {
|
.attr("r", (d) => {
|
||||||
const numOut = index.links[d.id]?.length || 0
|
const numOut = index.links[d.id]?.length || 0
|
||||||
const numIn = index.backlinks[d.id]?.length || 0
|
const numIn = index.backlinks[d.id]?.length || 0
|
||||||
return 3 + (numOut + numIn) / 4
|
return 3 + (numOut + numIn) / 4
|
||||||
})
|
})
|
||||||
.attr("fill", color)
|
.attr("fill", color)
|
||||||
.style("cursor", "pointer")
|
.style("cursor", "pointer")
|
||||||
.on("click", (_, d) => {
|
.on("click", (_, d) => {
|
||||||
window.location.href = baseUrl + '/' + decodeURI(d.id).replace(/\s+/g, '-')
|
window.location.href = baseUrl + '/' + decodeURI(d.id).replace(/\s+/g, '-')
|
||||||
})
|
})
|
||||||
.on("mouseover", function(_, d) {
|
.on("mouseover", function(_, d) {
|
||||||
d3.selectAll(".node")
|
d3.selectAll(".node")
|
||||||
.transition()
|
.transition()
|
||||||
.duration(100)
|
.duration(100)
|
||||||
.attr("fill", "var(--g-node-inactive)")
|
.attr("fill", "var(--g-node-inactive)")
|
||||||
|
|
||||||
const neighbours = parseIdsFromLinks([...(index.links[d.id] || []), ...(index.backlinks[d.id] || [])])
|
const neighbours = parseIdsFromLinks([...(index.links[d.id] || []), ...(index.backlinks[d.id] || [])])
|
||||||
const neighbourNodes = d3.selectAll(".node").filter(d => neighbours.includes(d.id))
|
const neighbourNodes = d3.selectAll(".node").filter(d => neighbours.includes(d.id))
|
||||||
const currentId = d.id
|
const currentId = d.id
|
||||||
const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId)
|
const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId)
|
||||||
|
|
||||||
// highlight neighbour nodes
|
// highlight neighbour nodes
|
||||||
neighbourNodes
|
neighbourNodes
|
||||||
.transition()
|
.transition()
|
||||||
.duration(200)
|
.duration(200)
|
||||||
.attr("fill", color)
|
.attr("fill", color)
|
||||||
|
|
||||||
// highlight links
|
// highlight links
|
||||||
linkNodes
|
linkNodes
|
||||||
.transition()
|
.transition()
|
||||||
.duration(200)
|
.duration(200)
|
||||||
.attr("stroke", "var(--g-link-active)")
|
.attr("stroke", "var(--g-link-active)")
|
||||||
|
|
||||||
// show text for self
|
// show text for self
|
||||||
d3.select(this.parentNode)
|
d3.select(this.parentNode)
|
||||||
.select("text")
|
.select("text")
|
||||||
.raise()
|
.raise()
|
||||||
.transition()
|
.transition()
|
||||||
.duration(200)
|
.duration(200)
|
||||||
.style("opacity", 1)
|
.style("opacity", 1)
|
||||||
}).on("mouseleave", function(_, d) {
|
}).on("mouseleave", function(_, d) {
|
||||||
d3.selectAll(".node")
|
d3.selectAll(".node")
|
||||||
.transition()
|
.transition()
|
||||||
.duration(200)
|
.duration(200)
|
||||||
.attr("fill", color)
|
.attr("fill", color)
|
||||||
|
|
||||||
const currentId = d.id
|
const currentId = d.id
|
||||||
const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId)
|
const linkNodes = d3.selectAll(".link").filter(d => d.source.id === currentId || d.target.id === currentId)
|
||||||
|
|
||||||
linkNodes
|
linkNodes
|
||||||
.transition()
|
.transition()
|
||||||
.duration(200)
|
.duration(200)
|
||||||
.attr("stroke", "var(--g-link)")
|
.attr("stroke", "var(--g-link)")
|
||||||
|
|
||||||
d3.select(this.parentNode)
|
d3.select(this.parentNode)
|
||||||
.select("text")
|
.select("text")
|
||||||
.transition()
|
.transition()
|
||||||
.duration(200)
|
.duration(200)
|
||||||
.style("opacity", 0)
|
.style("opacity", 0)
|
||||||
})
|
})
|
||||||
.call(drag(simulation));
|
.call(drag(simulation));
|
||||||
|
|
||||||
// draw labels
|
// draw labels
|
||||||
const labels = graphNode.append("text")
|
const labels = graphNode.append("text")
|
||||||
.attr("dx", 12)
|
.attr("dx", 12)
|
||||||
.attr("dy", ".35em")
|
.attr("dy", ".35em")
|
||||||
.text((d) => content[d.id]?.title || d.id.replace("-", " "))
|
.text((d) => content[d.id]?.title || d.id.replace("-", " "))
|
||||||
.style("opacity", 0)
|
.style("opacity", 0)
|
||||||
.style("pointer-events", "none")
|
.style("pointer-events", "none")
|
||||||
.call(drag(simulation));
|
.call(drag(simulation));
|
||||||
|
|
||||||
// set panning
|
// set panning
|
||||||
|
|
||||||
if (enableZoom) {
|
if (enableZoom) {
|
||||||
svg.call(d3.zoom()
|
svg.call(d3.zoom()
|
||||||
.extent([[0, 0], [width, height]])
|
.extent([[0, 0], [width, height]])
|
||||||
.scaleExtent([0.25, 4])
|
.scaleExtent([0.25, 4])
|
||||||
.on("zoom", ({ transform }) => {
|
.on("zoom", ({ transform }) => {
|
||||||
link.attr("transform", transform);
|
link.attr("transform", transform);
|
||||||
node.attr("transform", transform);
|
node.attr("transform", transform);
|
||||||
labels.attr("transform", transform);
|
labels.attr("transform", transform);
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
|
|
||||||
// progress the simulation
|
// progress the simulation
|
||||||
simulation.on("tick", () => {
|
simulation.on("tick", () => {
|
||||||
link
|
link
|
||||||
.attr("x1", d => d.source.x)
|
.attr("x1", d => d.source.x)
|
||||||
.attr("y1", d => d.source.y)
|
.attr("y1", d => d.source.y)
|
||||||
.attr("x2", d => d.target.x)
|
.attr("x2", d => d.target.x)
|
||||||
.attr("y2", d => d.target.y)
|
.attr("y2", d => d.target.y)
|
||||||
node
|
node
|
||||||
.attr("cx", d => d.x)
|
.attr("cx", d => d.x)
|
||||||
.attr("cy", d => d.y)
|
.attr("cy", d => d.y)
|
||||||
labels
|
labels
|
||||||
.attr("x", d => d.x)
|
.attr("x", d => d.x)
|
||||||
.attr("y", d => d.y)
|
.attr("y", d => d.y)
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,35 +1,35 @@
|
|||||||
function htmlToElement(html) {
|
function htmlToElement(html) {
|
||||||
const template = document.createElement('template')
|
const template = document.createElement('template')
|
||||||
html = html.trim()
|
html = html.trim()
|
||||||
template.innerHTML = html
|
template.innerHTML = html
|
||||||
return template.content.firstChild
|
return template.content.firstChild
|
||||||
}
|
}
|
||||||
|
|
||||||
function initPopover(baseURL) {
|
function initPopover(baseURL) {
|
||||||
const basePath = baseURL.replace(window.location.origin, "")
|
const basePath = baseURL.replace(window.location.origin, "")
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
fetchData.then(({ content }) => {
|
fetchData.then(({ content }) => {
|
||||||
const links = [...document.getElementsByClassName("internal-link")]
|
const links = [...document.getElementsByClassName("internal-link")]
|
||||||
links
|
links
|
||||||
.filter(li => li.dataset.src)
|
.filter(li => li.dataset.src)
|
||||||
.forEach(li => {
|
.forEach(li => {
|
||||||
const linkDest = content[li.dataset.src.replace(basePath, "")]
|
const linkDest = content[li.dataset.src.replace(basePath, "")]
|
||||||
if (linkDest) {
|
if (linkDest) {
|
||||||
const popoverElement = `<div class="popover">
|
const popoverElement = `<div class="popover">
|
||||||
<h3>${linkDest.title}</h3>
|
<h3>${linkDest.title}</h3>
|
||||||
<p>${removeMarkdown(linkDest.content).split(" ", 20).join(" ")}...</p>
|
<p>${removeMarkdown(linkDest.content).split(" ", 20).join(" ")}...</p>
|
||||||
<p class="meta">${new Date(linkDest.lastmodified).toLocaleDateString()}</p>
|
<p class="meta">${new Date(linkDest.lastmodified).toLocaleDateString()}</p>
|
||||||
</div>`
|
</div>`
|
||||||
const el = htmlToElement(popoverElement)
|
const el = htmlToElement(popoverElement)
|
||||||
li.appendChild(el)
|
li.appendChild(el)
|
||||||
li.addEventListener("mouseover", () => {
|
li.addEventListener("mouseover", () => {
|
||||||
el.classList.add("visible")
|
el.classList.add("visible")
|
||||||
})
|
})
|
||||||
li.addEventListener("mouseout", () => {
|
li.addEventListener("mouseout", () => {
|
||||||
el.classList.remove("visible")
|
el.classList.remove("visible")
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,239 +1,239 @@
|
|||||||
// code from https://github.com/danestves/markdown-to-text
|
// code from https://github.com/danestves/markdown-to-text
|
||||||
const removeMarkdown = (
|
const removeMarkdown = (
|
||||||
markdown,
|
markdown,
|
||||||
options = {
|
options = {
|
||||||
listUnicodeChar: false,
|
listUnicodeChar: false,
|
||||||
stripListLeaders: true,
|
stripListLeaders: true,
|
||||||
gfm: true,
|
gfm: true,
|
||||||
useImgAltText: false,
|
useImgAltText: false,
|
||||||
preserveLinks: false,
|
preserveLinks: false,
|
||||||
}
|
}
|
||||||
) => {
|
) => {
|
||||||
let output = markdown || "";
|
let output = markdown || "";
|
||||||
output = output.replace(/^(-\s*?|\*\s*?|_\s*?){3,}\s*$/gm, "");
|
output = output.replace(/^(-\s*?|\*\s*?|_\s*?){3,}\s*$/gm, "");
|
||||||
|
|
||||||
try {
|
try {
|
||||||
if (options.stripListLeaders) {
|
if (options.stripListLeaders) {
|
||||||
if (options.listUnicodeChar)
|
if (options.listUnicodeChar)
|
||||||
output = output.replace(
|
output = output.replace(
|
||||||
/^([\s\t]*)([\*\-\+]|\d+\.)\s+/gm,
|
/^([\s\t]*)([\*\-\+]|\d+\.)\s+/gm,
|
||||||
options.listUnicodeChar + " $1"
|
options.listUnicodeChar + " $1"
|
||||||
);
|
);
|
||||||
else output = output.replace(/^([\s\t]*)([\*\-\+]|\d+\.)\s+/gm, "$1");
|
else output = output.replace(/^([\s\t]*)([\*\-\+]|\d+\.)\s+/gm, "$1");
|
||||||
}
|
}
|
||||||
if (options.gfm) {
|
if (options.gfm) {
|
||||||
output = output
|
output = output
|
||||||
.replace(/\n={2,}/g, "\n")
|
.replace(/\n={2,}/g, "\n")
|
||||||
.replace(/~{3}.*\n/g, "")
|
.replace(/~{3}.*\n/g, "")
|
||||||
.replace(/~~/g, "")
|
.replace(/~~/g, "")
|
||||||
.replace(/`{3}.*\n/g, "");
|
.replace(/`{3}.*\n/g, "");
|
||||||
}
|
}
|
||||||
if (options.preserveLinks) {
|
if (options.preserveLinks) {
|
||||||
output = output.replace(/\[(.*?)\][\[\(](.*?)[\]\)]/g, "$1 ($2)")
|
output = output.replace(/\[(.*?)\][\[\(](.*?)[\]\)]/g, "$1 ($2)")
|
||||||
}
|
}
|
||||||
output = output
|
output = output
|
||||||
.replace(/<[^>]*>/g, "")
|
.replace(/<[^>]*>/g, "")
|
||||||
.replace(/^[=\-]{2,}\s*$/g, "")
|
.replace(/^[=\-]{2,}\s*$/g, "")
|
||||||
.replace(/\[\^.+?\](\: .*?$)?/g, "")
|
.replace(/\[\^.+?\](\: .*?$)?/g, "")
|
||||||
.replace(/\s{0,2}\[.*?\]: .*?$/g, "")
|
.replace(/\s{0,2}\[.*?\]: .*?$/g, "")
|
||||||
.replace(/\!\[(.*?)\][\[\(].*?[\]\)]/g, options.useImgAltText ? "$1" : "")
|
.replace(/\!\[(.*?)\][\[\(].*?[\]\)]/g, options.useImgAltText ? "$1" : "")
|
||||||
.replace(/\[(.*?)\][\[\(].*?[\]\)]/g, "$1")
|
.replace(/\[(.*?)\][\[\(].*?[\]\)]/g, "$1")
|
||||||
.replace(/^\s{0,3}>\s?/g, "")
|
.replace(/^\s{0,3}>\s?/g, "")
|
||||||
.replace(/(^|\n)\s{0,3}>\s?/g, "\n\n")
|
.replace(/(^|\n)\s{0,3}>\s?/g, "\n\n")
|
||||||
.replace(/^\s{1,2}\[(.*?)\]: (\S+)( ".*?")?\s*$/g, "")
|
.replace(/^\s{1,2}\[(.*?)\]: (\S+)( ".*?")?\s*$/g, "")
|
||||||
.replace(
|
.replace(
|
||||||
/^(\n)?\s{0,}#{1,6}\s+| {0,}(\n)?\s{0,}#{0,} {0,}(\n)?\s{0,}$/gm,
|
/^(\n)?\s{0,}#{1,6}\s+| {0,}(\n)?\s{0,}#{0,} {0,}(\n)?\s{0,}$/gm,
|
||||||
"$1$2$3"
|
"$1$2$3"
|
||||||
)
|
)
|
||||||
.replace(/([\*_]{1,3})(\S.*?\S{0,1})\1/g, "$2")
|
.replace(/([\*_]{1,3})(\S.*?\S{0,1})\1/g, "$2")
|
||||||
.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(/(`{3,})(.*?)\1/gm, "$2")
|
||||||
.replace(/`(.+?)`/g, "$1")
|
.replace(/`(.+?)`/g, "$1")
|
||||||
.replace(/\n{2,}/g, "\n\n");
|
.replace(/\n{2,}/g, "\n\n");
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(e);
|
console.error(e);
|
||||||
return markdown;
|
return markdown;
|
||||||
}
|
}
|
||||||
return output;
|
return output;
|
||||||
};
|
};
|
||||||
// -----
|
// -----
|
||||||
|
|
||||||
(async function() {
|
(async function() {
|
||||||
const encoder = str => str.toLowerCase().split(/([^a-z]|[^\x00-\x7F])+/)
|
const encoder = str => str.toLowerCase().split(/([^a-z]|[^\x00-\x7F])+/)
|
||||||
const contentIndex = new FlexSearch.Document({
|
const contentIndex = new FlexSearch.Document({
|
||||||
cache: true,
|
cache: true,
|
||||||
charset: "latin:extra",
|
charset: "latin:extra",
|
||||||
optimize: true,
|
optimize: true,
|
||||||
index: [{
|
index: [{
|
||||||
field: "content",
|
field: "content",
|
||||||
tokenize: "reverse",
|
tokenize: "reverse",
|
||||||
encode: encoder,
|
encode: encoder,
|
||||||
}, {
|
}, {
|
||||||
field: "title",
|
field: "title",
|
||||||
tokenize: "forward",
|
tokenize: "forward",
|
||||||
encode: encoder,
|
encode: encoder,
|
||||||
}]
|
}]
|
||||||
})
|
})
|
||||||
|
|
||||||
const { content } = await fetchData
|
const { content } = await fetchData
|
||||||
for (const [key, value] of Object.entries(content)) {
|
for (const [key, value] of Object.entries(content)) {
|
||||||
contentIndex.add({
|
contentIndex.add({
|
||||||
id: key,
|
id: key,
|
||||||
title: value.title,
|
title: value.title,
|
||||||
content: removeMarkdown(value.content),
|
content: removeMarkdown(value.content),
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
const highlight = (content, term) => {
|
const highlight = (content, term) => {
|
||||||
const highlightWindow = 20
|
const highlightWindow = 20
|
||||||
const tokenizedTerm = term.split(/\s+/).filter(t => t !== "")
|
const tokenizedTerm = term.split(/\s+/).filter(t => t !== "")
|
||||||
const splitText = content.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 includesCheck = (token) => tokenizedTerm.some(term => token.toLowerCase().startsWith(term.toLowerCase()))
|
||||||
|
|
||||||
const occurrencesIndices = splitText
|
const occurrencesIndices = splitText
|
||||||
.map(includesCheck)
|
.map(includesCheck)
|
||||||
|
|
||||||
// calculate best index
|
// calculate best index
|
||||||
let bestSum = 0
|
let bestSum = 0
|
||||||
let bestIndex = 0
|
let bestIndex = 0
|
||||||
for (let i = 0; i < Math.max(occurrencesIndices.length - highlightWindow, 0); i++) {
|
for (let i = 0; i < Math.max(occurrencesIndices.length - highlightWindow, 0); i++) {
|
||||||
const window = occurrencesIndices.slice(i, i + highlightWindow)
|
const window = occurrencesIndices.slice(i, i + highlightWindow)
|
||||||
const windowSum = window.reduce((total, cur) => total + cur, 0)
|
const windowSum = window.reduce((total, cur) => total + cur, 0)
|
||||||
if (windowSum >= bestSum) {
|
if (windowSum >= bestSum) {
|
||||||
bestSum = windowSum
|
bestSum = windowSum
|
||||||
bestIndex = i
|
bestIndex = i
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const startIndex = Math.max(bestIndex - highlightWindow, 0)
|
const startIndex = Math.max(bestIndex - highlightWindow, 0)
|
||||||
const endIndex = Math.min(startIndex + 2 * highlightWindow, splitText.length)
|
const endIndex = Math.min(startIndex + 2 * highlightWindow, splitText.length)
|
||||||
const mappedText = splitText
|
const mappedText = splitText
|
||||||
.slice(startIndex, endIndex)
|
.slice(startIndex, endIndex)
|
||||||
.map(token => {
|
.map(token => {
|
||||||
if (includesCheck(token)) {
|
if (includesCheck(token)) {
|
||||||
return `<span class="search-highlight">${token}</span>`
|
return `<span class="search-highlight">${token}</span>`
|
||||||
}
|
}
|
||||||
return token
|
return token
|
||||||
})
|
})
|
||||||
.join(" ")
|
.join(" ")
|
||||||
.replaceAll('</span> <span class="search-highlight">', " ")
|
.replaceAll('</span> <span class="search-highlight">', " ")
|
||||||
return `${startIndex === 0 ? "" : "..."}${mappedText}${endIndex === splitText.length ? "" : "..."}`
|
return `${startIndex === 0 ? "" : "..."}${mappedText}${endIndex === splitText.length ? "" : "..."}`
|
||||||
}
|
}
|
||||||
|
|
||||||
const resultToHTML = ({ url, title, content, term }) => {
|
const resultToHTML = ({ url, title, content, term }) => {
|
||||||
const text = removeMarkdown(content)
|
const text = removeMarkdown(content)
|
||||||
const resultTitle = highlight(title, term)
|
const resultTitle = highlight(title, term)
|
||||||
const resultText = highlight(text, term)
|
const resultText = highlight(text, term)
|
||||||
return `<button class="result-card" id="${url}">
|
return `<button class="result-card" id="${url}">
|
||||||
<h3>${resultTitle}</h3>
|
<h3>${resultTitle}</h3>
|
||||||
<p>${resultText}</p>
|
<p>${resultText}</p>
|
||||||
</button>`
|
</button>`
|
||||||
}
|
}
|
||||||
|
|
||||||
const redir = (id, term) => {
|
const redir = (id, term) => {
|
||||||
window.location.href = BASE_URL + `${id}#:~:text=${encodeURIComponent(term)}`
|
window.location.href = BASE_URL + `${id}#:~:text=${encodeURIComponent(term)}`
|
||||||
}
|
}
|
||||||
|
|
||||||
const formatForDisplay = id => ({
|
const formatForDisplay = id => ({
|
||||||
id,
|
id,
|
||||||
url: id,
|
url: id,
|
||||||
title: content[id].title,
|
title: content[id].title,
|
||||||
content: content[id].content
|
content: content[id].content
|
||||||
})
|
})
|
||||||
|
|
||||||
const source = document.getElementById('search-bar')
|
const source = document.getElementById('search-bar')
|
||||||
const results = document.getElementById("results-container")
|
const results = document.getElementById("results-container")
|
||||||
let term
|
let term
|
||||||
source.addEventListener("keyup", (e) => {
|
source.addEventListener("keyup", (e) => {
|
||||||
if (e.key === "Enter") {
|
if (e.key === "Enter") {
|
||||||
const anchor = document.getElementsByClassName("result-card")[0]
|
const anchor = document.getElementsByClassName("result-card")[0]
|
||||||
redir(anchor.id, term)
|
redir(anchor.id, term)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
source.addEventListener('input', (e) => {
|
source.addEventListener('input', (e) => {
|
||||||
term = e.target.value
|
term = e.target.value
|
||||||
const searchResults = contentIndex.search(term, [
|
const searchResults = contentIndex.search(term, [
|
||||||
{
|
{
|
||||||
field: "content",
|
field: "content",
|
||||||
limit: 10,
|
limit: 10,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
field: "title",
|
field: "title",
|
||||||
limit: 5,
|
limit: 5,
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
const getByField = field => {
|
const getByField = field => {
|
||||||
const results = searchResults.filter(x => x.field === field)
|
const results = searchResults.filter(x => x.field === field)
|
||||||
if (results.length === 0) {
|
if (results.length === 0) {
|
||||||
return []
|
return []
|
||||||
} else {
|
} else {
|
||||||
return [...results[0].result]
|
return [...results[0].result]
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const allIds = new Set([...getByField('title'), ...getByField('content')])
|
const allIds = new Set([...getByField('title'), ...getByField('content')])
|
||||||
const finalResults = [...allIds].map(formatForDisplay)
|
const finalResults = [...allIds].map(formatForDisplay)
|
||||||
|
|
||||||
// display
|
// display
|
||||||
if (finalResults.length === 0) {
|
if (finalResults.length === 0) {
|
||||||
results.innerHTML = `<button class="result-card">
|
results.innerHTML = `<button class="result-card">
|
||||||
<h3>No results.</h3>
|
<h3>No results.</h3>
|
||||||
<p>Try another search term?</p>
|
<p>Try another search term?</p>
|
||||||
</button>`
|
</button>`
|
||||||
} else {
|
} else {
|
||||||
results.innerHTML = finalResults
|
results.innerHTML = finalResults
|
||||||
.map(result => resultToHTML({
|
.map(result => resultToHTML({
|
||||||
...result,
|
...result,
|
||||||
term,
|
term,
|
||||||
}))
|
}))
|
||||||
.join("\n")
|
.join("\n")
|
||||||
const anchors = document.getElementsByClassName("result-card");
|
const anchors = document.getElementsByClassName("result-card");
|
||||||
[...anchors].forEach(anchor => {
|
[...anchors].forEach(anchor => {
|
||||||
anchor.onclick = () => redir(anchor.id, term)
|
anchor.onclick = () => redir(anchor.id, term)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
||||||
const searchContainer = document.getElementById("search-container")
|
const searchContainer = document.getElementById("search-container")
|
||||||
|
|
||||||
function openSearch() {
|
function openSearch() {
|
||||||
if (searchContainer.style.display === "none" || searchContainer.style.display === "") {
|
if (searchContainer.style.display === "none" || searchContainer.style.display === "") {
|
||||||
source.value = ""
|
source.value = ""
|
||||||
results.innerHTML = ""
|
results.innerHTML = ""
|
||||||
searchContainer.style.display = "block"
|
searchContainer.style.display = "block"
|
||||||
source.focus()
|
source.focus()
|
||||||
} else {
|
} else {
|
||||||
searchContainer.style.display = "none"
|
searchContainer.style.display = "none"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function closeSearch() {
|
function closeSearch() {
|
||||||
searchContainer.style.display = "none"
|
searchContainer.style.display = "none"
|
||||||
}
|
}
|
||||||
|
|
||||||
document.addEventListener('keydown', (event) => {
|
document.addEventListener('keydown', (event) => {
|
||||||
if (event.key === "k" && (event.ctrlKey || event.metaKey)) {
|
if (event.key === "k" && (event.ctrlKey || event.metaKey)) {
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
openSearch()
|
openSearch()
|
||||||
}
|
}
|
||||||
if (event.key === "Escape") {
|
if (event.key === "Escape") {
|
||||||
event.preventDefault()
|
event.preventDefault()
|
||||||
closeSearch()
|
closeSearch()
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
const searchButton = document.getElementById("search-icon")
|
const searchButton = document.getElementById("search-icon")
|
||||||
searchButton.addEventListener('click', (evt) => {
|
searchButton.addEventListener('click', (evt) => {
|
||||||
openSearch()
|
openSearch()
|
||||||
})
|
})
|
||||||
searchButton.addEventListener('keydown', (evt) => {
|
searchButton.addEventListener('keydown', (evt) => {
|
||||||
openSearch()
|
openSearch()
|
||||||
})
|
})
|
||||||
searchContainer.addEventListener('click', (evt) => {
|
searchContainer.addEventListener('click', (evt) => {
|
||||||
closeSearch()
|
closeSearch()
|
||||||
})
|
})
|
||||||
document.getElementById("search-space").addEventListener('click', (evt) => {
|
document.getElementById("search-space").addEventListener('click', (evt) => {
|
||||||
evt.stopPropagation()
|
evt.stopPropagation()
|
||||||
})
|
})
|
||||||
})()
|
})()
|
||||||
|
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
@ -1,24 +1,24 @@
|
|||||||
// Add your own CSS here!
|
// Add your own CSS here!
|
||||||
:root {
|
:root {
|
||||||
--light: #faf8f8;
|
--light: #faf8f8;
|
||||||
--dark: #141021;
|
--dark: #141021;
|
||||||
--secondary: #284b63;
|
--secondary: #284b63;
|
||||||
--tertiary: #84a59d;
|
--tertiary: #84a59d;
|
||||||
--visited: #afbfc9;
|
--visited: #afbfc9;
|
||||||
--primary: #f28482;
|
--primary: #f28482;
|
||||||
--gray: #4e4e4e;
|
--gray: #4e4e4e;
|
||||||
--lightgray: #f0f0f0;
|
--lightgray: #f0f0f0;
|
||||||
--outlinegray: #dadada;
|
--outlinegray: #dadada;
|
||||||
}
|
}
|
||||||
|
|
||||||
[saved-theme="dark"] {
|
[saved-theme="dark"] {
|
||||||
--light: #1e1e21 !important;
|
--light: #1e1e21 !important;
|
||||||
--dark: #fbfffe !important;
|
--dark: #fbfffe !important;
|
||||||
--secondary: #6b879a !important;
|
--secondary: #6b879a !important;
|
||||||
--visited: #4a575e !important;
|
--visited: #4a575e !important;
|
||||||
--tertiary: #84a59d !important;
|
--tertiary: #84a59d !important;
|
||||||
--primary: #f58382 !important;
|
--primary: #f58382 !important;
|
||||||
--gray: #d4d4d4 !important;
|
--gray: #d4d4d4 !important;
|
||||||
--lightgray: #292633 !important;
|
--lightgray: #292633 !important;
|
||||||
--outlinegray: #343434 !important;
|
--outlinegray: #343434 !important;
|
||||||
}
|
}
|
||||||
@ -1,44 +1,44 @@
|
|||||||
.darkmode {
|
.darkmode {
|
||||||
float: right;
|
float: right;
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
min-width: 30px;
|
min-width: 30px;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
@media all and (max-width: 450px) {
|
@media all and (max-width: 450px) {
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
& > .toggle {
|
& > .toggle {
|
||||||
display: none;
|
display: none;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
& svg {
|
& svg {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
width: 20px;
|
width: 20px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
top: calc(50% - 10px);
|
top: calc(50% - 10px);
|
||||||
margin: 0 7px;
|
margin: 0 7px;
|
||||||
fill: var(--gray);
|
fill: var(--gray);
|
||||||
transition: opacity 0.1s ease;
|
transition: opacity 0.1s ease;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggle:checked ~ label {
|
.toggle:checked ~ label {
|
||||||
& > #dayIcon {
|
& > #dayIcon {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
& > #nightIcon {
|
& > #nightIcon {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.toggle:not(:checked) ~ label {
|
.toggle:not(:checked) ~ label {
|
||||||
& > #dayIcon {
|
& > #dayIcon {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
& > #nightIcon {
|
& > #nightIcon {
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -1,99 +1,99 @@
|
|||||||
/* Background */ .chroma { color: #f8f8f2; background-color: #282a36; overflow: hidden }
|
/* Background */ .chroma { color: #f8f8f2; background-color: #282a36; overflow: hidden }
|
||||||
/* Other */ .chroma .x { }
|
/* Other */ .chroma .x { }
|
||||||
/* Error */ .chroma .err { }
|
/* Error */ .chroma .err { }
|
||||||
/* LineTableTD */ .chroma .lntd { vertical-align: top; padding: 0; margin: 0; border: 0; }
|
/* 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; }
|
/* 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 }
|
/* 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 }
|
/* 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 }
|
/* LineNumbers */ .chroma .ln { margin-right: 0.4em; padding: 0 0.4em 0 0.4em;color: #7f7f7f }
|
||||||
/* Keyword */ .chroma .k { color: #ff79c6 }
|
/* Keyword */ .chroma .k { color: #ff79c6 }
|
||||||
/* KeywordConstant */ .chroma .kc { color: #ff79c6 }
|
/* KeywordConstant */ .chroma .kc { color: #ff79c6 }
|
||||||
/* KeywordDeclaration */ .chroma .kd { color: #8be9fd; font-style: italic }
|
/* KeywordDeclaration */ .chroma .kd { color: #8be9fd; font-style: italic }
|
||||||
/* KeywordNamespace */ .chroma .kn { color: #ff79c6 }
|
/* KeywordNamespace */ .chroma .kn { color: #ff79c6 }
|
||||||
/* KeywordPseudo */ .chroma .kp { color: #ff79c6 }
|
/* KeywordPseudo */ .chroma .kp { color: #ff79c6 }
|
||||||
/* KeywordReserved */ .chroma .kr { color: #ff79c6 }
|
/* KeywordReserved */ .chroma .kr { color: #ff79c6 }
|
||||||
/* KeywordType */ .chroma .kt { color: #8be9fd }
|
/* KeywordType */ .chroma .kt { color: #8be9fd }
|
||||||
/* Name */ .chroma .n { }
|
/* Name */ .chroma .n { }
|
||||||
/* NameAttribute */ .chroma .na { color: #50fa7b }
|
/* NameAttribute */ .chroma .na { color: #50fa7b }
|
||||||
/* NameBuiltin */ .chroma .nb { color: #8be9fd; font-style: italic }
|
/* NameBuiltin */ .chroma .nb { color: #8be9fd; font-style: italic }
|
||||||
/* NameBuiltinPseudo */ .chroma .bp { }
|
/* NameBuiltinPseudo */ .chroma .bp { }
|
||||||
/* NameClass */ .chroma .nc { color: #50fa7b }
|
/* NameClass */ .chroma .nc { color: #50fa7b }
|
||||||
/* NameConstant */ .chroma .no { }
|
/* NameConstant */ .chroma .no { }
|
||||||
/* NameDecorator */ .chroma .nd { }
|
/* NameDecorator */ .chroma .nd { }
|
||||||
/* NameEntity */ .chroma .ni { }
|
/* NameEntity */ .chroma .ni { }
|
||||||
/* NameException */ .chroma .ne { }
|
/* NameException */ .chroma .ne { }
|
||||||
/* NameFunction */ .chroma .nf { color: #50fa7b }
|
/* NameFunction */ .chroma .nf { color: #50fa7b }
|
||||||
/* NameFunctionMagic */ .chroma .fm { }
|
/* NameFunctionMagic */ .chroma .fm { }
|
||||||
/* NameLabel */ .chroma .nl { color: #8be9fd; font-style: italic }
|
/* NameLabel */ .chroma .nl { color: #8be9fd; font-style: italic }
|
||||||
/* NameNamespace */ .chroma .nn { }
|
/* NameNamespace */ .chroma .nn { }
|
||||||
/* NameOther */ .chroma .nx { }
|
/* NameOther */ .chroma .nx { }
|
||||||
/* NameProperty */ .chroma .py { }
|
/* NameProperty */ .chroma .py { }
|
||||||
/* NameTag */ .chroma .nt { color: #ff79c6 }
|
/* NameTag */ .chroma .nt { color: #ff79c6 }
|
||||||
/* NameVariable */ .chroma .nv { color: #8be9fd; font-style: italic }
|
/* NameVariable */ .chroma .nv { color: #8be9fd; font-style: italic }
|
||||||
/* NameVariableClass */ .chroma .vc { color: #8be9fd; font-style: italic }
|
/* NameVariableClass */ .chroma .vc { color: #8be9fd; font-style: italic }
|
||||||
/* NameVariableGlobal */ .chroma .vg { color: #8be9fd; font-style: italic }
|
/* NameVariableGlobal */ .chroma .vg { color: #8be9fd; font-style: italic }
|
||||||
/* NameVariableInstance */ .chroma .vi { color: #8be9fd; font-style: italic }
|
/* NameVariableInstance */ .chroma .vi { color: #8be9fd; font-style: italic }
|
||||||
/* NameVariableMagic */ .chroma .vm { }
|
/* NameVariableMagic */ .chroma .vm { }
|
||||||
/* Literal */ .chroma .l { }
|
/* Literal */ .chroma .l { }
|
||||||
/* LiteralDate */ .chroma .ld { }
|
/* LiteralDate */ .chroma .ld { }
|
||||||
/* LiteralString */ .chroma .s { color: #f1fa8c }
|
/* LiteralString */ .chroma .s { color: #f1fa8c }
|
||||||
/* LiteralStringAffix */ .chroma .sa { color: #f1fa8c }
|
/* LiteralStringAffix */ .chroma .sa { color: #f1fa8c }
|
||||||
/* LiteralStringBacktick */ .chroma .sb { color: #f1fa8c }
|
/* LiteralStringBacktick */ .chroma .sb { color: #f1fa8c }
|
||||||
/* LiteralStringChar */ .chroma .sc { color: #f1fa8c }
|
/* LiteralStringChar */ .chroma .sc { color: #f1fa8c }
|
||||||
/* LiteralStringDelimiter */ .chroma .dl { color: #f1fa8c }
|
/* LiteralStringDelimiter */ .chroma .dl { color: #f1fa8c }
|
||||||
/* LiteralStringDoc */ .chroma .sd { color: #f1fa8c }
|
/* LiteralStringDoc */ .chroma .sd { color: #f1fa8c }
|
||||||
/* LiteralStringDouble */ .chroma .s2 { color: #f1fa8c }
|
/* LiteralStringDouble */ .chroma .s2 { color: #f1fa8c }
|
||||||
/* LiteralStringEscape */ .chroma .se { color: #f1fa8c }
|
/* LiteralStringEscape */ .chroma .se { color: #f1fa8c }
|
||||||
/* LiteralStringHeredoc */ .chroma .sh { color: #f1fa8c }
|
/* LiteralStringHeredoc */ .chroma .sh { color: #f1fa8c }
|
||||||
/* LiteralStringInterpol */ .chroma .si { color: #f1fa8c }
|
/* LiteralStringInterpol */ .chroma .si { color: #f1fa8c }
|
||||||
/* LiteralStringOther */ .chroma .sx { color: #f1fa8c }
|
/* LiteralStringOther */ .chroma .sx { color: #f1fa8c }
|
||||||
/* LiteralStringRegex */ .chroma .sr { color: #f1fa8c }
|
/* LiteralStringRegex */ .chroma .sr { color: #f1fa8c }
|
||||||
/* LiteralStringSingle */ .chroma .s1 { color: #f1fa8c }
|
/* LiteralStringSingle */ .chroma .s1 { color: #f1fa8c }
|
||||||
/* LiteralStringSymbol */ .chroma .ss { color: #f1fa8c }
|
/* LiteralStringSymbol */ .chroma .ss { color: #f1fa8c }
|
||||||
/* LiteralNumber */ .chroma .m { color: #bd93f9 }
|
/* LiteralNumber */ .chroma .m { color: #bd93f9 }
|
||||||
/* LiteralNumberBin */ .chroma .mb { color: #bd93f9 }
|
/* LiteralNumberBin */ .chroma .mb { color: #bd93f9 }
|
||||||
/* LiteralNumberFloat */ .chroma .mf { color: #bd93f9 }
|
/* LiteralNumberFloat */ .chroma .mf { color: #bd93f9 }
|
||||||
/* LiteralNumberHex */ .chroma .mh { color: #bd93f9 }
|
/* LiteralNumberHex */ .chroma .mh { color: #bd93f9 }
|
||||||
/* LiteralNumberInteger */ .chroma .mi { color: #bd93f9 }
|
/* LiteralNumberInteger */ .chroma .mi { color: #bd93f9 }
|
||||||
/* LiteralNumberIntegerLong */ .chroma .il { color: #bd93f9 }
|
/* LiteralNumberIntegerLong */ .chroma .il { color: #bd93f9 }
|
||||||
/* LiteralNumberOct */ .chroma .mo { color: #bd93f9 }
|
/* LiteralNumberOct */ .chroma .mo { color: #bd93f9 }
|
||||||
/* Operator */ .chroma .o { color: #ff79c6 }
|
/* Operator */ .chroma .o { color: #ff79c6 }
|
||||||
/* OperatorWord */ .chroma .ow { color: #ff79c6 }
|
/* OperatorWord */ .chroma .ow { color: #ff79c6 }
|
||||||
/* Punctuation */ .chroma .p { }
|
/* Punctuation */ .chroma .p { }
|
||||||
/* Comment */ .chroma .c { color: #6272a4 }
|
/* Comment */ .chroma .c { color: #6272a4 }
|
||||||
/* CommentHashbang */ .chroma .ch { color: #6272a4 }
|
/* CommentHashbang */ .chroma .ch { color: #6272a4 }
|
||||||
/* CommentMultiline */ .chroma .cm { color: #6272a4 }
|
/* CommentMultiline */ .chroma .cm { color: #6272a4 }
|
||||||
/* CommentSingle */ .chroma .c1 { color: #6272a4 }
|
/* CommentSingle */ .chroma .c1 { color: #6272a4 }
|
||||||
/* CommentSpecial */ .chroma .cs { color: #6272a4 }
|
/* CommentSpecial */ .chroma .cs { color: #6272a4 }
|
||||||
/* CommentPreproc */ .chroma .cp { color: #ff79c6 }
|
/* CommentPreproc */ .chroma .cp { color: #ff79c6 }
|
||||||
/* CommentPreprocFile */ .chroma .cpf { color: #ff79c6 }
|
/* CommentPreprocFile */ .chroma .cpf { color: #ff79c6 }
|
||||||
/* Generic */ .chroma .g { }
|
/* Generic */ .chroma .g { }
|
||||||
/* GenericDeleted */ .chroma .gd { color: #8b080b }
|
/* GenericDeleted */ .chroma .gd { color: #8b080b }
|
||||||
/* GenericEmph */ .chroma .ge { text-decoration: underline }
|
/* GenericEmph */ .chroma .ge { text-decoration: underline }
|
||||||
/* GenericError */ .chroma .gr { }
|
/* GenericError */ .chroma .gr { }
|
||||||
/* GenericHeading */ .chroma .gh { font-weight: bold }
|
/* GenericHeading */ .chroma .gh { font-weight: bold }
|
||||||
/* GenericInserted */ .chroma .gi { font-weight: bold }
|
/* GenericInserted */ .chroma .gi { font-weight: bold }
|
||||||
/* GenericOutput */ .chroma .go { color: #44475a }
|
/* GenericOutput */ .chroma .go { color: #44475a }
|
||||||
/* GenericPrompt */ .chroma .gp { }
|
/* GenericPrompt */ .chroma .gp { }
|
||||||
/* GenericStrong */ .chroma .gs { }
|
/* GenericStrong */ .chroma .gs { }
|
||||||
/* GenericSubheading */ .chroma .gu { font-weight: bold }
|
/* GenericSubheading */ .chroma .gu { font-weight: bold }
|
||||||
/* GenericTraceback */ .chroma .gt { }
|
/* GenericTraceback */ .chroma .gt { }
|
||||||
/* GenericUnderline */ .chroma .gl { text-decoration: underline }
|
/* GenericUnderline */ .chroma .gl { text-decoration: underline }
|
||||||
/* TextWhitespace */ .chroma .w { }
|
/* TextWhitespace */ .chroma .w { }
|
||||||
|
|
||||||
.lntd:first-of-type > .chroma {
|
.lntd:first-of-type > .chroma {
|
||||||
padding-right: 0;
|
padding-right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.chroma code {
|
.chroma code {
|
||||||
font-family: 'Fira Code' !important;
|
font-family: 'Fira Code' !important;
|
||||||
font-size: 0.85em;
|
font-size: 0.85em;
|
||||||
line-height: 1em;
|
line-height: 1em;
|
||||||
background: none;
|
background: none;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.chroma {
|
.chroma {
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
60
config.toml
60
config.toml
@ -1,30 +1,30 @@
|
|||||||
baseURL = "https://jethughes.github.io/quartz/"
|
baseURL = "https://jethughes.github.io/quartz/"
|
||||||
languageCode = "en-us"
|
languageCode = "en-us"
|
||||||
googleAnalytics = "G-XYFD95KB4J"
|
googleAnalytics = "G-XYFD95KB4J"
|
||||||
pygmentsUseClasses = true
|
pygmentsUseClasses = true
|
||||||
relativeURLs = false
|
relativeURLs = false
|
||||||
disablePathToLower = true
|
disablePathToLower = true
|
||||||
ignoreFiles = [
|
ignoreFiles = [
|
||||||
"/content/templates/*",
|
"/content/templates/*",
|
||||||
"/content/private/*",
|
"/content/private/*",
|
||||||
]
|
]
|
||||||
summaryLength = 20
|
summaryLength = 20
|
||||||
paginate = 10
|
paginate = 10
|
||||||
enableGitInfo = true
|
enableGitInfo = true
|
||||||
|
|
||||||
[markup]
|
[markup]
|
||||||
[markup.tableOfContents]
|
[markup.tableOfContents]
|
||||||
endLevel = 3
|
endLevel = 3
|
||||||
ordered = true
|
ordered = true
|
||||||
startLevel = 2
|
startLevel = 2
|
||||||
[markup.highlight]
|
[markup.highlight]
|
||||||
anchorLineNos = false
|
anchorLineNos = false
|
||||||
codeFences = true
|
codeFences = true
|
||||||
guessSyntax = true
|
guessSyntax = true
|
||||||
hl_Lines = ""
|
hl_Lines = ""
|
||||||
lineAnchors = ""
|
lineAnchors = ""
|
||||||
lineNoStart = 1
|
lineNoStart = 1
|
||||||
lineNos = true
|
lineNos = true
|
||||||
lineNumbersInTable = true
|
lineNumbersInTable = true
|
||||||
style = "dracula"
|
style = "dracula"
|
||||||
tabWidth = 4
|
tabWidth = 4
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
nmap j gj
|
nmap j gj
|
||||||
nmap k gk
|
nmap k gk
|
||||||
|
|
||||||
unmap <C-c>
|
unmap <C-c>
|
||||||
@ -11,4 +11,21 @@ title: "Jet Hughes"
|
|||||||
|
|
||||||
# 2 Other
|
# 2 Other
|
||||||
|
|
||||||
- [templates](notes/templates.md)
|
- [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
|
||||||
|
|||||||
@ -1,3 +1,5 @@
|
|||||||
|
#cheatsheet
|
||||||
|
|
||||||
**Busy waiting
|
**Busy waiting
|
||||||
|
|
||||||
```
|
```
|
||||||
|
|||||||
@ -11,7 +11,7 @@ Synchronicity - The Police - spotify:album:28eOriEfl7IGbQDNvWIWXK
|
|||||||
- [ ] info 201 lab 04
|
- [ ] info 201 lab 04
|
||||||
- [ ] info 201 lab 06
|
- [ ] info 201 lab 06
|
||||||
- [ ] change testing of contrast and brightness andie
|
- [ ] change testing of contrast and brightness andie
|
||||||
- [ ] fix 203 notes for disability services
|
- [x] upload 203 notes for disability services
|
||||||
- [ ] work through 202 labs
|
- [ ] work through 202 labs
|
||||||
- [ ] 04
|
- [ ] 04
|
||||||
- [ ] 05
|
- [ ] 05
|
||||||
@ -21,8 +21,8 @@ Synchronicity - The Police - spotify:album:28eOriEfl7IGbQDNvWIWXK
|
|||||||
|
|
||||||
- [x] 10:00 Info203 Lecture
|
- [x] 10:00 Info203 Lecture
|
||||||
- [x] 11:00 Cosc201 Lecture
|
- [x] 11:00 Cosc201 Lecture
|
||||||
- [ ] 13:00 Info201 Lecture
|
- [x] 13:00 Info201 Lecture
|
||||||
- [ ] 14:00 Cosc202 Lab
|
- [x] 14:00 Cosc202 Lab
|
||||||
|
|
||||||
## Assignments
|
## Assignments
|
||||||
- Mobile app
|
- Mobile app
|
||||||
|
|||||||
47
content/daily_notes/2022-04-13.md
Normal file
47
content/daily_notes/2022-04-13.md
Normal file
@ -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)
|
||||||
49
content/daily_notes/2022-04-14.md
Normal file
49
content/daily_notes/2022-04-14.md
Normal file
@ -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)
|
||||||
49
content/daily_notes/2022-04-15.md
Normal file
49
content/daily_notes/2022-04-15.md
Normal file
@ -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)
|
||||||
50
content/daily_notes/2022-04-16.md
Normal file
50
content/daily_notes/2022-04-16.md
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
[[notes/daily-notes]]
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
# 2022-04-16
|
||||||
|
|
||||||
|
No Sleep 'Til Hammersmith (Live) - Mot<6F>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)
|
||||||
50
content/daily_notes/2022-04-18.md
Normal file
50
content/daily_notes/2022-04-18.md
Normal file
@ -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)
|
||||||
42
content/daily_notes/2022-04-19.md
Normal file
42
content/daily_notes/2022-04-19.md
Normal file
@ -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)
|
||||||
42
content/daily_notes/2022-04-20.md
Normal file
42
content/daily_notes/2022-04-20.md
Normal file
@ -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)
|
||||||
37
content/daily_notes/2022-04-21.md
Normal file
37
content/daily_notes/2022-04-21.md
Normal file
@ -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)
|
||||||
33
content/daily_notes/2022-04-23.md
Normal file
33
content/daily_notes/2022-04-23.md
Normal file
@ -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)
|
||||||
37
content/daily_notes/2022-04-24.md
Normal file
37
content/daily_notes/2022-04-24.md
Normal file
@ -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)
|
||||||
36
content/daily_notes/2022-04-25.md
Normal file
36
content/daily_notes/2022-04-25.md
Normal file
@ -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)
|
||||||
39
content/daily_notes/2022-04-26.md
Normal file
39
content/daily_notes/2022-04-26.md
Normal file
@ -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)
|
||||||
36
content/daily_notes/2022-04-27.md
Normal file
36
content/daily_notes/2022-04-27.md
Normal file
@ -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)
|
||||||
35
content/daily_notes/2022-04-28.md
Normal file
35
content/daily_notes/2022-04-28.md
Normal file
@ -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)
|
||||||
29
content/notes/03-agile-methodologies.md
Normal file
29
content/notes/03-agile-methodologies.md
Normal file
@ -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
|
||||||
20
content/notes/04-evaluation-methods-birth-of-hci.md
Normal file
20
content/notes/04-evaluation-methods-birth-of-hci.md
Normal file
@ -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!
|
||||||
@ -3,9 +3,9 @@ title: "04-requirements"
|
|||||||
tags:
|
tags:
|
||||||
- info201
|
- info201
|
||||||
- lecture
|
- lecture
|
||||||
sr-due: 2022-04-13
|
sr-due: 2022-05-29
|
||||||
sr-interval: 2
|
sr-interval: 32
|
||||||
sr-ease: 230
|
sr-ease: 250
|
||||||
---
|
---
|
||||||
|
|
||||||
[requirements](notes/requirements.md)
|
[requirements](notes/requirements.md)
|
||||||
|
|||||||
@ -1,36 +1,15 @@
|
|||||||
---
|
---
|
||||||
title: "07-mergesort-1"
|
title: "07-mergesort-1"
|
||||||
sr-due: 2022-04-26
|
sr-due: 2022-06-22
|
||||||
sr-interval: 23
|
sr-interval: 57
|
||||||
sr-ease: 250
|
sr-ease: 250
|
||||||
tags:
|
tags:
|
||||||
- cosc201
|
- cosc201
|
||||||
- lecture
|
- lecture
|
||||||
---
|
---
|
||||||
|
|
||||||
[mergeosrt](notes/mergeosrt.md)
|
[mergesort](notes/mergesort.md)
|
||||||
|
|
||||||
#unfinished
|
[quicksort](notes/quicksort.md)
|
||||||
|
|
||||||
# 1 Divide and conquer
|
[divide-and-conquer](notes/divide-and-conquer.md)
|
||||||
|
|
||||||
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
|
|
||||||
|
|||||||
@ -1,8 +1,11 @@
|
|||||||
---
|
---
|
||||||
title: "08-business-patterns"
|
title: "08-business-patterns"
|
||||||
|
sr-due: 2022-05-19
|
||||||
|
sr-interval: 37
|
||||||
|
sr-ease: 270
|
||||||
tags:
|
tags:
|
||||||
- info201
|
- info201
|
||||||
- lecture
|
- lecture
|
||||||
---
|
---
|
||||||
|
|
||||||
[[notes/entity-relationship-diagrams]]
|
[entity-relationship-diagrams](notes/entity-relationship-diagrams.md)
|
||||||
@ -8,4 +8,4 @@ tags:
|
|||||||
- lecture
|
- lecture
|
||||||
---
|
---
|
||||||
|
|
||||||
[mergeosrt](notes/mergeosrt.md)
|
[mergesort](notes/mergesort.md)
|
||||||
|
|||||||
@ -3,6 +3,13 @@ title: "09-data-modelling-and-normalisation"
|
|||||||
tags:
|
tags:
|
||||||
- info201
|
- info201
|
||||||
- lecture
|
- 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)
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -3,6 +3,9 @@ title: "09-documentation"
|
|||||||
tags:
|
tags:
|
||||||
- cosc202
|
- cosc202
|
||||||
- lecture
|
- lecture
|
||||||
|
sr-due: 2022-05-21
|
||||||
|
sr-interval: 28
|
||||||
|
sr-ease: 290
|
||||||
---
|
---
|
||||||
|
|
||||||
[[notes/documentation]]
|
[documentation](notes/documentation.md)
|
||||||
@ -3,6 +3,9 @@ title: "09-paper-prototypes-wiz-of-oz-video-prototypes"
|
|||||||
tags:
|
tags:
|
||||||
- info203
|
- info203
|
||||||
- lecture
|
- lecture
|
||||||
|
sr-due: 2022-05-23
|
||||||
|
sr-interval: 26
|
||||||
|
sr-ease: 270
|
||||||
---
|
---
|
||||||
|
|
||||||
- [wizard-of-oz](notes/wizard-of-oz.md)
|
- [wizard-of-oz](notes/wizard-of-oz.md)
|
||||||
|
|||||||
@ -1,8 +1,8 @@
|
|||||||
---
|
---
|
||||||
title: "10-heaps-and-heapsort"
|
title: "10-heaps-and-heapsort"
|
||||||
sr-due: 2022-04-18
|
sr-due: 2022-06-04
|
||||||
sr-interval: 9
|
sr-interval: 42
|
||||||
sr-ease: 250
|
sr-ease: 270
|
||||||
tags:
|
tags:
|
||||||
- cosc201
|
- cosc201
|
||||||
- lecture
|
- lecture
|
||||||
@ -11,7 +11,6 @@ tags:
|
|||||||
[heaps-and-heapsort](notes/heaps-and-heapsort.md)
|
[heaps-and-heapsort](notes/heaps-and-heapsort.md)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 0.1 Overview
|
## 0.1 Overview
|
||||||
[[notes/heap]]
|
[[notes/heap]]
|
||||||
|
|
||||||
@ -66,7 +65,7 @@ So both loops do most Ο(lg n)
|
|||||||
### 0.2.4 Storage
|
### 0.2.4 Storage
|
||||||
|
|
||||||
|
|
||||||
- Array
|
- Array
|
||||||
- root at position 0 and children at 1 and 2
|
- 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
|
- children of 1 to in 3 and 4, children of 2 go in 5 and 6
|
||||||
|
|
||||||
|
|||||||
145
content/notes/11-class-diagrams.md
Normal file
145
content/notes/11-class-diagrams.md
Normal file
@ -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., 
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## 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
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## 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
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
ERDsd effectively only do zero one many
|
||||||
|
UML can to any non negative integer
|
||||||
|
default is 1
|
||||||
|
|
||||||
|
### 3.2 association names
|
||||||
|
|
||||||
|
|
||||||
|
- usuallya verb phrase like "assings", "manages", "enrols in" ...
|
||||||
|
- more useful is conpetual level diagrams
|
||||||
|
- optional arrow head ()
|
||||||
|
|
||||||
|
### 3.3 Role names
|
||||||
|
|
||||||
|
|
||||||
|
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
|
||||||
|
|
||||||
|
|
||||||
|
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
|
||||||
|
|
||||||
|
|
||||||
|
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
|
||||||
|
|
||||||
|
|
||||||
|
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
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
- 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
|
||||||
|
|
||||||
|
|
||||||
|
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\
|
||||||
|
|
||||||
|
|
||||||
|
only modles the associations among concepts from problem domain
|
||||||
|
|
||||||
|
can be at conceptual level or implementation level
|
||||||
|
|
||||||
|
## 5 System class model
|
||||||
|
|
||||||
|
Models associations among domain objects and system components; implementation level only
|
||||||
@ -1,14 +1,14 @@
|
|||||||
---
|
---
|
||||||
title: "11-continuous-integration-2"
|
title: "11-continuous-integration-2"
|
||||||
sr-due: 2022-04-19
|
sr-due: 2022-06-06
|
||||||
sr-interval: 10
|
sr-interval: 44
|
||||||
sr-ease: 250
|
sr-ease: 270
|
||||||
tags:
|
tags:
|
||||||
- cosc202
|
- cosc202
|
||||||
- lecture
|
- 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
|
2. Understand where CI jobs scripts get run
|
||||||
3. explain why repository servers can host websites
|
3. explain why repository servers can host websites
|
||||||
4. Understand how gitblab dternmimines awhen a CI script failed
|
4. Understand how gitblab dternmimines awhen a CI script failed
|
||||||
|
|||||||
@ -3,49 +3,12 @@ title: "11-design-heuristics-2"
|
|||||||
tags:
|
tags:
|
||||||
- info203
|
- info203
|
||||||
- lecture
|
- lecture
|
||||||
|
sr-due: 2022-05-01
|
||||||
|
sr-interval: 16
|
||||||
|
sr-ease: 280
|
||||||
---
|
---
|
||||||
|
|
||||||
## 1 Show system status
|
- [Show System Status](notes/show-system-status.md)
|
||||||
- show system stats
|
- [Familiar Metaphors And Language](notes/familiar-metaphors-and-language.md)
|
||||||
|
- [User Freedom And Control](notes/user-freedom-and-control.md)
|
||||||
- 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
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 2 familiar metaphors and language
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
imitating familiar real life
|
|
||||||
|
|
||||||
Categories
|
|
||||||
- good
|
|
||||||
- 
|
|
||||||
- bad
|
|
||||||
- 
|
|
||||||
|
|
||||||
## 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., 
|
|
||||||
e.g., 
|
|
||||||
|
|
||||||
|
|||||||
@ -3,13 +3,13 @@ title: "11-sets-maps-trees"
|
|||||||
tags:
|
tags:
|
||||||
- cosc201
|
- cosc201
|
||||||
- lecture
|
- lecture
|
||||||
sr-due: 2022-04-12
|
sr-due: 2022-05-26
|
||||||
sr-interval: 3
|
sr-interval: 33
|
||||||
sr-ease: 250
|
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 <!--SR:!2022-04-15,3,270-->
|
||||||
|
|
||||||
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 <!--SR:!2022-04-15,3,270-->
|
||||||
|
|
||||||
A [tree](notes/tree.md) is a general concept of a way of organising data.
|
A [tree](notes/tree.md) is :: a general concept of a way of organising data. <!--SR:!2022-04-15,3,270-->
|
||||||
|
|||||||
@ -1,9 +0,0 @@
|
|||||||
---
|
|
||||||
title: "11-trees-and-ordered-sets"
|
|
||||||
tags:
|
|
||||||
- cosc201
|
|
||||||
- lecture
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -3,9 +3,9 @@ title: "12-automation"
|
|||||||
tags:
|
tags:
|
||||||
- cosc202
|
- cosc202
|
||||||
- lecture
|
- lecture
|
||||||
sr-due: 2022-04-20
|
sr-due: 2022-05-30
|
||||||
sr-interval: 9
|
sr-interval: 37
|
||||||
sr-ease: 250
|
sr-ease: 270
|
||||||
---
|
---
|
||||||
links: [cosc-202-lectures](notes/cosc-202-lectures.md), [slides](https://cosc202.cspages.otago.ac.nz/lectures/L12-automation.pdf)
|
links: [cosc-202-lectures](notes/cosc-202-lectures.md), [slides](https://cosc202.cspages.otago.ac.nz/lectures/L12-automation.pdf)
|
||||||
|
|
||||||
|
|||||||
@ -3,9 +3,9 @@ title: "12-binary-search-tree-operations"
|
|||||||
tags:
|
tags:
|
||||||
- cosc201
|
- cosc201
|
||||||
- lecture
|
- lecture
|
||||||
sr-due: 2022-04-12
|
sr-due: 2022-05-27
|
||||||
sr-interval: 3
|
sr-interval: 34
|
||||||
sr-ease: 250
|
sr-ease: 270
|
||||||
---
|
---
|
||||||
|
|
||||||
Recall [binary-search-tree](notes/binary-search-tree.md)
|
Recall [binary-search-tree](notes/binary-search-tree.md)
|
||||||
|
|||||||
@ -3,118 +3,13 @@ title: "12-design-heuristics-3"
|
|||||||
tags:
|
tags:
|
||||||
- info203
|
- info203
|
||||||
- lecture
|
- lecture
|
||||||
|
sr-due: 2022-05-20
|
||||||
|
sr-interval: 27
|
||||||
|
sr-ease: 290
|
||||||
---
|
---
|
||||||
|
|
||||||
# 1 Consistency and standards
|
- [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)
|
||||||
good and bad
|
- [Aesthetic and Minimalist Design](notes/aesthetic-and-minimalist-design.md)
|
||||||
- standards (user interface guidelines) are always chaning
|
|
||||||
|
|
||||||
differ between platforms
|
|
||||||
evolve over time
|
|
||||||
|
|
||||||
e.g., menus
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
general look of webpages evolves over time
|
|
||||||
|
|
||||||
### 1.1 Naming and teminology
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
this is bad
|
|
||||||
you can ask users which categories they understand/know about
|
|
||||||
|
|
||||||
### 1.2 Data loss
|
|
||||||
|
|
||||||
|
|
||||||
standard to minimise loss
|
|
||||||
|
|
||||||
## 2 Error Prevention
|
|
||||||
|
|
||||||
### 2.1 Bad input
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
correct human errors
|
|
||||||
auto completion
|
|
||||||
|
|
||||||
### 2.2 helpful constraints
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 2.3 Suggestions and autocorrection
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
heavily abused by industry
|
|
||||||
- they can influence suggestions
|
|
||||||
|
|
||||||
### 2.4 Forgiving formatting
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
- reduce errors
|
|
||||||
-
|
|
||||||
|
|
||||||
## 3 recognition over recall
|
|
||||||
|
|
||||||
### 3.1 avoid codes
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 3.2 Recognition with previews or icons
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### 3.3 use icons that promote recognition
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 4 Flexibility and efficiency
|
|
||||||
|
|
||||||
### 4.1 Choices
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
something with immediate effect can use switch
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
good defaults
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
4.2 shortcuts and advanced options
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
ambient information
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
proactivity
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 5 aesthetic and minimalistic design
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
signal to noise
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -1,19 +1,36 @@
|
|||||||
---
|
---
|
||||||
title: "12-modelling-behaviour"
|
title: "12-modelling-behaviour"
|
||||||
tags:
|
tags:
|
||||||
- cosc201
|
- info201
|
||||||
- lecture
|
- lecture
|
||||||
sr-due: 2022-04-13
|
sr-due: 2022-05-28
|
||||||
sr-interval: 2
|
sr-interval: 31
|
||||||
sr-ease: 230
|
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)
|
[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
|
- method signatures
|
||||||
- inheritance of behaviour
|
- inheritance of behaviour
|
||||||
- lower level sequencing and flow of control
|
- lower level sequencing and flow of control
|
||||||
- compartmentalisation into "subsystems"
|
- 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)
|
# 1 Example of Linked UML (not realistic)
|
||||||
|
|
||||||
|
|
||||||
@ -181,11 +198,4 @@ Anything coded to work with Collection will accept *any* Java collection type. (
|
|||||||
- programming to an interface
|
- programming to an interface
|
||||||
- Domain models can be “rich” or “anaemic”.
|
- Domain models can be “rich” or “anaemic”.
|
||||||
- anaemic more common
|
- anaemic more common
|
||||||
- use “processors” to encapsulate “plumbing” code
|
- 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.
|
|
||||||
157
content/notes/13-UML-sequence-diagrams.md
Normal file
157
content/notes/13-UML-sequence-diagrams.md
Normal file
@ -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:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
# 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
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
this diagam is probably too general for this case
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
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)
|
||||||
|
|
||||||
|
|
||||||
@ -4,9 +4,9 @@ aliases:
|
|||||||
tags:
|
tags:
|
||||||
- cosc201
|
- cosc201
|
||||||
- lecture
|
- lecture
|
||||||
sr-due: 2022-04-15
|
sr-due: 2022-05-18
|
||||||
sr-interval: 3
|
sr-interval: 25
|
||||||
sr-ease: 250
|
sr-ease: 270
|
||||||
---
|
---
|
||||||
|
|
||||||
# Traversals
|
# Traversals
|
||||||
|
|||||||
@ -4,9 +4,9 @@ aliases: code libraries, libraries, software library
|
|||||||
tags:
|
tags:
|
||||||
- cosc202
|
- cosc202
|
||||||
- lecture
|
- lecture
|
||||||
sr-due: 2022-04-14
|
sr-due: 2022-05-25
|
||||||
sr-interval: 3
|
sr-interval: 30
|
||||||
sr-ease: 250
|
sr-ease: 270
|
||||||
---
|
---
|
||||||
|
|
||||||
# what is a software library
|
# what is a software library
|
||||||
|
|||||||
86
content/notes/14-balancing-bsts.md
Normal file
86
content/notes/14-balancing-bsts.md
Normal file
@ -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
|
||||||
|
|
||||||
|
|
||||||
|
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
|
||||||
|
|
||||||
41
content/notes/14-direct-manipulation-and-mental-models.md
Normal file
41
content/notes/14-direct-manipulation-and-mental-models.md
Normal file
@ -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
|
||||||
107
content/notes/15-containers.md
Normal file
107
content/notes/15-containers.md
Normal file
@ -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
|
||||||
142
content/notes/15-from-models-to-code-and-back.md
Normal file
142
content/notes/15-from-models-to-code-and-back.md
Normal file
@ -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
|
||||||
|
|
||||||
|
|
||||||
|
## 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.
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
[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
|
||||||
|
|
||||||
|
|
||||||
|
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.
|
||||||
@ -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)"
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
# 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
|
||||||
|
-
|
||||||
@ -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
|
||||||
|
|
||||||
|
|
||||||
|
leading depends on the font and the user setting but usually is 20% of the font
|
||||||
|
|
||||||
|
|
||||||
|
x height depends on the font.
|
||||||
|
- smaller x height adds "elegance"
|
||||||
|
- larger x height isbettwe to low res displays
|
||||||
|
|
||||||
|
|
||||||
|
ascenders and descender usually correlates with x height (small x-height > large ascenders and descenders)
|
||||||
|
|
||||||
|
|
||||||
|
weight: usually regullar and bold, also light semibold, ultrabold
|
||||||
|
|
||||||
|
|
||||||
|
sans serifs have less line width variation
|
||||||
|
|
||||||
|
|
||||||
|
some fonts provide small caps and lowercase numbers
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
- 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
|
||||||
|
|
||||||
|
|
||||||
|
expectation plays an important role
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## 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
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -0,0 +1,8 @@
|
|||||||
|
---
|
||||||
|
title: "<% tp.file.cursor(1) %>Untitled"
|
||||||
|
aliases: <% tp.file.cursor(2) %>
|
||||||
|
tags:
|
||||||
|
- <% tp.file.cursor(3) %>
|
||||||
|
---
|
||||||
|
|
||||||
|
<% tp.file.cursor(4) %>
|
||||||
16
content/notes/aesthetic-and-minimalist-design.md
Normal file
16
content/notes/aesthetic-and-minimalist-design.md
Normal file
@ -0,0 +1,16 @@
|
|||||||
|
---
|
||||||
|
title: "aesthetic-and-minimalist-design"
|
||||||
|
aliases: Aesthetic and Minimalist Design
|
||||||
|
tags:
|
||||||
|
- info203
|
||||||
|
---
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
signal to noise
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,18 +0,0 @@
|
|||||||
---
|
|
||||||
title: "Untitled"
|
|
||||||
tags:
|
|
||||||
- cosc202
|
|
||||||
- assignment
|
|
||||||
---
|
|
||||||
|
|
||||||
Todo
|
|
||||||
|
|
||||||
- [ ] todo
|
|
||||||
|
|
||||||
Issues
|
|
||||||
|
|
||||||
- [ ] "no obs file" popup when opening new image
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
---
|
|
||||||
title: "ass-01-what-is-usability"
|
|
||||||
tags:
|
|
||||||
- info203
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,7 +0,0 @@
|
|||||||
---
|
|
||||||
title: "ass-02-heuristic-evaluation"
|
|
||||||
tags:
|
|
||||||
- info203
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,5 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: "asymptotic-notation"
|
title: "asymptotic-notation"
|
||||||
|
aliases: Big O, Big Theta, Algorithm Analysis
|
||||||
tags:
|
tags:
|
||||||
- cosc201
|
- cosc201
|
||||||
- analysis-of-algorithms
|
- analysis-of-algorithms
|
||||||
@ -10,7 +11,7 @@ Asymptotic notations are used in computer science to classify algorithms based h
|
|||||||
|
|
||||||
# big O notation
|
# 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
|
## 1 Formal definition
|
||||||
|
|||||||
@ -112,20 +112,4 @@ private void delete(Node n) {
|
|||||||
|
|
||||||
# Traversal
|
# 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
|
[tree-traversal](notes/tree-traversal.md)
|
||||||
|
|
||||||
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
|
|
||||||
60
content/notes/bug-tracker.md
Normal file
60
content/notes/bug-tracker.md
Normal file
@ -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
|
||||||
@ -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)
|
|
||||||
|
|
||||||
@ -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.
|
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
|
- Abstract/big-picture
|
||||||
- Useful in inital design stages and for communication
|
- Useful in inital design stages and for communication
|
||||||
|
|
||||||
** Implementation
|
**Implementation
|
||||||
|
|
||||||
- Concrete/detailed
|
- Concrete/detailed
|
||||||
- Useful in documenting and specifying structure (for devs etc)
|
- Useful in documenting and specifying structure (for devs etc)
|
||||||
|
|||||||
33
content/notes/consistency-and-standards.md
Normal file
33
content/notes/consistency-and-standards.md
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
---
|
||||||
|
title: "consistency-and-standards"
|
||||||
|
aliases: Consistency And Standards
|
||||||
|
tags:
|
||||||
|
- info203
|
||||||
|
---
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
good and bad
|
||||||
|
- standards (user interface guidelines) are always chaning
|
||||||
|
|
||||||
|
differ between platforms
|
||||||
|
evolve over time
|
||||||
|
|
||||||
|
e.g., menus
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
general look of webpages evolves over time
|
||||||
|
|
||||||
|
### 1.1 Naming and teminology
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
this is bad
|
||||||
|
you can ask users which categories they understand/know about
|
||||||
|
|
||||||
|
### 1.2 Data loss
|
||||||
|
|
||||||
|
|
||||||
|
standard to minimise loss
|
||||||
@ -12,4 +12,5 @@ links: [[notes/cosc-201]]
|
|||||||
- [10-heaps-and-heapsort](notes/10-heaps-and-heapsort.md)
|
- [10-heaps-and-heapsort](notes/10-heaps-and-heapsort.md)
|
||||||
- [11-sets-maps-trees](notes/11-sets-maps-trees.md)
|
- [11-sets-maps-trees](notes/11-sets-maps-trees.md)
|
||||||
- [12-binary-search-tree-operations](notes/12-binary-search-tree-operations.md)
|
- [12-binary-search-tree-operations](notes/12-binary-search-tree-operations.md)
|
||||||
-
|
- [13-bst-traversals-and-balance](notes/13-bst-traversals-and-balance.md)
|
||||||
|
- [14-balancing-bsts](notes/14-balancing-bsts.md)
|
||||||
@ -14,4 +14,6 @@ links: [[notes/cosc-201]]
|
|||||||
- [[notes/sorting]]
|
- [[notes/sorting]]
|
||||||
- [[notes/heapsort]]
|
- [[notes/heapsort]]
|
||||||
- [[notes/mergesort]]
|
- [[notes/mergesort]]
|
||||||
- [[notes/quicksort]]
|
- [[notes/quicksort]]
|
||||||
|
- [divide-and-conquer](notes/divide-and-conquer.md)
|
||||||
|
- [unite-and-conquer](notes/unite-and-conquer.md)
|
||||||
@ -11,7 +11,7 @@ links: [_index](_index.md)
|
|||||||
- [cosc-201-outline](notes/cosc-201-outline.md)
|
- [cosc-201-outline](notes/cosc-201-outline.md)
|
||||||
- [cosc-201-lectures](notes/cosc-201-lectures.md)
|
- [cosc-201-lectures](notes/cosc-201-lectures.md)
|
||||||
|
|
||||||
## 0.1 Assignments
|
# 0.1 Assignments
|
||||||
|
|
||||||
- [[notes/assignment-01]]
|
- [[notes/assignment-01]]
|
||||||
- [[notes/assignment-02]]
|
- [[notes/assignment-02]]
|
||||||
@ -6,6 +6,7 @@ tags:
|
|||||||
---
|
---
|
||||||
links: [cosc-202](notes/cosc-202.md)
|
links: [cosc-202](notes/cosc-202.md)
|
||||||
|
|
||||||
|
-
|
||||||
- [07-testing](notes/07-testing.md)
|
- [07-testing](notes/07-testing.md)
|
||||||
- [08-debugging](notes/08-debugging.md)
|
- [08-debugging](notes/08-debugging.md)
|
||||||
- [09-documentation](notes/09-documentation.md)
|
- [09-documentation](notes/09-documentation.md)
|
||||||
|
|||||||
@ -2,4 +2,4 @@
|
|||||||
title: "daily-notes"
|
title: "daily-notes"
|
||||||
---
|
---
|
||||||
|
|
||||||
# daily-notes
|
# daily-notes
|
||||||
|
|||||||
93
content/notes/dependencies.md
Normal file
93
content/notes/dependencies.md
Normal file
@ -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.,
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## 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.,
|
||||||
|
|
||||||
|
|
||||||
|
### 1.5.2 Partial Dependency
|
||||||
|
Subset of left hand side determines right hand side
|
||||||
|
"extra attributes"
|
||||||
|
|
||||||
|
e.g.,
|
||||||
|
|
||||||
|
![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
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
### 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
|
||||||
|
|
||||||
16
content/notes/design-heuristics.md
Normal file
16
content/notes/design-heuristics.md
Normal file
@ -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)
|
||||||
|
-
|
||||||
@ -1,6 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: "direct-manipulation-video"
|
title: "direct-manipulation-video"
|
||||||
aliases:
|
aliases: Direct Manipulation
|
||||||
tags:
|
tags:
|
||||||
- info203
|
- info203
|
||||||
- video
|
- video
|
||||||
|
|||||||
13
content/notes/divide-and-conquer.md
Normal file
13
content/notes/divide-and-conquer.md
Normal file
@ -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
|
||||||
30
content/notes/docker-containers.md
Normal file
30
content/notes/docker-containers.md
Normal file
@ -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
|
||||||
24
content/notes/dotnet.md
Normal file
24
content/notes/dotnet.md
Normal file
@ -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
|
||||||
@ -1,5 +1,6 @@
|
|||||||
---
|
---
|
||||||
title: "entity-relationship-diagrams"
|
title: "entity-relationship-diagrams"
|
||||||
|
aliases: ERDs, ERD, entity relationship diagram, Entity Relationship Diagram
|
||||||
tags:
|
tags:
|
||||||
- info201
|
- info201
|
||||||
---
|
---
|
||||||
|
|||||||
31
content/notes/error-prevention.md
Normal file
31
content/notes/error-prevention.md
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
---
|
||||||
|
title: "error-prevention"
|
||||||
|
aliases: Error Prevention
|
||||||
|
tags:
|
||||||
|
- info203
|
||||||
|
---
|
||||||
|
|
||||||
|
### 2.1 Bad input
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
correct human errors
|
||||||
|
auto completion
|
||||||
|
|
||||||
|
### 2.2 helpful constraints
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
### 2.3 Suggestions and autocorrection
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
heavily abused by industry
|
||||||
|
- they can influence suggestions
|
||||||
|
|
||||||
|
### 2.4 Forgiving formatting
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
- reduce errors
|
||||||
|
-
|
||||||
@ -1,8 +1,5 @@
|
|||||||
---
|
---
|
||||||
title: "evaluating-designs"
|
title: "evaluating-designs"
|
||||||
sr-due: 2022-04-07
|
|
||||||
sr-interval: 10
|
|
||||||
sr-ease: 210
|
|
||||||
tags:
|
tags:
|
||||||
- info203
|
- info203
|
||||||
---
|
---
|
||||||
|
|||||||
28
content/notes/extreme-programming.md
Normal file
28
content/notes/extreme-programming.md
Normal file
@ -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
|
||||||
|
|
||||||
|
|
||||||
18
content/notes/familiar-metaphors-and-language.md
Normal file
18
content/notes/familiar-metaphors-and-language.md
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
---
|
||||||
|
title: "familiar-metaphors-and-language"
|
||||||
|
aliases: Familiar Metaphors And Language
|
||||||
|
tags:
|
||||||
|
- info203
|
||||||
|
---
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
imitating familiar real life
|
||||||
|
|
||||||
|
Categories
|
||||||
|
- good
|
||||||
|
- 
|
||||||
|
- bad
|
||||||
|
- 
|
||||||
|
|
||||||
38
content/notes/flexibility-and-efficiency.md
Normal file
38
content/notes/flexibility-and-efficiency.md
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
---
|
||||||
|
title: "flexibility-and-efficiency"
|
||||||
|
aliases: Flexibility and Efficiency
|
||||||
|
tags:
|
||||||
|
- info203
|
||||||
|
---
|
||||||
|
|
||||||
|
### 4.1 Choices
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
something with immediate effect can use switch
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
good defaults
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
4.2 shortcuts and advanced options
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
ambient information
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
proactivity
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@ -5,6 +5,7 @@ tags:
|
|||||||
---
|
---
|
||||||
links: [[notes/info-201]]
|
links: [[notes/info-201]]
|
||||||
|
|
||||||
|
-
|
||||||
- [04-requirements](notes/04-requirements)
|
- [04-requirements](notes/04-requirements)
|
||||||
- [06-business-functions-and-use-cases](notes/06-business-functions-and-use-cases.md)
|
- [06-business-functions-and-use-cases](notes/06-business-functions-and-use-cases.md)
|
||||||
- [07-business-process-modelling](notes/07-business-process-modelling.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)
|
- [09-data-modelling-and-normalisation](notes/09-data-modelling-and-normalisation.md)
|
||||||
- [10-oop-concepts-and-uml](notes/10-oop-concepts-and-uml.md)
|
- [10-oop-concepts-and-uml](notes/10-oop-concepts-and-uml.md)
|
||||||
- [11-class-diagrams](notes/11-class-diagrams.md)
|
- [11-class-diagrams](notes/11-class-diagrams.md)
|
||||||
- [12-modelling-behaviour](notes/12-modelling-behaviour.md)
|
- [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)
|
||||||
@ -6,11 +6,13 @@ tags:
|
|||||||
links: [[notes/info-201]]
|
links: [[notes/info-201]]
|
||||||
|
|
||||||
- [version-control-system](notes/version-control-system.md)
|
- [version-control-system](notes/version-control-system.md)
|
||||||
|
- [stakeholders](notes/stakeholders.md)
|
||||||
- [business-analyst](notes/business-analyst.md)
|
- [business-analyst](notes/business-analyst.md)
|
||||||
- [developer](notes/developer.md)
|
- [developer](notes/developer.md)
|
||||||
- [models](notes/models.md)
|
- [models](notes/models.md)
|
||||||
- [systems-development-life-cycle](notes/systems-development-life-cycle.md)
|
- [systems-development-life-cycle](notes/systems-development-life-cycle.md)
|
||||||
- [agile-development](notes/agile-development.md)
|
- [agile-development](notes/agile-development.md)
|
||||||
|
- [scrum](notes/scrum.md)
|
||||||
- [predictive-adaptive-spectrum](notes/predictive-adaptive-spectrum.md)
|
- [predictive-adaptive-spectrum](notes/predictive-adaptive-spectrum.md)
|
||||||
- [requirements](notes/requirements.md)
|
- [requirements](notes/requirements.md)
|
||||||
- [requirements-document](notes/requirements-document.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](notes/business-process-model.md)
|
||||||
- [business-process-model-and-notation](notes/business-process-model-and-notation.md)
|
- [business-process-model-and-notation](notes/business-process-model-and-notation.md)
|
||||||
- [UML](notes/UML.md)
|
- [UML](notes/UML.md)
|
||||||
- [entity-relationship-diagrams](notes/entity-relationship-diagrams.md)
|
- [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)
|
||||||
|
|||||||
@ -11,8 +11,6 @@ links: [_index](_index.md)
|
|||||||
- [info-201-lectures](notes/info-201-lectures.md)
|
- [info-201-lectures](notes/info-201-lectures.md)
|
||||||
- [info-201-outline](notes/info-201-outline.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#)
|
- [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)
|
- [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")
|
- [labs folder](file:///"C:/Users/Jet%20Hughes/Documents/Personal/courses/info-201/Labs")
|
||||||
|
|||||||
@ -5,9 +5,14 @@ tags:
|
|||||||
---
|
---
|
||||||
link: [[notes/info-203]]
|
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)
|
- [07-heuristic-evaluation-cont](notes/07-heuristic-evaluation-cont.md)
|
||||||
- [08-personas-and-scenarios](notes/08-personas-and-scenarios.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)
|
- [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)
|
- [10-design-heuristics-1](notes/10-design-heuristics-1.md)
|
||||||
- [11-design-heuristics-2](notes/11-design-heuristics-2.md)
|
- [11-design-heuristics-2](notes/11-design-heuristics-2.md)
|
||||||
- [12-design-heuristics-3](notes/12-design-heuristics-3.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)
|
||||||
@ -7,13 +7,22 @@ links: [[notes/info-203]]
|
|||||||
|
|
||||||
- [big-picture](notes/big-picture.md)
|
- [big-picture](notes/big-picture.md)
|
||||||
- [birth-of-hci](notes/birth-of-hci.md)
|
- [birth-of-hci](notes/birth-of-hci.md)
|
||||||
|
- [user-experience](notes/user-experience.md)
|
||||||
|
- [usbability](notes/usbability.md)
|
||||||
- [prototyping](notes/prototyping.md)
|
- [prototyping](notes/prototyping.md)
|
||||||
- [evaluating-designs](notes/evaluating-designs.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)
|
- [needfinding](notes/needfinding.md)
|
||||||
- [participant-observation](notes/participant-observation.md)
|
- [participant-observation](notes/participant-observation.md)
|
||||||
- [interviewing](notes/interviewing.md)
|
- [interviewing](notes/interviewing.md)
|
||||||
- [user-experience](notes/user-experience.md)
|
|
||||||
- [usbability](notes/usbability.md)
|
|
||||||
- [storyboards](notes/storyboards.md)
|
- [storyboards](notes/storyboards.md)
|
||||||
- [personas-and-scenarios](notes/personas-and-scenarios.md)
|
- [personas-and-scenarios](notes/personas-and-scenarios.md)
|
||||||
-
|
-
|
||||||
@ -9,4 +9,6 @@ links: [[notes/info-203]]
|
|||||||
- [storyboards-mockups-paper-prototypes](notes/storyboards-mockups-paper-prototypes.md)
|
- [storyboards-mockups-paper-prototypes](notes/storyboards-mockups-paper-prototypes.md)
|
||||||
- [wizard-of-oz](notes/wizard-of-oz.md)
|
- [wizard-of-oz](notes/wizard-of-oz.md)
|
||||||
- [video-prototyping](notes/video-prototyping.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)
|
||||||
@ -10,4 +10,6 @@ links:[_index](_index.md)
|
|||||||
|
|
||||||
- [info-203-outline](notes/info-203-outline.md)
|
- [info-203-outline](notes/info-203-outline.md)
|
||||||
- [info-203-lectures](notes/info-203-lectures.md)
|
- [info-203-lectures](notes/info-203-lectures.md)
|
||||||
- [info-203-videos](notes/info-203-videos.md)
|
- [info-203-videos](notes/info-203-videos.md)
|
||||||
|
|
||||||
|
- [mobile-app-ass-03](203-mobile-app/mobile-app-ass-03.md)
|
||||||
41
content/notes/mental-models-video.md
Normal file
41
content/notes/mental-models-video.md
Normal file
@ -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.
|
||||||
@ -26,7 +26,6 @@ e.g.,
|
|||||||
0 1 2 3 4 4 6 7 8 9
|
0 1 2 3 4 4 6 7 8 9
|
||||||
|
|
||||||
# 1 Implementation
|
# 1 Implementation
|
||||||
|
|
||||||
## 1.1 Merge
|
## 1.1 Merge
|
||||||
|
|
||||||
Given: a and b are sorted arrays. m is an array whose size is the sum of their sizes
|
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
|
# 2 Variations of Mergesort
|
||||||
|
|
||||||
[[unite and conquer]] #unfinished
|
[unite and conquer](notes/unite-and-conquer.md)
|
||||||
@ -1,9 +0,0 @@
|
|||||||
---
|
|
||||||
title: "milestone-2"
|
|
||||||
aliases:
|
|
||||||
tags:
|
|
||||||
- assignment
|
|
||||||
- info201
|
|
||||||
---
|
|
||||||
|
|
||||||
|
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user