michalvankodev/michalvankodev-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

We are half way there

Browse Source
This commit is contained in:
Michal Vanko
2023-01-17 20:57:28 +01:00
parent 145a5571c3
commit dad51ddb33
22 changed files with 2107 additions and 2079 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app.html
View File

@ -24,6 +24,8 @@
</head>
<body>
%sveltekit.body%
<div style="display: contents">
%sveltekit.body%
</div>
</body>
</html>

2
src/components/Footer.svelte
View File

@ -1,6 +1,6 @@
<script lang="ts">
import { format } from 'date-fns'
import type { PostContent } from 'src/routes/blog/_content'
import type { PostContent } from 'src/routes/blog/content'
import SvgIcon from './SvgIcon.svelte'
import {
boldClass,

3
src/components/Nav.svelte
View File

@ -12,8 +12,9 @@
portfolioPageNavigationLinksClass,
selectedClass,
} from './Nav.css'
import { page } from "$app/stores"
export let segment
$: segment = $page.url.pathname
</script>
<nav class={navigationClass}>

2
src/components/blog/ArticleFooter.svelte
View File

@ -2,7 +2,7 @@
import { horizontalBorderTopClass } from '$lib/styles/scoops.css'
import { format } from 'date-fns'
import type { PostContent } from '../../routes/blog/_content'
import type { PostContent } from '../../routes/blog/content'
import {
footerClass,
publishedClass,

20
src/routes/+layout.svelte Normal file
View File

@ -0,0 +1,20 @@
<script lang="ts">
import type { LayoutData } from "./$types"
import Nav from '../components/Nav.svelte'
import Footer from '../components/Footer.svelte'
import 'modern-normalize/modern-normalize.css'
import '$lib/styles/global.css'
import { mainContentClass } from './layout.css'
export let data: LayoutData
export let latestPosts = data.latestPosts
</script>
<div class="app-content">
<Nav />
<main class={mainContentClass}>
<slot />
</main>
<Footer {latestPosts} />
</div>

12
src/routes/+layout.ts Normal file
View File

@ -0,0 +1,12 @@
import type { LayoutLoad } from './$types';
export const load = (async ({ fetch, url }) => {
const blogPostsResponse = await fetch(`/blog/articles/pageSize/5.json`)
const blogPostsContent = await blogPostsResponse.json()
return {
latestPosts: blogPostsContent.posts.items,
// TODO Check if not bugged FIXME
segment: '',
}
}) satisfies LayoutLoad

0
src/routes/index.svelte → src/routes/+page.svelte
View File

37
src/routes/__layout.svelte
View File

@ -1,37 +0,0 @@
<script context="module" lang="ts">
import { take } from 'ramda'
import type { LoadInput, LoadOutput } from '@sveltejs/kit/types/page'
export async function load({ fetch, url }: LoadInput): Promise<LoadOutput> {
const blogPostsResponse = await fetch(`/blog/articles/pageSize/5.json`)
const blogPostsContent = await blogPostsResponse.json()
return {
props: {
latestPosts: blogPostsContent.posts.items,
// TODO Check if not bugged FIXME
// TODO remove console.logs
segment: '',
},
}
}
</script>
<script lang="ts">
import Nav from '../components/Nav.svelte'
import Footer from '../components/Footer.svelte'
import 'modern-normalize/modern-normalize.css'
import '$lib/styles/global.css'
import { mainContentClass } from './layout.css'
export let segment
export let latestPosts
</script>
<div class="app-content">
<Nav {segment} />
<main class={mainContentClass}>
<slot />
</main>
<Footer {latestPosts} />
</div>

2
src/routes/blog/[...params].svelte
View File

@ -25,7 +25,7 @@
import ArticleFooter from '../../components/blog/ArticleFooter.svelte'
import Paginator from '../../components/paginator/Paginator.svelte'
import { postListClass, seeAllClass } from './index.css'
import type { PostContent } from './_content'
import type { PostContent } from './content'
import type { PaginationResult } from '$lib/pagination/pagination'
export let posts: PaginationResult<PostContent>

2
src/routes/blog/[slug=blogPage].ts
View File

@ -2,7 +2,7 @@ import { readFile } from 'fs'
import { promisify } from 'util'
import fm from 'front-matter'
import { parseField } from '../../markdown/parse-markdown'
import type { PostAttributes } from './_content'
import type { PostAttributes } from './content'
import type { Request, Response } from '@sveltejs/kit'
export interface SinglePost {

17
src/routes/blog/articles/[...params].json.ts → src/routes/blog/articles/[...params]/+server.ts
View File

@ -2,9 +2,11 @@ import {
getDropTakeFromPageParams,
parseParams,
} from '$lib/pagination/dropTakeParams'
import { getBlogListing } from '../_content'
import { json } from '@sveltejs/kit'
import { getBlogListing } from '../../content'
import type { RequestHandler } from './$types'
export async function get({ params }) {
export const GET = (async ({ params }) => {
console.log('article-params', params)
const handledParams = params.params === 'index' ? '' : params.params
const { page = 1, pageSize = 7, ...filters } = parseParams(handledParams)
@ -15,10 +17,7 @@ export async function get({ params }) {
const paginationQuery = { ...paginationParams, filters }
const filteredContents = await getBlogListing(paginationQuery)
return {
status: 200,
body: {
posts: filteredContents,
},
}
}
return json({
posts: filteredContents,
})
}) satisfies RequestHandler

0
src/routes/blog/_content.ts → src/routes/blog/content.ts
View File

2
src/routes/feed/_feed.ts
View File

@ -1,5 +1,5 @@
import { Feed } from 'feed'
import { getBlogListing } from '../blog/_content'
import { getBlogListing } from '../blog/content'
export async function getFeed() {
const feed = new Feed({

20
src/routes/portfolio/index.json.ts → src/routes/portfolio/+page.server.ts
View File

@ -3,6 +3,7 @@ import { promisify } from 'util'
import fm from 'front-matter'
import marked from 'marked'
import { parseField } from '../../markdown/parse-markdown'
import type { PageServerLoad } from './$types'
export interface RecordAttributes {
name: string
@ -50,16 +51,8 @@ export type PortfolioContent = {
body: string
}
export async function get() {
let pageSource: string
try {
pageSource = await promisify(readFile)('_pages/portfolio.md', 'utf-8')
} catch (e) {
return {
status: 500,
body: 'Error loading portfolio source file. \n' + e.toString(),
}
}
export const load = (async () => {
const pageSource = await promisify(readFile)('_pages/portfolio.md', 'utf-8')
const parsed = fm<PortfolioAttributes>(pageSource)
const workHistory = (parsed.attributes.work_history || [])
@ -85,8 +78,5 @@ export async function get() {
presentations,
}
return {
status: 200,
body: response,
}
}
return response;
}) satisfies PageServerLoad

34
src/routes/portfolio/index.svelte → src/routes/portfolio/+page.svelte
View File

@ -1,30 +1,16 @@
<script lang="ts" context="module">
/**
* @type {import('@sveltejs/kit').Load}
*/
export async function load({ fetch }) {
const res = await fetch('portfolio.json')
const content = await res.json()
return {
props: {
content,
},
}
}
</script>
<script lang="ts">
import Work from '../../components/portfolio/work.svelte'
import Project from '../../components/portfolio/project.svelte'
import Presentation from '../../components/portfolio/presentation.svelte'
import type { PortfolioContent } from './index.json'
import type { PageData } from './$types'
import { listClass, listItemClass, nameTagClass } from './index.css'
export let content: PortfolioContent
export let data: PageData
</script>
<svelte:head>
<title>{content.title}</title>
<title>{data.title}</title>
</svelte:head>
<h1 class="name-tag {nameTagClass}">Michal Vanko</h1>
@ -34,16 +20,16 @@
</h2>
<section id="personal-information">
{@html content.body}
{@html data.body}
</section>
<section id="work-history">
<h2>Work experience</h2>
<section class="work-history-prelude">
{@html content.workHistoryPrelude}
{@html data.workHistoryPrelude}
</section>
<ul class={listClass}>
{#each content.workHistory as work}
{#each data.workHistory as work}
<li class={listItemClass}>
<Work {work} />
</li>
@ -54,7 +40,7 @@
<section id="projects">
<h2>Projects</h2>
<ul class={listClass}>
{#each content.projects as project}
{#each data.projects as project}
<li class={listItemClass}>
<Project {project} />
</li>
@ -65,7 +51,7 @@
<section id="presentations">
<h2>Presentations</h2>
<ul class="">
{#each content.presentations as presentation}
{#each data.presentations as presentation}
<li class="">
<Presentation {presentation} />
</li>
@ -76,7 +62,7 @@
<section id="education">
<h2>Education</h2>
<ul class={listClass}>
{#each content.education as work}
{#each data.education as work}
<li class={listItemClass}>
<Work {work} />
</li>

9
src/routes/portfolio/not-neede.ts Normal file
View File

@ -0,0 +1,9 @@
import type { PageLoad } from './$types'
export const load = (async () => {
const res = await fetch('/portfolio.json')
const content = await res.json()
return {
content,
}
}) satisfies PageLoad

89
src/service-worker.js
View File

@ -1,89 +0,0 @@
import { timestamp, files, build } from '$service-worker'
const ASSETS = `cache${timestamp}`
// `shell` is an array of all the files generated by the bundler,
// `files` is an array of everything in the `static` directory
const to_cache = build.concat(files)
const staticAssets = new Set(to_cache)
self.addEventListener('install', (event) => {
event.waitUntil(
caches
.open(ASSETS)
.then((cache) => cache.addAll(to_cache))
.then(() => {
self.skipWaiting()
})
)
})
self.addEventListener('activate', (event) => {
event.waitUntil(
caches.keys().then(async (keys) => {
// delete old caches
for (const key of keys) {
if (key !== ASSETS) await caches.delete(key)
}
self.clients.claim()
})
)
})
/**
* Fetch the asset from the network and store it in the cache.
* Fall back to the cache if the user is offline.
*/
async function fetchAndCache(request) {
const cache = await caches.open(`offline${timestamp}`)
try {
const response = await fetch(request)
cache.put(request, response.clone())
return response
} catch (err) {
const response = await cache.match(request)
if (response) return response
throw err
}
}
self.addEventListener('fetch', (event) => {
if (event.request.method !== 'GET' || event.request.headers.has('range'))
return
const url = new URL(event.request.url)
// don't try to handle e.g. data: URIs
const isHttp = url.protocol.startsWith('http')
const isDevServerRequest =
url.hostname === self.location.hostname && url.port !== self.location.port
const isStaticAsset =
url.host === self.location.host && staticAssets.has(url.pathname)
const skipBecauseUncached =
event.request.cache === 'only-if-cached' && !isStaticAsset
if (isHttp && !isDevServerRequest && !skipBecauseUncached) {
event.respondWith(
(async () => {
// always serve static files and bundler-generated assets from cache.
// if your application has other URLs with data that will never change,
// set this variable to true for them and they will only be fetched once.
const cachedAsset = isStaticAsset && (await caches.match(event.request))
// for pages, you might want to serve a shell `service-worker-index.html` file,
// which Sapper has generated for you. It's not right for every
// app, but if it's right for yours then uncomment this section
/*
if (!cachedAsset && url.origin === self.origin && routes.find(route => route.pattern.test(url.pathname))) {
return caches.match('/service-worker-index.html');
}
*/
return cachedAsset || fetchAndCache(event.request)
})()
)
}
})