Merge pull request #1239 from crawlab-team/develop

Develop
2026-01-21 17:21:09 +01:00 · 2022-12-20 13:33:12 +08:00
parent b9e5ec4e6d deeec93855
commit 088619f1f4
13 changed files with 4014 additions and 45 deletions
--- a/backend/conf/config.yml
+++ b/backend/conf/config.yml
@@ -1,3 +1,3 @@
 info:
  edition: global.edition.community
-  version: v0.6.0-2
+  version: v0.6.0-3
--- a/backend/go.mod
+++ b/backend/go.mod
@@ -2,4 +2,116 @@ module crawlab

 go 1.16

-require github.com/crawlab-team/crawlab-core v0.6.1-0.20221111034633-357a8ce0403b
+require github.com/crawlab-team/crawlab-core v0.6.1-0.20221218100507-9f27ace089f9
+
+require (
+	github.com/Masterminds/semver v1.4.2 // indirect
+	github.com/Masterminds/sprig v2.16.0+incompatible // indirect
+	github.com/PuerkitoBio/goquery v1.8.0 // indirect
+	github.com/ReneKroon/ttlcache v1.7.0 // indirect
+	github.com/andybalholm/cascadia v1.3.1 // indirect
+	github.com/aokoli/goutils v1.0.1 // indirect
+	github.com/apex/log v1.9.0 // indirect
+	github.com/blang/semver/v4 v4.0.0 // indirect
+	github.com/cenkalti/backoff/v4 v4.1.0 // indirect
+	github.com/crawlab-team/crawlab-db v0.6.0-beta.20220417.1300.0.20221020034454-40c7a5c6cbe2 // indirect
+	github.com/crawlab-team/crawlab-fs v0.6.0-beta.20211101.1940.0.20221218100256-a28d12756f73 // indirect
+	github.com/crawlab-team/crawlab-grpc v0.6.0-beta.20211219.1930.0.20221020032435-afa1c691f73c // indirect
+	github.com/crawlab-team/crawlab-log v0.1.1-0.20221001084727-6c3b35136f2b // indirect
+	github.com/crawlab-team/crawlab-vcs v0.6.0-beta.20211113.2048.0.20221024150201-467fe22630f8 // indirect
+	github.com/crawlab-team/go-trace v0.1.1 // indirect
+	github.com/crawlab-team/goseaweedfs v0.6.0-beta.20211101.1936.0.20220912021203-dfee5f74dd69 // indirect
+	github.com/crawlab-team/template-parser v0.0.4-0.20221006034646-9bb77a7ae86e // indirect
+	github.com/dgrijalva/jwt-go v3.2.0+incompatible // indirect
+	github.com/emirpasic/gods v1.18.1 // indirect
+	github.com/fsnotify/fsnotify v1.5.1 // indirect
+	github.com/gin-contrib/sse v0.1.0 // indirect
+	github.com/gin-gonic/gin v1.8.1 // indirect
+	github.com/go-git/gcfg v1.5.0 // indirect
+	github.com/go-git/go-billy/v5 v5.0.0 // indirect
+	github.com/go-git/go-git/v5 v5.2.0 // indirect
+	github.com/go-ole/go-ole v1.2.6 // indirect
+	github.com/go-playground/locales v0.14.0 // indirect
+	github.com/go-playground/universal-translator v0.18.0 // indirect
+	github.com/go-playground/validator/v10 v10.11.0 // indirect
+	github.com/go-stack/stack v1.8.0 // indirect
+	github.com/goccy/go-json v0.9.8 // indirect
+	github.com/golang/protobuf v1.5.2 // indirect
+	github.com/golang/snappy v0.0.3 // indirect
+	github.com/google/uuid v1.1.2 // indirect
+	github.com/gorilla/css v1.0.0 // indirect
+	github.com/grpc-ecosystem/go-grpc-middleware v1.0.1-0.20190118093823-f849b5445de4 // indirect
+	github.com/hashicorp/go-uuid v1.0.1 // indirect
+	github.com/hashicorp/hcl v1.0.0 // indirect
+	github.com/huandu/xstrings v1.2.0 // indirect
+	github.com/imdario/mergo v0.3.9 // indirect
+	github.com/imroc/req v0.3.0 // indirect
+	github.com/inconshreveable/mousetrap v1.0.0 // indirect
+	github.com/jaytaylor/html2text v0.0.0-20180606194806-57d518f124b0 // indirect
+	github.com/jbenet/go-context v0.0.0-20150711004518-d14ea06fba99 // indirect
+	github.com/joeshaw/multierror v0.0.0-20140124173710-69b34d4ec901 // indirect
+	github.com/josharian/intern v1.0.0 // indirect
+	github.com/json-iterator/go v1.1.12 // indirect
+	github.com/kevinburke/ssh_config v0.0.0-20190725054713-01f96b0aa0cd // indirect
+	github.com/klauspost/compress v1.13.6 // indirect
+	github.com/leodido/go-urn v1.2.1 // indirect
+	github.com/linxGnu/gumble v1.0.0 // indirect
+	github.com/logrusorgru/aurora v0.0.0-20181002194514-a7b3b318ed4e // indirect
+	github.com/magiconair/properties v1.8.5 // indirect
+	github.com/mailru/easyjson v0.7.7 // indirect
+	github.com/matcornic/hermes/v2 v2.1.0 // indirect
+	github.com/mattn/go-isatty v0.0.14 // indirect
+	github.com/mattn/go-runewidth v0.0.3 // indirect
+	github.com/mitchellh/go-homedir v1.1.0 // indirect
+	github.com/mitchellh/mapstructure v1.4.3 // indirect
+	github.com/modern-go/concurrent v0.0.0-20180306012644-bacd9c7ef1dd // indirect
+	github.com/modern-go/reflect2 v1.0.2 // indirect
+	github.com/olekukonko/tablewriter v0.0.1 // indirect
+	github.com/olivere/elastic/v7 v7.0.15 // indirect
+	github.com/pelletier/go-toml v1.9.4 // indirect
+	github.com/pelletier/go-toml/v2 v2.0.2 // indirect
+	github.com/pkg/errors v0.9.1 // indirect
+	github.com/robertkrimen/otto v0.0.0-20210614181706-373ff5438452 // indirect
+	github.com/robfig/cron/v3 v3.0.0 // indirect
+	github.com/russross/blackfriday/v2 v2.1.0 // indirect
+	github.com/satori/go.uuid v1.2.0 // indirect
+	github.com/sergi/go-diff v1.1.0 // indirect
+	github.com/shirou/gopsutil v3.21.11+incompatible // indirect
+	github.com/spf13/afero v1.6.0 // indirect
+	github.com/spf13/cast v1.4.1 // indirect
+	github.com/spf13/cobra v1.3.0 // indirect
+	github.com/spf13/jwalterweatherman v1.1.0 // indirect
+	github.com/spf13/pflag v1.0.5 // indirect
+	github.com/spf13/viper v1.10.0 // indirect
+	github.com/ssor/bom v0.0.0-20170718123548-6386211fdfcf // indirect
+	github.com/subosito/gotenv v1.2.0 // indirect
+	github.com/thoas/go-funk v0.9.1 // indirect
+	github.com/tklauser/go-sysconf v0.3.9 // indirect
+	github.com/tklauser/numcpus v0.3.0 // indirect
+	github.com/ugorji/go/codec v1.2.7 // indirect
+	github.com/vanng822/css v0.0.0-20190504095207-a21e860bcd04 // indirect
+	github.com/vanng822/go-premailer v0.0.0-20191214114701-be27abe028fe // indirect
+	github.com/xanzy/ssh-agent v0.2.1 // indirect
+	github.com/xdg-go/pbkdf2 v1.0.0 // indirect
+	github.com/xdg-go/scram v1.0.2 // indirect
+	github.com/xdg-go/stringprep v1.0.2 // indirect
+	github.com/youmark/pkcs8 v0.0.0-20181117223130-1be2e3e5546d // indirect
+	github.com/yusufpapurcu/wmi v1.2.2 // indirect
+	github.com/ztrue/tracerr v0.3.0 // indirect
+	go.mongodb.org/mongo-driver v1.8.0 // indirect
+	go.uber.org/dig v1.10.0 // indirect
+	golang.org/x/crypto v0.0.0-20220622213112-05595931fe9d // indirect
+	golang.org/x/net v0.0.0-20220630215102-69896b714898 // indirect
+	golang.org/x/sync v0.0.0-20210220032951-036812b2e83c // indirect
+	golang.org/x/sys v0.0.0-20220702020025-31831981b65f // indirect
+	golang.org/x/text v0.3.7 // indirect
+	google.golang.org/genproto v0.0.0-20211208223120-3a66f561d7aa // indirect
+	google.golang.org/grpc v1.42.0 // indirect
+	google.golang.org/protobuf v1.28.0 // indirect
+	gopkg.in/alexcesaro/quotedprintable.v3 v3.0.0-20150716171945-2caba252f4dc // indirect
+	gopkg.in/gomail.v2 v2.0.0-20160411212932-81ebce5c23df // indirect
+	gopkg.in/ini.v1 v1.66.2 // indirect
+	gopkg.in/sourcemap.v1 v1.0.5 // indirect
+	gopkg.in/warnings.v0 v0.1.2 // indirect
+	gopkg.in/yaml.v2 v2.4.0 // indirect
+)
--- a/backend/go.sum
+++ b/backend/go.sum
@@ -129,16 +129,14 @@ github.com/coreos/go-systemd v0.0.0-20190321100706-95778dfbb74e/go.mod h1:F5haX7
 github.com/coreos/go-systemd/v22 v22.3.2/go.mod h1:Y58oyj3AT4RCenI/lSvhwexgC+NSVTIJ3seZv2GcEnc=
 github.com/coreos/pkg v0.0.0-20180928190104-399ea9e2e55f/go.mod h1:E3G3o1h8I7cfcXa63jLwjI0eiQQMgzzUDFVpN/nH/eA=
 github.com/cpuguy83/go-md2man/v2 v2.0.1/go.mod h1:tgQtvFlXSQOSOSIRvRPT7W67SCa46tRHOmNcaadrF8o=
