Skip to content

Commit bd0eebc

Browse files
juliancwirkojuliancwirko
committed
init
0 parents  commit bd0eebc

36 files changed

+3876
-0
lines changed

‎.gitignore

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
node_modules
2+
build

‎package-lock.json

+2,195
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{
2+
"name": "netlify-deployment-demo",
3+
"version": "0.0.1",
4+
"description": "netlify-deployment-demo",
5+
"main": "index.js",
6+
"scripts": {
7+
"build": "harold-scripts build",
8+
"start": "harold-scripts start"
9+
},
10+
"devDependencies": {
11+
"harold-scripts": "^0.4.1"
12+
}
13+
}

‎src/assets/images/favicon.png

563 Bytes
Loading

‎src/assets/js/harold-main-menu.js

+18
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
(function () {
2+
const menuIcon = document.querySelector('[data-js-menu]');
3+
const menuIconClose = document.querySelector('[data-js-menu-close]');
4+
const menuOverlay = document.querySelector('[data-js-menu-overlay]');
5+
const body = document.body;
6+
7+
if (menuIcon && menuIconClose && menuOverlay) {
8+
menuIcon.addEventListener('click', function () {
9+
menuOverlay.classList.add('js-visible');
10+
body.classList.add('js-overflow-y-hidden');
11+
});
12+
13+
menuIconClose.addEventListener('click', function () {
14+
menuOverlay.classList.remove('js-visible');
15+
body.classList.remove('js-overflow-y-hidden');
16+
});
17+
}
18+
})();

‎src/assets/js/harold-scroll-top.js

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
(function () {
2+
const scrollTopButton = document.querySelector('[data-js-scroll-top]');
3+
4+
if (scrollTopButton) {
5+
let ticking = false;
6+
7+
document.addEventListener('scroll', function () {
8+
if (!ticking) {
9+
window.requestAnimationFrame(function () {
10+
if (window.scrollY > 200) {
11+
scrollTopButton.classList.add('js-visible');
12+
} else {
13+
scrollTopButton.classList.remove('js-visible');
14+
}
15+
ticking = false;
16+
});
17+
ticking = true;
18+
}
19+
});
20+
21+
scrollTopButton.addEventListener('click', function () {
22+
window.scroll({ top: 0, left: 0, behavior: 'smooth' });
23+
});
24+
}
25+
})();

‎src/assets/js/harold-search.js

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
(function () {
2+
// Trigger search overlay events and logic
3+
const rootDir = document.querySelector('html').dataset.hrldRoot;
4+
const postsPath =
5+
(rootDir && window.location.href.includes(rootDir) ? '/' + rootDir : '') +
6+
'/posts/';
7+
const searchIcon = document.querySelector('[data-js-search]');
8+
const searchIconClose = document.querySelector('[data-js-search-close]');
9+
const searchOverlay = document.querySelector('[data-js-search-overlay]');
10+
const body = document.body;
11+
const searchInput = document.querySelector('[data-js-search-input]');
12+
const searchResultsContainer = document.querySelector(
13+
'[data-js-search-results]'
14+
);
15+
16+
if (
17+
searchIcon &&
18+
searchInput &&
19+
searchIconClose &&
20+
searchOverlay &&
21+
searchResultsContainer
22+
) {
23+
searchIcon.addEventListener('click', function () {
24+
searchOverlay.classList.add('js-visible');
25+
body.classList.add('js-overflow-y-hidden');
26+
searchInput.focus();
27+
});
28+
29+
searchIconClose.addEventListener('click', function () {
30+
searchInput.value = '';
31+
searchResultsContainer.innerHTML = '';
32+
searchOverlay.classList.remove('js-visible');
33+
body.classList.remove('js-overflow-y-hidden');
34+
});
35+
36+
searchInput.addEventListener('keyup', function () {
37+
if (!this.value) {
38+
searchResultsContainer.innerHTML = '';
39+
}
40+
if (this.value && this.value.length >= 3 && harold && harold.search) {
41+
searchResultsContainer.innerHTML = '';
42+
const results = harold.search(this.value);
43+
if (!results || results.length === 0) {
44+
const noResults = document.createElement('div');
45+
noResults.classList.add('search-overlay-results-item');
46+
noResults.innerText = 'No results...';
47+
searchResultsContainer.appendChild(noResults);
48+
} else {
49+
results.forEach(function (result) {
50+
const resultItemContainer = document.createElement('div');
51+
resultItemContainer.classList.add('search-overlay-results-item');
52+
const resultItem = document.createElement('a');
53+
resultItem.innerText = result.title;
54+
resultItem.setAttribute('href', postsPath + result.fileName);
55+
resultItemContainer.appendChild(resultItem);
56+
searchResultsContainer.appendChild(resultItemContainer);
57+
});
58+
}
59+
}
60+
});
61+
}
62+
})();

