Skip to content

Commit be959fe

Browse files
jerrycantcodejerrycantcode
authored
Add files via upload
1 parent baf2319 commit be959fe

4 files changed

Lines changed: 51 additions & 30 deletions

File tree

‎index.html‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,7 @@ <h1>About</h1>
3939
<p class="abtDate">Last Updated April 25th, 2024</p>
4040
</div>
4141

42+
<div class="post-content">
4243
<div class="sideBar">
4344
<div class="sideBarArticle">
4445
<img class="sidebarimg" src="assets/pfp.png"></img>
@@ -81,6 +82,7 @@ <h3>My Story</h3>
8182
<p>P.S. If you actually care, you can read about my story on <a href="https://onedev.playcode.io">Onedev</a>.</p>
8283
</div>
8384
</div>
85+
</div>
8486
<div class="container" id="blogBody">
8587
<h1>Blog</h1>
8688
<div id="BlogPosts"></div>

‎scripts/analytics.js‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -30,12 +30,12 @@ async function getPublicIP() {
3030

3131
getPublicIP()
3232

33-
async function sendAnalytics(p,t) {
34-
var log = await getCurrentDateTime(p, t)
33+
async function sendAnalytics(p) {
34+
var log = await getCurrentDateTime(p)
3535
const formData = new FormData();
3636
formData.append("data", JSON.stringify(log));
3737

38-
fetch('https://script.google.com/macros/s/AKfycbz26nZqPM-AEs9MTBYWX0_36fkIc3OuUSU2GcT-4N2kAdB39igm1BKb-1pj-1ZR7igs/exec', {
38+
fetch('https://script.google.com/macros/s/AKfycbxAP4kL4hH0YTdpJsUC1jKGlnIKYa4RnHnG532hX2IJHK6FXIebVEuPyuwJv8veVNyD/exec', {
3939
method: 'POST',
4040
body: formData
4141
})
@@ -80,7 +80,7 @@ function getOS() {
8080
}
8181
}
8282

83-
async function getCurrentDateTime(post, type) {
83+
async function getCurrentDateTime(page) {
8484

8585
const now = new Date();
8686
const options = { month: 'long', day: 'numeric', year: 'numeric', hour: 'numeric', minute: 'numeric', hour12: true };
@@ -100,12 +100,13 @@ async function getCurrentDateTime(post, type) {
100100
// Combine everything into the desired format
101101
return {
102102
time: `${month} ${day}${suffix(day)}, ${now.getFullYear()} at ${time}`,
103-
type: type,
104-
post: post.title,
103+
type: page,
104+
post: window.location.hash,
105105
ip: ip,
106106
os: getOS(),
107107
location: `${locationn.city}, ${locationn.region} ${locationn.postal}`,
108108
wifi: locationn.org,
109-
gmaps: `https://www.google.com/maps?q=${locationn.loc.split(',')[0]},${locationn.loc.split(',')[1]}`
109+
gmaps: `https://www.google.com/maps?q=${locationn.loc.split(',')[0]},${locationn.loc.split(',')[1]}`,
110+
site: window.location.href
110111
}
111112
}

‎scripts/script.js‎

Lines changed: 20 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,10 @@ function nav(id){
7777
}
7878
document.getElementById(`${id}Body`).classList.remove('leave');
7979
document.getElementById(`${id}Body`).classList.add('onload');
80+
81+
if((id != 'search') && (id != 'post')) {
82+
sendAnalytics(id);
83+
}
8084
}
8185

8286
function openPost(t,type) {
@@ -100,10 +104,11 @@ function openPost(t,type) {
100104
<h1>`+pp.title+`</h1>
101105
<p class="date">Posted on `+pp.date+`</p>
102106
</div>
107+
<div class="post-content">
103108
`+pp.body+`
109+
</div>
104110
</div>
105111
`
106-
sendAnalytics(pp, type);
107112

108113
const parentElement = document.querySelector('#postBody');
109114
const childElement = parentElement.querySelector('.sideBar');
@@ -112,6 +117,7 @@ function openPost(t,type) {
112117
parentElement.querySelector('.article').style.width = "100%"
113118
}
114119

120+
sendAnalytics('post');
115121
}
116122

117123
function countWords(html) {
@@ -157,16 +163,12 @@ function initData() {
157163

158164
document.getElementById("BlogPosts").innerHTML = ``
159165
for(let i = postData.length - 1; i >= 0; i--) {
160-
document.getElementById("BlogPosts").innerHTML += `
161-
<div class="postPreview" onclick="openPost('${i}','blog')"><div class="previewLeft"><h1>`+JSON.parse(postData[i]).title+`</h1>
162-
<p>Posted on ${JSON.parse(postData[i]).date}</p><p>${countWords(JSON.parse(postData[i]).body)} words</p></div><div class="postPreviewParagraph">${postPreview(JSON.parse(postData[i]).body)}...</div></div>`
166+
document.getElementById("BlogPosts").innerHTML += generatePostPreview('blog', JSON.parse(postData[i]), i)
163167
}
164168

165169
document.getElementById("ProjectPosts").innerHTML = ``
166170
for(let i = projectData.length - 1; i >= 0; i--) {
167-
document.getElementById("ProjectPosts").innerHTML += `
168-
<div class="postPreview" onclick="openPost('${i}','projects')"><div class="previewLeft"><h1>`+JSON.parse(projectData[i]).title+`</h1>
169-
<p>Posted on ${JSON.parse(projectData[i]).date}</p><p>${countWords(JSON.parse(projectData[i]).body)} words</p></div><div class="postPreviewParagraph">${postPreview(JSON.parse(projectData[i]).body)}...</div></div>`
171+
document.getElementById("ProjectPosts").innerHTML += generatePostPreview('projects', JSON.parse(projectData[i]), i)
170172
}
171173

172174
load();
@@ -177,15 +179,11 @@ function initData() {
177179

178180
document.getElementById("BlogPosts").innerHTML = ``
179181
for(let i = postData.length - 1; i >= 0; i--) {
180-
document.getElementById("BlogPosts").innerHTML += `
181-
<div class="postPreview" onclick="openPost('${i}','blog')"><h1>`+JSON.parse(postData[i]).title+`</h1>
182-
<p>Posted on ${JSON.parse(postData[i]).date}</p></div>`
182+
document.getElementById("BlogPosts").innerHTML += generatePostPreview('blog', postData[i], i)
183183
}
184184
document.getElementById("ProjectPosts").innerHTML = ``
185185
for(let i = projectData.length - 1; i >= 0; i--) {
186-
document.getElementById("ProjectPosts").innerHTML += `
187-
<div class="postPreview" onclick="openPost('${i}','projects')"><h1>`+JSON.parse(projectData[i]).title+`</h1>
188-
<p>Posted on ${JSON.parse(projectData[i]).date}</p></div>`
186+
document.getElementById("ProjectPosts").innerHTML += generatePostPreview('projects', projectData[i], i);
189187
}
190188

191189
load();
@@ -199,15 +197,13 @@ function search(input){
199197
for(let i = postData.length - 1; i >= 0; i--) {
200198
let opt = JSON.parse(postData[i])
201199
if(JSON.stringify(opt).toLowerCase().includes(input.toLowerCase())) {
202-
output.innerHTML += `<div class="postPreview" onclick="openPost('${i}','blog')"><h1>`+opt.title+`</h1>
203-
<p>Posted on `+opt.date+`</p></div>`
200+
output.innerHTML += generatePostPreview('blog', opt, i)
204201
}
205202
}
206203
for(let i = projectData.length-1; i >= 0; i--) {
207204
let opt = JSON.parse(projectData[i])
208205
if(JSON.stringify(opt).toLowerCase().includes(input.toLowerCase())) {
209-
output.innerHTML += `<div class="postPreview" onclick="openPost('${i}','projects')"><h1>`+opt.title+`</h1>
210-
<p>Posted on `+opt.date+`</p></div>`
206+
output.innerHTML += generatePostPreview('projects', opt, i)
211207
}
212208
}
213209
if(output.innerHTML === ``) {
@@ -222,6 +218,13 @@ function search(input){
222218

223219
// Push the new URL to the browser history
224220
window.history.pushState({ path: newUrl }, '', newUrl);
221+
222+
sendAnalytics('search');
223+
}
224+
225+
function generatePostPreview(type, data, i) {
226+
return `<div class="postPreview" onclick="openPost('${i}','${type}')"><div class="previewLeft"><h1>`+data.title+`</h1>
227+
<p>Posted on ${data.date}</p><p>${countWords(data.body)} words</p></div><div class="postPreviewParagraph">${postPreview(data.body)}...</div></div>`
225228
}
226229

227230
function LoadVFX() {

‎styles/styles.css‎

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ body {
1010
font-optical-sizing: auto;
1111
font-weight: 300;
1212
font-style: normal;
13+
overflow-x: hidden;
1314
}
1415
h1 {
1516
margin: 15px;
@@ -303,10 +304,11 @@ p {
303304
}
304305
.sideBar {
305306
width: 20vw;
306-
position: absolute;
307-
right: 0;
308-
padding-top: 50px;
309307
margin-right: 10px;
308+
order: 2;
309+
}
310+
.article {
311+
order: 1;
310312
}
311313
.sideBarArticle {
312314
width: 20vw;
@@ -428,15 +430,17 @@ p {
428430
}
429431
.article {
430432
width: 100%;
433+
order: 2;
434+
background-color: red;
431435
}
432436
.sideBar {
433-
width: 90vw;
434437
padding-left: 0;
435438
padding-right: 0;
436-
position: unset;
437-
display: inline-flex;
439+
display: flex;
438440
padding-top: 0px;
439441
margin-right: 0px;
442+
order: 1;
443+
background-color: blue;
440444
}
441445
.sideBarArticle {
442446
flex: 1;
@@ -465,6 +469,9 @@ p {
465469
.postInfo h1 {
466470
margin: 0;
467471
}
472+
.post-content {
473+
flex-direction: column;
474+
}
468475
}
469476
@media only screen and (max-width: 523px) {
470477
#header {
@@ -575,6 +582,9 @@ p {
575582
padding: 3px;
576583
font-weight: 200;
577584
}
585+
#SearchPosts h2 {
586+
padding: 0;
587+
}
578588
.front {
579589
width: 100vw;
580590
display: flex;
@@ -659,4 +669,9 @@ p {
659669
margin: 0;
660670
padding: 0;
661671
}
672+
.post-content {
673+
display: flex;
674+
flex-direction: row;
675+
gap: 50px;
676+
}
662677

0 commit comments

Comments
 (0)