From c87eb9337cde124a2b72bb9b9e3e4d4c8bb906a3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E3=83=9D=E3=83=BC=E3=83=AB=20=E3=82=A6=E3=82=A7=E3=83=83?= =?UTF-8?q?=E3=83=96?= Date: Thu, 27 Sep 2018 15:46:59 -0500 Subject: [PATCH] Only whitelisted content can be tipped via the URL bar now, and other fixes --- README.md | 4 +++ app/components/client/tour-scripts.js | 19 ++++++++++--- app/components/playground.js | 2 +- app/helpers/fetch-metadata.js | 39 ++++++++++++++++----------- app/sass/pages/_tour.scss | 5 ++++ app/sockets.js | 28 ++++++++++--------- 6 files changed, 64 insertions(+), 33 deletions(-) diff --git a/README.md b/README.md index adb8b94..1d98944 100755 --- a/README.md +++ b/README.md @@ -22,6 +22,10 @@ - [lbry/web-daemon](https://github.com/lbryio/web-daemon) - [Node](https://nodejs.org) (version >= 10) +## Notes +- **This repo will not run locally if you do not also have the LBRY app/daemon and the [web-daemon](https://github.com/lbryio/web-daemon) running.** +- When running locally and completing the tipping example in Playground, the LBC donated to a creator comes from _your_ LBC balance. Otherwise, the example will fail. On production, the donated LBC comes from LBRY. + ## Installation `npm i` diff --git a/app/components/client/tour-scripts.js b/app/components/client/tour-scripts.js index 1fd3f10..7eb7fd3 100644 --- a/app/components/client/tour-scripts.js +++ b/app/components/client/tour-scripts.js @@ -36,10 +36,21 @@ document.querySelector("body").addEventListener("click", event => { document.getElementById("fetch-claim-uri").addEventListener("keyup", event => { const key = event.keyCode ? event.keyCode : event.which; - if ( - key === 13 && - document.getElementById("fetch-claim-uri").value.length > 0 - ) fetchMetadata(1, document.getElementById("fetch-claim-uri").value); + switch(true) { + case (document.querySelector("[data-example='1']").classList.contains("active")): + if ( + key === 13 && + document.getElementById("fetch-claim-uri").value.length > 0 + ) fetchMetadata(1, document.getElementById("fetch-claim-uri").value); + break; + + case (document.querySelector("[data-example='3']").classList.contains("active")): + if ( + key === 13 && + document.getElementById("fetch-claim-uri").value.length > 0 + ) fetchMetadata(3, document.getElementById("fetch-claim-uri").value); + break; + } }); document.querySelector("body").addEventListener("keyup", event => { diff --git a/app/components/playground.js b/app/components/playground.js index db9b863..a0c5ad1 100644 --- a/app/components/playground.js +++ b/app/components/playground.js @@ -73,7 +73,7 @@ function navigation() { // TODO: Save tutorial position to localStorage data-action="tour, example 3" data-description="In the LBRY app, you can financially support your favorite creators by donating LBRY Coin (LBC). In this example, we are donating LBC in your stead." data-example="3" - data-success="Kudos You've just supported a creator with LBC (or, LBRY credits) with our own stash of LBC (you'd use your own IRL). You're basically saying, \"thanks for this great content, please continue!\" and that's awesome. You're awesome." + data-success="Kudos You've just supported a creator with LBC (or, LBRY credits) with our own stash of LBC (you'd use your own IRL). You're basically saying, 'thanks for this great content, please continue!' and that's awesome. You're awesome." > Support creators on LBRY with a tip, on us! diff --git a/app/helpers/fetch-metadata.js b/app/helpers/fetch-metadata.js index 02d22d0..c520bf5 100644 --- a/app/helpers/fetch-metadata.js +++ b/app/helpers/fetch-metadata.js @@ -92,8 +92,6 @@ module.exports = exports = (data, socket) => { body.file_path = uploadResponse.filename; return publishMeme(body).then(publishResponse => { - // let explorerNotice = ""; - if (publishResponse.error) { socket.send(JSON.stringify({ "details": "Meme publish failed", @@ -112,22 +110,12 @@ module.exports = exports = (data, socket) => { return; } - /* - if ( - publishResponse.result && - publishResponse.result.txid - ) explorerNotice = ` -

If you want proof of the tip you just gave, check it out on our blockchain explorer!

- `; - */ - const renderedCode = prism.highlight(stringifyObject(publishResponse, { indent: " ", singleQuotes: false }), prism.languages.json, "json"); return socket.send(JSON.stringify({ "example": data.example, "html": raw(`

Response

- 
${renderedCode}
`), "message": "updated html", @@ -143,6 +131,30 @@ module.exports = exports = (data, socket) => { } if (resolveMethod === "wallet_send") { + const approvedIds = [ + "3db81c073f82fd1bb670c65f526faea3b8546720", + "173412f5b1b7aa63a752e8832406aafd9f1ecb4e", + "d81bac6d49b1f92e58c37a5f633a27a45b43405e", + "b4668c0bd096317b44c40738c099b6618095e75f", + "007789cc45cbb4255cf02ba77cbf84ca8e3d7561", + "1ac47b8b3def40a25850dc726a09ce23d09e7009", + "784b3c215a6f06b663fc1aa292bcb19f29c489bb", + "758dd6497cdfc401ae1f25984738d024d47b50af", + "8a7401b88d5ed0376d98f16808194d4dcb05b284" + ]; + + if (!approvedIds.includes(claimAddress)) { + return socket.send(JSON.stringify({ + "example": data.example, + "html": raw(` +

Response

+ 
Tipping creators not in the whitelist for this example is not allowed.
+ `), + "message": "updated html", + "selector": `#example${data.example}-result` + })); + } + apiRequestMethod = "POST"; body.amount = "0.01"; // Hardcoded tip amount @@ -150,8 +162,6 @@ module.exports = exports = (data, socket) => { } return new Promise((resolve, reject) => { // eslint-disable-line - // let explorerNotice = ""; - request({ body: body, json: true, @@ -198,7 +208,6 @@ module.exports = exports = (data, socket) => { "example": data.example, "html": raw(`

Response

- 
${renderedCode}
`), "message": "updated html", diff --git a/app/sass/pages/_tour.scss b/app/sass/pages/_tour.scss index 3228495..12246df 100644 --- a/app/sass/pages/_tour.scss +++ b/app/sass/pages/_tour.scss @@ -166,6 +166,11 @@ } } + h3 { + font-size: 1.5rem; + margin-bottom: 1rem; + } + pre { font-size: 1rem; } diff --git a/app/sockets.js b/app/sockets.js index 3880864..0de1585 100644 --- a/app/sockets.js +++ b/app/sockets.js @@ -105,9 +105,9 @@ function generateContent(exampleNumber, displayTrendingContent) { try { renderedContentCollection.push(`
- ${part.name} + ${part.name} -
+
${part.value.stream.metadata.title} ${part.channel_name}
@@ -120,7 +120,7 @@ function generateContent(exampleNumber, displayTrendingContent) { renderedContentCollection.push(` `); @@ -133,7 +133,7 @@ function generateContent(exampleNumber, displayTrendingContent) { const approvedUrls = [ "LBRY#3db81c073f82fd1bb670c65f526faea3b8546720", "correlation-can-imply-causation#173412f5b1b7aa63a752e8832406aafd9f1ecb4e", - "thanos-is-the-protagonist-how-infinity#2a7f5db2678177435b1dee6c9e38e035ead450b6nyte", + "thanos-is-the-protagonist-how-infinity#2a7f5db2678177435b1dee6c9e38e035ead450b6", "epic-arcade-mode-duos-nickatnyte-molt#d81bac6d49b1f92e58c37a5f633a27a45b43405e", "political-correctness-a-force-for-good-a#b4668c0bd096317b44c40738c099b6618095e75f", "10-secrets-hidden-inside-famous-logos#007789cc45cbb4255cf02ba77cbf84ca8e3d7561", @@ -150,27 +150,29 @@ function generateContent(exampleNumber, displayTrendingContent) { rawContentCollection.push(fetchMetadata({ claim: url, method: "resolve", example: exampleNumber })); } - Promise.all(rawContentCollection).then(collection => { + return Promise.all(rawContentCollection).then(collection => { for (const part of collection) { - try { + if ( + part && + part.value && + part.value.stream.metadata.thumbnail && + part.channel_name + ) { renderedContentCollection.push(`
- ${part.name} - -
+ ${part.name} +
${part.value.stream.metadata.title} ${part.channel_name}
`); - } catch (err) { - return; // TODO: Return nice error message } } renderedContentCollection.push(` `); @@ -296,7 +298,7 @@ function generateMemeCreator(socket) { detectLanguageAndUpdate(); initCanvas(); - document.getElementById("tour-example-description").textContent = document.querySelector("[data-action='tour, example 2']").dataset.description; + document.getElementById("tour-example-description").innerHTML = document.querySelector("[data-action='tour, example 2']").dataset.description; setTimeout(() => { document.querySelector(".tour__content__meme__canvas__thumbnail").click();