WordPress_Themes/NAN_Student_Handbook
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

reverse traverse implemented

Browse Source
This commit is contained in:
prospect
2024-01-24 23:26:30 -05:00
parent 158d2ac7c5
commit 2daf505f33
2 changed files with 80 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
assets/js/index.js
View File

@@ -48,7 +48,8 @@ __webpack_require__.r(__webpack_exports__);
class HammerGestures { class HammerGestures {
constructor() { constructor() {
this.history = JSON.parse(sessionStorage.getItem('historyArray')) || []; this.pageTransition = new _PageTransitions__WEBPACK_IMPORTED_MODULE_0__["default"]();
this.history = this.pageTransition.historyArray;
this.init(); this.init();
} }
init() { init() {
@@ -60,56 +61,63 @@ class HammerGestures {
hammer.get('swipe').set({ hammer.get('swipe').set({
direction: Hammer.DIRECTION_ALL direction: Hammer.DIRECTION_ALL
}); });
var pageTransition = new _PageTransitions__WEBPACK_IMPORTED_MODULE_0__["default"]();
// Add a swipe event listener for swipe left // Add a swipe event listener for swipe left
hammer.on('swipeleft', ev => { hammer.on('swipeleft', ev => {
this.currentUrl = window.location.href; this.currentUrl = window.location.href;
this.goForward(this.currentUrl); // this.goForward(this.currentUrl)
console.log(ev.type); console.log(ev.type);
// pageTransition.animatePageTransition(() => { // this.pageTransition.animatePageTransition(() => {
// pageTransition.loadContent(pageTransition.navigateArray('forward'), 'content-container') // this.pageTransition.loadContent(this.pageTransition.navigateArray('forward'), 'content-container')
// }) // })
}); });
// Add a swipe event listener for swipe right // Add a swipe event listener for swipe right
hammer.on('swiperight', ev => { hammer.on('swiperight', ev => {
this.currentUrl = window.location.href; this.currentUrl = window.location.href;
this.goBack(this.currentUrl); // this.goBack(this.currentUrl)
console.log(ev.type); console.log(ev.type);
pageTransition.animatePageTransition(() => { console.log(JSON.parse(sessionStorage.getItem('historyArray')));
pageTransition.loadContent(pageTransition.navigateArray('backward'), 'content-container'); if (JSON.parse(sessionStorage.getItem('historyArray')).length > 1) {
}); this.pageTransition.animatePageTransition(() => {
this.pageTransition.loadContent(this.pageTransition.navigateArray('backward'), 'content-container');
});
}
}); });
}); });
} }
goForward(currentUrl) {
if (this.history.length > 0) { // goForward(currentUrl) {
const nextUrl = this.history[this.history.length - 1]; // if (this.history.length > 0) {
if (HammerGestures.isSameDomain(currentUrl, nextUrl)) { // const nextUrl = this.history[this.history.length - 1]
console.log(`Going forward to ${nextUrl}`); // if (HammerGestures.isSameDomain(currentUrl, nextUrl)) {
this.history.pop(); // console.log(`Going forward to ${nextUrl}`)
} else { // this.history.pop()
console.log('Cannot go forward. Different domain.'); // } else {
} // console.log('Cannot go forward. Different domain.')
} else { // }
console.log('Cannot go forward. History is empty.'); // } else {
} // console.log('Cannot go forward. History is empty.')
} // }
goBack(currentUrl) { // }
if (this.history.length > 0) {
const previousUrl = this.history.pop(); // goBack(currentUrl) {
if (HammerGestures.isSameDomain(currentUrl, previousUrl)) { // if (this.history.length > 0) {
console.log(`Going back to ${previousUrl}`); // const previousUrl = this.history.pop()
} else { // if (HammerGestures.isSameDomain(currentUrl, previousUrl)) {
console.log('Cannot go back. Different domain.'); // console.log(`Going back to ${previousUrl}`)
this.history.push(previousUrl); // Re-add the popped URL // } else {
} // console.log('Cannot go back. Different domain.')
} else { // this.history.push(previousUrl) // Re-add the popped URL
console.log('Cannot go back. History is empty.'); // return
} // }
} // } else {
// console.log('Cannot go back. History is empty.')
// return
// }
// }
static isSameDomain(url1, url2) { static isSameDomain(url1, url2) {
const domain1 = new URL(url1).hostname; const domain1 = new URL(url1).hostname;
const domain2 = new URL(url2).hostname; const domain2 = new URL(url2).hostname;
@@ -177,6 +185,9 @@ __webpack_require__.r(__webpack_exports__);
class PageTransitions { class PageTransitions {
constructor() { constructor() {
// Check if the history array already exists in the sessionStorage
this.historyArray = JSON.parse(sessionStorage.getItem('historyArray')) || [];
this.navControl = new _NavControl__WEBPACK_IMPORTED_MODULE_1__["default"]();
this.init(); this.init();
} }
init() { init() {
@@ -194,7 +205,6 @@ class PageTransitions {
if (link.href === window.location.href) { if (link.href === window.location.href) {
return; return;
} }
this.navControl = new _NavControl__WEBPACK_IMPORTED_MODULE_1__["default"]();
if (this.navControl.toggleMenuBtn.classList.contains('active')) { if (this.navControl.toggleMenuBtn.classList.contains('active')) {
this.navControl.toggleNavMenu(); this.navControl.toggleNavMenu();
} }
@@ -216,6 +226,7 @@ class PageTransitions {
this.forms = document.querySelectorAll(selector); this.forms = document.querySelectorAll(selector);
this.forms.forEach(form => { this.forms.forEach(form => {
form.addEventListener('submit', e => { form.addEventListener('submit', e => {
console.log(e);
e.preventDefault(); e.preventDefault();
if (this.navControl.toggleMenuBtn.classList.contains('active')) { if (this.navControl.toggleMenuBtn.classList.contains('active')) {
this.navControl.toggleNavMenu(); this.navControl.toggleNavMenu();
@@ -223,6 +234,7 @@ class PageTransitions {
this.animatePageTransition(() => { this.animatePageTransition(() => {
this.submitFormAsync(form); this.submitFormAsync(form);
}); });
this.formResetter(form);
}); });
}); });
} }
@@ -242,7 +254,6 @@ class PageTransitions {
element.classList.remove('page-transition'); element.classList.remove('page-transition');
} }
loadContent(targetUrl, elementId) { loadContent(targetUrl, elementId) {
const contentContainer = document.getElementById('content-container');
fetch(targetUrl).then(response => response.text()).then(data => { fetch(targetUrl).then(response => response.text()).then(data => {
this.updateContent(data, elementId); this.updateContent(data, elementId);
history.pushState(null, null, targetUrl); history.pushState(null, null, targetUrl);
@@ -255,19 +266,9 @@ class PageTransitions {
body: formData body: formData
}).then(response => response.text()).then(data => { }).then(response => response.text()).then(data => {
// Assuming the response contains the new content to be loaded // Assuming the response contains the new content to be loaded
const targetUrl = form.action; // You might need to adjust this based on your server's response const targetUrl = form.action + '?s=' + formData.get('s'); // You might need to adjust this based on your server's response
const elementId = 'content-container'; const elementId = 'content-container';
// Clear the search form
var inputs = form.getElementsByTagName('input');
Array.from(inputs).forEach(function (input) {
// Reset the input value
input.value = '';
// Unfocus the input
input.blur();
});
// Update content, push state, and remove transition class // Update content, push state, and remove transition class
this.updateContent(data, elementId); this.updateContent(data, elementId);
history.pushState(null, null, targetUrl); history.pushState(null, null, targetUrl);
@@ -290,6 +291,17 @@ class PageTransitions {
this.addLinkClickListener('#content-container a'); this.addLinkClickListener('#content-container a');
}).catch(error => console.error('Error submitting form:', error)); }).catch(error => console.error('Error submitting form:', error));
} }
formResetter(form) {
// Clear the search form
var inputs = form.getElementsByTagName('input');
Array.from(inputs).forEach(function (input) {
// Reset the input value
input.value = '';
// Unfocus the input
input.blur();
});
}
updateContent(data, elementId) { updateContent(data, elementId) {
const contentContainer = document.getElementById('content-container'); const contentContainer = document.getElementById('content-container');
const parsedData = new DOMParser().parseFromString(data, 'text/html'); const parsedData = new DOMParser().parseFromString(data, 'text/html');
@@ -331,9 +343,6 @@ class PageTransitions {
return adminUrlRegex.test(link.href); return adminUrlRegex.test(link.href);
} }
createHistoryTracker() { createHistoryTracker() {
// Check if the history array already exists in the sessionStorage
let historyArray = JSON.parse(sessionStorage.getItem('historyArray')) || [];
// Get the initial page's href // Get the initial page's href
let initialHref = window.location.href; let initialHref = window.location.href;
@@ -344,19 +353,28 @@ class PageTransitions {
// Check if the currentHref is the same as the last item in the history array // Check if the currentHref is the same as the last item in the history array
// and if it's different from the initialHref // and if it's different from the initialHref
if (currentHref !== initialHref && (historyArray.length === 0 || currentHref !== historyArray[historyArray.length])) { if (currentHref !== initialHref && (this.historyArray.length === 0 || currentHref !== this.historyArray[this.historyArray.length])) {
// Remove all occurrences of the currentHref from historyArray // Remove all occurrences of the currentHref from this.historyArray
historyArray = historyArray.filter(url => url !== currentHref); this.historyArray = this.historyArray.filter(url => url !== currentHref);
// Add the currentHref to the history array // Add the currentHref to the history array
historyArray.unshift(initialHref); this.historyArray.unshift(currentHref);
initialHref = currentHref; // initialHref = currentHref
// this.historyArray.pop()
// Save the updated history array to the sessionStorage // Save the updated history array to the sessionStorage
sessionStorage.setItem('historyArray', JSON.stringify(historyArray)); const itemToRemove = 'https://' + window.location.hostname + '/?s=';
console.log(itemToRemove);
console.log('Yes');
// Use the filter method to create a new array without the item to remove
this.historyArray = this.historyArray.filter(item => item !== itemToRemove);
sessionStorage.setItem('historyArray', JSON.stringify(this.historyArray));
this.historyArray = JSON.parse(sessionStorage.getItem('historyArray')) || [];
// sessionStorage.setItem('historyArray', JSON.stringify(this.historyArray))
// Log the history array (you can replace this with your own logic) // Log the history array (you can replace this with your own logic)
console.log('History Array:', historyArray); // console.log('History Array:', this.historyArray)
} }
}; };
@@ -376,15 +394,12 @@ class PageTransitions {
observer.observe(document.body, config); observer.observe(document.body, config);
} }
navigateArray(direction) { navigateArray(direction) {
// Retrieve the historyArray from storage (assuming it's stored as a JSON string)
const storedHistory = sessionStorage.getItem('historyArray');
// Parse the JSON string into an array or provide a default empty array if null
const historyArray = storedHistory ? JSON.parse(storedHistory) : [];
if (direction === 'forward') { if (direction === 'forward') {
console.log('Forward Navigation is Null'); console.log('Forward Navigation is Null');
} else if (direction === 'backward') { } else if (direction === 'backward') {
console.log('Backward Naviation is Allowed And Will Be Implemented Soon'); this.historyArray.shift();
sessionStorage.setItem('historyArray', JSON.stringify(this.historyArray));
return this.historyArray[0];
} }
} }
} }

2
assets/js/index.js.map
View File

File diff suppressed because one or more lines are too long