提交 faae63b3 编写于 作者: J Jason Park 提交者: Jinseo Park

Separate backend from algorithm-visualizer repo

上级 83e4c196
...@@ -2,6 +2,4 @@ ...@@ -2,6 +2,4 @@
/node_modules /node_modules
/build /build
/npm-debug.log /npm-debug.log
/src/backend/public
.DS_Store .DS_Store
/pm2.config.js
MIT License MIT License
Copyright (c) 2018 Jinseo Jason Park Copyright (c) 2019 Jinseo Jason Park
Permission is hereby granted, free of charge, to any person obtaining a copy Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal of this software and associated documentation files (the "Software"), to deal
......
const {
__DEV__,
backendBuildPath,
} = require('../environment');
if (__DEV__) {
const webpack = require('webpack');
const webpackConfig = require('../webpack.backend.config.js');
const compiler = webpack(webpackConfig);
let backend = null;
let lastHash = null;
compiler.watch({
watchOptions: {
ignored: /public/,
},
}, (err, stats) => {
if (err) {
lastHash = null;
compiler.purgeInputFileSystem();
console.error(err);
} else if (stats.hash !== lastHash) {
lastHash = stats.hash;
console.info(stats.toString({
cached: false,
colors: true,
}));
delete require.cache[require.resolve(backendBuildPath)];
backend = require(backendBuildPath).default;
}
});
const backendWrapper = (req, res, next) => backend(req, res, next);
backendWrapper.getHierarchy = () => backend.hierarchy;
module.exports = backendWrapper;
} else {
const backend = require(backendBuildPath).default;
const backendWrapper = (req, res, next) => backend(req, res, next);
backendWrapper.getHierarchy = () => backend.hierarchy;
module.exports = backendWrapper;
}
const express = require('express');
const path = require('path');
const fs = require('fs');
const url = require('url');
const packageJson = require('../package');
const {
__DEV__,
frontendSrcPath,
frontendBuildPath,
} = require('../environment');
const app = express();
if (__DEV__) {
const webpack = require('webpack');
const webpackDev = require('webpack-dev-middleware');
const webpackHot = require('webpack-hot-middleware');
const webpackConfig = require('../webpack.frontend.config.js');
const compiler = webpack(webpackConfig);
app.use(express.static(path.resolve(frontendSrcPath, 'static')));
app.use(webpackDev(compiler, {
stats: {
cached: false,
colors: true,
},
serverSideRender: true,
index: false,
}));
app.use(webpackHot(compiler));
app.use((req, res, next) => {
const { fs } = res.locals;
const outputPath = res.locals.webpackStats.toJson().outputPath;
const filePath = path.resolve(outputPath, 'index.html');
fs.readFile(filePath, 'utf8', (err, data) => {
if (err) return next(err);
res.indexFile = data;
next();
});
});
} else {
app.use(express.static(frontendBuildPath, { index: false }));
app.use((req, res, next) => {
const filePath = path.resolve(frontendBuildPath, 'index.html');
fs.readFile(filePath, 'utf8', (err, data) => {
if (err) return next(err);
res.indexFile = data;
next();
});
});
}
app.use((req, res) => {
const backend = require('./backend');
const hierarchy = backend.getHierarchy();
const [, categoryKey, algorithmKey] = url.parse(req.originalUrl).pathname.split('/');
let { title, description } = packageJson;
let algorithm = undefined;
if (categoryKey && categoryKey !== 'scratch-paper') {
algorithm = hierarchy.find(categoryKey, algorithmKey) || null;
if (algorithm) {
title = [algorithm.categoryName, algorithm.algorithmName].join(' - ');
description = algorithm.description;
} else {
res.status(404);
}
}
const indexFile = res.indexFile
.replace(/\$TITLE/g, title)
.replace(/\$DESCRIPTION/g, description)
.replace(/\$ALGORITHM/g, algorithm === undefined ? 'undefined' :
JSON.stringify(algorithm).replace(/</g, '\\u003c'));
res.send(indexFile);
});
module.exports = app;
const path = require('path');
const express = require('express');
const compression = require('compression');
const app = express();
const frontend = require('./frontend');
const backend = require('./backend');
const {
apiEndpoint,
credentials,
} = require('../environment');
app.use(compression());
app.use((req, res, next) => {
if (req.hostname === 'algo-visualizer.jasonpark.me') {
res.redirect(301, 'https://algorithm-visualizer.org/');
} else if (credentials && !req.secure) {
res.redirect(301, `https://${req.hostname}${req.url}`);
} else {
next();
}
});
app.get('/robots.txt', (req, res) => {
res.sendFile(path.resolve(__dirname, '..', 'robots.txt'));
});
app.use(apiEndpoint, backend);
app.use(frontend);
module.exports = app;
#!/usr/bin/env bash
git fetch &&
! git diff-index --quiet origin/master -- ':!package-lock.json' &&
git reset --hard origin/master &&
npm install &&
npm run build
#!/usr/bin/env node
const http = require('http');
const https = require('https');
const app = require('../app');
const {
httpPort,
httpsPort,
credentials,
} = require('../environment');
const httpServer = http.createServer(app);
httpServer.listen(httpPort);
console.info(`http: listening on port ${httpPort}`);
if (credentials) {
const httpsServer = https.createServer(credentials, app);
httpsServer.listen(httpsPort);
console.info(`https: listening on port ${httpsPort}`);
}
...@@ -23,11 +23,6 @@ ...@@ -23,11 +23,6 @@
"visualization", "visualization",
"animation" "animation"
], ],
"author": {
"name": "Jinseo Jason Park",
"email": "parkjs814@gmail.com",
"url": "https://jasonpark.me/"
},
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"axios": "latest", "axios": "latest",
......
import Promise from 'bluebird';
import axios from 'axios';
import fs from 'fs';
import { githubClientId, githubClientSecret } from '/environment';
const instance = axios.create();
instance.interceptors.request.use(request => {
request.params = { client_id: githubClientId, client_secret: githubClientSecret, ...request.params };
return request;
});
instance.interceptors.response.use(response => {
return response.data;
}, error => {
return Promise.reject(error.response.data);
});
const request = (url, process) => {
const tokens = url.split('/');
const baseURL = /^https?:\/\//i.test(url) ? '' : 'https://api.github.com';
return (...args) => {
return new Promise((resolve, reject) => {
const mappedURL = baseURL + tokens.map((token, i) => token.startsWith(':') ? args.shift() : token).join('/');
return resolve(process(mappedURL, args));
});
};
};
const GET = URL => {
return request(URL, (mappedURL, args) => {
const [params] = args;
return instance.get(mappedURL, { params });
});
};
const DELETE = URL => {
return request(URL, (mappedURL, args) => {
const [params] = args;
return instance.delete(mappedURL, { params });
});
};
const POST = URL => {
return request(URL, (mappedURL, args) => {
const [body, params] = args;
return instance.post(mappedURL, body, { params });
});
};
const PUT = URL => {
return request(URL, (mappedURL, args) => {
const [body, params] = args;
return instance.put(mappedURL, body, { params });
});
};
const PATCH = URL => {
return request(URL, (mappedURL, args) => {
const [body, params] = args;
return instance.patch(mappedURL, body, { params });
});
};
const GitHubApi = {
listCommits: GET('/repos/:owner/:repo/commits'),
getAccessToken: code => instance.post('https://github.com/login/oauth/access_token', { code }, { headers: { Accept: 'application/json' } }),
getLatestRelease: GET('/repos/:owner/:repo/releases/latest'),
download: (url, path) => instance({
method: 'get',
url,
responseType: 'stream',
}).then(data => new Promise((resolve, reject) => {
data.pipe(fs.createWriteStream(path));
data.on('end', resolve);
data.on('error', reject);
})),
};
export {
GitHubApi,
};
\ No newline at end of file
const memoryLimit = 256; // in megabytes
const timeLimit = 5000; // in milliseconds
export {
memoryLimit,
timeLimit,
};
class ClientError extends Error {
}
class NotFoundError extends ClientError {
}
class ForbiddenError extends ClientError {
}
class UnauthorizedError extends ClientError {
}
export {
ClientError,
NotFoundError,
ForbiddenError,
UnauthorizedError,
};
import { Hierarchy } from '/models';
import path from 'path';
const repoPath = path.resolve(__dirname, '..', 'public', 'algorithms');
const hierarchy = new Hierarchy(repoPath);
export default hierarchy;
import Promise from 'bluebird';
import axios from 'axios';
import child_process from 'child_process';
import path from 'path';
import fs from 'fs-extra';
import removeMarkdown from 'remove-markdown';
const execute = (command, { stdout = process.stdout, stderr = process.stderr, ...options } = {}) => new Promise((resolve, reject) => {
const child = child_process.exec(command, options, (error, stdout, stderr) => {
if (error) return reject(error.code ? new Error(stderr) : error);
resolve(stdout);
});
if (stdout) child.stdout.pipe(stdout);
if (stderr) child.stderr.pipe(stderr);
});
const createKey = name => name.toLowerCase().trim().replace(/[^\w \-]/g, '').replace(/ /g, '-');
const isDirectory = dirPath => fs.lstatSync(dirPath).isDirectory();
const listFiles = dirPath => fs.readdirSync(dirPath).filter(fileName => !fileName.startsWith('.'));
const listDirectories = dirPath => listFiles(dirPath).filter(fileName => isDirectory(path.resolve(dirPath, fileName)));
const getDescription = files => {
const readmeFile = files.find(file => file.name === 'README.md');
if (!readmeFile) return '';
const lines = readmeFile.content.split('\n');
lines.shift();
while (lines.length && !lines[0].trim()) lines.shift();
let descriptionLines = [];
while (lines.length && lines[0].trim()) descriptionLines.push(lines.shift());
return removeMarkdown(descriptionLines.join(' '));
};
const download = (url, localPath) => axios({ url, method: 'GET', responseType: 'stream' })
.then(response => new Promise((resolve, reject) => {
const writer = fs.createWriteStream(localPath);
writer.on('finish', resolve);
writer.on('error', reject);
response.data.pipe(writer);
}));
export {
execute,
createKey,
isDirectory,
listFiles,
listDirectories,
getDescription,
download,
};
import GithubWebHook from 'express-github-webhook';
import { githubWebhookSecret } from '/environment';
const webhook = GithubWebHook({ path: '/', secret: githubWebhookSecret });
export default webhook;
import express from 'express';
import fs from 'fs-extra';
import { execute } from '/common/util';
import webhook from '/common/webhook';
import hierarchy from '/common/hierarchy';
import { NotFoundError } from '/common/error';
const router = express.Router();
const downloadCategories = () => (
fs.pathExistsSync(hierarchy.path) ?
execute(`git fetch && git reset --hard origin/master`, { cwd: hierarchy.path }) :
execute(`git clone https://github.com/algorithm-visualizer/algorithms.git ${hierarchy.path}`)
).then(() => hierarchy.refresh());
downloadCategories().catch(console.error);
webhook.on('algorithms', event => {
switch (event) {
case 'push':
downloadCategories().catch(console.error);
break;
}
});
router.route('/')
.get((req, res, next) => {
res.json(hierarchy);
});
router.route('/:categoryKey/:algorithmKey')
.get((req, res, next) => {
const { categoryKey, algorithmKey } = req.params;
const algorithm = hierarchy.find(categoryKey, algorithmKey);
if (!algorithm) return next(new NotFoundError());
res.json({ algorithm });
});
router.route('/sitemap.txt')
.get((req, res, next) => {
const urls = [];
hierarchy.iterate((category, algorithm) => {
urls.push(`https://algorithm-visualizer.org/${category.key}/${algorithm.key}`);
});
res.set('Content-Type', 'text/plain');
res.send(urls.join('\n'));
});
export default router;
import express from 'express';
import { githubClientId } from '/environment';
import { GitHubApi } from '/apis';
const router = express.Router();
const request = (req, res, next) => {
res.redirect(`https://github.com/login/oauth/authorize?client_id=${githubClientId}&scope=user,gist`);
};
const response = (req, res, next) => {
const { code } = req.query;
GitHubApi.getAccessToken(code).then(({ access_token }) => {
res.send(`<script>window.opener.signIn('${access_token}');window.close();</script>`);
}).catch(next);
};
const destroy = (req, res, next) => {
res.send(`<script>window.opener.signOut();window.close();</script>`);
};
router.route('/request')
.get(request);
router.route('/response')
.get(response);
router.route('/destroy')
.get(destroy);
export default router;
export { default as auth } from './auth';
export { default as algorithms } from './algorithms';
export { default as tracers } from './tracers';
export { default as visualizations } from './visualizations';
import express from 'express';
import fs from 'fs-extra';
import Promise from 'bluebird';
import uuid from 'uuid';
import path from 'path';
import { GitHubApi } from '/apis';
import { execute } from '/common/util';
import webhook from '/common/webhook';
import { ImageBuilder, WorkerBuilder } from '/tracers';
import { memoryLimit, timeLimit } from '/common/config';
const router = express.Router();
const trace = lang => (req, res, next) => {
const { code } = req.body;
const tempPath = path.resolve(__dirname, '..', 'public', 'codes', uuid.v4());
fs.outputFile(path.resolve(tempPath, `Main.${lang}`), code)
.then(() => {
const builder = builderMap[lang];
const containerName = uuid.v4();
let killed = false;
const timer = setTimeout(() => {
execute(`docker kill ${containerName}`).then(() => {
killed = true;
});
}, timeLimit);
return execute([
'docker run --rm',
`--name=${containerName}`,
'-w=/usr/visualization',
`-v=${tempPath}:/usr/visualization:rw`,
`-m=${memoryLimit}m`,
'-e ALGORITHM_VISUALIZER=1',
builder.imageName,
].join(' '), { stdout: null, stderr: null }).catch(error => {
if (killed) throw new Error('Time Limit Exceeded');
throw error;
}).finally(() => clearTimeout(timer));
})
.then(() => new Promise((resolve, reject) => {
const visualizationPath = path.resolve(tempPath, 'visualization.json');
res.sendFile(visualizationPath, err => {
if (err) return reject(new Error('Visualization Not Found'));
resolve();
});
}))
.catch(next)
.finally(() => fs.remove(tempPath));
};
const builderMap = {
js: new WorkerBuilder(),
cpp: new ImageBuilder('cpp'),
java: new ImageBuilder('java'),
};
Promise.map(Object.keys(builderMap), lang => {
const builder = builderMap[lang];
return GitHubApi.getLatestRelease('algorithm-visualizer', `tracers.${lang}`).then(builder.build);
}).catch(console.error);
webhook.on('release', (repo, data) => {
const result = /^tracers\.(\w+)$/.exec(repo);
if (result) {
const [, lang] = result;
const builder = builderMap[lang];
builder.build(data.release).catch(console.error);
}
});
Object.keys(builderMap).forEach(lang => {
const builder = builderMap[lang];
if (builder instanceof ImageBuilder) {
router.post(`/${lang}`, trace(lang));
} else if (builder instanceof WorkerBuilder) {
router.get(`/${lang}`, (req, res) => res.sendFile(builder.tracerPath));
router.get(`/${lang}/worker`, (req, res) => res.sendFile(builder.workerPath));
}
});
export default router;
import express from 'express';
import path from 'path';
import uuid from 'uuid';
import fs from 'fs-extra';
import Promise from 'bluebird';
const router = express.Router();
const uploadPath = path.resolve(__dirname, '..', 'public', 'visualizations');
const getVisualizationPath = visualizationId => path.resolve(uploadPath, `${visualizationId}.json`);
fs.remove(uploadPath).catch(console.error);
const uploadVisualization = (req, res, next) => {
const { content } = req.body;
const visualizationId = uuid.v4();
const tracesPath = getVisualizationPath(visualizationId);
const url = `https://algorithm-visualizer.org/scratch-paper/new?visualizationId=${visualizationId}`;
fs.outputFile(tracesPath, content)
.then(() => res.send(url))
.catch(next);
};
const getVisualization = (req, res, next) => {
const { visualizationId } = req.params;
const visualizationPath = getVisualizationPath(visualizationId);
new Promise((resolve, reject) => {
res.sendFile(visualizationPath, err => {
if (err) return reject(new Error('Visualization Expired'));
resolve();
});
}).catch(next)
.finally(() => fs.remove(visualizationPath));
};
router.route('/')
.post(uploadVisualization);
router.route('/:visualizationId')
.get(getVisualization);
export default router;
import express from 'express';
import morgan from 'morgan';
import cookieParser from 'cookie-parser';
import bodyParser from 'body-parser';
import * as controllers from '/controllers';
import { ClientError, ForbiddenError, NotFoundError, UnauthorizedError } from '/common/error';
import webhook from '/common/webhook';
import hierarchy from '/common/hierarchy';
const app = express();
app.use(morgan('tiny'));
app.use(cookieParser());
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
Object.keys(controllers).forEach(key => app.use(`/${key}`, controllers[key]));
app.use('/webhook', webhook);
app.use((req, res, next) => next(new NotFoundError()));
app.use((err, req, res, next) => {
const statusMap = [
[UnauthorizedError, 401],
[ForbiddenError, 403],
[NotFoundError, 404],
[ClientError, 400],
[Error, 500],
];
const [, status] = statusMap.find(([Error]) => err instanceof Error);
res.status(status);
res.send(err.message);
console.error(err);
});
app.hierarchy = hierarchy;
webhook.on('algorithm-visualizer', event => {
switch (event) {
case 'push':
process.exit(0);
break;
}
});
export default app;
import path from 'path';
import { createKey, getDescription, listFiles } from '/common/util';
import { File } from '/models';
class Algorithm {
constructor(path, name) {
this.path = path;
this.key = createKey(name);
this.name = name;
this.refresh();
}
refresh() {
this.files = listFiles(this.path)
.map(fileName => new File(path.resolve(this.path, fileName), fileName));
this.description = getDescription(this.files);
}
toJSON() {
const { key, name } = this;
return { key, name };
}
}
export default Algorithm;
import path from 'path';
import { createKey, listDirectories } from '/common/util';
import { Algorithm } from '/models';
class Category {
constructor(path, name) {
this.path = path;
this.key = createKey(name);
this.name = name;
this.refresh();
}
refresh() {
this.algorithms = listDirectories(this.path)
.map(algorithmName => new Algorithm(path.resolve(this.path, algorithmName), algorithmName));
}
toJSON() {
const { key, name, algorithms } = this;
return { key, name, algorithms };
}
}
export default Category;
import fs from 'fs-extra';
class File {
constructor(path, name) {
this.path = path;
this.name = name;
this.refresh();
}
refresh() {
this.content = fs.readFileSync(this.path, 'utf-8');
this.contributors = [];
}
toJSON() {
const { name, content, contributors } = this;
return { name, content, contributors };
}
}
export default File;
import Promise from 'bluebird';
import path from 'path';
import { execute, listDirectories } from '/common/util';
import { GitHubApi } from '/apis';
import { Category } from '/models';
class Hierarchy {
constructor(path) {
this.path = path;
this.refresh();
}
refresh() {
this.categories = listDirectories(this.path)
.map(categoryName => new Category(path.resolve(this.path, categoryName), categoryName));
const files = [];
this.categories.forEach(category => category.algorithms.forEach(algorithm => files.push(...algorithm.files)));
this.cacheCommitAuthors().then(commitAuthors => this.cacheContributors(files, commitAuthors));
}
cacheCommitAuthors(page = 1, commitAuthors = {}) {
const per_page = 100;
return GitHubApi.listCommits('algorithm-visualizer', 'algorithms', {
per_page,
page,
}).then(commits => {
commits.forEach(({ sha, commit, author }) => {
if (!author) return;
const { login, avatar_url } = author;
commitAuthors[sha] = { login, avatar_url };
});
if (commits.length < per_page) {
return commitAuthors;
} else {
return this.cacheCommitAuthors(page + 1, commitAuthors);
}
});
}
cacheContributors(files, commitAuthors) {
return Promise.each(files, file => {
return execute(`git --no-pager log --follow --no-merges --format="%H" "${file.path}"`, {
cwd: this.path, stdout: null,
}).then(stdout => {
const output = stdout.toString().replace(/\n$/, '');
const shas = output.split('\n').reverse();
const contributors = [];
for (const sha of shas) {
const author = commitAuthors[sha];
if (author && !contributors.find(contributor => contributor.login === author.login)) {
contributors.push(author);
}
}
file.contributors = contributors;
});
});
}
find(categoryKey, algorithmKey) {
const category = this.categories.find(category => category.key === categoryKey);
if (!category) return;
const algorithm = category.algorithms.find(algorithm => algorithm.key === algorithmKey);
if (!algorithm) return;
const categoryName = category.name;
const algorithmName = algorithm.name;
const files = algorithm.files;
const description = algorithm.description;
return { categoryKey, categoryName, algorithmKey, algorithmName, files, description };
}
iterate(callback) {
this.categories.forEach(category => category.algorithms.forEach(algorithm => callback(category, algorithm)));
}
toJSON() {
const { categories } = this;
return { categories };
}
}
export default Hierarchy;
export { default as Algorithm } from './Algorithm';
export { default as Category } from './Category';
export { default as File } from './File';
export { default as Hierarchy } from './Hierarchy';
import path from 'path';
import { execute } from '/common/util';
class ImageBuilder {
constructor(lang) {
this.lang = lang;
this.directory = path.resolve(__dirname, lang);
this.imageName = `tracer-${this.lang}`;
this.build = this.build.bind(this);
}
build(release) {
const { tag_name } = release;
return execute(`docker build -t ${this.imageName} . --build-arg tag_name=${tag_name}`, { cwd: this.directory });
}
}
export default ImageBuilder;
import path from 'path';
import { download } from '/common/util';
class WorkerBuilder {
constructor() {
this.tracerPath = path.resolve(__dirname, '..', 'public', 'algorithm-visualizer.js');
this.workerPath = path.resolve(__dirname, 'js', 'worker.js');
this.build = this.build.bind(this);
}
build(release) {
const { tag_name } = release;
return download(`https://github.com/algorithm-visualizer/tracers.js/releases/download/${tag_name}/algorithm-visualizer.js`, this.tracerPath);
}
}
export default WorkerBuilder;
FROM rikorose/gcc-cmake
ARG tag_name
RUN curl --create-dirs -o /usr/local/include/nlohmann/json.hpp -L "https://github.com/nlohmann/json/releases/download/v3.1.2/json.hpp" \
&& curl --create-dirs -o /usr/tmp/algorithm-visualizer.tar.gz -L "https://github.com/algorithm-visualizer/tracers.cpp/archive/${tag_name}.tar.gz" \
&& cd /usr/tmp \
&& mkdir algorithm-visualizer \
&& tar xvzf algorithm-visualizer.tar.gz -C algorithm-visualizer --strip-components=1 \
&& cd /usr/tmp/algorithm-visualizer \
&& mkdir build \
&& cd build \
&& cmake .. \
&& make install
CMD g++ Main.cpp -o Main -O2 -std=c++11 -lcurl \
&& ./Main
export { default as ImageBuilder } from './ImageBuilder';
export { default as WorkerBuilder } from './WorkerBuilder';
FROM openjdk:8
ARG tag_name
RUN curl --create-dirs -o /usr/local/lib/algorithm-visualizer.jar -L "https://github.com/algorithm-visualizer/tracers.java/releases/download/${tag_name}/algorithm-visualizer.jar"
CMD javac -cp /usr/local/lib/algorithm-visualizer.jar Main.java \
&& java -cp /usr/local/lib/algorithm-visualizer.jar:. Main
const process = { env: { ALGORITHM_VISUALIZER: '1' } };
importScripts('/api/tracers/js');
const sandbox = code => {
const require = name => ({ 'algorithm-visualizer': AlgorithmVisualizer }[name]); // fake require
eval(code);
};
onmessage = e => {
const lines = e.data.split('\n').map((line, i) => line.replace(/(\.\s*delay\s*)\(\s*\)/g, `$1(${i})`));
const code = lines.join('\n');
sandbox(code);
postMessage(AlgorithmVisualizer.Commander.commands);
};
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册