public/static/scripts/favorites.js


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
84
85
86
87
88
89
90
91
92
93

function saveFavoriteFiles(files) {
    localStorage.setItem('favorite-files', JSON.stringify(files));
}

function getFavoriteFiles() {
    const files = JSON.parse(localStorage.getItem('favorite-files') ?? '[]');
    return files;
}

function addFavoriteFile(f) {
    if (isFavoriteFile(f)) {
        return;
    }

    const files = getFavoriteFiles();
    files.push(f);
    saveFavoriteFiles(files);
}

function removeFavoriteFile(f) {
    if (!isFavoriteFile(f)) {
        return;
    }

    let files = getFavoriteFiles();
    files = files.filter((x) => x.id != f.id);
    saveFavoriteFiles(files);
}

function isFavoriteFile(f) {
    const files = getFavoriteFiles();
    return files.find((x) => x.id == f.id) != undefined;
}

window.addEventListener('load', () => {
    const tabs = document.getElementById('file-tab-buttons');
    if (tabs != null) {
        const addIcon = document.createElement('img');
        addIcon.src = '/static/img/icons/star-gray.png';
        addIcon.alt = 'Favorite';

        const delIcon = document.createElement('img');
        delIcon.src = '/static/img/icons/star.png';
        delIcon.alt = 'Unfavorite';

        const btn = document.createElement('button');

        const file = {
            id: document.getElementById('file-id').innerText,
            mime: document.getElementById('file-mime').innerText,
            extension: document.getElementById('file-extension').innerText,
            size: document.getElementById('file-size').innerText
        };

        btn.addEventListener('click', (e) => {
            if (isFavoriteFile(file)) {
                removeFavoriteFile(file);
            } else {
                addFavoriteFile(file);
            }

            btn.innerHTML = '';

            const isf = isFavoriteFile(file);

            btn.appendChild(isf ? delIcon : addIcon);
            btn.title = isf ? 'Unfavorite this file' : 'Favorite file';
        });

        const isf = isFavoriteFile(file);

        btn.appendChild(isf ? delIcon : addIcon);
        btn.title = isf ? 'Unfavorite this file' : 'Favorite file';

        tabs.appendChild(btn);
    }

    const files = document.getElementById('favorite-files');
    if (files != null) {
        const data = getFavoriteFiles();
        if (data.length > 0) {
            files.parentElement.style.display = 'flex';
            files.innerHTML = '';
            enableTab('favorite-files');
        } else {
            disableTab('favorite-files');
        }
        data.forEach((x) => {
            const html = addUploadedFile(x);
            files.innerHTML += html;
        });
    }
});