Skip to content

Commit 6322e91

Browse files
committed
feat: Enabled control via query params
1 parent cdfb931 commit 6322e91

10 files changed

Lines changed: 72 additions & 222 deletions

File tree

CHANGELOG.md

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,9 @@ All notable changes to this project will be documented in this file.
55
The format is based on [Keep a Changelog](http://keepachangelog.com/)
66
and this project adheres to [Semantic Versioning](http://semver.org/).
77

8+
## v6.1.0 - 2025-04-30
9+
* Enabled controls via queryparams
10+
811
## v6.0.1 - 2025-04-30
912
* Updated menu emojis
1013
* Improved print controls for Plain

cv.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@
33
<title>Tucker Beck Resumé</title>
44
<meta charset="UTF-8"></meta>
55
<link id="main-css" rel="stylesheet" type="text/css" href="static/css/main.css"></link>
6-
<link id="format-css" rel="stylesheet" type="text/css" href="static/css/formats/plain.css"></link>
76
<link id="switcher-css" rel="stylesheet" type="text/css" href="static/css/switchers.css"></link>
87
</head>
98
<body>
@@ -140,5 +139,6 @@
140139

141140
<script src="static/js/main.js" type="module"></script>
142141
<script src="static/js/switchers.js" type="module"></script>
142+
<!--<script src="http://localhost:5500/livereload.js?LR-verbose=true"></script>-->
143143
</body>
144144
</html>

pyproject.toml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
[project]
22
name = "cv"
3-
version = "6.0.1"
3+
version = "6.1.0"
44
description = "Build my resume page"
55
readme = "README.md"
66
requires-python = ">=3.13"

src/cv/constants.py

Lines changed: 0 additions & 121 deletions
This file was deleted.

static/js/build-fancy.js

Lines changed: 7 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,9 @@
1-
import { cap, withDiv, makeElement, addKids } from "./tools.js";
2-
3-
export const build = data => {
4-
const formatCssUrl = "static/css/formats/fancy.css";
5-
const oldFormatCss = document.getElementById("format-css");
6-
if (oldFormatCss.href !== formatCssUrl) {
7-
const newFormatCss = makeElement(
8-
"link",
9-
{id: "format-css", rel: "stylesheet", type: "text/css", href: formatCssUrl}
10-
)
11-
oldFormatCss.replaceWith(newFormatCss);
12-
}
13-
14-
const head = document.getElementsByTagName("head")[0];
15-
if (document.getElementById("size-style") === null) {
16-
head.appendChild(
17-
makeElement("link", { id: "size-style", rel: "stylesheet", type: "text/css", href: "static/css/sizes/medium.css" }),
18-
);
19-
}
20-
if (document.getElementById("color-style") === null) {
21-
head.appendChild(
22-
makeElement("link", { id: "color-style", rel: "stylesheet", type: "text/css", href: "static/css/colors/light.css" }),
23-
);
24-
}
1+
import { cap, withDiv, makeElement, addKids, maybeUpdateCss } from "./tools.js";
2+
3+
export const build = (data, color, size) => {
4+
maybeUpdateCss("format-style", "formats", "fancy");
5+
maybeUpdateCss("size-style", "sizes", size);
6+
maybeUpdateCss("color-style", "colors", color);
257

268
document.getElementById("size-menu").style.display = "flex";
279
document.getElementById("color-menu").style.display = "flex";
@@ -68,7 +50,7 @@ const buildHeaderTitle = data => {
6850
const buildHeaderContacts = data => {
6951
return withDiv({ id: "header-contact-list" }, div => addKids(
7052
div,
71-
...data.contacts.map( (contact) => withDiv({ klass: "header-contact-item" }, (cDiv) => addKids(
53+
...data.contacts.map(contact => withDiv({ klass: "header-contact-item" }, (cDiv) => addKids(
7254
cDiv,
7355
makeElement("p", {klass: "header-contact-emoji", html: contact.emoji}),
7456
makeElement("a", {klass: "header-contact-link", html: contact.text, href: contact.link, target: "_blank"}),

static/js/build-plain.js

Lines changed: 2 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,7 @@
1-
import { cap } from "./tools.js";
1+
import { cap, maybeUpdateCss } from "./tools.js";
22

33
export const build = (data) => {
4-
const formatCssUrl = "static/css/formats/plain.css";
5-
const oldFormatCss = document.getElementById("format-css");
6-
if (oldFormatCss.href !== formatCssUrl) {
7-
const newFormatCss = document.createElement("link");
8-
newFormatCss.setAttribute("id", "format-css");
9-
newFormatCss.setAttribute("rel", "stylesheet");
10-
newFormatCss.setAttribute("type", "text/css");
11-
newFormatCss.setAttribute("href", formatCssUrl);
12-
13-
oldFormatCss.replaceWith(newFormatCss);
14-
}
4+
maybeUpdateCss("format-style", "formats", "plain");
155

166
const sizeStyle = document.getElementById("size-style")
177
if (sizeStyle !== null) {

static/js/build.js

Lines changed: 18 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,40 +1,37 @@
11
import { build as buildPlain } from "./build-plain.js";
22
import { build as buildFancy } from "./build-fancy.js";
3-
import { deepUpdate } from "./tools.js";
3+
import { deepUpdate, makeElement } from "./tools.js";
44

55
export var currentFormat = "fancy";
6-
export var currentProfile = "staff";
76

87
export const loadConfig = (args = {}) => {
8+
const queryString = window.location.search;
9+
const urlParams = new URLSearchParams(queryString);
10+
911
fetch("static/cv.json")
1012
.then(r => r.json())
1113
.then(data => {
1214
var cv = data.main;
1315

14-
if (args.profile !== undefined && args.profile !== currentProfile) {
15-
deepUpdate(cv, data.profiles[args.profile]);
16-
currentProfile = args.profile;
16+
const role = urlParams.get("role") || "staff";
17+
if (role !== "staff") {
18+
deepUpdate(cv, data.profiles[role]);
1719
}
1820

19-
var format = currentFormat
20-
if (args.format !== undefined) {
21-
format = args.format;
21+
const color = urlParams.get("color") || "light";
22+
const format = urlParams.get("format") || "fancy";
23+
const size = urlParams.get("size") || "medium";
24+
25+
switch (format) {
26+
case "plain":
27+
buildPlain(cv);
28+
break;
29+
case "fancy":
30+
buildFancy(cv, color, size);
31+
break;
2232
}
23-
buildPage(cv, format);
2433
})
2534
.catch(e => {
2635
console.error("Error fetching json: ", e);
2736
});
2837
}
29-
30-
const buildPage = (data, format) => {
31-
switch (format) {
32-
case "plain":
33-
buildPlain(data);
34-
break;
35-
case "fancy":
36-
buildFancy(data);
37-
break;
38-
}
39-
currentFormat = format;
40-
}

static/js/switchers.js

Lines changed: 6 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { loadConfig } from "./build.js";
2-
import { makeElement } from "./tools.js";
2+
import { makeElement, setUrlParams } from "./tools.js";
33

44
const head = document.getElementsByTagName('head')[0];
55

@@ -40,13 +40,9 @@ switcherDiv.addEventListener('mouseout', (event) => {
4040
// Role Controls
4141

4242
Array.from(document.getElementsByClassName("role-button")).map( e => {
43-
e.addEventListener("click", () => changeRole(e.role));
43+
e.addEventListener("click", () => setUrlParams({ role: e.getAttribute("role") }));
4444
});
4545

46-
export const changeRole = (key) => {
47-
loadConfig({ profile: key });
48-
}
49-
5046
const roleMenu = document.getElementById('role-menu').addEventListener('mouseover', () => {
5147
showButtons("role-buttons");
5248
});
@@ -55,20 +51,9 @@ const roleMenu = document.getElementById('role-menu').addEventListener('mouseove
5551
// Color Controls
5652

5753
Array.from(document.getElementsByClassName("color-button")).map( e => {
58-
e.addEventListener("click", () => changeColor(e.getAttribute("color")));
54+
e.addEventListener("click", () => setUrlParams({ color: e.getAttribute("color") }));
5955
});
6056

61-
export const changeColor = (key) => {
62-
const path = `static/css/colors/${key}.css`;
63-
const oldCss = document.getElementById("color-style");
64-
if (oldCss.getAttribute("href") !== path) {
65-
oldCss.replaceWith(makeElement(
66-
"link",
67-
{ id: "color-style", rel: "stylesheet", type: "text/css", href: path }
68-
));
69-
}
70-
}
71-
7257
const colorMenu = document.getElementById('color-menu').addEventListener('mouseover', () => {
7358
showButtons("color-buttons");
7459
});
@@ -77,20 +62,9 @@ const colorMenu = document.getElementById('color-menu').addEventListener('mouseo
7762
// Size Controls
7863

7964
Array.from(document.getElementsByClassName("size-button")).map( e => {
80-
e.addEventListener("click", () => changeSize(e.getAttribute("size")));
65+
e.addEventListener("click", () => setUrlParams({ size: e.getAttribute("size") }));
8166
});
8267

83-
export const changeSize = (key) => {
84-
const path = `static/css/sizes/${key}.css`;
85-
const oldCss = document.getElementById("size-style");
86-
if (oldCss.getAttribute("href") !== path) {
87-
oldCss.replaceWith(makeElement(
88-
"link",
89-
{ id: "size-style", rel: "stylesheet", type: "text/css", href: path }
90-
));
91-
}
92-
}
93-
9468
const sizeMenu = document.getElementById('size-menu').addEventListener('mouseover', () => {
9569
showButtons("size-buttons");
9670
});
@@ -99,13 +73,9 @@ const sizeMenu = document.getElementById('size-menu').addEventListener('mouseove
9973
// Render Controls
10074

10175
Array.from(document.getElementsByClassName("render-button")).map( e => {
102-
e.addEventListener("click", () => render(e.format));
76+
e.addEventListener("click", () => window.print());
10377
});
10478

105-
export const render = (format) => {
106-
window.print();
107-
}
108-
10979
const renderMenu = document.getElementById('render-menu').addEventListener('mouseover', () => {
11080
showButtons("render-buttons")
11181
});
@@ -114,7 +84,7 @@ const renderMenu = document.getElementById('render-menu').addEventListener('mous
11484
// Format Controls
11585

11686
Array.from(document.getElementsByClassName("format-button")).map( e => {
117-
e.addEventListener("click", () => loadConfig({ format: e.getAttribute("format") }));
87+
e.addEventListener("click", () => setUrlParams({ format: e.getAttribute("format"), clear: true }));
11888
});
11989

12090
const formatMenu = document.getElementById('format-menu').addEventListener('mouseover', () => {

0 commit comments

Comments
 (0)