Getting coin names from coinmarketcap

index.html

@@ -78,7 +78,7 @@
     <!-- Javascript -->
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
-    <script src="js/main.min.js"></script>
+    <script src="js/main.js"></script>
 
   </body>
 </html>

js/main.js

@@ -8,6 +8,7 @@ $(document).ready(function() {
   var variants    = ["color", "black", "icon", "white"];
   var iconDefault = "black";
   var iconHover   = "color";
+  var url = 'https://api.coinmarketcap.com/v1/ticker/?limit=0'
 
 
   // ------------------------------
@@ -26,40 +27,43 @@ $(document).ready(function() {
   // ------------------------------
   // Get list of icons in manifest
   // ------------------------------
-  $.getJSON(dataJson, function(data) {
+  $.get(url, function(coins){
+    $.getJSON(dataJson, function(data) {
+      var icons = "";
+      var count = 0;
+      data.icons.forEach(function(icon) {
+        var coin = coins.find(function(coin){
+          return coin.symbol.toLowerCase() === icon
+        })
+        var name = coin ? coin.name.toLowerCase() : icon
+        // Construct icon
+        if (icons.indexOf("data-icon=\"" + icon + "\"") === -1) {
+          icons += "<div class=\"col-6 col-sm-4 col-lg-3 col-xl-2 text-left icon\">";
+          icons +=   "<a href=\"#" + icon + "\" class=\"bg-light text-muted text-uppercase d-block p-4\" data-toggle=\"modal\" data-target=\"#infoIcon\" data-icon=\"" + icon + "\" data-name=\"" + name + "\">";
+          icons +=     "<img class=\"mr-2\" src=\"svg/" + iconDefault + "/" + icon + ".svg\" alt=\"" + icon + "\" onerror=\"error(this);\">" + icon;
+          icons +=   "</a>";
+          icons += "</div>";
+          count++;
+        }
+      });
 
-    var icons = "";
+      // Display
-    var count = 0;
+      $(".row.icons").html(icons);
-    $.each(data.icons, function(key, val) {
 
-      // Construct icon
+      // Hover
-      if (icons.indexOf("data-icon=\"" + val + "\"") == -1) {
+      $(".icon").hover(function() {
-        icons += "<div class=\"col-6 col-sm-4 col-lg-3 col-xl-2 text-left icon\">";
+        changeFolder($(this), iconDefault, iconHover);
-        icons +=   "<a href=\"#" + val + "\" class=\"bg-light text-muted text-uppercase d-block p-4\" data-toggle=\"modal\" data-target=\"#infoIcon\" data-icon=\"" + val + "\">";
+      });
-        icons +=     "<img class=\"mr-2\" src=\"svg/" + iconDefault + "/" + val + ".svg\" alt=\"" + val + "\" onerror=\"error(this);\">" + val;
+
-        icons +=   "</a>";
+      // Mouseleave
-        icons += "</div>";
+      $(".icon").mouseleave(function() {
-        count++;
+        changeFolder($(this), iconHover, iconDefault );
-      }
+      });
+
+      // Count icons
+      $(".count-cryptos").text(count);
 
     });
-
-    // Display
-    $(".row.icons").html(icons);
-
-    // Hover
-    $(".icon").hover(function() {
-      changeFolder($(this), iconDefault, iconHover);
-    });
-
-    // Mouseleave
-    $(".icon").mouseleave(function() {
-      changeFolder($(this), iconHover, iconDefault );
-    });
-
-    // Count icons
-    $(".count-cryptos").text(count);
-
   });
 
 
@@ -167,6 +171,7 @@ $(document).ready(function() {
       // Filter icons
       $(".icon").css("display", "none");
       $("a[data-icon*='" + $(target).val().toLowerCase() + "']").parent().css("display", "block");
+      $("a[data-name*='" + $(target).val().toLowerCase() + "']").parent().css("display", "block");
 
       // Close
       $("<div class=\"close-search\"></div>").insertAfter(target);

js/main.min.js

@@ -1 +1 @@
-function error(t){$(t).parent().parent().remove()}$(document).ready(function(){function t(t,e,o){var t=$(t).find("img"),a=$(t).attr("src").replace(e,o);$(t).attr("src",a)}function e(t){$(t).val().length>0?($(".icon").css("display","none"),$("a[data-icon*='"+$(t).val().toLowerCase()+"']").parent().css("display","block"),$('<div class="close-search"></div>').insertAfter(t),$(".close-search").click(function(){o(t)})):o(t)}function o(t){$(".close-search").remove(),$(".icon").css("display","block"),$(t).val("")}var a=["svg","128","32","32@2x"],c=["color","black","icon","white"];$("form .search").on("input",function(){e($(this))}),$("form").submit(function(t){t.preventDefault(),e($("form .search"))}),$.getJSON("manifest.json",function(e){var o="",a=0;$.each(e.icons,function(t,e){-1==o.indexOf('data-icon="'+e+'"')&&(o+='<div class="col-6 col-sm-4 col-lg-3 col-xl-2 text-left icon">',o+='<a href="#'+e+'" class="bg-light text-muted text-uppercase d-block p-4" data-toggle="modal" data-target="#infoIcon" data-icon="'+e+'">',o+='<img class="mr-2" src="svg/black/'+e+'.svg" alt="'+e+'" onerror="error(this);">'+e,o+="</a>",o+="</div>",a++)}),$(".row.icons").html(o),$(".icon").hover(function(){t($(this),"black","color")}),$(".icon").mouseleave(function(){t($(this),"color","black")}),$(".count-cryptos").text(a)}),$("#infoIcon").on("show.bs.modal",function(t){var e=$(t.relatedTarget),o=$(this),n=e.data("icon"),r="",i=0,l=0;for(r+='<table class="table info-icon mb-0">',r+="<thead>",r+="<tr>",r+='<th class="text-center text-uppercase align-middle"><h5 class="mb-0">'+n+"</h5></th>";c[l];){s=a[i].replace("@","-");r+='<th class="variant-'+c[l]+' text-center font-weight-light text-muted align-middle">'+c[l]+"</th>",l++}for(l=0,r+="</tr>",r+="</thead>",r+="<tbody>";a[i];){var s;if(r+="<tr>",r+='<th class="format-'+(s=a[i].replace("@","-"))+' text-center font-weight-light text-muted align-middle" scope="row">'+a[i]+"</th>","svg"==a[i])d=".svg";else if("32@2x"==a[i])d="@2x.png";else var d=".png";for(;c[l];)r+='<td class="format-'+s+" variant-"+c[l]+' text-center">',r+='<img src="'+a[i]+"/"+c[l]+"/"+n+d+'" alt="'+n+'">',r+="</td>",l++;l=0,i++,r+="</tr>"}r+="</tbody>",r+="</table>",o.find(".modal-title").text(n),o.find(".modal-body").html(r)})});
+

manifest.json

@@ -1,297 +1,296 @@
 {
-  "icons": {
+  "icons": [
-    "act": "act",
+    "act",
-    "ada": "ada",
+    "ada",
-    "adx": "adx",
+    "adx",
-    "ae": "ae",
+    "ae",
-    "agi": "agi",
+    "agi",
-    "agrs": "agrs",
+    "agrs",
-    "aion": "aion",
+    "aion",
-    "amb": "amb",
+    "amb",
-    "amp": "amp",
+    "amp",
-    "ant": "ant",
+    "ant",
-    "appc": "appc",
+    "appc",
-    "ardr": "ardr",
+    "ardr",
-    "ark": "ark",
+    "ark",
-    "arn": "arn",
+    "arn",
-    "ast": "ast",
+    "ast",
-    "atm": "atm",
+    "atm",
-    "bat": "bat",
+    "bat",
-    "bay": "bay",
+    "bay",
-    "bcc": "bcc",
+    "bcc",
-    "bcd": "bcd",
+    "bcd",
-    "bch": "bch",
+    "bch",
-    "bcn": "bcn",
+    "bcn",
-    "bco": "bco",
+    "bco",
-    "bcpt": "bcpt",
+    "bcpt",
-    "bdl": "bdl",
+    "bdl",
-    "bela": "bela",
+    "bela",
-    "bix": "bix",
+    "bix",
-    "blcn": "blcn",
+    "blcn",
-    "blk": "blk",
+    "blk",
-    "block": "block",
+    "block",
-    "blz": "blz",
+    "blz",
-    "bnb": "bnb",
+    "bnb",
-    "bnt": "bnt",
+    "bnt",
-    "bnty": "bnty",
+    "bnty",
-    "bpt": "bpt",
+    "bpt",
-    "bq": "bq",
+    "bq",
-    "bqx": "bqx",
+    "bqx",
-    "brd": "brd",
+    "brd",
-    "btc": "btc",
+    "btc",
-    "btcd": "btcd",
+    "btcd",
-    "btcz": "btcz",
+    "btcz",
-    "btg": "btg",
+    "btg",
-    "btm": "btm",
+    "btm",
-    "bts": "bts",
+    "bts",
-    "btx": "btx",
+    "btx",
-    "burst": "burst",
+    "burst",
-    "cdn": "cdn",
+    "cdn",
-    "cdt": "cdt",
+    "cdt",
-    "clam": "clam",
+    "clam",
-    "cloak": "cloak",
+    "cloak",
-    "cmt": "cmt",
+    "cmt",
-    "cnd": "cnd",
+    "cnd",
-    "cnx": "cnx",
+    "cnx",
-    "cny": "cny",
+    "cny",
-    "cob": "cob",
+    "cob",
-    "cred": "cred",
+    "cred",
-    "crpt": "crpt",
+    "crpt",
-    "cvc": "cvc",
+    "cvc",
-    "dash": "dash",
+    "dash",
-    "dat": "dat",
+    "dat",
-    "data": "data",
+    "data",
-    "dbc": "dbc",
+    "dbc",
-    "dcn": "dcn",
+    "dcn",
-    "dcr": "dcr",
+    "dcr",
-    "dent": "dent",
+    "dent",
-    "dew": "dew",
+    "dew",
-    "dgb": "dgb",
+    "dgb",
-    "dgd": "dgd",
+    "dgd",
-    "dlt": "dlt",
+    "dlt",
-    "dnt": "dnt",
+    "dnt",
-    "doge": "doge",
+    "doge",
-    "drgn": "drgn",
+    "drgn",
-    "dta": "dta",
+    "dta",
-    "dtr": "dtr",
+    "dtr",
-    "ebst": "ebst",
+    "ebst",
-    "edg": "edg",
+    "edg",
-    "edo": "edo",
+    "edo",
-    "edoge": "edoge",
+    "edoge",
-    "elf": "elf",
+    "elf",
-    "ella": "ella",
+    "ella",
-    "elix": "elix",
+    "elix",
-    "emc": "emc",
+    "emc",
-    "emc2": "emc2",
+    "emc2",
-    "eng": "eng",
+    "eng",
-    "enj": "enj",
+    "enj",
-    "equa": "equa",
+    "equa",
-    "eos": "eos",
+    "eos",
-    "etc": "etc",
+    "etc",
-    "eth": "eth",
+    "eth",
-    "ethos": "ethos",
+    "ethos",
-    "etn": "etn",
+    "etn",
-    "etp": "etp",
+    "etp",
-    "eur": "eur",
+    "eur",
-    "evx": "evx",
+    "evx",
-    "exmo": "exmo",
+    "exmo",
-    "exp": "exp",
+    "exp",
-    "fair": "fair",
+    "fair",
-    "fct": "fct",
+    "fct",
-    "fil": "fil",
+    "fil",
-    "fldc": "fldc",
+    "fldc",
-    "flo": "flo",
+    "flo",
-    "ftc": "ftc",
+    "ftc",
-    "fuel": "fuel",
+    "fuel",
-    "fun": "fun",
+    "fun",
-    "game": "game",
+    "game",
-    "gas": "gas",
+    "gas",
-    "gbp": "gbp",
+    "gbp",
-    "gbx": "gbx",
+    "gbx",
-    "gbyte": "gbyte",
+    "gbyte",
-    "gno": "gno",
+    "gno",
-    "gnt": "gnt",
+    "gnt",
-    "grc": "grc",
+    "grc",
-    "grs": "grs",
+    "grs",
-    "gto": "gto",
+    "gto",
-    "gvt": "gvt",
+    "gvt",
-    "gup": "gup",
+    "gup",
-    "gxs": "gxs",
+    "gxs",
-    "hpb": "hpb",
+    "hpb",
-    "hsr": "hsr",
+    "hsr",
-    "html": "html",
+    "html",
-    "huc": "huc",
+    "huc",
-    "hush": "hush",
+    "hush",
-    "icn": "icn",
+    "icn",
-    "icx": "icx",
+    "icx",
-    "ignis": "ignis",
+    "ignis",
-    "ink": "ink",
+    "ink",
-    "ins": "ins",
+    "ins",
-    "ion": "ion",
+    "ion",
-    "iop": "iop",
+    "iop",
-    "iost": "iost",
+    "iost",
-    "iot": "miota",
+    "iot",
-    "iota": "miota",
+    "miota",
-    "jnt": "jnt",
+    "jnt",
-    "jpy": "jpy",
+    "jpy",
-    "kcs": "kcs",
+    "kcs",
-    "kin": "kin",
+    "kin",
-    "kmd": "kmd",
+    "kmd",
-    "knc": "knc",
+    "knc",
-    "krb": "krb",
+    "krb",
-    "lbc": "lbc",
+    "lbc",
-    "lend": "lend",
+    "lend",
-    "link": "link",
+    "link",
-    "lkk": "lkk",
+    "lkk",
-    "lrc": "lrc",
+    "lrc",
-    "lsk": "lsk",
+    "lsk",
-    "ltc": "ltc",
+    "ltc",
-    "lun": "lun",
+    "lun",
-    "maid": "maid",
+    "maid",
-    "mana": "mana",
+    "mana",
-    "mcap": "mcap",
+    "mcap",
-    "mco": "mco",
+    "mco",
-    "mds": "mds",
+    "mds",
-    "med": "med",
+    "med",
-    "miota": "miota",
+    "miota",
-    "mkr": "mkr",
+    "mkr",
-    "mln": "mln",
+    "mln",
-    "mnx": "mnx",
+    "mnx",
-    "mona": "mona",
+    "mona",
-    "mth": "mth",
+    "mth",
-    "mtl": "mtl",
+    "mtl",
-    "music": "music",
+    "music",
-    "nano": "nano",
+    "nano",
-    "nav": "nav",
+    "nav",
-    "nas": "nas",
+    "nas",
-    "nebl": "nebl",
+    "nebl",
-    "neo": "neo",
+    "neo",
-    "neos": "neos",
+    "neos",
-    "ndz": "ndz",
+    "ndz",
-    "ngc": "ngc",
+    "ngc",
-    "nlc2": "nlc2",
+    "nlc2",
-    "nlg": "nlg",
+    "nlg",
-    "nmc": "nmc",
+    "nmc",
-    "nuls": "nuls",
+    "nuls",
-    "nxs": "nxs",
+    "nxs",
-    "nxt": "nxt",
+    "nxt",
-    "oax": "oax",
+    "oax",
-    "omg": "omg",
+    "omg",
-    "omni": "omni",
+    "omni",
-    "ost": "ost",
+    "ost",
-    "ox": "ox",
+    "ox",
-    "pac": "pac",
+    "pac",
-    "part": "part",
+    "part",
-    "pasl": "pasl",
+    "pasl",
-    "pay": "pay",
+    "pay",
-    "pink": "pink",
+    "pink",
-    "pirl": "pirl",
+    "pirl",
-    "pivx": "pivx",
+    "pivx",
-    "plr": "plr",
+    "plr",
-    "poe": "poe",
+    "poe",
-    "poly": "poly",
+    "poly",
-    "pot": "pot",
+    "pot",
-    "powr": "powr",
+    "powr",
-    "ppc": "ppc",
+    "ppc",
-    "ppp": "ppp",
+    "ppp",
-    "ppt": "ppt",
+    "ppt",
-    "prl": "prl",
+    "prl",
-    "pura": "pura",
+    "pura",
-    "qash": "qash",
+    "qash",
-    "qiwi": "qiwi",
+    "qiwi",
-    "qlc": "qlc",
+    "qlc",
-    "qrl": "qrl",
+    "qrl",
-    "qsp": "qsp",
+    "qsp",
-    "qtum": "qtum",
+    "qtum",
-    "r": "r",
+    "r",
-    "rads": "rads",
+    "rads",
-    "rcn": "rcn",
+    "rcn",
-    "rdd": "rdd",
+    "rdd",
-    "rdn": "rdn",
+    "rdn",
-    "rep": "rep",
+    "rep",
-    "req": "req",
+    "req",
-    "rhoc": "rhoc",
+    "rhoc",
-    "ric": "ric",
+    "ric",
-    "rise": "rise",
+    "rise",
-    "rlc": "rlc",
+    "rlc",
-    "rpx": "rpx",
+    "rpx",
-    "rub": "rub",
+    "rub",
-    "salt": "salt",
+    "salt",
-    "san": "san",
+    "san",
-    "sbd": "sbd",
+    "sbd",
-    "sberbank": "sberbank",
+    "sberbank",
-    "sc": "sc",
+    "sc",
-    "sky": "sky",
+    "sky",
-    "sls": "sls",
+    "sls",
-    "smart": "smart",
+    "smart",
-    "sngls": "sngls",
+    "sngls",
-    "snm": "sonm",
+    "snt",
-    "snt": "snt",
+    "spank",
-    "spank": "spank",
+    "sphtx",
-    "sphtx": "sphtx",
+    "srn",
-    "srn": "srn",
+    "start",
-    "start": "start",
+    "steem",
-    "steem": "steem",
+    "storj",
-    "storj": "storj",
+    "storm",
-    "storm": "storm",
+    "strat",
-    "strat": "strat",
+    "sub",
-    "sub": "sub",
+    "sys",
-    "sys": "sys",
+    "taas",
-    "taas": "taas",
+    "tau",
-    "tau": "tau",
+    "tel",
-    "tel": "tel",
+    "theta",
-    "theta": "theta",
+    "tix",
-    "tix": "tix",
+    "tkn",
-    "tkn": "tkn",
+    "tnb",
-    "tnb": "tnb",
+    "tnc",
-    "tnc": "tnc",
+    "tnt",
-    "tnt": "tnt",
+    "trig",
-    "trig": "trig",
+    "trx",
-    "trx": "trx",
+    "tzc",
-    "tzc": "tzc",
+    "ubq",
-    "ubq": "ubq",
+    "unity",
-    "unity": "unity",
+    "usd",
-    "usd": "usd",
+    "usdt",
-    "usdt": "usdt",
+    "utk",
-    "utk": "utk",
+    "ven",
-    "ven": "ven",
+    "veri",
-    "veri": "veri",
+    "via",
-    "via": "via",
+    "vibe",
-    "vibe": "vibe",
+    "vivo",
-    "vivo": "vivo",
+    "vrc",
-    "vrc": "vrc",
+    "vtc",
-    "vtc": "vtc",
+    "wabi",
-    "wabi": "wabi",
+    "waves",
-    "waves": "waves",
+    "wax",
-    "wax": "wax",
+    "wgr",
-    "wgr": "wgr",
+    "wpr",
-    "wpr": "wpr",
+    "wtc",
-    "wtc": "wtc",
+    "xas",
-    "xas": "xas",
+    "xbc",
-    "xbc": "xbc",
+    "xby",
-    "xby": "xby",
+    "xcp",
-    "xcp": "xcp",
+    "xdn",
-    "xdn": "xdn",
+    "xem",
-    "xem": "xem",
+    "xlm",
-    "xlm": "xlm",
+    "xmg",
-    "xmg": "xmg",
+    "xmr",
-    "xmr": "xmr",
+    "xmy",
-    "xmy": "xmy",
+    "xp",
-    "xp": "xp",
+    "xpa",
-    "xpa": "xpa",
+    "xpm",
-    "xpm": "xpm",
+    "nano",
-    "xrb": "nano",
+    "xrp",
-    "xrp": "xrp",
+    "xtz",
-    "xtz": "xtz",
+    "xuc",
-    "xuc": "xuc",
+    "xvc",
-    "xvc": "xvc",
+    "xvg",
-    "xvg": "xvg",
+    "xzc",
-    "xzc": "xzc",
+    "yoyow",
-    "yoyow": "yoyow",
+    "zcl",
-    "zcl": "zcl",
+    "zec",
-    "zec": "zec",
+    "zen",
-    "zen": "zen",
+    "zil",
-    "zil": "zil",
+    "zrx"
-    "zrx": "zrx"
+  ]
-  }
 }