‎src/assets/js/harold.js

+62
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
const harold = (function () {
2+
let searchIndex;
3+
let postsJSON;
4+
const rootDir = document.querySelector('html').dataset.hrldRoot;
5+
const postsJsonDataPath =
6+
(rootDir && window.location.href.includes(rootDir) ? '/' + rootDir : '') +
7+
'/jsonData/posts.json';
8+
9+
// Loads data for search index
10+
const fetchPostsJsonData = () => {
11+
return fetch(postsJsonDataPath)
12+
.then((response) => response.json())
13+
.then((data) => {
14+
postsJSON = data;
15+
return data;
16+
});
17+
};
18+
19+
// Builds search index using json data and lunr library
20+
const buildSearchIndexWithLunr = () => {
21+
fetchPostsJsonData().then((data) => {
22+
searchIndex = lunr(function () {
23+
this.ref('fileName');
24+
this.field('title');
25+
this.field('body');
26+
this.field('excerpt');
27+
this.field('tags');
28+
data.forEach((doc) => {
29+
this.add(
30+
Object.assign(doc, {
31+
tags: doc.tags.join(' '),
32+
body: doc.body.replace(/(<([^>]+)>)/gi, ''),
33+
})
34+
);
35+
}, this);
36+
});
37+
});
38+
};
39+
40+
// Search function
41+
const search = (phrase) => {
42+
if (searchIndex) {
43+
const searchResults = searchIndex.search(phrase);
44+
const refs = searchResults.map((result) => result.ref);
45+
return postsJSON.filter((item) => refs.includes(item.fileName));
46+
} else {
47+
console.error('Search index is not ready!');
48+
}
49+
};
50+
51+
// Initialize whole harold app javascript logic
52+
const init = () => {
53+
buildSearchIndexWithLunr();
54+
};
55+
56+
return {
57+
init,
58+
search,
59+
};
60+
})();
61+
62+
harold.init();

‎src/blog-layouts/blog-post.hbs

