shop/index.html at main · PolyExtended/shop · 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
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
  <link rel="stylesheet" href="rarity.css"> <!-- Assuming rarity.css is in the same directory as your HTML file -->
  <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>
  <title>Fortnite Shop Tracker</title>
  <style>
    a {
      color: #16aaf2;
    }

    .backer {
      background: #16aaf2;
    }

    .backer-dark {
      background: #0c99dd;
    }

    .section {
      margin-bottom: 20px;
    }

    .collection-item {
      padding: 10px;
    }

    .title {
      font-size: 1.2em;
      font-weight: bold;
    }

    img {
      max-width: 100%;
      height: auto;
    }
  </style>
</head>

<body>
  <header class="z-depth-1">
    <nav class="z-depth-0 backer-dark">
      <div class="nav-wrapper container">
        <ul class="left">
          <li><a href="https://rebrand.ly/PolyExtended">Home</a></li>
          <li><a href="https://rebrand.ly/polylive">PolyLive</a></li>
          <li><a href="https://rebrand.ly/PolyStreamLookup">PolyLookup</a></li>
          <li><a href="https://rebrand.ly/PolyFNShop">Poly - FNSHOP</a></li>
          <li><a href="https://rebrand.ly/polywyr">Poly - WYR?</a></li>
        </ul>
      </div>
    </nav>
  </header>
  <div class="container">
    <h3 class="center-align">Fortnite Shop</h3>
    <div id="shop-list"></div>
  </div>

  <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
  <script>
    function showToast() {
      M.toast({
        html: 'Please use Epic Code TaborTime',
        classes: 'rounded'
      });
    }

    document.addEventListener('DOMContentLoaded', function () {
      showToast();

      fetch('https://fortnite-api.com/v2/shop/br')
        .then(response => response.json())
        .then(data => {
          const shopListContainer = document.getElementById('shop-list');
          const sections = {};

          data.data.featured.entries.forEach(entry => {
            entry.items.forEach(item => {
              const sectionName = item.type.displayValue || 'Other';
              if (!sections[sectionName]) {
                sections[sectionName] = [];
              }

              const rarityClass = item.rarity ? item.rarity.displayValue.replace(/\s+/g, '-').toLowerCase() : 'common';

              const dateAdded = moment(item.added).format('MMMM D, YYYY');
              const picture = `<img src="${item.images.icon}" class="${rarityClass}-border" alt="${item.name}">`;

              const itemInfo = `<span class="title">${item.name}</span>
                                   ${picture}
                                   <p class="${rarityClass}">Rarity: ${item.rarity ? item.rarity.displayValue : 'N/A'}</p>
                                   <p>Regular Price: ${entry.regularPrice}</p>
                                   <p>Final Price: ${entry.finalPrice}</p>
                                   <p>Date Added: ${dateAdded}</p>`;

              sections[sectionName].push(itemInfo);
            });
          });

          for (const sectionName in sections) {
            const section = document.createElement('div');
            section.className = 'section';
            section.innerHTML = `<h4>${sectionName}</h4>
                                   <ul class="collection">${sections[sectionName].map(item => `<li class="collection-item">${item}</li>`).join('')}</ul>`;
            shopListContainer.appendChild(section);
          }
        })
        .catch(error => console.error('Error fetching data:', error));
    });
  </script>
</body>

</html>