From d7dd4e9fc4e041c2593aa140054586ed49f9cfa8 Mon Sep 17 00:00:00 2001 From: Yuki Arimo Date: Fri, 16 Feb 2024 23:09:16 -0700 Subject: [PATCH] Basic logic Added --- assets/js/index.js | 44 +++++----- assets/js/solo-leveling.js | 171 +++++++++++++++++++++++++++++++++++++ index.html | 155 ++++++++++++++++++++++----------- 3 files changed, 299 insertions(+), 71 deletions(-) diff --git a/assets/js/index.js b/assets/js/index.js index 7b769fe..efbed96 100644 --- a/assets/js/index.js +++ b/assets/js/index.js @@ -50,8 +50,8 @@ if (isMobile) { } } -function createAndShowPopups() { - if (localStorage.getItem('status') == 'undefined' || localStorage.getItem('status') == null) { +function createAndShowPopups(callback) { + if (localStorage.getItem('status') === 'undefined' || localStorage.getItem('status') === null) { // Function to create a Bootstrap modal with custom styles function createModal(id, title, body) { const modalHTML = ` @@ -79,7 +79,9 @@ function createAndShowPopups() { // Function to remove a modal from the DOM function removeModal(id) { const modalElement = document.getElementById(id); - modalElement.parentNode.removeChild(modalElement); + if (modalElement && modalElement.parentNode) { + modalElement.parentNode.removeChild(modalElement); + } } // Create the first modal @@ -88,35 +90,38 @@ function createAndShowPopups() { // Show the first modal firstModal.show(); - // Create an innerHTML small form element in Bootstrap 5 with a single input field and a submit button to collect input and parse it to the initializeSystem function - const formHTML = ` -
-
- -
- -
- `; - // When the first modal is closed, remove it and create the second modal firstModal._element.addEventListener('hidden.bs.modal', function () { removeModal('firstModal'); // Create and show the second modal - const secondModal = createModal('secondModal', 'SYSTEM', formHTML); + const secondModal = createModal('secondModal', 'SYSTEM', ` +
+
+ +
+ +
+ `); secondModal.show(); - // When the second modal is closed, remove it and stop the function + // When the second modal is closed, remove it secondModal._element.addEventListener('hidden.bs.modal', function () { + // get the input value from the input field and store it in the local storage + localStorage.setItem('nameInit', document.getElementById('inputField').value); removeModal('secondModal'); // Create and show the third modal - const thirdModal = createModal('thirdModal', 'SYSTEM', 'Done! You are ready to play!'); + const thirdModal = createModal('thirdModal', 'SYSTEM', `Ready ${localStorage.getItem('nameInit')}! You are ready to play!`); thirdModal.show(); - // When the third modal is closed, remove it and stop the function + // When the third modal is closed, remove it and call the callback with the value thirdModal._element.addEventListener('hidden.bs.modal', function () { removeModal('thirdModal'); + const nameInit = localStorage.getItem('nameInit'); + if (callback) { + callback(nameInit); + } }); }); }); @@ -128,7 +133,4 @@ function initializeSystem() { const inputField = document.getElementById('inputField'); console.log(inputField.value); secondModal.click(); -} - -// Call the function to execute the popup creation and handling -createAndShowPopups(); \ No newline at end of file +} \ No newline at end of file diff --git a/assets/js/solo-leveling.js b/assets/js/solo-leveling.js index e69de29..527f3bb 100644 --- a/assets/js/solo-leveling.js +++ b/assets/js/solo-leveling.js @@ -0,0 +1,171 @@ +class SoloManager { + constructor() { + this.load(); + } + + load() { + const data = localStorage.getItem('soloData'); + this.data = data ? JSON.parse(data) : { + name: "Yuki", + status: { + xp: 0, + coins: 0, + points: 0, + retries: 0, + level: 1, + demands: { + quests: 0, + xp: 0, + modes: 0, + skippers: 0, + unlockers: 0 + } + }, + quests: { + active: [], + completed: [], + failed: [], + available: [] + }, + events: { + active: [], + completed: [], + failed: [], + available: [] + }, + store: { + shop: [], + exchange: [], + } + }; + } + + update() { + this.load(); + + // update the name of the user + document.getElementById('name').innerText = this.data.name; + document.getElementById('name-top').innerText = this.data.name; + + // update the level of the user + document.getElementById('level').innerText = this.data.status.level; + + // update the xp of the user + document.getElementById('xp').innerText = this.data.status.xp; + + // update the coins of the user + document.getElementById('coins').innerText = this.data.status.coins; + } + + save() { + localStorage.setItem('soloData', JSON.stringify(this.data)); + } + + createItem(type, category, item) { + if (!this.data[type] || !this.data[type][category]) { + console.error('Invalid type or category'); + return; + } + this.data[type][category].push(item); + this.save(); + } + + editItem(type, category, itemId, newValues) { + const itemIndex = this.data[type][category].findIndex(item => item.id === itemId); + if (itemIndex === -1) { + console.error('Item not found'); + return; + } + this.data[type][category][itemIndex] = { + ...this.data[type][category][itemIndex], + ...newValues + }; + this.save(); + } + + deleteItem(type, category, itemId) { + const itemIndex = this.data[type][category].findIndex(item => item.id === itemId); + if (itemIndex === -1) { + console.error('Item not found'); + return; + } + this.data[type][category].splice(itemIndex, 1); + this.save(); + } + + renameUser(newName) { + this.data.name = newName; + this.save(); + } + + modifyItemProperty(type, category, itemId, property, newValue) { + const itemIndex = this.data[type][category].findIndex(item => item.id === itemId); + if (itemIndex === -1) { + console.error('Item not found'); + return; + } + this.data[type][category][itemIndex][property] = newValue; + this.save(); + } + + changeItem(type, category, itemId, newItem) { + const itemIndex = this.data[type][category].findIndex(item => item.id === itemId); + if (itemIndex === -1) { + console.error('Item not found'); + return; + } + this.data[type][category][itemIndex] = newItem; + this.save(); + } + + moveItem(type, fromCategory, toCategory, itemId) { + const itemIndex = this.data[type][fromCategory].findIndex(item => item.id === itemId); + if (itemIndex === -1) { + console.error('Item not found in source category'); + return; + } + const item = this.data[type][fromCategory].splice(itemIndex, 1)[0]; + this.data[type][toCategory].push(item); + this.save(); + } + + addNotification(alertText, timestamp) { + // Find the dropdown menu where the alerts will be added + const dropdownMenu = document.getElementById('notification-center'); + + // Create a new alert item + const alertItem = document.createElement('a'); + alertItem.classList.add('dropdown-item', 'd-flex', 'align-items-center'); + + // Add the inner HTML structure for the alert item + alertItem.innerHTML = ` +
+
+ ${alertText} +
+

${timestamp}

+
+ `; + + // Append the new alert item to the dropdown menu + dropdownMenu.appendChild(alertItem); + } +} + +// if soloData is not found in localStorage, create a new one with default values +const soloManager = new SoloManager(); + +// if soloData is found in localStorage, load it, otherwise create a new one with default values +if (!localStorage.getItem('soloData')) { + // run the createAndShowPopups(); function and save returned value to as a name of the user in soloData + createAndShowPopups(function (nameInit) { + soloManager.data.name = nameInit; + soloManager.save(); + }); +} else { + soloManager.load(); + soloManager.update(); + + // Add notification to the notification center with the current date and time as the timestamp and the alert text as "Welcome back, [name]!" + soloManager.addNotification(`Welcome back, ${soloManager.data.name}!`, new Date().toLocaleString()); +} \ No newline at end of file diff --git a/index.html b/index.html index 1330929..cca7f3c 100644 --- a/index.html +++ b/index.html @@ -112,24 +112,11 @@
-
-
alerts center
- -
-
Hi there! I am wondering if you can - help me with a problem I've been having.
-

Emily Fowler - 58m

-
- - -
-
I have the photos that you ordered last - month!
-

Jae Chun - 1d

-
- - Show All - Alerts +
+
Notification center
+ +
alerts center
  • + href="#">YukiSolo Leveling Player
     ProfileStatus
    Player
    -
    Yuki
    +
    Yuki
    +
    +
    Level
    -
    3
    +
    0
    Experience
    -
    500 XP
    +
    0
    Coins
    -
    0
    +
    0
    @@ -285,44 +277,107 @@
    Benefits
    • - -
    + +
    -
    -
    -
    - Shop +
    +
    +
    +
    Shop
    -
    -
    Modes
    -

    Hard - 50 coins, Level 3, Time 24h

    -

    Easy - 50 coins, Level 3, Time 24h

    -
    Bonus
    -

    Night read - 20 coins, Level 3

    -

    Todo deadline - 30 coins, Level 5

    +
    +
    + +
    +
    +
    +
    +
    Modes
    +
    +
      +
    • + Hard + 50 coins + Level 5 + Time 24h +
      • +
    • + Easy + 25 coins + Level 2 + Time 12h +
      • +
    +
    +
    +
    +
    Shop
    +
    +
      +
    • + Night read + 50 coins +
      • +
    • + Todo + 20 coins +
      • +
    +
    +
    +
    + +
    +
    +
    +
    Shop
    +
    -
    -
    - Exchange +
    +
    +
    Exchange
    -
    -
    Base
    -

    100 XP -> 1 coin

    -

    10 coins -> 1 LVL UP

    -

    7500 XP -> 10 coins

    -
    Benefit
    -

    3 points -> 2500 XP

    -

    10 points -> 1 retry

    +
      +
    • + Base + 100 xp + 40 coins +
      • +
    • + 1 coin + 3 points +
      • +
    • + 1 LVL UP + 10 coins +
      • +
    +
    +
    +
    +
    Benefit
    +
      +
    • + 25 XP + 5 points +
      • +
    -
    +