+27
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{{> head description=excerpt}}
2+
3+
<section class="container post-container" data-js-post-content>
4+
{{#if coverImage}}
5+
<aside class="post-cover-image">
6+
<img src="{{coverImage}}" />
7+
</aside>
8+
{{/if}}
9+
<article class="post-content">
10+
<div class="post-content-date">
11+
{{formatDate date=publicationDate format='dd mmmm yyyy'}}
12+
</div>
13+
<div>
14+
<h1 class="post-content-title">{{title}}</h1>
15+
</div>
16+
<div>
17+
{{{content}}}
18+
</div>
19+
<div class="post-content-tags">
20+
{{#each tags}}
21+
<div class="post-content-tag">{{this}}{{#if @last}}{{else}},{{/if}}</div>
22+
{{/each}}
23+
</div>
24+
</article>
25+
</section>
26+
27+
{{> footer}}

‎src/jsonData/posts.json

+1
Large diffs are not rendered by default.

‎src/pages/about.hbs

+54
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
{{> head title="About" description="Harold app default theme" }}
2+
3+
<div class="container page-container">
4+
<article class="page-content">
5+
<h1 class="page-content-title">About page example</h1>
6+
<div>
7+
<p>
8+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac lacus non neque vehicula euismod. Vivamus rutrum
9+
vitae velit vel fringilla. Aliquam ultricies id erat condimentum tempor. Nullam porta magna tristique,
10+
sollicitudin urna sed, sollicitudin ante. Ut ante tellus, luctus sed sollicitudin eget, feugiat vitae quam.
11+
Praesent porta pellentesque sapien a mattis. Curabitur sit amet ligula nibh. Sed quis molestie ligula. Vivamus ut
12+
purus id ipsum placerat pharetra nec eget lectus. Pellentesque tempus tincidunt hendrerit. Morbi mollis leo ut
13+
semper finibus. Aliquam erat volutpat. Nullam convallis ultrices facilisis. Duis scelerisque sit amet libero eu
14+
malesuada.
15+
</p>
16+
17+
<p>
18+
Vivamus rutrum feugiat urna, vitae volutpat nibh porta in. Vivamus velit orci, maximus tincidunt mi id, efficitur
19+
tempor mi. Nunc laoreet, dui quis molestie iaculis, sem augue volutpat enim, vitae fringilla ante odio ac eros.
20+
Nullam sit amet erat sit amet lectus gravida porta. Pellentesque habitant morbi tristique senectus et netus et
21+
malesuada fames ac turpis egestas. Curabitur bibendum dui vel accumsan lobortis. Nunc feugiat, ex rutrum posuere
22+
eleifend, elit sem molestie sapien, in facilisis leo mauris et lacus. Donec sit amet placerat tortor, vel
23+
tincidunt urna. Morbi et justo dui. Maecenas sodales sem lectus. Curabitur ut quam lorem.
24+
</p>
25+
26+
<p>
27+
Nulla aliquam leo non justo aliquam viverra. Vivamus eu ultrices felis, ac pellentesque elit. Maecenas blandit ac
28+
ex vel faucibus. Cras rutrum ornare velit, scelerisque pharetra est. Nulla vel tincidunt turpis. Donec in auctor
29+
ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
30+
</p>
31+
32+
<p>
33+
In nunc nisi, dapibus at iaculis eget, vestibulum accumsan purus. Suspendisse tincidunt rhoncus gravida.
34+
Suspendisse laoreet convallis massa ullamcorper ultrices. Curabitur at ante quis ante euismod porttitor sit amet
35+
et magna. Donec at lacus metus. Nullam ut lacinia lorem. Praesent feugiat nunc nisi. Proin elementum ultricies
36+
odio, ac ultricies urna imperdiet ac. Maecenas vitae porttitor purus, et suscipit ante. Praesent tincidunt lorem
37+
mollis lectus eleifend tempus. In lacinia, eros a faucibus mollis, mi turpis sollicitudin felis, quis luctus felis
38+
mi sed magna. Sed pharetra sapien a mi fermentum blandit. Quisque lacinia, ligula nec maximus eleifend, orci
39+
ligula consequat orci, nec lacinia odio justo quis risus. Aliquam at eros quis lacus volutpat fermentum id quis
40+
ex.
41+
</p>
42+
43+
<p>
44+
Nam ligula tortor, finibus non urna at, dictum porttitor velit. Orci varius natoque penatibus et magnis dis
45+
parturient montes, nascetur ridiculus mus. Mauris condimentum tincidunt placerat. Maecenas nec venenatis erat. Nam
46+
lacus metus, fermentum nec felis in, bibendum vestibulum arcu. Sed sollicitudin nisi a ultrices imperdiet.
47+
Vestibulum in rutrum risus. Integer sed turpis velit. Aenean imperdiet hendrerit nisl, et ultricies neque
48+
facilisis non. Praesent imperdiet ex ornare mi porta hendrerit.
49+
</p>
50+
</div>
51+
</article>
52+
</div>
53+
54+
{{> footer}}

‎src/pages/all-posts-list.hbs

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
{{> head title="All posts" description="Harold app default theme" }}
2+
3+
<div class="container page-container all-posts-page">
4+
{{postsList
5+
noImage=true
6+
noExcerpt=true
7+
noReadMoreButton=true
8+
className="post-list-items"
9+
dateFormat='dd mmmm yyyy'
10+
}}
11+
</div>
12+
13+
{{> footer}}

‎src/pages/author.hbs

+54
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,54 @@
1+
{{> head title="Author" description="Harold app default theme" }}
2+
3+
<div class="container page-container">
4+
<article class="page-content">
5+
<h1 class="page-content-title">Author page example</h1>
6+
<div>
7+
<p>
8+
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut ac lacus non neque vehicula euismod. Vivamus rutrum
9+
vitae velit vel fringilla. Aliquam ultricies id erat condimentum tempor. Nullam porta magna tristique,
10+
sollicitudin urna sed, sollicitudin ante. Ut ante tellus, luctus sed sollicitudin eget, feugiat vitae quam.
11+
Praesent porta pellentesque sapien a mattis. Curabitur sit amet ligula nibh. Sed quis molestie ligula. Vivamus ut
12+
purus id ipsum placerat pharetra nec eget lectus. Pellentesque tempus tincidunt hendrerit. Morbi mollis leo ut
13+
semper finibus. Aliquam erat volutpat. Nullam convallis ultrices facilisis. Duis scelerisque sit amet libero eu
14+
malesuada.
15+
</p>
16+
17+
<p>
18+
Vivamus rutrum feugiat urna, vitae volutpat nibh porta in. Vivamus velit orci, maximus tincidunt mi id, efficitur
19+
tempor mi. Nunc laoreet, dui quis molestie iaculis, sem augue volutpat enim, vitae fringilla ante odio ac eros.
20+
Nullam sit amet erat sit amet lectus gravida porta. Pellentesque habitant morbi tristique senectus et netus et
21+
malesuada fames ac turpis egestas. Curabitur bibendum dui vel accumsan lobortis. Nunc feugiat, ex rutrum posuere
22+
eleifend, elit sem molestie sapien, in facilisis leo mauris et lacus. Donec sit amet placerat tortor, vel
23+
tincidunt urna. Morbi et justo dui. Maecenas sodales sem lectus. Curabitur ut quam lorem.
24+
</p>
25+
26+
<p>
27+
Nulla aliquam leo non justo aliquam viverra. Vivamus eu ultrices felis, ac pellentesque elit. Maecenas blandit ac
28+
ex vel faucibus. Cras rutrum ornare velit, scelerisque pharetra est. Nulla vel tincidunt turpis. Donec in auctor
29+
ante. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
30+
</p>
31+
32+
<p>
33+
In nunc nisi, dapibus at iaculis eget, vestibulum accumsan purus. Suspendisse tincidunt rhoncus gravida.
34+
Suspendisse laoreet convallis massa ullamcorper ultrices. Curabitur at ante quis ante euismod porttitor sit amet
35+
et magna. Donec at lacus metus. Nullam ut lacinia lorem. Praesent feugiat nunc nisi. Proin elementum ultricies
36+
odio, ac ultricies urna imperdiet ac. Maecenas vitae porttitor purus, et suscipit ante. Praesent tincidunt lorem
37+
mollis lectus eleifend tempus. In lacinia, eros a faucibus mollis, mi turpis sollicitudin felis, quis luctus felis
38+
mi sed magna. Sed pharetra sapien a mi fermentum blandit. Quisque lacinia, ligula nec maximus eleifend, orci
39+
ligula consequat orci, nec lacinia odio justo quis risus. Aliquam at eros quis lacus volutpat fermentum id quis
40+
ex.
41+
</p>
42+
43+
<p>
44+
Nam ligula tortor, finibus non urna at, dictum porttitor velit. Orci varius natoque penatibus et magnis dis
45+
parturient montes, nascetur ridiculus mus. Mauris condimentum tincidunt placerat. Maecenas nec venenatis erat. Nam
46+
lacus metus, fermentum nec felis in, bibendum vestibulum arcu. Sed sollicitudin nisi a ultrices imperdiet.
47+
Vestibulum in rutrum risus. Integer sed turpis velit. Aenean imperdiet hendrerit nisl, et ultricies neque
48+
facilisis non. Praesent imperdiet ex ornare mi porta hendrerit.
49+
</p>
50+
</div>
51+
</article>
52+
</div>
53+
54+
{{> footer}}

0 commit comments

Comments
 (0)