-github.com/crawlab-team/crawlab-core v0.6.1-0.20221031113626-cea0654441d7 h1:neDrbgnpJmapi3Y1F7kqRN08ofC/PbVFtdTKVoFEYro=
-github.com/crawlab-team/crawlab-core v0.6.1-0.20221031113626-cea0654441d7/go.mod h1:7j+NZVXLxBlZpQq0WSVLlKlQ6Vmxqq7FQK9WcNxOlwc=
-github.com/crawlab-team/crawlab-core v0.6.1-0.20221111034633-357a8ce0403b h1:Qk1TspDVtVQ6vGm2fDCGBWIvlTdJMYb8/whSKMQFryA=
-github.com/crawlab-team/crawlab-core v0.6.1-0.20221111034633-357a8ce0403b/go.mod h1:7j+NZVXLxBlZpQq0WSVLlKlQ6Vmxqq7FQK9WcNxOlwc=
+github.com/crawlab-team/crawlab-core v0.6.1-0.20221218100507-9f27ace089f9 h1:pDkLufdTp+hwIn8ruU5CbfP0mLrRovuSzb+w4qCJ4Q4=
+github.com/crawlab-team/crawlab-core v0.6.1-0.20221218100507-9f27ace089f9/go.mod h1:/wp/xXBzg4lSouj8x3uZ6m56m/pOg+jhtnzBH6+eCGo=
 github.com/crawlab-team/crawlab-db v0.6.0-1/go.mod h1:gfeF0nAnFuup6iYvgHkY0in/HpO/+JktXqVNMdhoxhU=
 github.com/crawlab-team/crawlab-db v0.6.0-beta.20220417.1300.0.20221020034454-40c7a5c6cbe2 h1:dmC9D/BSHv6yh8khtQ7cDYFh8Yzr8NmhbAMBS36h9dA=
 github.com/crawlab-team/crawlab-db v0.6.0-beta.20220417.1300.0.20221020034454-40c7a5c6cbe2/go.mod h1:gfeF0nAnFuup6iYvgHkY0in/HpO/+JktXqVNMdhoxhU=
 github.com/crawlab-team/crawlab-fs v0.6.0-beta.20211101.1940/go.mod h1:dA1G6xeiClbTMkjRuoagGrcKfQ97jJZRAhZUSwrKdoI=
