diff --git a/.forgejo/workflows/deployment-pull-request.yaml b/.forgejo/workflows/deployment-pull-request.yaml new file mode 100644 index 0000000..bef68b9 --- /dev/null +++ b/.forgejo/workflows/deployment-pull-request.yaml @@ -0,0 +1,22 @@ +name: deployment-on-pull-request +on: + pull_request: + pull_request_target: + types: + - opened + - reopened + - synchronize + +jobs: + deployment: + runs-on: docker + container: + image: node:bookworm + steps: + - uses: actions/checkout@v4 + - name: Build inventory + uses: https://codeberg.org/umglurf/kaniko-action@main + with: + cache: false + push: 'false' + context: /workspace/snoopy/in-c4/ diff --git a/.forgejo/workflows/deployment.yaml b/.forgejo/workflows/deployment.yaml new file mode 100644 index 0000000..391e59c --- /dev/null +++ b/.forgejo/workflows/deployment.yaml @@ -0,0 +1,24 @@ +name: deployment +on: + push: + branches: + - 'main' + +jobs: + deployment: + runs-on: docker + container: + image: node:bookworm + steps: + - uses: actions/checkout@v4 + - name: Build inventory + uses: https://codeberg.org/umglurf/kaniko-action@main + with: + cache: true + cache_repo: git.koeln.ccc.de/${{ github.repository }}/cache + push: 'true' + context: /workspace/snoopy/in-c4/ + credentials: | + git.koeln.ccc.de=snoopy:${{ secrets.REGISTRY_WRITE }} + destinations: | + git.koeln.ccc.de/${{ github.repository }}/in-c4:latest diff --git a/.gitignore b/.gitignore index 53c9ebf..03899e1 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,2 @@ -/inventory.sqlite3 +/data/* *.pyc diff --git a/database.py b/database.py index 44a3006..7759e10 100644 --- a/database.py +++ b/database.py @@ -2,7 +2,7 @@ from sqlalchemy import create_engine from sqlalchemy.ext.declarative import declarative_base from sqlalchemy.orm import sessionmaker -SQLALCHEMY_DATABASE_URL = "sqlite:///./inventory.sqlite3" +SQLALCHEMY_DATABASE_URL = "sqlite:///./data/inventory.sqlite3" engine = create_engine( SQLALCHEMY_DATABASE_URL, connect_args={"check_same_thread": False}, echo=True diff --git a/static/80x80.svg b/static/80x80.svg deleted file mode 100644 index d0124e9..0000000 --- a/static/80x80.svg +++ /dev/null @@ -1 +0,0 @@ -/home/me/stuff/cccac/clubraum/plan_0.5.sh3dCreator: FreeHEP Graphics2D Driver Producer: com.eteks.sweethome3d.swing.PlanComponent$SVGSupport$1 Revision: 12753 Source: me Date: Monday, June 6, 2022 11:58:58 PM CEST \ No newline at end of file diff --git a/static/c4.css b/static/c4.css new file mode 100644 index 0000000..abeae82 --- /dev/null +++ b/static/c4.css @@ -0,0 +1,122 @@ +body { + color: #f0f0f0; + background-color: #333; +} + +h1, h1 a { + color: #dfaa37; /* C4 Yellow */ +} + +#search.failed { + color: #200; + background-color: #ec6d5f; +} + +#map { + border: 1px solid #202020; + background-color: #4d4d4d; + max-width: 1440px; + max-height: 50vh; + aspect-ratio: 2 / 1; + box-shadow: 0px 6px 12px #000c; +} + +#mapnote { + background-color: #ccc; + color: #333; + border-color: #202020; + padding: 0.25em 0.5em; + position: relative; + top: -1px; + box-shadow: 0px 6px 12px #000c; +} + +#mapnote:empty { + display: none; +} + +#itemcount { + display: inline-block; + margin-right: 1ch; +} + +.result { + background-color: #202020; + border-color: #4d4d4d; +} + +.result:focus { + background-color: #202020; + border-color: #dfaa37; + outline-color: #dfaa37; +} + +.result a { + color: #dfaa37; +} + +.note { + background-color: #333; + font-size: smaller; +} + +#knowntypes button { + color: #220; + background-color: #dfaa37; + border: 1px solid #220; + border-radius: 4px; + padding: 0.2em 0.4em; + margin: 0.2em; + font-weight: bolder; + cursor: pointer; +} + +#knowntypes button:hover, #knowntypes button:focus { + background-color: #f5c251; +} + +.btn { + box-shadow: 0 3px 6px -1px rgba(0,0,0,0.3); +} + +.btn.primary { + color: #220; + background-color: #dfaa37; +} + +.btn.primary:hover,.btn.primary:focus { + background-color: #f5c251; +} + +.btn.grn { + color: #020; + background-color: #9f6; +} + +.btn.grn:hover ,.btn.grn:focus { + background-color: #3f0; +} + +.btn.red { + color: #200; + background-color: #ec6d5f; +} + +.btn.red:hover, .btn.red:focus { + background-color: #ff7667; +} + +@keyframes blinker { + 0% { opacity: 1; } + 40% { opacity: 1; } + 90% { opacity: 0; } + 100% { opacity: 1; } +} + +#mapgrid { + outline: 2px solid #333; + background-color: #dfaa37; + border-radius: min(4px, 25%); + animation: blinker 1s infinite; +} + diff --git a/static/form.html b/static/form.html index d894279..44d5c16 100644 --- a/static/form.html +++ b/static/form.html @@ -3,6 +3,7 @@ in? + @@ -21,7 +22,7 @@ Coordinates (click on map)
- +
@@ -49,6 +50,6 @@ - + diff --git a/static/form.js b/static/form.js index b69f358..d1affc1 100644 --- a/static/form.js +++ b/static/form.js @@ -65,8 +65,22 @@ function knownTypes() { map[i.type] = true; } } - let types = Object.keys(map).sort().join(', ') - document.getElementById('knowntypes').textContent = `Known types: ${types}.`; + + // Get location in document. + const known_types = document.getElementById('knowntypes'); + known_types.textContent = `Known types: `; + + // Create a button for every known type. + for (let label of Object.keys(map).sort()) { + btn = document.createElement('button'); + btn.setAttribute('type', 'button'); + btn.textContent = label; + btn.addEventListener('click', function() { + document.getElementById('type').value = label; + }); + + known_types.appendChild(btn); + } } function save() { @@ -136,14 +150,14 @@ function del() { let clicks = {x: [], y: []}; function mapClick(e) { - let x = Math.floor(31 / e.target.width * e.layerX); - let y = Math.floor(10 / e.target.height * e.layerY); + let x = Math.floor(36 / e.target.width * e.layerX); + let y = Math.floor(18 / e.target.height * e.layerY); let humanPos = (x, y) => { - return `${String.fromCharCode(65 + 8 - y)}${x}`; + return `${String.fromCharCode(65 + 16 - y)}${x}`; }; - if (x > 0 && x < 31 && y > 0 && y < 9) { + if (x > 0 && x < 36 && y > 0 && y < 18) { if (clicks.x.length > 1) { clicks.x = [x]; clicks.y = [y]; diff --git a/static/index.html b/static/index.html index 585514b..07dceb7 100644 --- a/static/index.html +++ b/static/index.html @@ -3,6 +3,7 @@ in? + @@ -11,12 +12,13 @@
+

