How to use

Visit https://store.gaijin.net/user.php?skin_lang=en&view=purchases
Scroll down to this section

Click "Show me all purchases" for all sections and wait until they load
Open the browser console for the webpage usually pressing: ctrl + shift + i
Click the Console Tab:

Paste in the code below like so

If successful then you can get disappointed in life in how much you fed the snail or how little.

Q. What does this code do?

A. All it does is search the page for cards and value (cards are the styling format of the item since they look like cards) It collects all the cards and looks for their Name, Price, and How many you bought usually in the form of {number} x {Money}. It will safely ignore cards with out values.

Q. My money isn't in USD Will it still count right?

A. No idea, but it should work, all it is doing is counting numbers and doing math, the final output will show $#.##

Q. Is is stealing my data?

A. No, nothing is sent to servers or stolen, you can see in the code there is no web requests being made, other than just searching for values.

Code

const showcaseSections = [
  document.querySelector("#bodyRoot > div.content > section > section:nth-child(5) > div"),
  document.querySelector("#bodyRoot > div.content > section > section:nth-child(8)"),
  document.querySelector("#bodyRoot > div.content > section > section:nth-child(10)"),
  document.querySelector("#bodyRoot > div.content > section > section:nth-child(12)"),
  document.querySelector("#bodyRoot > div.content > section > section:nth-child(14)"),
];

let totalCost = 0;
const itemCosts = [];

showcaseSections.forEach(section => {
  const showcaseItems = section.querySelectorAll('.showcase__item');

  showcaseItems.forEach(item => {
    const priceElement = item.querySelector('.showcase-item__price');
    const titleElement = item.querySelector('.showcase-item-description__title');

    if (priceElement) {
      let price = parseFloat(priceElement.textContent.replace('$', ''));
      const quantityElement = item.querySelector('.showcase-item-description__title-comment');
      if (quantityElement) {
        let quantity = parseInt(quantityElement.textContent.replace('x', ''));
        price *= quantity;
      }
      totalCost += price;
      itemCosts.push({ name: titleElement.textContent.trim(), cost: price });
    } else if (titleElement) {
      const title = titleElement.textContent.trim();
      if (!title.includes('Free')) {
        console.warn(`Found an item with no price: ${title}`);
        totalCost += 0;
        itemCosts.push({ name: title, cost: 0 });
      }
    } else {
      console.warn('Found an empty item with no price or title.');
    }
  });
});

// Sort items by cost in descending order
itemCosts.sort((a, b) => b.cost - a.cost);

// Create a new popup window
const popup = window.open('', 'Spending Summary', 'width=600,height=400');
// Add CSS styling to the popup
popup.document.write(`
  <style>
    body {
      font-family: sans-serif;
    }
    table {
      width: 100%;
      border-collapse: collapse;
    }
    th, td {
      text-align: left;
      padding: 8px;
      border: 1px solid #ddd;
    }
    th {
      background-color: #f2f2f2;
    }
    .highlight {
      background-color: #f0f0f0;
    }
    .semi-highlight {
      background-color: #f5f5f5;
    }
  </style>
`);

// Create a table in the popup
popup.document.write(`
  <h2>Spending Summary</h2>
  <p>Total cost: $${totalCost.toFixed(2)}</p>
  <table>
    <tr>
      <th>Item Name</th>
      <th>Total Spent</th>
    </tr>
`);

// Display items with highlighting
for (let i = 0; i < itemCosts.length; i++) {
  let className = '';
  if (i === 0) {
    className = 'highlight';
  } else if (i <= 2) {
    className = 'semi-highlight';
  }
  popup.document.write(`
    <tr class="${className}">
      <td>${itemCosts[i].name}</td>
      <td>$${itemCosts[i].cost.toFixed(2)}</td>
    </tr>
  `);
}

popup.document.write(`</table>`);

Screenshot entire page and save it

Open the console in the newly created window and paste in this and press enter and wait for it to load.

const script = document.createElement('script');
script.src = 'https://html2canvas.hertzen.com/dist/html2canvas.min.js';
script.onload = () => console.log('html2canvas loaded');
document.body.appendChild(script);

Paste in this once it is ready:

html2canvas(document.body, {
  windowWidth: document.documentElement.scrollWidth,
  windowHeight: document.documentElement.scrollHeight
}).then(canvas => {
  const img = canvas.toDataURL('image/png');

  const link = document.createElement('a');
  link.download = 'screenshot.png';
  link.href = img;
  link.click();
});