-github.com/crawlab-team/crawlab-fs v0.6.0-beta.20211101.1940.0.20220912130912-a47819e0c7c9 h1:h1SCAinaakI8rtL2kh3ciTSfiHaC7RyD/HK1d3Mil7U=
-github.com/crawlab-team/crawlab-fs v0.6.0-beta.20211101.1940.0.20220912130912-a47819e0c7c9/go.mod h1:y9YhLLR3GuPrDuPKe7ZuiHCITK9K2IcI8nlznF8YIEc=
+github.com/crawlab-team/crawlab-fs v0.6.0-beta.20211101.1940.0.20221218100256-a28d12756f73 h1:xIgfVPa3ZJWC72Y57oHS41n4jRtGZPn1YDEYBgMj2EU=
+github.com/crawlab-team/crawlab-fs v0.6.0-beta.20211101.1940.0.20221218100256-a28d12756f73/go.mod h1:y9YhLLR3GuPrDuPKe7ZuiHCITK9K2IcI8nlznF8YIEc=
 github.com/crawlab-team/crawlab-grpc v0.6.0-beta.20211219.1930.0.20221020032435-afa1c691f73c h1:jX0iax3WHwomWGQVWrCTy8a4zYDsKKyuspP3+04XCcU=
 github.com/crawlab-team/crawlab-grpc v0.6.0-beta.20211219.1930.0.20221020032435-afa1c691f73c/go.mod h1:Bq2Pm967EYWbjhP5Ghc4DV2LZgbOLMzLftJXDJYz/gs=
 github.com/crawlab-team/crawlab-log v0.1.1-0.20221001084727-6c3b35136f2b h1:qStgbyujyIm/h1qeD+cu8knmaD+n+upsFvCsqzJW9EE=
