Skip to content

Commit

Permalink
updated dynamic sections
Browse files Browse the repository at this point in the history
  • Loading branch information
Abhishek Kumar committed Nov 28, 2024
1 parent 93c3389 commit 99816df
Show file tree
Hide file tree
Showing 4 changed files with 98 additions and 60 deletions.
13 changes: 7 additions & 6 deletions app.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,24 +54,25 @@ def scrape():

@app.route('/api/saveLocalStorage', methods=['POST'])
def save():
print('Saving to local storage')
data = request.get_json()
animelist = data.get('animelist')
# save to file system with the name 'animelist.json'
with open('saves/animelist.json', 'w') as file:
json.dump(animelist, file)
json.dump(data, file)

return jsonify({'message': 'Saved successfully'})

@app.route('/api/loadLocalStorage', methods=['GET'])
def load():
# load from file system with the name 'animelist.json'
print('Loading from local storage')
try:
with open('saves/animelist.json', 'r') as file:
animelist = json.load(file)
data = json.load(file)
except FileNotFoundError:
animelist = []
return jsonify(animelist)
data = {}

return jsonify({'data': data})

if __name__ == '__main__':
app.run(host='0.0.0.0', port=8000, debug=True)
94 changes: 85 additions & 9 deletions static/script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
// Function to save data to a file
let animeList = [];
let iframedata = null;
let retryloading = 0;
window.animeList = animeList;
window.animePropertyList = ['name', 'episodesWatched', 'status', 'rating', 'link', 'image'];
window.visibleProperties = ['rating', 'episodesWatched'];
Expand All @@ -13,7 +14,7 @@ window.animeListState = {};
window.sortBy = 'rating';
window.options = {};

const sections = ['long', 'short', 'inactive'];
let sections = ['long', 'short', 'inactive'];

