<html> <head> <title>Speed Dial</title> <link rel="icon" href="https://pube.tk/favicon.ico" type="image/x-icon" /> <script> /* Configuration */ var sortSubcategories = true; // Sort URLs alphabetically var singleExpand = true; // Allow expanding one category at a time var rounding = 8; // Cryptocurrency rounding to n-th digit var cryptos = // List of cryptos (their IDs on CoinMarketCap) and respective values { 'bitcoin' : 0.12345678, 'ethereum' : 0.12345678, 'monero' : 0.12345678, }; var sites = // JSON tree structure of 'Group' : { 'Name' : 'URL' } { 'Shopping' : { 'eBay' : 'https://www.ebay.com/', 'Amazon' : 'https://www.amazon.com/', }, 'Search' : { 'DuckDuckGo' : 'https://duckduckgo.com/', 'Qwant' : 'https://www.qwant.com/', }, 'Entertainment': { 'asdf' : 'http://asdf.com/', }, 'Videos': { 'HookTube' : 'http://hooktube.com', } }; </script> <style> body { background-color: #151515; color: #bbb; font-family: Arial; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; } a { color: #BB7D38; text-decoration: none; display:block; } a:hover { color: #FF8500; } .hidden { display: none; } .navBlock { display: inline-block; vertical-align: middle; } .expandLink { font-weight: bold; } .hidden > a { color: #bbb; } #mainNav { margin: auto; text-align: center; position: relative; top: 50%; transform: translateY(-50%); display: none; } #cryptoTicker { position: fixed; bottom: 0; right: 0; display: none; } #cryptoTable td { padding: 0px 15px; text-align: center; font-family: "Lucida Console", Monaco, monospace; font-size: 0.6em; } </style> <script src="http://code.jquery.com/jquery-3.2.1.min.js"></script> <!-- Gets cached, can be replaced with Google hosted library --> <script> $(document).ready(function(){ // Subcategory sort if(sortSubcategories) { jQuery.each(sites, function(group, values) { unordered = this; const ordered = {}; Object.keys(unordered).sort().forEach(function(key) { ordered[key] = unordered[key]; }); sites[group] = ordered; }); } // Navigation menu jQuery.each(sites, function(group, values) { urlStr = ""; jQuery.each(values, function(name, url) { urlStr += '<a href="'+url+'">'+name+'</a>'; }); if($('#mainNav').children().length) { $('#mainNav').append(' :: '); } $('#mainNav').append('<div class="navBlock"><a href="#" class="expandLink">'+group+'</a><div class="hidden">'+urlStr+'</div></div>'); }); $("#mainNav").fadeIn(); // Subcategory URL expansion $('.expandLink').bind('click', function () { if(singleExpand && $(this).siblings().is(":hidden")) $('.expandLink').siblings().slideUp(); // "Closes" all categories $(this).siblings().slideToggle(200); }); // Ticker table (Async) var usdtotal = 0.0; jQuery.each(cryptos, function(key, value) { $.ajax({ url: "https://api.coinmarketcap.com/v1/ticker/"+key+"/", async: false, cache: true, success: function(data) { usdtotal += usdval = (value*parseFloat(data[0].price_usd)); $('#cryptoTable tr:last').after( '<tr><td>'+ data[0].rank+ '</td><td><a href="https://coinmarketcap.com/currencies/'+key+'/">'+ data[0].symbol+ '</a></td><td>'+ value.toFixed(rounding)+ '</td><td>'+ parseFloat(data[0].price_usd).toFixed(2)+ '</td><td>'+ usdval.toFixed(2)+ '</tr></tr>'); } }); }); $('#cryptoTable tr:last').after('<tr><td></td><td></td><td></td><td></td><td>'+usdtotal.toFixed(2)+'</td></tr>') $("#cryptoTicker").fadeIn(); }); </script> <meta name="Abhorrent_Anger" content="Speed Dail"> <meta http-equiv="Cache-control" content="public"> </head> <body bgcolor="#151515"> <div id="cryptoTicker"> <table id="cryptoTable"> <tr><td>Rank</td><td>Ticker</td><td>Hold</td><td>USD</td><td>Hold USD</td></tr> </table> </div> <div id="mainNav"> </div> </body> </html>