--- a/frontend/.npmrc
+++ b/frontend/.npmrc
@@ -1,2 +1 @@
-registry=https://registry.npm.taobao.org
-sass_binary_site=https://npm.taobao.org/mirrors/node-sass
+registry=https://registry.npmjs.org
--- a/frontend/Dockerfile
+++ b/frontend/Dockerfile
@@ -1,11 +1,13 @@
-FROM node:12 AS build
+FROM node:14 AS build

 ADD . /app
 WORKDIR /app
 RUN rm /app/.npmrc

 # install frontend
-RUN yarn install && yarn run build:docker
+RUN npm i -g pnpm
+RUN pnpm install
+RUN pnpm run build

 FROM alpine:3.14

--- a/frontend/public/index.html
+++ b/frontend/public/index.html
@@ -1,18 +1,15 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-  <title><%= htmlWebpackPlugin.options.title %></title>
-  <link rel="icon" type="image/x-icon" href="<%= BASE_URL %>favicon.ico">
-  <link rel="stylesheet" href="font-awesome.min.css">
  <meta charset="utf-8">
  <meta content="IE=edge" http-equiv="X-UA-Compatible">
  <meta content="width=device-width,initial-scale=1.0" name="viewport">
-  <script>
-      window.VUE_APP_API_BASE_URL = '<%= VUE_APP_API_BASE_URL %>';
-      window.VUE_APP_INIT_UMENG = '<%= VUE_APP_INIT_UMENG %>';
-      window.VUE_APP_INIT_BAIDU_TONGJI = '<%= VUE_APP_INIT_BAIDU_TONGJI %>';
-  </script>
-  <script src="/js/vue3-sfc-loader.js"></script>
+  <link href="favicon.ico" rel="icon">
+  <link href="font-awesome.min.css" rel="stylesheet">
+  <title>Crawlab</title>
+  <script src="js/vue3-sfc-loader.js"></script>
+  <script src="js/login-canvas.js"></script>
+  <script src="simplemde/simplemde.js"></script>
  <style>
      #loading-placeholder {
          position: fixed;
@@ -216,6 +213,7 @@
  </div>
 </div>
 <div id="app"></div>