- +

@@ -37,7 +39,7 @@
- + + + diff --git a/static/index.js b/static/index.js index 2d7b1aa..f7bb046 100644 --- a/static/index.js +++ b/static/index.js @@ -17,6 +17,7 @@ function renderItems() { const container = document.getElementById('results'); const template = document.getElementById('item'); const loading = document.getElementById('loading'); + let count = 0; for (const [id, item] of Object.entries(items)) { const clone = template.content.cloneNode(true); @@ -31,11 +32,14 @@ function renderItems() { clone.querySelector(".result").id = `item-${id}`; clone.querySelector("a").href = `form.html?id=${encodeURIComponent(id)}`; if (item.hidden) { - clone.querySelector(".result").classList.add('hidden') - }; + clone.querySelector(".result").classList.add('hidden'); + } else { + count++; + } container.appendChild(clone); - }; + } loading.remove(); + updateCounter(count); } function getLocString(items, item) { @@ -67,6 +71,7 @@ function search(e) { const searchAttrs = ['id', 'name', 'type', 'note', 'content']; const query = e.target.value; const regex = new RegExp(query, 'i') + let count = 0; for (const elem of document.getElementsByClassName('result')) { const item = items[elem.id.slice(5)]; @@ -85,10 +90,36 @@ function search(e) { if (found) { elem.classList.remove('filtered'); + count++; } else { elem.classList.add('filtered'); } } + + // Indicate failed search. + if (count) { + e.target.classList.remove('failed'); + } else { + e.target.classList.add('failed'); + } + + updateCounter(count); +} + +function updateCounter(count) { + const itemcount = document.getElementById('itemcount'); + + switch(count) { + case 0: + itemcount.textContent = 'No items found.'; + break; + case 1: + itemcount.textContent = '1 item found.'; + break; + default: + itemcount.textContent = `${count} items found.`; + break; + } } function showhidden(e){ @@ -118,4 +149,4 @@ function showItem(e) { function hideItem(e) { clearMap(); -} \ No newline at end of file +} diff --git a/static/map.svg b/static/map.svg new file mode 100644 index 0000000..4210fd9 --- /dev/null +++ b/static/map.svg @@ -0,0 +1,433 @@ + + + + diff --git a/static/shared.js b/static/shared.js index 7a51e29..c2b9c35 100644 --- a/static/shared.js +++ b/static/shared.js @@ -1,12 +1,12 @@ function renderMap(xx, yy) { - if (xx[0] > 0 && xx[0] < 31 && yy[0] > 0 && yy[0] < 9 && - xx[1] > 0 && xx[1] < 31 && yy[1] > 0 && yy[1] < 9 && + if (xx[0] > 0 && xx[0] < 36 && yy[0] > 0 && yy[0] < 18 && + xx[1] > 0 && xx[1] < 36 && yy[1] > 0 && yy[1] < 18 && xx[1] >= xx[0] && yy[1] >= yy[0]) { let grid = document.getElementById('mapgrid'); - grid.style.top = `${yy[0]*10}%`; - grid.style.left = `${100/31*xx[0]}%`; - grid.style.height = `${(yy[1] - yy[0] + 1) * 10}%`; - grid.style.width = `${100/31*(xx[1] - xx[0] + 1)}%`; + grid.style.top = `${yy[0]*100/18}%`; + grid.style.left = `${100/36*xx[0]}%`; + grid.style.height = `${(yy[1] - yy[0] + 1) * 100/18}%`; + grid.style.width = `${100/36*(xx[1] - xx[0] + 1)}%`; } else { alert(`invalid coordinates x=${xx} y=${yy}`); } @@ -26,8 +26,8 @@ function coordsToMap(coords_bl, coords_tr) { let bl_x = parseInt(coords_bl.slice(1)); let tr_x = parseInt(coords_tr.slice(1)); - bl_y = 8 - (bl_y.charCodeAt(0) - 65); - tr_y = 8 - (tr_y.charCodeAt(0) - 65); + bl_y = 16 - (bl_y.charCodeAt(0) - 65); + tr_y = 16 - (tr_y.charCodeAt(0) - 65); renderMap([bl_x, tr_x], [tr_y, bl_y]); -} \ No newline at end of file +} diff --git a/static/style.css b/static/style.css index be8a9bd..d055b22 100644 --- a/static/style.css +++ b/static/style.css @@ -171,10 +171,10 @@ textarea { #map { position: relative; border: 1px solid black; - background: #fff; - max-width: 800px; + background: #4d4d4d; + max-width: 1440px; max-height: 50vh; - aspect-ratio: 31 / 10; + aspect-ratio: 2 / 1; margin: 0 auto; } @@ -238,4 +238,4 @@ form #map { max-width: 100%; text-align: center; margin: auto; -} \ No newline at end of file +}