A repo for my personal website
Adding new blog post to posts.js
+8
-152
-152
scripts/blog.js
-152
scripts/blog.js
···
1
-
import getBase from './base.js';
2
-
import parseMarkdown from './markdown.js';
3
-
import setupNavAnim from './nav_anim.js';
4
-
import setupLink from './link_setup.js';
5
-
import getPosts from './posts.js';
6
-
import generateBlogPost from './blog_post.js';
7
-
8
-
var currentPage = 1;
9
-
var numPages = 1;
10
-
11
-
var get_page = (el) => {
12
-
return el.dataset.page;
13
-
};
14
-
15
-
(function () {
16
-
document.body.innerHTML = getBase(false, true, false, false);
17
-
18
-
document.querySelector('.site-content').innerHTML = `
19
-
<div class="page-desc">
20
-
<h4>Personal Blog</h4>
21
-
<a href="blog-rss.xml"<img src="img/rss-icon.png" alt="rss-icon" style="width:20px;height:20px;" /></a>
22
-
<p>Random postings, news, and other thoughts coming soon!</p>
23
-
</div>
24
-
`;
25
-
26
-
var postData = getPosts();
27
-
postData.reverse();
28
-
29
-
for (var i = 0; i < postData.length; i += 5) {
30
-
document.querySelector('.site-content').innerHTML += `
31
-
<article class="news" data-page="${(Math.floor(i / 5) + 1).toString()}">
32
-
</article>
33
-
`;
34
-
35
-
document.querySelector(`.site-content .news[data-page="${(Math.floor(i / 5) + 1).toString()}"]`).innerHTML = generateBlogPost(postData[i]);
36
-
37
-
if ((i + 1) < postData.length) {
38
-
document.querySelector(`.site-content .news[data-page="${(Math.floor(i / 5) + 1).toString()}"]`).innerHTML += generateBlogPost(postData[i + 1]);
39
-
}
40
-
41
-
if ((i + 2) < postData.length) {
42
-
document.querySelector(`.site-content .news[data-page="${(Math.floor(i / 5) + 1).toString()}"]`).innerHTML += generateBlogPost(postData[i + 2]);
43
-
}
44
-
45
-
if ((i + 3) < postData.length) {
46
-
document.querySelector(`.site-content .news[data-page="${(Math.floor(i / 5) + 1).toString()}"]`).innerHTML += generateBlogPost(postData[i + 3]);
47
-
}
48
-
49
-
if ((i + 4) < postData.length) {
50
-
document.querySelector(`.site-content .news[data-page="${(Math.floor(i / 5) + 1).toString()}"]`).innerHTML += generateBlogPost(postData[i + 4]);
51
-
}
52
-
}
53
-
54
-
document.querySelector('.site-content .news[data-page="1"]').classList.add('active-news-page');
55
-
56
-
document.getElementById('foot-nav').innerHTML = `
57
-
<ul class="cd-pagination animated-buttons custom-icons">
58
-
<li class="button"><a id="previous" href="#"><i data-i18n="[html]nav.previous">Prev</i></a></li>
59
-
<li><a class="current page-button" href="#" data-i18n="[html]nav.page.1" data-page="1">1</a></li>
60
-
<!--<li><span id="left-elipses">...</span></li>-->
61
-
<li><a href="#" class="page-button" data-i18n="[html]nav.page.2" data-page="2">2</a></li>
62
-
<!--<li><a href="#" class="page-button" data-i18n="[html]nav.page.3" data-page="3">3</a></li>
63
-
<li><a href="#" class="page-button" data-i18n="[html]nav.page.4" data-page="4">4</a></li>
64
-
<li><span id="right-elipses">...</span></li>
65
-
<li><a href="#" class="page-button" data-i18n="[html]nav.page.20" data-page="20">20</a></li>-->
66
-
<li class="button"><a id="next" href="#"><i data-i18n="[html]nav.next">Next</i></a></li>
67
-
</ul>
68
-
`;
69
-
70
-
var pageNumber = window.location.hash.substring(1);
71
-
var pages = document.querySelectorAll('.news');
72
-
73
-
if (pageNumber === '') {
74
-
pageNumber = '1';
75
-
}
76
-
77
-
for (var i = 0; i < pages.length; i++) {
78
-
if ((get_page(pages[i]) === pageNumber) && (!pages[i].classList.contains('active-news-page'))) {
79
-
pages[i].classList.add('active-news-page');
80
-
81
-
if (!document.querySelectorAll('.page-button')[i].className.includes('current')) {
82
-
document.querySelectorAll('.page-button')[i].classList.add('current');
83
-
}
84
-
} else if ((get_page(pages[i]) !== pageNumber) && (pages[i].classList.contains('active-news-page'))) {
85
-
pages[i].classList.remove('active-news-page');
86
-
87
-
if (document.querySelectorAll('.page-button')[i].className.includes('current')) {
88
-
document.querySelectorAll('.page-button')[i].classList.remove('current');
89
-
}
90
-
}
91
-
}
92
-
93
-
if (pageNumber === '1') {
94
-
//document.getElementById('left-elipses').style.display = 'none';
95
-
}
96
-
97
-
if (pageNumber === '20') {
98
-
//document.getElementById('right-elipses').style.display = 'none';
99
-
}
100
-
101
-
currentPage = parseInt(pageNumber);
102
-
numPages = parseInt(pages.length);
103
-
104
-
document.querySelectorAll('.page-button').forEach((element, key, parent) => {
105
-
element.addEventListener('click', (e) => {
106
-
e.preventDefault();
107
-
window.location = `blog.html#${get_page(element)}`;
108
-
window.location.reload();
109
-
}, false);
110
-
});
111
-
112
-
document.getElementById('previous').addEventListener('click', (e) => {
113
-
e.preventDefault();
114
-
var newPage = currentPage - 1;
115
-
116
-
if (newPage === 0) {
117
-
newPage = 1;
118
-
}
119
-
120
-
window.location = `blog.html#${newPage.toString()}`;
121
-
window.location.reload();
122
-
});
123
-
124
-
document.getElementById('next').addEventListener('click', (e) => {
125
-
e.preventDefault();
126
-
var newPage = currentPage + 1;
127
-
128
-
if (newPage > numPages) {
129
-
newPage = numPages;
130
-
}
131
-
132
-
window.location = `blog.html#${newPage.toString()}`;
133
-
window.location.reload();
134
-
});
135
-
136
-
document.querySelectorAll('.cd-primary-nav li a').forEach((element, key, parent) => {
137
-
if (element.href.indexOf('blog.html') != -1) {
138
-
element.classList.add('selected');
139
-
} else {
140
-
element.classList.remove('selected');
141
-
}
142
-
});
143
-
144
-
setupNavAnim(document);
145
-
parseMarkdown(document);
146
-
147
-
setTimeout(() => {
148
-
document.body.classList.add('loaded');
149
-
}, 150);
150
-
151
-
setupLink(document);
152
-
})();
+8
scripts/posts.js
+8
scripts/posts.js
···
79
79
author: 'Cass Forest',
80
80
content: 'Hey everyone! I\'ve been working on editing the update video for the Four Woods Podcast so that is coming soon (I recently switched to a new video editing program, so it\'s been A Time<sup>tm</sup> to learn, but I\'m starting to get into a groove with it), so stay tuned for that. I\'m also still working on getting subtitles added to the YouTube video for the first episode of the show, so the update video won\'t come out until those are finished. Until the video releases, here\'s this week\'s stream schedule!\n\n\n\nThat\'s all from me, see you over on Twitch!',
81
81
description: 'The stream schedule for February 28-March 5, 2022'
82
+
},
83
+
{
84
+
id: 'streamschedule22mar7mar12',
85
+
title: 'Another new stream schedule with a new game!',
86
+
date: '2022 March 6',
87
+
author: 'Cass Forest',
88
+
content: 'Hey everyone! I\'m still hard at work adding captions to the video for the first episode of the Four Woods Podcast along with keeping up with my rigorous content schedule and also working on finding a stable job, so the update video for the Four Woods Podcast will have to wait just a bit (along with a couple other video projects I wanted to get working on, but that\'s besides the point). Anyway, I\'m here today with a new stream schedule and a new game to add to the schedule! Enjoy!\n\n\n\n---\n\nThat\'s all from me for this week, I\'ll see y\'all over on Twitch!',
89
+
description: 'The stream schedule for March 7-12, 2022'
82
90
}
83
91
];
84
92
}