// #############################################
// ############## Event listeners ##############
Expand All @@ -28,11 +29,18 @@ document.addEventListener('DOMContentLoaded', () => {
// change sortby radio button to rating
const options = localStorage.getItem('options');

const sortBy = options ? JSON.parse(options).sortBy : 'rating';
document.getElementById(sortBy).checked = true;

const horviewstyle = options ? JSON.parse(options).horviewstyle : false;
document.getElementById('horviewstyle').checked = horviewstyle;
try
{
const sortBy = options ? JSON.parse(options).sortBy : 'rating';
document.getElementById(sortBy).checked = true;

const horviewstyle = options ? JSON.parse(options).horviewstyle : false;
document.getElementById('horviewstyle').checked = horviewstyle;
}
catch (e)
{
console.log("error in loading data")
}

loadDataFromLocalStorage();
// window.animePropertyList = Object.keys(window.animeList[0]);
Expand Down Expand Up @@ -574,6 +582,7 @@ function updateEpisodes(animeName, increment) {
if (anime) {
anime.episodesWatched += increment;
localStorage.setItem('animeList', JSON.stringify(window.animeList)); // Update localStorage
saveLocalStorage()
renderAnimeList(anime.status);
}
}
Expand Down Expand Up @@ -632,13 +641,16 @@ function updateLocalStorage() {
localStorage.setItem('decimalProperties', JSON.stringify(window.decimalProperties)); // Update decimalProperties
localStorage.setItem('animeListState', JSON.stringify(window.animeListState)); // Update animeListState
localStorage.setItem('options', JSON.stringify(window.options)); // Update options
saveLocalStorage();
console.log("working", window.options);
}
// function to load data from localStorage
function loadDataFromLocalStorage() {
// Load data from localStorage or use initial data
const storedData = localStorage.getItem('animeList');
window.animeList = storedData ? JSON.parse(storedData) : window.animeList;
window.animeList = storedData !== undefined ? JSON.parse(storedData) : window.animeList;

console.log('Loaded data:', localStorage);

if (window.animeList.length === 0) {
return;
Expand All @@ -656,6 +668,9 @@ function loadDataFromLocalStorage() {
window.sortBy = window.options.sortBy;
const hideRecent = document.getElementById('hideRecent');
hideRecent.checked = window.options.hideRecent;

// load anime sections if not loaded
generateAnimeSections(window.animeList);
}
// Function to add a new property to animePropertyList
function addProperty() {
Expand Down Expand Up @@ -991,7 +1006,7 @@ function updateAnimeForm(animeName) {
// function to process link and get anime properties
async function processLink(urlLink) {
// if link contains luciferdonghua.in
if (urlLink.includes('lucifer')) {
if (urlLink.includes('lucifer') || urlLink.includes('mister')) {
return await processLuciferDonghua(urlLink);
}
else{
Expand Down Expand Up @@ -1054,6 +1069,67 @@ async function loadLocalStorage() {
})
.then(response => response.json())
.then(data => {
localStorage = data;
ddata = data.data;
console.log(ddata);

// iterate over keys and set the local storage
for (let [key, value] of Object.entries(ddata)) {
localStorage.setItem(key, value);
}

loadDataFromLocalStorage();
})
}

// generate anime sections
function generateAnimeSections(animeData) {
const mainElement = document.querySelector('main');

if (!mainElement) {
console.error('Main element not found');
return;
}

existingSections = document.getElementsByClassName('animeSectionClass');
existingSectionNames = [];
for (let i = 0; i < existingSections.length; i++) {
existingSectionNames.push(existingSections[i].id);
}

console.log('Generating anime sections', animeData);
animeData.forEach(anime => {
sectionExists = existingSectionNames.includes(anime.status+ 'Section');
console.log('Section exists', sectionExists, existingSectionNames);
if (!sectionExists) {
console.log('Generating section for status', anime.status);
const blockDiv = document.createElement('div');
blockDiv.className = 'block';

const stickySectionDiv = document.createElement('div');
stickySectionDiv.className = 'stickysection';

const h2Element = document.createElement('h2');
h2Element.innerHTML = `${anime.status} <button id="${anime.status}Button">Hide</button><button class="${anime.status}CollapseBtn animeCollapseBtn fas fa-angle-double-up"></button>`;

stickySectionDiv.appendChild(h2Element);
blockDiv.appendChild(stickySectionDiv);

const animeSectionDiv = document.createElement('div');
animeSectionDiv.id = `${anime.status}Section`;
animeSectionDiv.className = 'animeSection masked animeSectionClass';

const ulElement = document.createElement('ul');
ulElement.id = `${anime.status}List`;

animeSectionDiv.appendChild(ulElement);
blockDiv.appendChild(animeSectionDiv);

mainElement.appendChild(blockDiv);
existingSectionNames.push(anime.status + 'Section');

if (!sections.includes(anime.status)) {
sections.push(anime.status);
}
}
});
}
16 changes: 5 additions & 11 deletions static/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -135,9 +135,7 @@ button:hover {
/* Light gray text */
}

#longSection,
#shortSection,
#inactiveSection {
.animeSectionClass {
/* background-color: #3b3b3b; Slightly lighter gray background */
color: #f0f0f0;
/* Light gray text */
Expand All @@ -149,9 +147,7 @@ button:hover {
min-width: 95vw;
}

#longSection.masked::after,
#shortSection.masked::after,
#inactiveSection.masked::after {
.animeSectionClass.masked::after {
color: #f0f0f0;
content: "";
position: absolute;
Expand Down Expand Up @@ -244,9 +240,7 @@ span {
background: linear-gradient(to top, #000, transparent);
}

.longCollapseBtn,
.shortCollapseBtn,
.inactiveCollapseBtn {
.animeCollapseBtn {
display: none;
background: #000;
}
Expand Down Expand Up @@ -476,7 +470,7 @@ span {

.updateAnimeForm{
display: none;
position: absolute;
position: fixed;
background-color: rgba(0, 0, 0, 0.8);
/* Slightly lighter gray background */
color: #f0f0f0;
Expand All @@ -489,7 +483,7 @@ span {
font-size: 0.9vw;
min-width: 3vw;
width: 50%;
top: 10%;
top: 25%;
z-index: 1000;
left: 25%;
float: left;
Expand Down
35 changes: 1 addition & 34 deletions templates/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,40 +54,7 @@ <h1>Anime Database</h1>
</div>
</header>
<main>
<div class="block">
<div class="stickysection">
<h2>Long <button id="longButton">Hide</button><button class="longCollapseBtn fas fa-angle-double-up"></button>
</h2>
</div>
<div id="longSection" class="animeSection masked">
<ul id="longList"></ul>
</div>
</div>
<div class="block">

<div class="stickysection">
<h2>Short <button id="shortButton">Hide</button><button
class="shortCollapseBtn fas fa-angle-double-up"></button></h2>
</div>
<div id="shortSection" class="animeSection masked">
<ul id="shortList"></ul>
</div>

</div>
<div class="block">

<div class="stickysection">
<h2>Inactive <button id="inactiveButton">Hide</button><button
class="inactiveCollapseBtn fas fa-angle-double-up"></button></h2>
</div>
<div id="inactiveSection" class="animeSection masked">
<ul id="inactiveList"></ul>
</div>
</div>

<!-- <div class="editAnimePopup" id="editAnimePopupId">
</div> -->

<!-- placeholder -->
</main>
<script type='text/javascript' src='{{ url_for("static", filename="script.js") }}'></script>
</body>
Expand Down

0 comments on commit 99816df

Please sign in to comment.