+<script type="module" src="/src/main.ts"></script>
 <!-- built files will be auto injected -->
 </body>
 </html>
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -2,12 +2,10 @@
  "name": "@crawlab/app",
  "version": "0.6.0",
  "scripts": {
-    "serve": "vue-cli-service serve",
+    "serve": "vite",
    "serve:dist": "serve dist",
-    "build": "vue-cli-service build",
-    "build:development": "vue-cli-service build --mode development",
-    "build:docker": "vue-cli-service build --mode docker",
-    "build:analyze": "vue-cli-service build --mode analyze"
+    "build": "vite build",
+    "build:docker": "vite build --mode docker"
  },
  "author": {
    "name": "Marvin Zhang",
@@ -21,26 +19,22 @@
    "@fortawesome/free-regular-svg-icons": "^6.0.0",
    "@fortawesome/free-solid-svg-icons": "^6.0.0",
    "@fortawesome/vue-fontawesome": "^3.0.0-5",
+    "@vitejs/plugin-vue": "^3.2.0",
    "atom-material-icons": "^3.0.0",
    "codemirror": "^5.59.1",
-    "crawlab-ui": "0.6.0-18",
+    "crawlab-ui": "0.6.0-37",
    "echarts": "^5.1.2",
    "element-plus": "^1.3.0-beta.10",
    "vue": "^3.2",
    "vue-router": "^4.0.11"
  },
  "devDependencies": {
-    "@babel/core": "^7.17.2",
-    "@babel/preset-env": "^7.16.11",
-    "@babel/preset-typescript": "^7.16.7",
-    "@vue/cli-plugin-babel": "^4.5.15",
-    "@vue/cli-service": "^4.5.15",
-    "@vue/compiler-sfc": "^3.0.11",
-    "babel-loader": "^8.2.3",
-    "copy-webpack-plugin": "^6.0",
-    "raw-loader": "^4.0.2",
-    "serve": "^13.0.2",
-    "webpack-bundle-analyzer": "^4.5.0"
+    "@types/node": "^18.11.10",
+    "@vue/compiler-sfc": "^3.2.45",
+    "typescript": "^4.6.4",
+    "vite": "^3.2.4",
+    "vite-aliases": "^0.9.7",
+    "vite-plugin-dynamic-import": "^1.2.4",
+    "vue-tsc": "^1.0.9"
  }
 }
