Add HTTP API client-server binding

tshemsedinov · tshemsedinov · commit a65922f11927 · 2019-03-28T15:26:39.000+02:00
diff --git a/JavaScript/1-HTTP/api/move.js b/JavaScript/1-HTTP/api/move.js
@@ -0,0 +1,14 @@
+const move = (point, x, y) => {
+  point.x += x;
+  point.y += y;
+};
+
+module.exports = async (name, x, y) => {
+  const shape = memory.get(name);
+  if (!shape) return 'Shape is not found';
+  for (const key in shape) {
+    const point = shape[key];
+    move(point, x, y);
+  }
+  return 'Shape moved';
+};
diff --git a/JavaScript/1-HTTP/api/read.js b/JavaScript/1-HTTP/api/read.js
@@ -0,0 +1,5 @@
+module.exports = async name => {
+  const shape = memory.get(name);
+  if (!shape) return 'Shape is not found';
+  return shape;
+};
diff --git a/JavaScript/1-HTTP/api/rect.js b/JavaScript/1-HTTP/api/rect.js
@@ -0,0 +1,21 @@
+class Point {
+  constructor(x, y) {
+    this.x = x;
+    this.y = y;
+  }
+}
+
+class Rect {
+  constructor(x1, y1, x2, y2) {
+    this.a = new Point(x1, y1);
+    this.b = new Point(x2, y1);
+    this.c = new Point(x2, y2);
+    this.d = new Point(x1, y2);
+  }
+}
+
+module.exports = async (name, x1, y1, x2, y2) => {
+  const rect = new Rect(x1, y1, x2, y2);
+  memory.set(name, rect);
+  return 'ok';
+};
diff --git a/JavaScript/1-HTTP/api/render.js b/JavaScript/1-HTTP/api/render.js
@@ -0,0 +1,15 @@
+module.exports = async name => {
+  const shape = memory.get(name);
+  if (!shape) return 'Shape is not found';
+  const points = [];
+  for (const key in shape) {
+    const point = shape[key];
+    points.push(point);
+  }
+  const svg = [];
+  svg.push('<svg viewBox="-20 -20 40 40" xmlns="http://www.w3.org/2000/svg">');
+  svg.push('<polygon points="');
+  svg.push(points.map(point => `${point.x},${point.y}`).join(' '));
+  svg.push('" /></svg>');
+  return svg.join('');
+};
diff --git a/JavaScript/1-HTTP/api/rotate.js b/JavaScript/1-HTTP/api/rotate.js
@@ -0,0 +1,17 @@
+const rotate = (point, angle) => {
+  const sin = Math.sin(angle);
+  const cos = Math.cos(angle);
+  const { x, y } = point;
+  point.x = x * cos - y * sin;
+  point.y = x * sin + y * cos;
+};
+
+module.exports = async (name, angle) => {
+  const shape = memory.get(name);
+  if (!shape) return 'Shape is not found';
+  for (const key in shape) {
+    const point = shape[key];
+    rotate(point, angle);
+  }
+  return 'Shape rotated';
+};
diff --git a/JavaScript/1-HTTP/server.js b/JavaScript/1-HTTP/server.js
@@ -0,0 +1,84 @@
+'use strict';
+
+const http = require('http');
+const path = require('path');
+const fs = require('fs');
+
+global.memory = new Map();
+const api = new Map();
+
+const apiPath = './api/';
+
+const cacheFile = name => {
+  const filePath = apiPath + name;
+  const key = path.basename(filePath, '.js');
+  try {
+    const libPath = require.resolve(filePath);
+    delete require.cache[libPath];
+  } catch (e) {
+    return;
+  }
+  try {
+    const method = require(filePath);
+    api.set(key, method);
+  } catch (e) {
+    cache.delete(name);
+  }
+};
+
+const cacheFolder = path => {
+  fs.readdir(path, (err, files) => {
+    if (err) return;
+    files.forEach(cacheFile);
+  });
+};
+
+const watch = path => {
+  fs.watch(path, (event, file) => {
+    cacheFile(file);
+  });
+};
+
+cacheFolder(apiPath);
+watch(apiPath);
+
+setTimeout(() => {
+  console.dir({ api });
+}, 1000);
+
+http.createServer(async (req, res) => {
+  const url = req.url === '/' ? '/index.html' : req.url;
+  const [s, folder, file] = url.split('/');
+  if (folder === 'api') {
+    const method = api.get(file);
+    const body = [];
+    req.on('data', chunk => {
+      body.push(chunk);
+    }).on('end', async () => {
+      const data = body.join('');
+      const args = JSON.parse(data);
+      try {
+        const result = await method(...args);
+        if (!result) {
+          res.statusCode = 500;
+          res.end('"Server error"');
+          return;
+        }
+        res.end(JSON.stringify(result));
+      } catch (err) {
+        console.dir({ err });
+        res.statusCode = 500;
+        res.end('"Server error"');
+      }
+    });
+  } else {
+    const path = `./static/${folder}`;
+    try {
+      const data = await fs.promises.readFile(path);
+      res.end(data);
+    } catch (err) {
+      res.statusCode = 404;
+      res.end('"File is not found"');
+    }
+  }
+}).listen(8000);
diff --git a/JavaScript/1-HTTP/static/client.js b/JavaScript/1-HTTP/static/client.js
@@ -0,0 +1,41 @@
+'use strict';
+
+const buildAPI = methods => {
+  const api = {};
+  for (const method of methods) {
+    api[method] = (...args) => new Promise((resolve, reject) => {
+      const url = `/api/${method}`;
+      console.log(url);
+      fetch(url, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(args),
+      }).then(res => {
+        const { status } = res;
+        if (status !== 200) {
+          reject(new Error(`Status Code: ${status}`));
+          return;
+        }
+        resolve(res.json());
+      });
+    });
+  }
+  return api;
+};
+
+const show = async () => {
+  const svg = await api.render('Rect1');
+  const output = document.getElementById('output');
+  output.innerHTML = svg;
+};
+
+const scenario = async () => {
+  await api.rect('Rect1', -10, 10, 10, -10);
+  await api.move('Rect1', 5, 5);
+  await api.rotate('Rect1', 5);
+  const data = await api.read('Rect1');
+  await show();
+};
+
+const api = buildAPI(['rect', 'move', 'rotate', 'read', 'render']);
+scenario();
diff --git a/JavaScript/1-HTTP/static/index.html b/JavaScript/1-HTTP/static/index.html
@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src="client.js"></script>
+</head>
+<body>
+  <div id="output"></div>
+</body>
+</html>
