lbrycrd examples are fixed and new functionality is added
This commit is contained in:
ポール ウェッブ
parent
50ebc277d9
commit
bb40fc1725
4 changed files with 97 additions and 83 deletions
4
app/dist/scripts/api.js
vendored
4
app/dist/scripts/api.js
vendored
|
|
@ -35,6 +35,7 @@ document.querySelector(".api-toc__search-clear").addEventListener("click", () =>
|
|||
|
||||
|
||||
// Code toggles
|
||||
handleApiLanguageToggles("cli");
|
||||
handleApiLanguageToggles("curl");
|
||||
handleApiLanguageToggles("lbrynet");
|
||||
handleApiLanguageToggles("python");
|
||||
|
|
@ -44,6 +45,9 @@ handleApiLanguageToggles("python");
|
|||
// H E L P E R S
|
||||
|
||||
function handleApiLanguageToggles(language) {
|
||||
if (!document.getElementById(`toggle-${language}`))
|
||||
return;
|
||||
|
||||
document.getElementById(`toggle-${language}`).addEventListener("click", () => {
|
||||
const codeExamples = document.querySelectorAll(`[data-api-example-type="${language}"]`);
|
||||
const examples = document.querySelectorAll("[data-api-example-type]");
|
||||
|
|
|
|||
|
|
@ -53,9 +53,7 @@ export default async(state) => {
|
|||
<div class="api-documentation" id="toc-content">
|
||||
<div></div>
|
||||
<nav class="api-content__items">
|
||||
<button class="api-content__item" id="toggle-curl" type="button">curl</button>
|
||||
<button class="api-content__item" id="toggle-lbrynet" type="button">lbrynet</button>
|
||||
<button class="api-content__item" id="toggle-python" type="button">python</button>
|
||||
${renderToggles(apilabel === "SDK")}
|
||||
</nav>
|
||||
|
||||
${createApiHeader(state.params.wildcard)}
|
||||
|
|
@ -68,6 +66,9 @@ export default async(state) => {
|
|||
<script src="/assets/scripts/api.js"></script>
|
||||
|
||||
<script>
|
||||
if (window.location.pathname === "/api/blockchain")
|
||||
document.getElementById("toggle-cli").click();
|
||||
else
|
||||
document.getElementById("toggle-curl").click();
|
||||
</script>
|
||||
`;
|
||||
|
|
@ -109,7 +110,7 @@ export default async(state) => {
|
|||
function createApiContent(apiDetails) {
|
||||
const apiContent = [];
|
||||
|
||||
for (const apiDetail of apiDetails) {
|
||||
apiDetails.forEach(apiDetail => {
|
||||
let apiDetailsReturns = "";
|
||||
|
||||
if (apiDetail.returns)
|
||||
|
|
@ -121,15 +122,14 @@ function createApiContent(apiDetails) {
|
|||
<p>${apiDetail.description}</p>
|
||||
|
||||
${apiDetail.arguments.length ? `<h3>Arguments</h3><ul class="api-content__body-arguments">${renderArguments(apiDetail.arguments).join("")}</ul>` : ""}
|
||||
|
||||
<h3>Returns</h3><pre><code>${dedent(apiDetailsReturns)}</code></pre>
|
||||
${apiDetail.returns ? `<h3>Returns</h3><pre><code>${dedent(apiDetailsReturns)}</code></pre>` : ""}
|
||||
</div>
|
||||
|
||||
<div class="api-content__example">
|
||||
${apiDetail.examples && apiDetail.examples.length ? renderExamples(apiDetail.examples).join("") : `<pre><code>// example(s) for ${apiDetail.name} to come later</code></pre>`}
|
||||
</div>
|
||||
`);
|
||||
}
|
||||
});
|
||||
|
||||
return apiContent;
|
||||
}
|
||||
|
|
@ -150,7 +150,7 @@ function createApiHeader(slug) {
|
|||
function createApiSidebar(apiDetails) {
|
||||
const apiSidebar = [];
|
||||
|
||||
for (const apiDetail of apiDetails) {
|
||||
apiDetails.forEach(apiDetail => {
|
||||
apiSidebar.push(`
|
||||
<li class="api-toc__command">
|
||||
<a href="#${apiDetail.name}" title="Go to ${apiDetail.name} section">
|
||||
|
|
@ -158,7 +158,7 @@ function createApiSidebar(apiDetails) {
|
|||
</a>
|
||||
</li>
|
||||
`);
|
||||
}
|
||||
});
|
||||
|
||||
return apiSidebar;
|
||||
}
|
||||
|
|
@ -167,7 +167,7 @@ function createSdkContent(apiDetails) {
|
|||
const apiContent = [];
|
||||
const sectionTitles = Object.keys(apiDetails);
|
||||
|
||||
for (const title of sectionTitles) {
|
||||
sectionTitles.forEach(title => {
|
||||
const commands = apiDetails[title].commands;
|
||||
const description = apiDetails[title].doc;
|
||||
|
||||
|
|
@ -176,7 +176,7 @@ function createSdkContent(apiDetails) {
|
|||
commands.map(command => createSdkContentSections(title, description, command)).join("") :
|
||||
""
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
return apiContent;
|
||||
}
|
||||
|
|
@ -206,7 +206,7 @@ function createSdkSidebar(apiDetails) {
|
|||
const sectionTitles = Object.keys(apiDetails);
|
||||
const apiSidebar = [];
|
||||
|
||||
for (const title of sectionTitles) {
|
||||
sectionTitles.forEach(title => {
|
||||
const commands = apiDetails[title].commands;
|
||||
|
||||
apiSidebar.push(`
|
||||
|
|
@ -215,7 +215,7 @@ function createSdkSidebar(apiDetails) {
|
|||
${(commands.map(command => `<li class="api-toc__command"><a href="#${command.name}" title="Go to ${command.name} section">${command.name}</a></li>`)).join("")}
|
||||
</ul>
|
||||
`);
|
||||
}
|
||||
});
|
||||
|
||||
return apiSidebar;
|
||||
}
|
||||
|
|
@ -254,7 +254,7 @@ function renderArguments(args) {
|
|||
if (!args || args.length === 0)
|
||||
return argumentContent;
|
||||
|
||||
for (const arg of args) {
|
||||
args.forEach(arg => {
|
||||
argumentContent.push(`
|
||||
<li class="api-content__body-argument">
|
||||
<div class="left">
|
||||
|
|
@ -265,7 +265,7 @@ function renderArguments(args) {
|
|||
<div class="right">${typeof arg.description === "string" ? arg.description.replace(/</g, "<").replace(/>/g, ">") : ""}</div>
|
||||
</li>
|
||||
`);
|
||||
}
|
||||
});
|
||||
|
||||
return argumentContent;
|
||||
}
|
||||
|
|
@ -278,18 +278,21 @@ function renderExamples(args) {
|
|||
return exampleContent;
|
||||
}
|
||||
|
||||
for (const arg of args) {
|
||||
args.forEach(arg => {
|
||||
exampleContent.push(`
|
||||
<h3>${arg.title}</h3><br/>
|
||||
<pre data-api-example-type="curl"><code>${arg.curl}</code></pre>
|
||||
<pre data-api-example-type="lbrynet"><code>${arg.lbrynet}</code></pre>
|
||||
<pre data-api-example-type="python"><code>${arg.python}</code></pre>
|
||||
${arg.title ? `<h3>${arg.title}</h3><br/>` : ""}
|
||||
${arg.cli ? `<pre data-api-example-type="cli"><code>${arg.cli}</code></pre>` : ""}
|
||||
${arg.curl ? `<pre data-api-example-type="curl"><code>${arg.curl}</code></pre>` : ""}
|
||||
${arg.lbrynet ? `<pre data-api-example-type="lbrynet"><code>${arg.lbrynet}</code></pre>` : ""}
|
||||
${arg.python ? `<pre data-api-example-type="python"><code>${arg.python}</code></pre>` : ""}
|
||||
|
||||
${arg.output ? `
|
||||
<h3>Output</h3><br/>
|
||||
<pre><code>${arg.output}</code></pre>
|
||||
<hr/>
|
||||
` : ""}
|
||||
`);
|
||||
}
|
||||
});
|
||||
|
||||
return exampleContent;
|
||||
}
|
||||
|
|
@ -303,3 +306,12 @@ function renderReturns(args) {
|
|||
returnContent = dedent(JSON.parse(JSON.stringify(args)));
|
||||
return returnContent;
|
||||
}
|
||||
|
||||
function renderToggles(onSdkPage) {
|
||||
return [
|
||||
!onSdkPage ? "<button class='api-content__item' id='toggle-cli' type='button'>cli</button>" : "",
|
||||
"<button class='api-content__item' id='toggle-curl' type='button'>curl</button>",
|
||||
onSdkPage ? "<button class='api-content__item' id='toggle-lbrynet' type='button'>lbrynet</button>" : "",
|
||||
onSdkPage ? "<button class='api-content__item' id='toggle-python' type='button'>python</button>" : ""
|
||||
];
|
||||
}
|
||||
|
|
|
|||
|
|
@ -27,13 +27,13 @@ If you want to read a more general overview on application building (or you don'
|
|||
|
||||
## Hello Satoshi
|
||||
|
||||
This section will guide you through creating a basic [Electron](https://electronjs.org/) application that calls to the LBRY network and renders an image returned by the network.
|
||||
This section will guide you through creating a basic [Electron](https://electronjs.org) application that calls to the LBRY network and renders an image returned by the network.
|
||||
|
||||
Electron is nice because it allows you to easily create web apps that don't rely on any centralized web servers, but you can absolutely use any tooling or language you would like.
|
||||
|
||||
### The Steps
|
||||
|
||||
_These steps require [npm](https://www.npmjs.com/). Learn how to install it [here](https://www.npmjs.com/get-npm)._
|
||||
_These steps require [npm](https://www.npmjs.com). Learn how to install it [here](https://www.npmjs.com/get-npm)._
|
||||
|
||||
#### 1. Download and build the starter app
|
||||
|
||||
|
|
@ -56,8 +56,9 @@ Type a word into the text input and click the button to [resolve](https://lbry.t
|
|||
|
||||
Now that we have the metadata, let's [get](https://lbry.tech/api/sdk#get) the actual file! The code to do this is already there, just un-comment these lines in the app's [renderer/index.js](https://github.com/lbryio/electron-starter/blob/master/src/renderer/index.js) file.
|
||||
|
||||
```
|
||||
```js
|
||||
claimData.innerText = "Loading...";
|
||||
|
||||
Lbry.get({ uri: `lbry://${value}` })
|
||||
.then(result => {
|
||||
const filePath = result.download_path;
|
||||
|
|
@ -127,7 +128,7 @@ It is also possible to create a browser extension similar to Joule and Metamask.
|
|||
|
||||
1. Have the user run a local copy of the [SDK](#sdk) on their computer and send commands from the browser that interact with the user's personal wallet.
|
||||
|
||||
2. Run the [SDK](#sdk) on a centrally hosted server and manage keys or funds for each user. If you're doing this, you'll want to read [Full Web Applications](#full-web-applications).
|
||||
1. Run the [SDK](#sdk) on a centrally hosted server and manage keys or funds for each user. If you're doing this, you'll want to read [Full Web Applications](#full-web-applications).
|
||||
|
||||
Going through a centralized server makes it easier on users, but comes with more responsibility to keep your user's funds secure. It also requires creating business logic on your server to associate user accounts with common types like claims and files.
|
||||
|
||||
|
|
@ -247,8 +248,5 @@ A full list of methods is available [here](https://lbry.tech/api/blockchain).
|
|||
Trouble? Questions? Want to share your progress? Interact with other devs!
|
||||
|
||||
- Join the #dev channel [in our chat](https://chat.lbry.com)
|
||||
- Introduce yourself or ask a question in [the forum](https://forum.lbry.tech/).
|
||||
- Introduce yourself or ask a question in [the forum](https://forum.lbry.tech).
|
||||
- Every LBRY repository on our [GitHub](https://github.com/lbryio) contains contact information for the maintainer.
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
44
package.json
44
package.json
|
|
@ -10,10 +10,10 @@
|
|||
},
|
||||
"author": "LBRY Team",
|
||||
"dependencies": {
|
||||
"@babel/polyfill": "^7.4.3",
|
||||
"@babel/polyfill": "^7.4.4",
|
||||
"@inc/fastify-ws": "^1.1.0",
|
||||
"@octokit/rest": "^16.23.4",
|
||||
"@slack/client": "^5.0.0",
|
||||
"@octokit/rest": "^16.25.3",
|
||||
"@slack/client": "^5.0.1",
|
||||
"async": "^2.6.2",
|
||||
"async-es": "^2.6.2",
|
||||
"choo": "^6.13.3",
|
||||
|
|
@ -23,16 +23,16 @@
|
|||
"choo-websocket": "^2.0.0",
|
||||
"colorette": "^1.0.7",
|
||||
"cors": "^2.8.5",
|
||||
"cron": "^1.7.0",
|
||||
"cron": "^1.7.1",
|
||||
"date-format-lite": "^17.7.0",
|
||||
"decamelize": "^3.2.0",
|
||||
"dedent": "^0.7.0",
|
||||
"dotenv": "^7.0.0",
|
||||
"fastify": "~2.2.0",
|
||||
"fastify-compress": "^0.8.1",
|
||||
"dotenv": "^8.0.0",
|
||||
"fastify": "~2.3.0",
|
||||
"fastify-compress": "^0.9.0",
|
||||
"fastify-helmet": "^3.0.0",
|
||||
"fastify-static": "^2.4.0",
|
||||
"front-matter": "^3.0.1",
|
||||
"front-matter": "^3.0.2",
|
||||
"fs-exists-sync": "^0.1.0",
|
||||
"got": "^9.6.0",
|
||||
"graceful-fs": "^4.1.15",
|
||||
|
|
@ -48,11 +48,11 @@
|
|||
},
|
||||
"description": "Documentation for the LBRY protocol and associated projects",
|
||||
"devDependencies": {
|
||||
"@babel/cli": "^7.4.3",
|
||||
"@babel/core": "^7.4.3",
|
||||
"@babel/cli": "^7.4.4",
|
||||
"@babel/core": "^7.4.4",
|
||||
"@babel/plugin-external-helpers": "7.2.0",
|
||||
"@babel/plugin-proposal-class-properties": "7.4.0",
|
||||
"@babel/plugin-proposal-decorators": "7.4.0",
|
||||
"@babel/plugin-proposal-class-properties": "7.4.4",
|
||||
"@babel/plugin-proposal-decorators": "7.4.4",
|
||||
"@babel/plugin-proposal-export-namespace-from": "7.2.0",
|
||||
"@babel/plugin-proposal-function-sent": "7.2.0",
|
||||
"@babel/plugin-proposal-json-strings": "7.2.0",
|
||||
|
|
@ -60,22 +60,22 @@
|
|||
"@babel/plugin-proposal-throw-expressions": "7.2.0",
|
||||
"@babel/plugin-syntax-dynamic-import": "7.2.0",
|
||||
"@babel/plugin-syntax-import-meta": "7.2.0",
|
||||
"@babel/preset-env": "^7.4.3",
|
||||
"@babel/register": "^7.4.0",
|
||||
"@babel/preset-env": "^7.4.4",
|
||||
"@babel/register": "^7.4.4",
|
||||
"@inc/eslint-config": "^1.1.3",
|
||||
"@inc/sasslint-config": "^1.2.0",
|
||||
"@inc/sasslint-config": "^2019.5.7",
|
||||
"@lbry/color": "^1.1.1",
|
||||
"@lbry/components": "^2.4.0",
|
||||
"@lbry/components": "^2.7.1",
|
||||
"eslint": "^5.16.0",
|
||||
"husky": "^1.3.1",
|
||||
"nodemon": "^1.18.11",
|
||||
"husky": "^2.2.0",
|
||||
"nodemon": "^1.19.0",
|
||||
"npm-run-all": "^4.1.5",
|
||||
"pino-pretty": "^2.6.0",
|
||||
"sass": "^1.18.0",
|
||||
"sass-lint": "^1.12.1",
|
||||
"pino-pretty": "^3.0.0",
|
||||
"sass": "^1.20.1",
|
||||
"sass-lint": "^1.13.1",
|
||||
"snazzy": "^8.0.0",
|
||||
"standardx": "^3.0.1",
|
||||
"updates": "^8.0.1"
|
||||
"updates": "^8.0.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": "10.2.x"
|
||||
|
|
|
|||
Loading…
Reference in a new issue