Skip to content

Commit 3276f26

Browse files
renoirbrenoirb
committed
WIP
1 parent b371799 commit 3276f26

File tree

1 file changed

+156
-0
lines changed

1 file changed

+156
-0
lines changed

‎static/resume/rework.html‎

Lines changed: 156 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,156 @@
1+
<!DOCTYPE html>
2+
<html lang="en-CA" class="layout--default zone__sandwich light-mode">
3+
<head>
4+
<meta charset="utf-8" />
5+
<title>My curriculum vitæ - Renoir Boulanger</title>
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
7+
<meta name="robots" content="noindex" />
8+
<script type="importmap">
9+
{
10+
"imports": {
11+
"https://renoirb.com/esm-modules/element-utils": "https://dist.renoirb.com/esm/own/element-utils/v0.1.0/browser.mjs",
12+
"https://renoirb.com/esm-modules/context-api": "https://dist.renoirb.com/esm/own/context-api/v0.1.0/browser.mjs",
13+
"@renoirb/app-layout-element": "https://dist.renoirb.com/esm/own/app-layout-element/v0.1.0/browser.mjs",
14+
"@renoirb/notice-box-element": "https://dist.renoirb.com/esm/own/notice-box-element/v0.2.0/browser.mjs",
15+
"@renoirb/work-experience-element": "https://dist.renoirb.com/esm/own/work-experience-element/v0.1.0/browser.mjs",
16+
"@renoirb/value-date-element": "https://dist.renoirb.com/esm/own/value-date-element/v0.1.0/browser.mjs",
17+
"@renoirb/context-api": "https://dist.renoirb.com/esm/own/context-api/v0.1.0/browser.mjs",
18+
"@renoirb/element-utils": "https://dist.renoirb.com/esm/own/element-utils/v0.1.0/browser.mjs"
19+
}
20+
}
21+
</script>
22+
<script type="module">
23+
import {
24+
/* */
25+
ContextRequest_DateConversion,
26+
assertIsDateConversionContextPayload,
27+
} from '@renoirb/value-date-element'
28+
29+
import dayjs from 'https://cdn.skypack.dev/dayjs'
30+
import 'https://cdn.skypack.dev/dayjs/locale/pt'
31+
import weekday from 'https://cdn.skypack.dev/dayjs/plugin/weekday'
32+
import customParseFormat from 'https://cdn.skypack.dev/dayjs/plugin/customParseFormat'
33+
dayjs.extend(weekday)
34+
dayjs.extend(customParseFormat)
35+
36+
/**
37+
* From the client-side, and early in the document, we
38+
* register handlers for each supported context-request data models
39+
* and that's where we mount any dependencies
40+
*/
41+
const dateConversionContextResponder = (event) => {
42+
console.log('dateConversionContext', event)
43+
if (event.context === ContextRequest_DateConversion) {
44+
event.stopPropagation()
45+
const host = event.contextTarget
46+
const datetime = host.getAttribute('datetime')
47+
const format = host.dataset.dateFormat || 'MMM D, YYYY'
48+
const formatLocale = host.dataset.dateLocale || 'en'
49+
if (datetime) {
50+
const formatter = dayjs(datetime)
51+
const unixEpoch = formatter.unix()
52+
const isoString = formatter.toISOString()
53+
const human = formatter
54+
.locale(formatLocale)
55+
.format(format, formatLocale)
56+
const payload = { date: datetime, human, isoString, unixEpoch }
57+
assertIsDateConversionContextPayload(payload)
58+
event.callback(payload)
59+
}
60+
}
61+
}
62+
window.document.body.addEventListener(
63+
'context-request',
64+
dateConversionContextResponder,
65+
)
66+
</script>
67+
</head>
68+
<body>
69+
<app-layout class="nuxt-content">
70+
<div class="document document--item">
71+
<div class="title page-title">
72+
<h1>My curriculum vitæ</h1>
73+
</div>
74+
<div class="body">
75+
<section>
76+
<h2>Work Experience</h2>
77+
<div id="work-experience">
78+
<app-work-experience
79+
workFor="GoTo Inc."
80+
workForUrl="https://www.GoTo.com/"
81+
workPosition="Staff Software Developer"
82+
dateBegin="2021-01-01"
83+
dateEnd="2022-05-01"
84+
>
85+
<p>
86+
Contributed to an established micro-frontend architecture
87+
based on Web Components and lit-element, helping teams
88+
leverage its framework-agnostic foundations. Provided
89+
technical guidance on native Web Platform capabilities,
90+
demonstrating how to maintain accessibility and performance
91+
while integrating with React, and other frameworks. Created
92+
documentation and working examples showing how to effectively
93+
use the existing component system across different technology
94+
stacks.
95+
</p>
96+
</app-work-experience>
97+
</div>
98+
</section>
99+
</div>
100+
</div>
101+
102+
<div slot="top-right"></div>
103+
</app-layout>
104+
105+
<script type="module">
106+
import { AppLayoutAlphaElement } from '@renoirb/app-layout-element'
107+
import { NoticeBoxElement } from '@renoirb/notice-box-element'
108+
import { WorkExperienceElement } from '@renoirb/work-experience-element'
109+
import {
110+
ValueDateRangeElement,
111+
BaseValueDateElement,
112+
} from '@renoirb/value-date-element'
113+
customElements.define('app-layout', AppLayoutAlphaElement)
114+
customElements.define('app-notice', NoticeBoxElement)
115+
customElements.define('app-work-experience', WorkExperienceElement)
116+
customElements.define('value-date', BaseValueDateElement)
117+
customElements.define('value-date-range', ValueDateRangeElement)
118+
</script>
119+
120+
<script type="module" defer>
121+
const JSONRESUME =
122+
'https://renoirboulanger.com/files/resume/jsonresume-renoirb.json'
123+
const request = new Request(JSONRESUME)
124+
const response = await fetch(request)
125+
const data = await response.json()
126+
document.getElementById('work-experience').innerHTML = ''
127+
const fragment = new DocumentFragment()
128+
const { work = [] } = data
129+
for (const experience of work) {
130+
const {
131+
company = '',
132+
endDate = '',
133+
startDate = '',
134+
url,
135+
position = '',
136+
summary,
137+
description,
138+
hilights = [],
139+
} = experience
140+
const el = document.createElement('app-work-experience')
141+
el.setAttribute('workFor', company)
142+
el.setAttribute('workPosition', position)
143+
el.setAttribute('dateBegin', startDate)
144+
el.setAttribute('dateEnd', endDate)
145+
if (url) {
146+
el.setAttribute('workForUrl', url)
147+
}
148+
if (summary) {
149+
el.innerHTML = `<p>${summary}</p>`
150+
}
151+
fragment.append(el)
152+
}
153+
document.getElementById('work-experience').appendChild(fragment)
154+
</script>
155+
</body>
156+
</html>

0 commit comments

Comments
 (0)