Wallet-Website/addWallets.js at master · dariiing/Wallet-Website · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
function createWallet(){
    let popup = document.getElementById("wallet-form");
    popup.classList.add("open-wallet-form");
    popup = document.getElementById("sidebar");
    popup.classList.add("sidebar-height");
}

function closeWallet(form){
    let popup = document.getElementById("wallet-form");
    popup.classList.remove("open-wallet-form");
    popup = document.getElementById("sidebar");
    popup.classList.remove("sidebar-height");
    let changeName = form.name.value;
    let changeValue = form.value.value;

    const div = document.createElement('div');
    div.setAttribute('class', 'wallet money');
    let double = false;
    Wallets.forEach(wallet=>{
        if(wallet.name === changeName){
            alert("Change the name of the wallet");
            double = true;
        }
    })

    if(double===false){
        Wallets.push({
            name: changeName,
            value: changeValue
        });

        updateSumTotal();
        populateWallets();
        populateCategories();
        stringJSON();

        div.innerHTML = `<span class="material-symbols-outlined">wallet</span>
                       <section class="text" onClick="openEditPopup(this)">
                       <h3>${changeName}</h3>
                       <h4>$${changeValue}</h4>
                       </section>`;
        document.querySelector('.types-wallet').appendChild(div);
    }

}

function populateWallets(){
    let select = document.getElementById("wallet-opt");

    select.innerHTML='';
    Wallets.forEach(wallet =>{
        let option = document.createElement('option');
        option.value= wallet.name;
        option.text = wallet.name;
        select.appendChild(option);
    })
}

//se formeaza sidebar stanga wallets
function updateWallets(){
    const walletsContainer = document.querySelector('.types-wallet');
    walletsContainer.innerHTML = '<div class="wallet-form" id="wallet-form">\n' +
        '                                <form>\n' +
        '                                    <label for="wallet-name">Wallet name:</label><br>\n' +
        '                                    <input type="text" id="wallet-name" name="name" value="Piggy Bank"><br>\n' +
        '                                    <label for="wallet-price">Value:</label><br>\n' +
        '                                    <input type="number" id="wallet-price" name="value" value="100" min="1"><br>\n' +
        '                                    <input type="button" name="button" value="Done" onclick="closeWallet(this.form)">\n' +
        '                                </form>\n' +
        '                            </div>';
    Wallets.forEach(wallet => {
        const div = document.createElement('div');
        div.setAttribute('class', 'wallet money');


        div.innerHTML = `<span class="material-symbols-outlined">wallet</span>
                       <section class="text" onClick="openEditPopup(this)">
                       <h3>${wallet.name}</h3>
                       <h4>$${wallet.value}</h4>
                       </section>`;
        document.querySelector('.types-wallet').appendChild(div);
    })
}