Merge pull request #24 from TheOtterlord/banlist-visuals

Banlist visuals

Author: TheOtterlord

CHANGELOG.md

@@ -6,6 +6,14 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
 
+## 1.0.1
+
+Adds banlist visuals. A feature planned for 1.0.0 but one I forgot to add.
+
+### Added
+
+- Add banlist visuals
+
 ## 1.0.0
 
 We've reached a big milestone, and while I have been gone for a while working on other projects, I'm going to make sure to dedicate more time to DeckMaster.

assets/ban.png

@@ -459,7 +459,7 @@ <h2>Welcome</h2>
   <div class="changelog" style="padding: 16px;">
     <h2>What's new in <span class="version"></span></h2>
     <div>
-      <!-- TODO: add changelog -->
+      <p>Adds banlist visuals</p>
     </div>
     <div class="ir-flex-row">
       <button class="ir-flex ir-button" onclick="closeChangelog()">Close Changelog</button>

assets/limit.png

@@ -2,7 +2,7 @@ const { dialog } = require('electron').remote;
 const paths = require('path');
 
 const deckmaster = {
-  version: "v1.0.0",
+  version: "v1.0.1",
   notification: (title, text, onclick) => {
     const notification = new Notification(title, {
       body: text

assets/semi.png

@@ -74,7 +74,10 @@ function set_page() {
     child.classList.add("card");
     child.draggable = false;
     var url = ygoprodeck.dl_image(card, child);
-    child.innerHTML = `<img src='${url}' alt='${card}'>`;
+    var tag = ygodata.cards[card].banlist_info?.ban_tcg == 'Banned' ? `<div style='position:relative;'><img style='position: absolute;width: 1.5em;height: 1.5em;transform: translateX(-100%);margin: -4px 4px;' src='./assets/ban.png'></div>` : '';
+    var tag = ygodata.cards[card].banlist_info?.ban_tcg == 'Limited' ? `<div style='position:relative;'><img style='position: absolute;width: 1.5em;height: 1.5em;transform: translateX(-100%);margin: -4px 4px;' src='./assets/limit.png'></div>` : tag;
+    var tag = ygodata.cards[card].banlist_info?.ban_tcg == 'Semi-Limited' ? `<div style='position:relative;'><img style='position: absolute;width: 1.5em;height: 1.5em;transform: translateX(-100%);margin: -4px 4px;' src='./assets/semi.png'></div>` : tag;
+    child.innerHTML = `<img src='${url}' alt='${card}'>${tag}`;
     child.oncontextmenu = (ev) => {
       ev.preventDefault();
       var main = document.querySelector(".deckbox.main");
@@ -374,7 +377,10 @@ class Deck {
       return true;
     }
     var img = ygoprodeck.dl_image(id, card);
-    card.innerHTML = `<img src="${img}", alt="${id}">`;
+    var tag = ygodata.cards[id].banlist_info?.ban_tcg == 'Banned' ? `<div style='position:relative;'><img style='position: absolute;width: 1.5em;height: 1.5em;transform: translateX(-100%);margin: -4px 4px;' src='./assets/ban.png'></div>` : '';
+    var tag = ygodata.cards[id].banlist_info?.ban_tcg == 'Limited' ? `<div style='position:relative;'><img style='position: absolute;width: 1.5em;height: 1.5em;transform: translateX(-100%);margin: -4px 4px;' src='./assets/limit.png'></div>` : tag;
+    var tag = ygodata.cards[id].banlist_info?.ban_tcg == 'Semi-Limited' ? `<div style='position:relative;'><img style='position: absolute;width: 1.5em;height: 1.5em;transform: translateX(-100%);margin: -4px 4px;' src='./assets/semi.png'></div>` : tag;
+    card.innerHTML = `<img src='${img}' alt='${id}'>${tag}`;
     card.children[0].onerror = () => {
       card.children[0].src = DEFAULT_IMG;
       card.children[0].onerror = () => {

index.html

@@ -78,11 +78,16 @@ const ygoprodeck = {
       if (this.readyState == 4 && this.status == 200) {
         var json = JSON.parse(xhttp.responseText);
         var date = new Date();
+        var baninfo = new XMLHttpRequest();
+        baninfo.open("GET", `https://db.ygoprodeck.com/api/${ygoprodeck.version}/cardinfo.php?banlist=tcg&misc=yes`, false);
+        baninfo.send();
+        var banlist = JSON.parse(baninfo.responseText).data;
         var cards = {
           updated: `${date.getFullYear()}-${date.getMonth()}-${date.getDate()}`,
           cards: {}
         };
         for (let i = 0; i < json.data.length; i++) {
+          json.data[i] = banlist.find(card => {return card.id == json.data[i].id}) ?? json.data[i];
           cards.cards[`${json.data[i].id}`] = json.data[i];
         }
         ygodata = cards;

js/api.js

@@ -1,6 +1,6 @@
 {
   "name": "deckmaster",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "A Yu-Gi-Oh! TCG deck editor",
   "main": "index.js",
   "scripts": {