diff options
| -rw-r--r-- | .github/workflows/build.yml | 12 | ||||
| -rw-r--r-- | .gitignore | 2 | ||||
| -rw-r--r-- | dist/index.html | 68 | ||||
| -rw-r--r-- | package.json | 22 | ||||
| -rw-r--r-- | src/index.js | 17 | ||||
| -rw-r--r-- | webpack.config.js | 23 |
6 files changed, 143 insertions, 1 deletions
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml index 2f8f8fa..01afe77 100644 --- a/.github/workflows/build.yml +++ b/.github/workflows/build.yml @@ -1,4 +1,4 @@ -name: build +name: Build and deploy on: push: @@ -21,3 +21,13 @@ jobs: uses: actions/upload-artifact@v2 with: path: tag-versions + + - name: Build frontend + run: | + npm install + npm run build + - name: Deploy to Github Pages + uses: peaceiris/actions-gh-pages@v3 + with: + github_token: ${{ secrets.GITHUB_TOKEN }} + publish_dir: ./dist diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..8225baa --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +/node_modules +/dist diff --git a/dist/index.html b/dist/index.html new file mode 100644 index 0000000..1d8d93c --- /dev/null +++ b/dist/index.html @@ -0,0 +1,68 @@ +<!DOCTYPE html> +<html> + <head lang="en-US"> + <title>Vim help tag versions</title> +<style> +body { + color: #1d1f21; + padding: 0 5% 5%; + margin: 0 auto; + font: large "Open Sans", Helvetica, Arial, sans-serif; +} + +header { + background-color: #b5bd68; + display: flex; + justify-content: center; + align-items: center; + padding: .8em 0; + font-size: xx-large; + font-weight: 300; + margin-bottom: 1em; + text-align: center; +} + +#input { + border: 0; + border-bottom: 1px solid black; + border-radius: 0; + text-align: center; + background: transparent; + font: inherit; + color: inherit; +} + +#input:focus { + background: #1d1f2115; +} + +table { + width: 100%; + padding: 0 2em; + border-collapse: collapse; + line-height: 2; + border: solid #1d1f21; + border-width: 3px 0; +} + +table tr { + background-color: white; +} + +table tr:nth-child(even) { + background-color: #e0e0e0; +} +</style> + </head> + <body> + <header> + <label> + What Vim version added <input type="search" id="input" autofocus>? + </label> + </header> + + <table id="results"></table> + + <script src="bundle.js"></script> + </body> +</html> diff --git a/package.json b/package.json new file mode 100644 index 0000000..dd88d63 --- /dev/null +++ b/package.json @@ -0,0 +1,22 @@ +{ + "name": "vim-helptag-versions", + "version": "1.0.0", + "description": "Index of what Vim version introduced what help tag", + "repository": "git@github.com:axelf4/vim-helptag-versions.git", + "author": "Axel Forsman <axelsfor@gmail.com>", + "license": "MIT", + "private": true, + "scripts": { + "start": "webpack-dev-server --open", + "build": "webpack" + }, + "devDependencies": { + "csv-loader": "^3.0.3", + "webpack": "^4.44.1", + "webpack-cli": "^3.3.12", + "webpack-dev-server": "^3.11.0" + }, + "dependencies": { + "fuzzysort": "^1.1.4" + } +} diff --git a/src/index.js b/src/index.js new file mode 100644 index 0000000..6562fca --- /dev/null +++ b/src/index.js @@ -0,0 +1,17 @@ +import fuzzysort from "fuzzysort"; +import data from "../tag-versions"; + +const tagVersions = data.map(([version, helpTag]) => ({version, helpTag})); +const input = document.getElementById("input"), + results = document.getElementById("results"); + +function render() { + results.innerHTML = fuzzysort.go(input.value, tagVersions, { + key: 'helpTag', + limit: 50, + }) + .map(result => `<tr><td>${fuzzysort.highlight(result)}</td><td>${result.obj.version}</td></tr>`) + .join(""); +} +render(); +input.addEventListener("input", render); diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 0000000..dfb07f4 --- /dev/null +++ b/webpack.config.js @@ -0,0 +1,23 @@ +const path = require('path'); + +module.exports = { + entry: './src/index.js', + output: { + filename: 'bundle.js', + path: path.resolve(__dirname, 'dist'), + }, + devServer: { + contentBase: './dist', + }, + module: { + rules: [ + { + test: path.resolve(__dirname, 'tag-versions'), + loader: 'csv-loader', + options: { + delimiter: '\t', newline: '\n', + } + }, + ], + }, +}; |