Add new documentation for Liquid and Bisq.

This commit is contained in:
Miguel Medeiros 2021-08-11 12:50:49 -03:00 committed by wiz
parent dbd205b73f
commit d76f42296a
No known key found for this signature in database
GPG Key ID: A394E332255A6173
4 changed files with 4110 additions and 1441 deletions

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -12,7 +12,7 @@
<ng-template ngbNavContent>
<div class="subtitle"><ng-container i18n="API Docs code example">Code Example</ng-container> <app-clipboard [text]="wrapCommonJS(code.codeSample.commonJS)"></app-clipboard></div>
<div class="links">
<a href="https://github.com/mempool/mempool.js" target="_blank">github repository</a>
<a [href]="npmGithubLink()" target="_blank">github repository</a>
</div>
<pre><code [innerText]="wrapCommonJS(code.codeSample.commonJS)"></code></pre>
</ng-template>
@ -20,12 +20,12 @@
<li ngbNavItem>
<a ngbNavLink>ES Module</a>
<ng-template ngbNavContent>
<div class="subtitle"><ng-container i18n="API Docs install lib">Install Package</ng-container> <app-clipboard [text]="esModuleInstall"></app-clipboard></div>
<div class="subtitle"><ng-container i18n="API Docs install lib">Install Package</ng-container> <app-clipboard [text]="wrapImportTemplate()"></app-clipboard></div>
<div class="links">
<a href="https://github.com/mempool/mempool.js" target="_blank">github repository</a>
<a href="https://www.npmjs.org/package/@mempool/mempool.js" target="_blank">npm package</a>
<a [href]="npmGithubLink()" target="_blank">github repository</a>
<a [href]="npmModuleLink()" target="_blank">npm package</a>
</div>
<pre><code [innerText]="esModuleInstall"></code></pre>
<pre><code [innerText]="wrapImportTemplate()"></code></pre>
<div class="subtitle"><ng-container i18n="API Docs code example">Code Example</ng-container> <app-clipboard [text]="wrapESmodule(code.codeSample.esModule)"></app-clipboard></div>
<pre><code [innerText]="wrapESmodule(code.codeSample.esModule)"></code></pre>
</ng-template>

View File

@ -7,6 +7,7 @@ import { Component, Input } from '@angular/core';
})
export class CodeTemplateComponent {
@Input() network: string;
@Input() layer: string;
@Input() code: {
codeSample: {
esModule: string;
@ -16,15 +17,32 @@ export class CodeTemplateComponent {
responseSample: string;
};
hostname = document.location.hostname;
esModuleInstall = `# npm
npm install @mempool/mempool.js --save
# yarn
yarn add @mempool/mempool.js`;
constructor(
) { }
npmGithubLink(){
let npmLink = `https://github.com/mempool/mempool.js`;
if (this.layer === 'bisq') {
npmLink = `https://github.com/mempool/mempool.js/tree/main/npm-bisq-js`;
}
if (this.layer === 'liquid') {
npmLink = `https://github.com/mempool/mempool.js/tree/main/npm-liquid-js`;
}
return npmLink;
}
npmModuleLink() {
let npmLink = `https://www.npmjs.org/package/@mempool/mempool.js`;
if (this.layer === 'bisq') {
npmLink = `https://www.npmjs.org/package/@mempool/bisq.js`;
}
if (this.layer === 'liquid') {
npmLink = `https://www.npmjs.org/package/@mempool/liquid.js`;
}
return npmLink;
}
normalizeCodeHostname(code: string) {
let codeText: string;
if (this.network === 'bisq' || this.network === 'liquid'){
@ -44,7 +62,15 @@ yarn add @mempool/mempool.js`;
});` );
}
return `import mempoolJS from "@mempool/mempool.js";
let importText = `import mempoolJS from "@mempool/mempool.js";`;
if (this.layer === 'bisq') {
importText = `import bisqJS from "@mempool/bisq.js";`;
}
if (this.layer === 'liquid') {
importText = `import liquidJS from "@mempool/liquid.js";`;
}
return `${importText}
const init = async () => {
${codeText}
@ -60,10 +86,18 @@ init();`;
hostname: '${this.hostname}/${this.network}'
});` );
}
let importText = `<script src="https://mempool.space/mempool.js"></script>`;
if (this.layer === 'bisq') {
importText = `<script src="https://bisq.markets/bisq.js"></script>`;
}
if (this.layer === 'liquid') {
importText = `<script src="https://liquid.network/liquid.js"></script>`;
}
return `<!DOCTYPE html>
<html>
<head>
<script src="https://mempool.space/mempool.js"></script>
${importText}
<script>
const init = async () => {
${codeText}
@ -81,4 +115,31 @@ init();`;
return code;
}
wrapImportTemplate() {
let importTemplate = `# npm
npm install @mempool/mempool.js --save
# yarn
yarn add @mempool/mempool.js`;
if (this.layer === 'bisq') {
importTemplate = `# npm
npm install @mempool/bisq.js --save
# yarn
yarn add @mempool/bisq.js`;
}
if (this.layer === 'liquid') {
importTemplate = `# npm
npm install @mempool/liquid.js --save
# yarn
yarn add @mempool/liquid.js`;
}
return importTemplate;
}
}