more plugin setup

pull/3542/head
Joseph Izang 2 years ago
parent a1cb360c7a
commit a3e7973d08
  1. 9
      apps/remix-ide/src/app.js
  2. 9
      apps/remix-ide/src/app/plugins/docgen.ts
  3. 6
      apps/remixdocgen/src/app/App.tsx
  4. 28
      apps/remixdocgen/src/app/docgen-client.ts
  5. 3
      apps/remixdocgen/webpack.config.js
  6. 1
      libs/remix-ui/docgenclient-ui/src/index.ts
  7. 10
      libs/remix-ui/docgenclient-ui/src/lib/docgenclient-ui.tsx
  8. 294
      libs/remix-ui/solidity-compiler/src/lib/logic/pdfSaveLogic.ts
  9. 5
      tsconfig.paths.json

@ -51,6 +51,7 @@ const remixLib = require('@remix-project/remix-lib')
import { QueryParams } from '@remix-project/remix-lib'
import { SearchPlugin } from './app/tabs/search'
import { DocGen } from './app/plugins/docgen'
const Storage = remixLib.Storage
const RemixDProvider = require('./app/files/remixDProvider')
@ -180,6 +181,9 @@ class AppComponent {
//----- search
const search = new SearchPlugin()
//---- docgen plugin
const docgen = new DocGen()
//---------------- Solidity UML Generator -------------------------
const solidityumlgen = new SolidityUmlGen(appManager)
@ -298,7 +302,8 @@ class AppComponent {
this.walkthroughService,
search,
solidityumlgen,
contractFlattener
contractFlattener,
docgen
])
// LAYOUT & SYSTEM VIEWS
@ -413,7 +418,7 @@ class AppComponent {
await this.appManager.activatePlugin(['settings', 'config'])
await this.appManager.activatePlugin(['hiddenPanel', 'pluginManager', 'codeParser', 'codeFormatter', 'fileDecorator', 'terminal', 'blockchain', 'fetchAndCompile', 'contentImport', 'gistHandler'])
await this.appManager.activatePlugin(['settings'])
await this.appManager.activatePlugin(['walkthrough', 'storage', 'search', 'compileAndRun', 'recorder'])
await this.appManager.activatePlugin(['walkthrough', 'storage', 'search', 'compileAndRun', 'recorder', 'docgen'])
this.appManager.on(
'filePanel',

@ -30,10 +30,11 @@ export class DocGen extends Plugin {
}
async docgen(builds: Build[], userConfig?: Config): Promise<void> {
const config = { ...defaults, ...userConfig };
const templates = await loadTemplates(config.theme, config.root, config.templates);
const site = buildSite(builds, config, templates.properties ?? {});
const renderedSite = render(site, templates, config.collapseNewlines);
const config = { ...defaults, ...userConfig }
const templates = await loadTemplates(config.theme, config.root, config.templates)
const site = buildSite(builds, config, templates.properties ?? {})
const renderedSite = render(site, templates, config.collapseNewlines)
console.log({ renderedSite })
for (const { id, contents } of renderedSite) {
await this.call('fileManager', 'setFile', id, contents)
}

@ -10,7 +10,9 @@ import { Status } from "@remixproject/plugin-utils";
import { AppContext } from "./AppContext";
import { Routes } from "./routes";
import { useLocalStorage } from "./hooks/useLocalStorage";
import { useLocalStorage } from "./hooks/useLocalStorage"
import { RemixUiDocgenClient } from '@remix-ui/docgenclient-ui' // eslint-disable-line
import "./App.css";
@ -101,7 +103,7 @@ const App = () => {
// <Routes />
// </AppContext.Provider>
<div>
<h1>Testing</h1>
<RemixUiDocgenClient />
</div>
)
};

@ -0,0 +1,28 @@
import { PluginClient } from '@remixproject/plugin'
import { IRemixApi } from '@remixproject/plugin-api'
import { Api, PluginApi } from '@remixproject/plugin-utils'
import { createClient } from '@remixproject/plugin-webview'
export class DocGenClient extends PluginClient {
private client
constructor() {
super()
this.client = createClient(this)
this.methods = ['generateDocs', 'publishDocs']
this.client.onload(async () => {
await this.client.activate()
})
}
async generateDocs() {
console.log('docgen client generateDocs')
// await this.client.call('docgen', 'docgen', [])
}
async publishDocs() {
console.log('docgen client publishDocs')
// await this.client.call('docgen', 'docgen', [])
}
}

@ -1,10 +1,11 @@
const { composePlugins, withNx } = require('@nrwl/webpack')
const { withReact } = require('@nrwl/react')
const webpack = require('webpack')
const TerserPlugin = require("terser-webpack-plugin")
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin")
// Nx plugins for webpack.
module.exports = composePlugins(withNx(), (config) => {
module.exports = composePlugins(withNx(), withReact(), (config) => {
// Update the webpack config as needed here.
// e.g. `config.plugins.push(new MyPlugin())`

@ -0,0 +1 @@
export * from './lib/docgenclient-ui'

@ -0,0 +1,10 @@
import React from 'react'
export function RemixUiDocgenClient() {
return (
<div>
<h1 className="h1">DocgenClientUI</h1>
</div>
)
}

@ -1,294 +0,0 @@
/* eslint-disable prefer-const */
import domToImage from 'dom-to-image';
import { jsPDF } from 'jspdf';
const _cloneNode = (node, javascriptEnabled) => {
let child = node.firstChild
const clone = node.nodeType === 3 ? document.createTextNode(node.nodeValue) : node.cloneNode(false)
while (child) {
if (javascriptEnabled === true || child.nodeType !== 1 || child.nodeName !== 'SCRIPT') {
clone.appendChild(_cloneNode(child, javascriptEnabled))
}
child = child.nextSibling
}
if (node.nodeType === 1) {
if (node.nodeName === 'CANVAS') {
clone.width = node.width
clone.height = node.height
clone.getContext('2d').drawImage(node, 0, 0)
} else if (node.nodeName === 'TEXTAREA' || node.nodeName === 'SELECT') {
clone.value = node.value
}
clone.addEventListener('load', (() => {
clone.scrollTop = node.scrollTop
clone.scrollLeft = node.scrollLeft
}), true)
}
return clone
}
const _createElement = (tagName, {className, innerHTML, style}) => {
let i
let scripts
const el = document.createElement(tagName)
if (className) {
el.className = className
}
if (innerHTML) {
el.innerHTML = innerHTML
scripts = el.getElementsByTagName('script')
i = scripts.length
while (i-- > 0) {
scripts[i].parentNode.removeChild(scripts[i])
}
}
for (const key in style) {
el.style[key] = style[key];
}
return el;
};
const _isCanvasBlank = canvas => {
const blank = document.createElement('canvas');
blank.width = canvas.width;
blank.height = canvas.height;
const ctx = blank.getContext('2d');
ctx.fillStyle = '#FFFFFF';
ctx.fillRect(0, 0, blank.width, blank.height);
return canvas.toDataURL() === blank.toDataURL();
};
const downloadPdf = (dom, options, cb) => {
const a4Height = 841.89;
const a4Width = 595.28;
let overrideWidth;
let container;
let containerCSS;
let containerWidth;
let elements;
let excludeClassNames;
let excludeTagNames;
let filename;
let filterFn;
let innerRatio;
let overlay;
let overlayCSS;
let pageHeightPx;
let proxyUrl;
let compression = 'NONE';
let scale;
let opts;
let offsetHeight;
let offsetWidth;
let scaleObj;
let style;
const transformOrigin = 'top left';
const pdfOptions: any = {
orientation: 'l',
unit: 'pt',
format: 'a4'
};
({filename, excludeClassNames = [], excludeTagNames = ['button', 'input', 'select'], overrideWidth, proxyUrl, compression, scale} = options);
overlayCSS = {
position: 'fixed',
zIndex: 1000,
opacity: 0,
left: 0,
right: 0,
bottom: 0,
top: 0,
backgroundColor: 'rgba(0,0,0,0.8)'
};
if (overrideWidth) {
overlayCSS.width = `${overrideWidth}px`;
}
containerCSS = {
position: 'absolute',
left: 0,
right: 0,
top: 0,
height: 'auto',
margin: 'auto',
overflow: 'auto',
backgroundColor: 'white'
};
overlay = _createElement('div', {
style: overlayCSS,
className: '',
innerHTML: ''
});
container = _createElement('div', {
style: containerCSS,
className: '',
innerHTML: ''
});
//@ts-ignore
container.appendChild(_cloneNode(dom));
overlay.appendChild(container);
document.body.appendChild(overlay);
innerRatio = a4Height / a4Width;
containerWidth = overrideWidth || container.getBoundingClientRect().width;
pageHeightPx = Math.floor(containerWidth * innerRatio);
elements = container.querySelectorAll('*');
for (let i = 0, len = excludeClassNames.length; i < len; i++) {
const clName = excludeClassNames[i];
container.querySelectorAll(`.${clName}`).forEach(function(a) {
return a.remove();
});
}
for (let j = 0, len1 = excludeTagNames.length; j < len1; j++) {
const tName = excludeTagNames[j];
let els = container.getElementsByTagName(tName);
for (let k = els.length - 1; k >= 0; k--) {
if (!els[k]) {
continue;
}
els[k].parentNode.removeChild(els[k]);
}
}
Array.prototype.forEach.call(elements, el => {
let clientRect;
let endPage;
let nPages;
let pad;
let rules;
let startPage;
rules = {
before: false,
after: false,
avoid: true
};
clientRect = el.getBoundingClientRect();
if (rules.avoid && !rules.before) {
startPage = Math.floor(clientRect.top / pageHeightPx);
endPage = Math.floor(clientRect.bottom / pageHeightPx);
nPages = Math.abs(clientRect.bottom - clientRect.top) / pageHeightPx;
// Turn on rules.before if the el is broken and is at most one page long.
if (endPage !== startPage && nPages <= 1) {
rules.before = true;
}
// Before: Create a padding div to push the element to the next page.
if (rules.before) {
pad = _createElement('div', {
className: '',
innerHTML: '',
style: {
display: 'block',
height: `${pageHeightPx - clientRect.top % pageHeightPx}px`
}
});
return el.parentNode.insertBefore(pad, el);
}
}
});
// Remove unnecessary elements from result pdf
filterFn = ({classList, tagName}) => {
let cName;
let j;
let len;
let ref;
if (classList) {
for (j = 0, len = excludeClassNames.length; j < len; j++) {
cName = excludeClassNames[j];
if (Array.prototype.indexOf.call(classList, cName) >= 0) {
return false;
}
}
}
ref = tagName != null ? tagName.toLowerCase() : undefined;
return excludeTagNames.indexOf(ref) < 0;
};
opts = {
filter: filterFn,
proxy: proxyUrl
};
if (scale) {
offsetWidth = container.offsetWidth;
offsetHeight = container.offsetHeight;
style = {
transform: 'scale(' + scale + ')',
transformOrigin: transformOrigin,
width: offsetWidth + 'px',
height: offsetHeight + 'px'
};
scaleObj = {
width: offsetWidth * scale,
height: offsetHeight * scale,
quality: 1,
style: style
};
opts = Object.assign(opts, scaleObj);
}
return domToImage.toCanvas(container, opts).then(canvas => {
let h;
let imgData;
let nPages;
let page;
let pageCanvas;
let pageCtx;
let pageHeight;
let pdf;
let pxFullHeight;
let w;
// Remove overlay
document.body.removeChild(overlay);
// Initialize the PDF.
pdf = new jsPDF(pdfOptions);
// Calculate the number of pages.
pxFullHeight = canvas.height;
nPages = Math.ceil(pxFullHeight / pageHeightPx);
// Define pageHeight separately so it can be trimmed on the final page.
pageHeight = a4Height;
pageCanvas = document.createElement('canvas');
pageCtx = pageCanvas.getContext('2d');
pageCanvas.width = canvas.width;
pageCanvas.height = pageHeightPx;
page = 0;
while (page < nPages) {
if (page === nPages - 1 && pxFullHeight % pageHeightPx !== 0) {
pageCanvas.height = pxFullHeight % pageHeightPx;
pageHeight = pageCanvas.height * a4Width / pageCanvas.width;
}
w = pageCanvas.width;
h = pageCanvas.height;
pageCtx.fillStyle = 'white';
pageCtx.fillRect(0, 0, w, h);
pageCtx.drawImage(canvas, 0, page * pageHeightPx, w, h, 0, 0, w, h);
// Don't create blank pages
if (_isCanvasBlank(pageCanvas)) {
++page;
continue;
}
// Add the page to the PDF.
if (page) {
pdf.addPage();
}
imgData = pageCanvas.toDataURL('image/PNG');
pdf.addImage(imgData, 'PNG', 0, 0, a4Width, pageHeight, undefined, compression);
++page;
}
if (typeof cb === "function") {
cb(pdf);
}
return pdf.save(filename);
}).catch(error => {
// Remove overlay
document.body.removeChild(overlay);
if (typeof cb === "function") {
cb(null);
}
return console.error(error);
});
};
module.exports = downloadPdf;

@ -148,9 +148,12 @@
"@remix-ui/solidity-uml-gen": [
"libs/remix-ui/solidity-uml-gen/src/index.ts"
],
"@remix-ui/docgenclient-ui": [
"libs/remix-ui/docgenclient-ui/src/index.ts"
],
"@remix-project/ghaction-helper": [
"libs/ghaction-helper/src/index.ts"
]
],
}
}
}
Loading…
Cancel
Save