-
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
--- a/frontend/public/js/login-canvas.js
+++ b/frontend/public/js/login-canvas.js
@@ -0,0 +1,258 @@
+function initCanvas() {
+  let canvas, ctx, circ, nodes, mouse, SENSITIVITY, SIBLINGS_LIMIT, DENSITY, NODES_QTY, ANCHOR_LENGTH, MOUSE_RADIUS,
+    TURBULENCE, MOUSE_MOVING_TURBULENCE, MOUSE_ANGLE_TURBULENCE, MOUSE_MOVING_RADIUS, BASE_BRIGHTNESS, RADIUS_DEGRADE,
+    SAMPLE_SIZE
+
+  let handle
+
+  // how close next node must be to activate connection (in px)
+  // shorter distance == better connection (line width)
+  SENSITIVITY = 200
+  // note that siblings limit is not 'accurate' as the node can actually have more connections than this value that's because the node accepts sibling nodes with no regard to their current connections this is acceptable because potential fix would not result in significant visual difference
+  // more siblings == bigger node
+  SIBLINGS_LIMIT = 10
+  // default node margin
+  DENSITY = 100
+  // total number of nodes used (incremented after creation)
+  NODES_QTY = 0
+  // avoid nodes spreading
+  ANCHOR_LENGTH = 100
+  // highlight radius
+  MOUSE_RADIUS = 200
+  // turbulence of randomness
+  TURBULENCE = 3
+  // turbulence of mouse moving
+  MOUSE_MOVING_TURBULENCE = 50
+  // turbulence of mouse moving angle
+  MOUSE_ANGLE_TURBULENCE = 0.002
+  // moving radius of mouse
+  MOUSE_MOVING_RADIUS = 600
+  // base brightness
+  BASE_BRIGHTNESS = 0.12
+  // radius degrade
+  RADIUS_DEGRADE = 0.4
+  // sample size
+  SAMPLE_SIZE = 0.5
+
+  circ = 2 * Math.PI
+  nodes = []
+
+  canvas = document.querySelector('#canvas')
+  if (!canvas) return;
+  resizeWindow()
+  ctx = canvas.getContext('2d')
+  if (!ctx) {
+    alert('Ooops! Your browser does not support canvas :\'(')
+  }
+
+  function Mouse(x, y) {
+    this.anchorX = x
+    this.anchorY = y
+    this.x = x
+    this.y = y - MOUSE_RADIUS / 2
+    this.angle = 0
+  }
+
+  Mouse.prototype.computePosition = function () {
+    // this.x = this.anchorX + MOUSE_MOVING_RADIUS / 2 * Math.sin(this.angle)
+    // this.y = this.anchorY - MOUSE_MOVING_RADIUS / 2 * Math.cos(this.angle)
+  }
+
+  Mouse.prototype.move = function () {
+    let vx = Math.random() * MOUSE_MOVING_TURBULENCE
+    let vy = Math.random() * MOUSE_MOVING_TURBULENCE
+    if (this.x + vx + MOUSE_RADIUS / 2 > window.innerWidth || this.x + vx - MOUSE_RADIUS / 2 < 0) {
+      vx = -vx
+    }
+    if (this.y + vy + MOUSE_RADIUS / 2 > window.innerHeight || this.y + vy - MOUSE_RADIUS / 2 < 0) {
+      vy = -vy
+    }
+    this.x += vx
+    this.y += vy
+    // this.angle += Math.random() * MOUSE_ANGLE_TURBULENCE * 2 * Math.PI
+    // this.angle -= Math.floor(this.angle / (2 * Math.PI)) * 2 * Math.PI
+    // this.computePosition()
+  }
+
+  function Node(x, y) {
+    this.anchorX = x
+    this.anchorY = y
+    this.x = Math.random() * (x - (x - ANCHOR_LENGTH)) + (x - ANCHOR_LENGTH)
+    this.y = Math.random() * (y - (y - ANCHOR_LENGTH)) + (y - ANCHOR_LENGTH)
+    this.vx = Math.random() * TURBULENCE - 1
+    this.vy = Math.random() * TURBULENCE - 1
+    this.energy = Math.random() * 100
+    this.radius = Math.random()
+    this.siblings = []
+    this.brightness = 0
+  }
+
+  Node.prototype.drawNode = function () {
+    let color = 'rgba(64, 156, 255, ' + this.brightness + ')'
+    ctx.beginPath()
+    ctx.arc(this.x, this.y, 2 * this.radius + 2 * this.siblings.length / SIBLINGS_LIMIT / 1.5, 0, circ)
+    ctx.fillStyle = color
+    ctx.fill()
+  }
+
+  Node.prototype.drawConnections = function () {
+    for (let i = 0; i < this.siblings.length; i++) {
+      let color = 'rgba(64, 156, 255, ' + this.brightness + ')'
+      ctx.beginPath()
+      ctx.moveTo(this.x, this.y)
+      ctx.lineTo(this.siblings[i].x, this.siblings[i].y)
+      ctx.lineWidth = 1 - calcDistance(this, this.siblings[i]) / SENSITIVITY
+      ctx.strokeStyle = color
+      ctx.stroke()
+    }
+  }
+
+  Node.prototype.moveNode = function () {
+    this.energy -= 2
+    if (this.energy < 1) {
+      this.energy = Math.random() * 100
+      if (this.x - this.anchorX < -ANCHOR_LENGTH) {
+        this.vx = Math.random() * TURBULENCE
+      } else if (this.x - this.anchorX > ANCHOR_LENGTH) {
+        this.vx = Math.random() * -TURBULENCE
+      } else {
+        this.vx = Math.random() * 2 * TURBULENCE - TURBULENCE
+      }
+      if (this.y - this.anchorY < -ANCHOR_LENGTH) {
+        this.vy = Math.random() * TURBULENCE
+      } else if (this.y - this.anchorY > ANCHOR_LENGTH) {
+        this.vy = Math.random() * -TURBULENCE
+      } else {
+        this.vy = Math.random() * 2 * TURBULENCE - TURBULENCE
+      }
+    }
+    this.x += this.vx * this.energy / 100
+    this.y += this.vy * this.energy / 100
+  }
+
+  function Handle() {
+    this.isStopped = false
+  }
+
+  Handle.prototype.stop = function () {
+    this.isStopped = true
+  }
+
+  function initNodes() {
+    ctx.clearRect(0, 0, canvas.width, canvas.height)
+    nodes = []
+    for (let i = DENSITY; i < canvas.width; i += DENSITY) {
+      for (let j = DENSITY; j < canvas.height; j += DENSITY) {
+        nodes.push(new Node(i, j))
+        NODES_QTY++
+      }
+    }
+  }
+
+  function initMouse() {
+    mouse = new Mouse(canvas.width / 2, canvas.height / 2)
+  }
+
+  function initHandle() {
+    handle = new Handle()
+  }
+
+  function calcDistance(node1, node2) {
+    return Math.sqrt(Math.pow(node1.x - node2.x, 2) + (Math.pow(node1.y - node2.y, 2)))
+  }
+
+  function findSiblings() {
+    let node1, node2, distance
+    for (let i = 0; i < NODES_QTY; i++) {
+      node1 = nodes[i]
+      node1.siblings = []
+      for (let j = 0; j < NODES_QTY; j++) {
+        node2 = nodes[j]
+        if (node1 !== node2) {
+          distance = calcDistance(node1, node2)
+          if (distance < SENSITIVITY) {
+            if (node1.siblings.length < SIBLINGS_LIMIT) {
+              node1.siblings.push(node2)
+            } else {
+              let node_sibling_distance = 0
+              let max_distance = 0
+              let s
+              for (let k = 0; k < SIBLINGS_LIMIT; k++) {
+                node_sibling_distance = calcDistance(node1, node1.siblings[k])
+                if (node_sibling_distance > max_distance) {
+                  max_distance = node_sibling_distance
+                  s = k
+                }
+              }
+              if (distance < max_distance) {
+                node1.siblings.splice(s, 1)
+                node1.siblings.push(node2)
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+
+  function redrawScene() {
+    if (handle && handle.isStopped) {
+      return
+    }
+    resizeWindow()
+    ctx.clearRect(0, 0, canvas.width, canvas.height)
+    findSiblings()
+    let i, node, distance
+    for (i = 0; i < NODES_QTY; i++) {
+      node = nodes[i]
+      distance = calcDistance({
+        x: mouse.x,
+        y: mouse.y
+      }, node)
+      node.brightness = (1 - Math.log(distance / MOUSE_RADIUS * RADIUS_DEGRADE)) * BASE_BRIGHTNESS
+    }
+    for (i = 0; i < NODES_QTY; i++) {
+      node = nodes[i]
+      if (node.brightness) {
+        node.drawNode()
+        node.drawConnections()
+      }
+      node.moveNode()
+    }
+    // mouse.move()
+    setTimeout(() => {
+      requestAnimationFrame(redrawScene)
+    }, 50)
+  }
+
+  function initHandlers() {
+    document.addEventListener('resize', resizeWindow, {passive: true})
+    // canvas.addEventListener('mousemove', mousemoveHandler, false)
+  }
+
+  function resizeWindow() {
+    canvas.width = window.innerWidth
+    canvas.height = window.innerHeight
+  }
+
+  function mousemoveHandler(e) {
+    mouse.x = e.clientX
+    mouse.y = e.clientY
+  }
+
+  function init() {
+    initHandlers()
+    initNodes()
+    initMouse()
+    initHandle()
+    redrawScene()
+  }
+
+  function reset() {
+    handle.isStopped = true
+  }
+
+  init()
+
+  window.resetCanvas = reset
+}
--- a/frontend/public/simplemde/simplemde.js
+++ b/frontend/public/simplemde/simplemde.js
--- a/frontend/src/main.ts
+++ b/frontend/src/main.ts
@@ -1,4 +1,4 @@
-import 'crawlab-ui/dist/crawlab-ui.css';
+import 'crawlab-ui/dist/style.css';
 import 'vue';
 import {createApp} from 'crawlab-ui';

--- a/frontend/tsconfig.json
+++ b/frontend/tsconfig.json
@@ -12,9 +12,6 @@
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
-    "types": [
-      "webpack-env"
-    ],
    "paths": {
      "@/*": [
        "src/*"
@@ -25,14 +22,17 @@
      "dom",
      "dom.iterable",
      "scripthost"
+    ],
+    "typeRoots": [
+      "src/interfaces"
    ]
  },
  "include": [
+    "src/shims-vue.d.ts",
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
-    "__test__/**/*.ts",
-    "__test__/**/*.tsx"
+    "__test__/**/*.spec.ts"
  ],
  "exclude": [
    "node_modules",
--- a/frontend/vite.config.ts
+++ b/frontend/vite.config.ts
@@ -0,0 +1,28 @@
+import {resolve} from 'path';
+import {defineConfig} from 'vite';
+import vue from '@vitejs/plugin-vue';
+import dynamicImport from 'vite-plugin-dynamic-import';
+
+export default defineConfig({
+  resolve: {
+    alias: [
+      {find: '@', replacement: resolve(__dirname, 'src')},
+    ],
+    extensions: [
+      '.js',
+      '.ts',
+      '.jsx',
+      '.tsx',
+      '.json',
+      '.vue',
+      '.scss',
+    ]
+  },
+  plugins: [
+    vue(),
+    dynamicImport(),
+  ],
+  server: {
+    cors: true,
+  },
+});