Viewing Program

Program Data

Program thumbnail for "{props.program.title}"

Title	Spend Elon Musk's Money
ID	6520442229669888
Created	3 years ago, 1641491255600
Updated	3 years ago, 1641491297666
Code	<!DOCTYPE html> <html> <!-- Have fun spending money of the richest person in the world! Plus don't forget to sub the awesome coders: Leaf: https://www.khanacademy.org/computer-programming/leafs-subscription-page/5965098333454336 JSCoder: https://www.khanacademy.org/computer-programming/subscribe/6673555329073152 --> <head> <meta charset="utf-8"> <title>Spend Elon Musk's Money</title> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Lato:wght@400&family=Montserrat&family=Poppins:wght@500&display=swap" rel="stylesheet"> <div class="sass-style"> $f1: 'Lato'; $f2: 'Montserrat'; $f3: 'Poppins'; $c1: #f1f2f6; * { margin: 0; box-sizing: border-box; } body { background-color: $c1; overflow-x: hidden; } header { background-color: #fff; padding: 20px; font-family: $f3; border-bottom: 1px solid #c4c7cc; a { text-decoration: none; color: inherit; } } .main { margin: 30px; padding: 20px; background-color: #fff; h1, h2, h3, h4, h5 { font-family: $f3; } h1 { text-align: center; } h2 { text-align: center; } h3 { text-align: center; } p, span, i, b, ul, li { font-family: $f1; } } .center { display: flex; align-items: center; justify-content: center; } .center img { width: 7em; border-radius: 76px; } #avail { background-image: linear-gradient(rgb(189, 177, 227), rgb(115, 230, 136)); padding: 10px; color: #000; font-family: $f2; text-align: center; position: relative; } .sell, .buy { padding: 10px; font-family: $f2; font-weight: bold; font-size: 1.1em; margin: 10px; border: none; outline: none; border-radius: 10px; cursor: pointer; } .buy { background-image: linear-gradient(rgb(189, 177, 227), rgb(115, 230, 136)); } .sell { color: #fff; background-image: linear-gradient(rgb(204, 41, 63), rgb(204, 26, 26)); } input { padding: 10px; margin: 10px; font-family: $f2; font-size: 1.1em; text-align: center; } .cost { color: rgb(28, 156, 49); } </div> </head> <body> <header> <h2><a href="https://www.khanacademy.org/computer-programming/leafs-subscription-page/5965098333454336" target="_blank">Leaf</a>      <a href="https://www.khanacademy.org/computer-programming/subscribe/6673555329073152" target="_blank">JSCoder</a> </h2> <h2 style="position:fixed;top:0;right: 0;z-index:99;"><input id="ava" type="number" value="300000000000" min="0" max="300000000000" readonly style="border-radius: 61% 39% 70% 30% / 30% 63% 37% 70% ;"></h2> </header> <div class="main"> <div class="center"> <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/49/Elon_Musk_2015.jpg/408px-Elon_Musk_2015.jpg" alt="EM"> </div> <br> <h1>Spend Elon Musk's Money</h1> </div> <div id="avail"> <h2>Initial : $300,000,000,000</h2> <br><br> <h2>Available : (On the top right)</h2> </div> <div id="things"> </div> <div class="center main" id="xx" style="border-radius: 82% 18% 89% 11% / 19% 78% 22% 81%;border: 2px solid rgb(128, 56, 128)"> <h2>Your Receipt</h2> <br> <div id="product"></div> </div> <div id="receipt"></div> <div id="total"> </div> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <!-- KA-SASS from @stranothus/KASASS on GitHub but copy/pasted for accessibility --> <!-- Import code = <script src = "https://cdn.jsdelivr.net/gh/stranothus/KASASS/importless.js"></script> --> <script type="application/javascript"> function Sassify(style) { style = style.replace(/[^:]\/\/([^\n]+)/gm, "\/$1/"); style = style.replace(/@keyframes\s+([^\s{]+)\s+{/gi, "@keyframes $1 CURLYBRACKET_HERE"); style = style.replace(/@media\s([^{]+){/gi, "@media $1 CURLYBRACKET_HERE"); let variables = style.match(/(?:[^:]\|^)\s\$[^\s:]+\s:\s[^;]+/g); style = style.replace(/(?:[^:]\|^)\s\$[^\s:]+\s:\s[^;]+;/g, ""); if (variables) { variables = variables.map(v => v.replace(/^;/, "").trim().split(/\s:\s/)); for (var i = 0; i < variables.length; i++) { style = style.replace(new RegExp("(:[^;])\\" + variables[i][0], "g"), "$1" + variables[i][1]).replace(new RegExp("(,\\s)\\" + variables[i][0], "g"), "$1" + variables[i][1]).replace(new RegExp("(\$\\s)\\" + variables[i][0], "g"), "$1" + variables[i][1]); } } let inheritances = style.match(/%([^\s{]+)\s{\s([^}]+)}/g); if (inheritances) { inheritances = inheritances.map(v => v.split(/\s{\s/).map(v => v.replace(/\s}/, ""))); style = style.replace(/%[^{\s]+[\s]{[^}]+}/g, ""); for (var i = 0; i < inheritances.length; i++) { style = style.replace(new RegExp("@extend\\s" + inheritances[i][0] + "\\s;", "g"), inheritances[i][1]); } } style = style.replace(/:(\s)(-?\d+[a-z%]+\s[+-\/][^;]+)\s/gi, ":$1calc($2)"); function nest(txt) { let matched = txt.match(/[^}\/]+{[^{}]+{[^}]+}/g); let parentSelector = matched.map(v => v.match(/(^\|;)[^{;]+{/g).slice(0, -1).join(" ").replace(/;\|{/g, "").replace(/\s+/g, " ").trim()); let nested = matched.map(v => v.replace(/^[^{]+{[\s\S]+;\s([^{;]+){/g, "$1{")); let without = txt; for (let i = 0; i < nested.length; i++) { without = without.replace(new RegExp(nested[i].replace(/([\?\\$\($\/])/g, "\\$1")), ""); } let full = parentSelector.map((v, i) => v + " " + nested[i]); let final = without + full.join(""); return final.replace(/\s+:/g, ":"); } let nestLimit = 100; while (style.match(/[^}]+{[^{}]+{[^}]+}/g) && nestLimit) { style = nest(style); nestLimit--; } let mixin_at = /@mixin\s(\w+)(\s\|\s$.+$\|$.+$)\s{([^}]+)}/gms; let mixMatch = style.match(mixin_at); if (!!mixMatch) { let mixMatch_2 = mixMatch.map(x => x.split(/\s{\s/gms).toString().split(/\s}/).map(x => x.replace(/\s}/, ""))); let x = mixMatch_2.toString().split(","); let names = x.filter(v => v.includes("@mixin")).map(v => v.replace(/@mixin\s/, "").replace(/$[^$]+\)/, "").trim()); for (let i = 0; i < names.length; i++) { let includes = style.match(new RegExp("@include\\s+" + names[i] + "[^;]+;")); let mixin = style.match(new RegExp("@mixin\\s+" + names[i] + "[^}]+}"))[0]; let variables = mixin.match(/$[^$]\)/)[0].replace(/(?:$\|$)/g, "").split(/\.\s/); if (includes) { for (let e = 0; e < includes.length; e++) { let include = includes[e]; let parameters = include.match(/$[^$]\)/)[0].replace(/(?:$\|$)/g, "").split(/\.\s/); let replaceWith = mixin.match(/{[^{]}/)[0].replace(/(?:{\|})/g, "").trim(); for (let j = 0; j < variables.length; j++) { replaceWith = replaceWith.replace(new RegExp(variables[j].replace(/\$/g, "\\$"), "g"), parameters[j]); } style = style.replace(new RegExp(include.replace(/(\.\|$\|$)/g, "\\$1")), replaceWith); } } style = style.replace(new RegExp(mixin.replace(/(\.\|$\|$\|\$)/g, "\\$1")), ""); } } const find_abs = /:\sabs$(-\|\+\|)\s(\d+)(px\|cm\|mm\|in\|pt\|pc\|em\|ex\|ch\|rem\|vw\|vh\|vmin\|vmax\|%)\s$;/gi; style = style.replace(find_abs, ": $2$3;"); style = style.replace(/CURLYBRACKET_HERE/g, "{"); return style; } var SassStyles = document.querySelectorAll(".sass-style"); SassStyles.forEach(element => { let sassified = Sassify(element.innerHTML); let style = document.createElement("style"); style.innerText = sassified; element.parentElement.removeChild(element); document.head.appendChild(style); }); </script> <script type> console.log("JSCoder IS cool Sub Him!"); var arrOfThings = [ { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/9/9a/Big_Mac_hamburger.jpg/694px-Big_Mac_hamburger.jpg', 'name': 'Big Mac', 'cost': '$2', 'tag': '#burgerForever' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/d/d6/Pizza_pan.jpg', 'name': 'Pan Pizza', 'cost': '$5', 'tag': '#pizzaIsBest' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/4/47/Flip_flop.jpg/800px-Flip_flop.jpg', 'name': 'Flip Flops', 'cost': '$3', 'tag': '#TheBestFootwear' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/f/f6/15-09-26-RalfR-WLC-0098.jpg/170px-15-09-26-RalfR-WLC-0098.jpg', 'name': 'Coca Cola Bottles Pack', 'cost': '$20', 'tag': '#Pepsi' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/a/a8/A_classic_Black_pair_of_Converse_All_Stars_resting_on_the_Black_%26_White_Ed._Shoebox_%281998-2002%29.JPG/450px-A_classic_Black_pair_of_Converse_All_Stars_resting_on_the_Black_%26_White_Ed._Shoebox_%281998-2002%29.JPG', 'name': 'Shoes', 'cost': '$90', 'tag': '#LiveShoes' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/4/45/Red_High_Heel_Pumps.jpg', 'name': 'High Heels', 'cost': '$90', 'tag': '#Noice' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/6/67/NewNetflixLogo.png', 'name': 'A year of Netflix', 'cost': '$100', 'tag': '#Easy' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/3/3c/Amazon_Echo_Dot_%2827716286638%29.jpg/800px-Amazon_Echo_Dot_%2827716286638%29.jpg', 'name': 'Amazon Echo', 'cost': '$100', 'tag': '#GoogleAssisantIsTheBest' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/9/9c/Pc_Gaming_Modificado.jpg', 'name': 'Gaming PC', 'cost': '$1,400', 'tag': '#ILoveThem' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/1/1d/1-month-old_kittens_32.jpg/800px-1-month-old_kittens_32.jpg', 'name': 'Kitten', 'cost': '$1,500', 'tag': '#Catsuwu' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Staffordshire-bull-terrier-puppy-fawn-2166763.jpg/640px-Staffordshire-bull-terrier-puppy-fawn-2166763.jpg', 'name': 'Puppy', 'cost': '$1,500', 'tag': '#uwu' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/b/ba/Apple_iPhone_13_Pro.jpg/800px-Apple_iPhone_13_Pro.jpg', 'name': 'iPhone 13 Pro Max', 'cost': '$2,000', 'tag': '#AppleLol' }, { 'img': 'https://upload.wikimedia.org/wikipedia/en/thumb/9/9f/Cyberpunk_2077_box_art.jpg/220px-Cyberpunk_2077_box_art.jpg', 'name': 'Cyberpunk 2077(Xbox one)', 'cost': '$2,500', 'tag': '#BestGame' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/6/64/At_the_ring.jpg/800px-At_the_ring.jpg', 'name': 'Acre of land', 'cost': '$7,000', 'tag': '#wow' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/6/63/Pink_diamond_engagement_ring_by_1791_Diamond.jpg', 'name': 'Diamond Ring', 'cost': '$10,000', 'tag': '#Beautiful' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/f/f5/Apple_airpods_pro.jpg/745px-Apple_airpods_pro.jpg', 'name': 'AirPods 3rd Gen', 'cost': '$20,000', 'tag': '#AgainApple' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/3/35/Mercedes-Benz_S_320_CDI_4MATIC_L_%28V_221%29_%E2%80%93_Frontansicht_%281%29%2C_30._August_2011%2C_D%C3%BCsseldorf.jpg/800px-Mercedes-Benz_S_320_CDI_4MATIC_L_%28V_221%29_%E2%80%93_Frontansicht_%281%29%2C_30._August_2011%2C_D%C3%BCsseldorf.jpg', 'name': 'Mercedes-Benz E 350 Sedan', 'cost': '$60,000', 'tag': '#Woah' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/b/b0/2020_Tesla_Model_Y%2C_front_8.1.20.jpg/1024px-2020_Tesla_Model_Y%2C_front_8.1.20.jpg', 'name': 'Tesla', 'cost': '$75,000', 'tag': '#MyFavCar' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/9/96/Lamborghini_in_Nagoya.jpg/800px-Lamborghini_in_Nagoya.jpg', 'name': 'Lamborghini', 'cost': '$200,000', 'tag': '#IGotMelted' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/0/02/Zwei_Goldbarren.JPG', 'name': 'Gold Bar', 'cost': '$700,000', 'tag': '#11%IfYouKnow' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/2/2a/Patek-Philippe_MG_2586.jpg/800px-Patek-Philippe_MG_2586.jpg', 'name': 'MAD Paris customised pre-owned Patek Philippe Nautilus 5980', 'cost': '$730,000', 'tag': '#JustAWatch' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/Mcdonalds_yecxon.jpg/640px-Mcdonalds_yecxon.jpg', 'name': 'McDonalds Franchise', 'tag': '#burgersForever', 'cost': '$1,500,000' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/a/af/Palais_du_Luxembourg%2C_South_View_140116_1.jpg/800px-Palais_du_Luxembourg%2C_South_View_140116_1.jpg', 'name': 'Mansion', 'tag': '#beauty', 'cost': '$45,000,000' }, { 'img': 'https://upload.wikimedia.org/wikipedia/en/b/bc/Interstellar_film_poster.jpg', 'name': 'Make a movie', 'cost': '$100,000,000', 'tag': '#manyWoods' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/4/4e/Boeing_787_N1015B_ANA_Airlines_%2827611880663%29_%28cropped%29.jpg/300px-Boeing_787_N1015B_ANA_Airlines_%2827611880663%29_%28cropped%29.jpg', 'name': 'Boeing 747', 'tag': '#woooosh', 'cost': '$150,000,000' }, { 'img': 'https://upload.wikimedia.org/wikipedia/en/thumb/9/93/Burj_Khalifa.jpg/320px-Burj_Khalifa.jpg', 'name': 'Skyscraper', 'tag': '#BurjKhalifa', 'cost': '$850,000,000' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/f/f2/Queen_Elizabeth_Kreuzfahrtschiff_%28203664459%29.jpeg/800px-Queen_Elizabeth_Kreuzfahrtschiff_%28203664459%29.jpeg', 'name': 'Cruise Ship', 'tag': '#expensivelyExpensive', 'cost': '$930,000,000' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/4/4a/Mumbai_03-2016_19_Antilia_Tower.jpg/800px-Mumbai_03-2016_19_Antilia_Tower.jpg', 'name': 'Antilia', 'tag': '#MostExpensiveHouse', 'cost': '$2,600,000,000' }, { 'img': 'https://upload.wikimedia.org/wikipedia/commons/thumb/6/69/PositronDiscovery.jpg/220px-PositronDiscovery.jpg', 'name': 'Anti-matter', 'tag': '#youCantBuy<br><b style=\'color:red;\'>#don\'tBuy_youWillGoNegative</b>', 'cost': '$63,000,000,000,000' } ]; for (var i = 0; i < arrOfThings.length; i++) { // do stuff here :) var el = document.createElement('div'); el.setAttribute('class', 'main'); var cn = arrOfThings[i].cost.substring(1); var cnn = parseFloat(cn.replace(/,/g, '')); var ele = document.getElementById('things'); var id = arrOfThings[i].tag.substring(1); var ntostore = arrOfThings[i].name; el.innerHTML = ` <div class="card"> <div class="center"><img src="${arrOfThings[i].img}" alt="img"></div> <h2>${arrOfThings[i].name}</h2> <p style="text-align:center;"><i>${arrOfThings[i].tag}</i></p> <br> <h3 class="cost">${arrOfThings[i].cost}</h3> <div class="center"> <button id="sl" onclick="sell('${id}', '${cnn}')" class="sell">Sell</button> <input type="number" min="0" value="0" id="${arrOfThings[i].tag.substring(1)}" readonly> <button onclick="buy('${id}', '-${cnn}', '${ntostore}')" class="buy">Buy</button> </div> </div> `; ele.appendChild(el); } var products = Array(); var tst = Array(); var result = Array(); function buy(arg, amount, name) { var inar = document.getElementById(arg); inar.value++; document.getElementById("ava").value = +document.getElementById("ava").value + +amount; products.push({ "name": name, "amount": +amount.substring(1) }); tst.push(name + " --> Cost $" + +amount.substring(1)); var noDuplicates = [...new Set(tst)]; result = noDuplicates.map(primaryValue => ({ value: primaryValue, occurances: tst .map(secondaryValue => primaryValue === secondaryValue) .filter(value => value) .length })); // document.getElementById("sl").addEventListener('click', function() { // }); var ment = document.getElementById("receipt"); ment.innerHTML = `<div style="text-align:center;"> <p style="font-family: Lato;font-weight:bold;font-size:15px;">${JSON.stringify(result) .replace(/\[/gi, '') .replace(/\]/gi, '') .replace(/\{/gi, '') .replace(/\}/gi, '') .replace(/","/gi, ' x ') .replace(/value/gi, '') .replace(/occurances/gi, '') .replace(/:/gi, '') .replace(/"/gi, '') .replace(/,/gi, '<br><br>')}</p> </div>`; } document.body.addEventListener('click', function () { document.getElementById("total").innerHTML = `<br><h1 style="color:green;font-family:poppins;text-align:center;">Amount spent - $${300000000000 - document.getElementById("ava").value}<h1>`; }); function sell(arg, amount) { const object = arrOfThings.filter(v => v.tag === "#" + arg)[0]; const index = tst.indexOf(object.name + " --> Cost $" + +object.cost.substring(1)); tst.splice(index, 1); var noDuplicates = [...new Set(tst)]; result = noDuplicates.map(primaryValue => ({ value: primaryValue, occurances: tst .map(secondaryValue => primaryValue === secondaryValue) .filter(value => value) .length })); if (document.getElementById(arg).value !== '0') { document.getElementById("ava").value = +document.getElementById("ava").value - -+amount; } document.getElementById(arg).value !== '0' ? document.getElementById(arg).value-- : document.getElementById(arg).value = 0; var ment = document.getElementById("receipt"); ment.innerHTML = `<div style="text-align:center;"> <p style="font-family: Lato;font-weight:bold;font-size:15px;">${JSON.stringify(result) .replace(/\[/gi, '') .replace(/\]/gi, '') .replace(/\{/gi, '') .replace(/\}/gi, '') .replace(/","/gi, ' x ') .replace(/value/gi, '') .replace(/occurances/gi, '') .replace(/:/gi, '') .replace(/"/gi, '') .replace(/,/gi, '<br><br>')}</p> </div>`; } </script> <script> /RELOAD*/console.log("A very awesome program by Leaf - sub to Leaf rn :)"); </script> <script src="https://cdn.jsdelivr.net/npm/html2canvas@1.0.0-rc.3/dist/html2canvas.min.js"></script> <!-- CREDIT TO BlueBird@BirdWatcher03 FOR THE AMAZING SAVE FUNCTION --> <script> var save = function(){ html2canvas(document.body,{ allowTaint : false, useCORS: true, width:579, height:566, }) .then(function(canvas){ b64Img = canvas.toDataURL(); window.top.postMessage(b64Img, "https://www.khanacademy.org/"); }); }; var handleSave = function(e) { if (JSON.parse(e.data).screenshot) { setTimeout(function() { console.log("Saving..."); save(); }, 1000) } }; window.parent.savers = window.parent.savers \|\| 0; window.parent.addEventListener('message', handleSave); window.parent.savers += 1; for (window.parent.savers; window.parent.savers > 1; window.parent.savers -= 1) { window.parent.removeEventListener('message', handleSave) } </script> <script type="application/javascript"> document.body.addEventListener("keydown", function(e) { if (e.code === "Escape") { document.body.innerHTML = ` <div style="background-color:#f1f2f6; width:100vw; height:100vh; display:grid; align-items:center; justify-content:center;"> <h1 style="font-family:Montserrat; padding:0; margin:22px; font-size:4em; position:fixed; text-align:center; bottom:0; background-image: linear-gradient(rgb(189, 177, 227), rgb(115, 230, 136));">Spend Elon Musk's Money</h1> <img style="position:fixed; top:20px;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/17/Noto_Emoji_KitKat_1f4b0.svg/640px-Noto_Emoji_KitKat_1f4b0.svg.png" width="70"> <img style="position:fixed; top:159px; right:30px;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/17/Noto_Emoji_KitKat_1f4b0.svg/640px-Noto_Emoji_KitKat_1f4b0.svg.png" width="70"> <img style="position:fixed;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/1/17/Noto_Emoji_KitKat_1f4b0.svg/640px-Noto_Emoji_KitKat_1f4b0.svg.png" width="70"> <div style="display:grid; align-items:center; justify-content:center;"> <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/4/49/Elon_Musk_2015.jpg/408px-Elon_Musk_2015.jpg" alt="EM" width="340"> </div> </div> `; } if (e.code === "Enter") { e.preventDefault(); } }); </script> </body> </html>
Folds	11,119,121,638
Fork	false
Key	ag5zfmtoYW4tYWNhZGVteXIXCxIKU2NyYXRjaHBhZBiAgIOX7MnKCww
Votes	188
Spin-Offs	98
Type	WEBPAGE
Width	400
Height	500
User Flagged	false
Origin Scratchpad	null
Hidden From Hotlist	false
Restricted Posting	false
By Child	false
Author Nick	Leaf
Author Name	leafkn
Author ID	kaid_481697903688181525808339
Author Profile Access	PUBLIC

Archive Data

Added	10 months ago, 1739458857307
Updated	10 months ago, 1739458866285
Source Deleted	unknown