feat: regex memo
This commit is contained in:
Nicolas Maltais-Dansereau
parent
5bd5d2c2f3
commit
8aef7e8d1e
@ -3,7 +3,10 @@ All notable changes to this project will be documented in this file.
|
||||
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||
|
||||
## Next
|
||||
## 1.8.0
|
||||
- [feat] [REGEX memo](https://it-tools.tech/regex-memo)
|
||||
|
||||
## 1.7.0
|
||||
- [feat] [Crontab friendly generator](https://it-tools.tech/crontab-generator)
|
||||
|
||||
## 1.6.0
|
||||
|
||||
@ -23,7 +23,7 @@ Here is an unordered list of the current functionalities, and some that may come
|
||||
- [x] Base 64 string converter
|
||||
- [x] Crontab friendly generator
|
||||
- [ ] CSS memo (cheat sheet)
|
||||
- [ ] REGEX memo (cheat sheet) + tester?
|
||||
- [x] REGEX memo (cheat sheet) + tester?
|
||||
- [ ] Minify/un-minify
|
||||
- [ ] Image exif editor/remover
|
||||
- [ ] Image format converter?
|
||||
|
||||
232
package-lock.json
generated
232
package-lock.json
generated
@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "it-tools",
|
||||
"version": "1.7.0",
|
||||
"version": "1.8.0",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
@ -1196,6 +1196,12 @@
|
||||
"@types/node": "*"
|
||||
}
|
||||
},
|
||||
"@types/json-schema": {
|
||||
"version": "7.0.6",
|
||||
"resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.6.tgz",
|
||||
"integrity": "sha512-3c+yGKvVP5Y9TYBEibGNR+kLtijnj7mYrXRg+WpFb2X9xm04g/DXYkfg4hmzJQosc9snFNUPkbYIhu+KAm6jJw==",
|
||||
"dev": true
|
||||
},
|
||||
"@types/minimatch": {
|
||||
"version": "3.0.3",
|
||||
"resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz",
|
||||
@ -1446,6 +1452,24 @@
|
||||
"integrity": "sha512-add7dgA5ppRPxCFJoAGfMDi7PIBXq1RtGo7BhbLaxwrXPOmw8gq48Y9ozT01hUKy9byMjlR20EJhu5zlkErEkg==",
|
||||
"dev": true
|
||||
},
|
||||
"ajv": {
|
||||
"version": "6.12.4",
|
||||
"resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.4.tgz",
|
||||
"integrity": "sha512-eienB2c9qVQs2KWexhkrdMLVDoIQCz5KSeLxwg9Lzk4DOfBtIK9PQwwufcsn1jjGuf9WZmqPMbGxOzfcuphJCQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fast-deep-equal": "^3.1.1",
|
||||
"fast-json-stable-stringify": "^2.0.0",
|
||||
"json-schema-traverse": "^0.4.1",
|
||||
"uri-js": "^4.2.2"
|
||||
}
|
||||
},
|
||||
"ajv-keywords": {
|
||||
"version": "3.5.2",
|
||||
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-3.5.2.tgz",
|
||||
"integrity": "sha512-5p6WTN0DdTGVQk6VjcEju19IgaHudalcfabD7yhDGeA6bcQnmL+CpveLJq/3hvfwd1aof6L386Ougkx6RfyMIQ==",
|
||||
"dev": true
|
||||
},
|
||||
"cacache": {
|
||||
"version": "13.0.1",
|
||||
"resolved": "https://registry.npmjs.org/cacache/-/cacache-13.0.1.tgz",
|
||||
@ -1470,6 +1494,44 @@
|
||||
"rimraf": "^2.7.1",
|
||||
"ssri": "^7.0.0",
|
||||
"unique-filename": "^1.1.1"
|
||||
},
|
||||
"dependencies": {
|
||||
"fs-minipass": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz",
|
||||
"integrity": "sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minipass": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"minipass-collect": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/minipass-collect/-/minipass-collect-1.0.2.tgz",
|
||||
"integrity": "sha512-6T6lH0H8OG9kITm/Jm6tdooIbogG9e0tLgpY6mphXSm/A9u8Nq1ryBG+Qspiub9LjWlBPsPS3tWQ/Botq4FdxA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minipass": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"minipass-flush": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/minipass-flush/-/minipass-flush-1.0.5.tgz",
|
||||
"integrity": "sha512-JmQSYYpPUqX5Jyn1mXaRwOda1uQ8HP5KAT/oDSLCzt1BYRhQU0/hDtsB1ufZfEEzMZ9aAVmsBw8+FWsIXlClWw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minipass": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"minipass-pipeline": {
|
||||
"version": "1.2.4",
|
||||
"resolved": "https://registry.npmjs.org/minipass-pipeline/-/minipass-pipeline-1.2.4.tgz",
|
||||
"integrity": "sha512-xuIq7cIOt09RPRJ19gdi4b+RiNvDFYe5JH+ggNvBqGqpQXcru3PcRmOZuHBKWK1Txf9+cQ+HMVN4d6z46LZP7A==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minipass": "^3.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"find-cache-dir": {
|
||||
@ -1504,6 +1566,12 @@
|
||||
"universalify": "^0.1.0"
|
||||
}
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true
|
||||
},
|
||||
"locate-path": {
|
||||
"version": "5.0.0",
|
||||
"resolved": "https://registry.npmjs.org/locate-path/-/locate-path-5.0.0.tgz",
|
||||
@ -1514,9 +1582,9 @@
|
||||
}
|
||||
},
|
||||
"make-dir": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.0.2.tgz",
|
||||
"integrity": "sha512-rYKABKutXa6vXTXhoV18cBE7PaewPXHe/Bdq4v+ZLMhxbWApkFFplT0LcbMW+6BbjnQXzZ/sAvSE/JdguApG5w==",
|
||||
"version": "3.1.0",
|
||||
"resolved": "https://registry.npmjs.org/make-dir/-/make-dir-3.1.0.tgz",
|
||||
"integrity": "sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"semver": "^6.0.0"
|
||||
@ -1583,21 +1651,73 @@
|
||||
"minipass": "^3.1.1"
|
||||
}
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.2.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
|
||||
"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"has-flag": "^4.0.0"
|
||||
}
|
||||
},
|
||||
"terser-webpack-plugin": {
|
||||
"version": "2.3.5",
|
||||
"resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.5.tgz",
|
||||
"integrity": "sha512-WlWksUoq+E4+JlJ+h+U+QUzXpcsMSSNXkDy9lBVkSqDn1w23Gg29L/ary9GeJVYCGiNJJX7LnVc4bwL1N3/g1w==",
|
||||
"version": "2.3.8",
|
||||
"resolved": "https://registry.npmjs.org/terser-webpack-plugin/-/terser-webpack-plugin-2.3.8.tgz",
|
||||
"integrity": "sha512-/fKw3R+hWyHfYx7Bv6oPqmk4HGQcrWLtV3X6ggvPuwPNHSnzvVV51z6OaaCOus4YLjutYGOz3pEpbhe6Up2s1w==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"cacache": "^13.0.1",
|
||||
"find-cache-dir": "^3.2.0",
|
||||
"jest-worker": "^25.1.0",
|
||||
"p-limit": "^2.2.2",
|
||||
"schema-utils": "^2.6.4",
|
||||
"serialize-javascript": "^2.1.2",
|
||||
"find-cache-dir": "^3.3.1",
|
||||
"jest-worker": "^25.4.0",
|
||||
"p-limit": "^2.3.0",
|
||||
"schema-utils": "^2.6.6",
|
||||
"serialize-javascript": "^4.0.0",
|
||||
"source-map": "^0.6.1",
|
||||
"terser": "^4.4.3",
|
||||
"terser": "^4.6.12",
|
||||
"webpack-sources": "^1.4.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"jest-worker": {
|
||||
"version": "25.5.0",
|
||||
"resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-25.5.0.tgz",
|
||||
"integrity": "sha512-/dsSmUkIy5EBGfv/IjjqmFxrNAUpBERfGs1oHROyD7yxjG/w+t0GOJDX8O1k32ySmd7+a5IhnJU2qQFcJ4n1vw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"merge-stream": "^2.0.0",
|
||||
"supports-color": "^7.0.0"
|
||||
}
|
||||
},
|
||||
"schema-utils": {
|
||||
"version": "2.7.1",
|
||||
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-2.7.1.tgz",
|
||||
"integrity": "sha512-SHiNtMOUGWBQJwzISiVYKu82GiV4QYGePp3odlY1tuKO7gPtphAT5R/py0fA6xtbgLL/RvtJZnU9b8s0F1q0Xg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@types/json-schema": "^7.0.5",
|
||||
"ajv": "^6.12.4",
|
||||
"ajv-keywords": "^3.5.2"
|
||||
}
|
||||
},
|
||||
"serialize-javascript": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-4.0.0.tgz",
|
||||
"integrity": "sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"randombytes": "^2.1.0"
|
||||
}
|
||||
},
|
||||
"terser": {
|
||||
"version": "4.8.0",
|
||||
"resolved": "https://registry.npmjs.org/terser/-/terser-4.8.0.tgz",
|
||||
"integrity": "sha512-EAPipTNeWsb/3wLPeup1tVPaXfIaU68xMnVdPafIL1TV05OhASArYyIfFvnvJCNrR2NIOvDVNNTFRa+Re2MWyw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"commander": "^2.20.0",
|
||||
"source-map": "~0.6.1",
|
||||
"source-map-support": "~0.5.12"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -3553,9 +3673,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"copy-webpack-plugin": {
|
||||
"version": "5.1.1",
|
||||
"resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-5.1.1.tgz",
|
||||
"integrity": "sha512-P15M5ZC8dyCjQHWwd4Ia/dm0SgVvZJMYeykVIVYXbGyqO4dWB5oyPHp9i7wjwo5LhtlhKbiBCdS2NvM07Wlybg==",
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-5.1.2.tgz",
|
||||
"integrity": "sha512-Uh7crJAco3AjBvgAy9Z75CjK8IG+gxaErro71THQ+vv/bl4HaQcpkexAY8KVW/T6D2W2IRr+couF/knIRkZMIQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"cacache": "^12.0.3",
|
||||
@ -3568,7 +3688,7 @@
|
||||
"normalize-path": "^3.0.0",
|
||||
"p-limit": "^2.2.1",
|
||||
"schema-utils": "^1.0.0",
|
||||
"serialize-javascript": "^2.1.2",
|
||||
"serialize-javascript": "^4.0.0",
|
||||
"webpack-log": "^2.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
@ -3624,6 +3744,15 @@
|
||||
"ajv-keywords": "^3.1.0"
|
||||
}
|
||||
},
|
||||
"serialize-javascript": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/serialize-javascript/-/serialize-javascript-4.0.0.tgz",
|
||||
"integrity": "sha512-GaNA54380uFefWghODBWEGisLZFj00nS5ACs6yHa9nLqlLpVLO8ChDGeKRjZnV4Nh4n0Qi7nhYZD/9fCPzEqkw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"randombytes": "^2.1.0"
|
||||
}
|
||||
},
|
||||
"slash": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmjs.org/slash/-/slash-1.0.0.tgz",
|
||||
@ -4507,9 +4636,9 @@
|
||||
"dev": true
|
||||
},
|
||||
"elliptic": {
|
||||
"version": "6.5.2",
|
||||
"resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.2.tgz",
|
||||
"integrity": "sha512-f4x70okzZbIQl/NSRLkI/+tteV/9WqL98zx+SQ69KbXxmVrmjwsNUPn/gYJJ0sHvEak24cZgHIPegRePAtA/xw==",
|
||||
"version": "6.5.3",
|
||||
"resolved": "https://registry.npmjs.org/elliptic/-/elliptic-6.5.3.tgz",
|
||||
"integrity": "sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"bn.js": "^4.4.0",
|
||||
@ -5443,15 +5572,6 @@
|
||||
"universalify": "^0.1.0"
|
||||
}
|
||||
},
|
||||
"fs-minipass": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-2.1.0.tgz",
|
||||
"integrity": "sha512-V/JgOLFCS+R6Vcq0slCuaeWEdNC3ouDlJMNIsacH2VtALiu9mV4LPrHc5cDl8k5aw6J8jwgWWpiTo5RYhmIzvg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minipass": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"fs-write-stream-atomic": {
|
||||
"version": "1.0.10",
|
||||
"resolved": "https://registry.npmjs.org/fs-write-stream-atomic/-/fs-write-stream-atomic-1.0.10.tgz",
|
||||
@ -7154,33 +7274,6 @@
|
||||
"integrity": "sha512-yV+gqbd5vaOYjqlbk16EG89xB5udgjqQF3C5FAORDg4f/IS1Yc5ERCv5e/57yBcfJYw05V5JyIXabhwb75Xxow==",
|
||||
"dev": true
|
||||
},
|
||||
"jest-worker": {
|
||||
"version": "25.2.6",
|
||||
"resolved": "https://registry.npmjs.org/jest-worker/-/jest-worker-25.2.6.tgz",
|
||||
"integrity": "sha512-FJn9XDUSxcOR4cwDzRfL1z56rUofNTFs539FGASpd50RHdb6EVkhxQqktodW2mI49l+W3H+tFJDotCHUQF6dmA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"merge-stream": "^2.0.0",
|
||||
"supports-color": "^7.0.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"has-flag": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
|
||||
"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
|
||||
"dev": true
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "7.1.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.1.0.tgz",
|
||||
"integrity": "sha512-oRSIpR8pxT1Wr2FquTNnGet79b3BWljqOuoW/h4oBhxJ/HUbX5nX6JSruTkvXDCFMwDPvsaTTbvMLKZWSy0R5g==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"has-flag": "^4.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"js-message": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/js-message/-/js-message-1.0.5.tgz",
|
||||
@ -8348,33 +8441,6 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"minipass-collect": {
|
||||
"version": "1.0.2",
|
||||
"resolved": "https://registry.npmjs.org/minipass-collect/-/minipass-collect-1.0.2.tgz",
|
||||
"integrity": "sha512-6T6lH0H8OG9kITm/Jm6tdooIbogG9e0tLgpY6mphXSm/A9u8Nq1ryBG+Qspiub9LjWlBPsPS3tWQ/Botq4FdxA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minipass": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"minipass-flush": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/minipass-flush/-/minipass-flush-1.0.5.tgz",
|
||||
"integrity": "sha512-JmQSYYpPUqX5Jyn1mXaRwOda1uQ8HP5KAT/oDSLCzt1BYRhQU0/hDtsB1ufZfEEzMZ9aAVmsBw8+FWsIXlClWw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minipass": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"minipass-pipeline": {
|
||||
"version": "1.2.2",
|
||||
"resolved": "https://registry.npmjs.org/minipass-pipeline/-/minipass-pipeline-1.2.2.tgz",
|
||||
"integrity": "sha512-3JS5A2DKhD2g0Gg8x3yamO0pj7YeKGwVlDS90pF++kxptwx/F+B//roxf9SqYil5tQo65bijy+dAuAFZmYOouA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"minipass": "^3.0.0"
|
||||
}
|
||||
},
|
||||
"mississippi": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/mississippi/-/mississippi-3.0.0.tgz",
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
{
|
||||
"name": "it-tools",
|
||||
"description": "",
|
||||
"version": "1.7.0",
|
||||
"version": "1.8.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
|
||||
46
src/components/StyledTextarea.vue
Normal file
46
src/components/StyledTextarea.vue
Normal file
@ -0,0 +1,46 @@
|
||||
<template>
|
||||
<div class="StyledTextarea" @input="updateInput(true)" contenteditable></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "StyledTextarea",
|
||||
props: {
|
||||
value: String,
|
||||
fn: Function,
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
content: this.value
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
updateInput (moveCursor) {
|
||||
if(this.$el.innerText){
|
||||
this.$emit('input', this.$el.innerText);
|
||||
|
||||
let html = this.fn(this.$el.innerText);
|
||||
this.$el.innerHTML = html;
|
||||
|
||||
if(moveCursor){
|
||||
/* Move cursor to end of selection */
|
||||
this.$el.focus();
|
||||
document.execCommand('selectAll', false, null);
|
||||
document.getSelection().collapseToEnd();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.StyledTextarea {
|
||||
overflow:scroll;
|
||||
height:100px;
|
||||
width:100%;
|
||||
border:solid;
|
||||
border-width:1px;
|
||||
resize: vertical;
|
||||
}
|
||||
</style>
|
||||
@ -132,6 +132,13 @@ const toolsComponents = [
|
||||
icon: 'fa-code-branch',
|
||||
component: () => import('./routes/tools/GitMemo'),
|
||||
keywords: ['git', 'push', 'rebase', 'merge', 'tag', 'commit', 'checkout']
|
||||
},
|
||||
{
|
||||
text: 'Regex memo',
|
||||
path: '/regex-memo',
|
||||
icon: 'fa-code',
|
||||
component: () => import('./routes/tools/RegexMemo'),
|
||||
keywords: ['regex', 'regular', 'expression']
|
||||
}
|
||||
]
|
||||
},
|
||||
|
||||
254
src/routes/tools/RegexMemo.vue
Normal file
254
src/routes/tools/RegexMemo.vue
Normal file
@ -0,0 +1,254 @@
|
||||
<template>
|
||||
<v-row >
|
||||
<v-col cols="12" xl="6" lg="6" md="4" sm="12">
|
||||
<v-card class="single-card" id="REGEX_Tester">
|
||||
<v-card-title>REGEX Tester</v-card-title>
|
||||
<v-card-text>
|
||||
<v-text-field
|
||||
outlined
|
||||
v-model="inputRegex"
|
||||
@input="handleRegexInput"
|
||||
label="Regular Expression"
|
||||
/>
|
||||
Input Text
|
||||
<StyledTextarea v-model="inputText" ref="styledTextarea" :fn="this.handleInput" />
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-col>
|
||||
<v-col cols="12" xl="6" lg="6" md="8" sm="12">
|
||||
<v-card class="single-card" id="REGEX_Memo">
|
||||
<v-card-title>REGEX Memo</v-card-title>
|
||||
<table>
|
||||
<tr><th>Character Classes</th></tr>
|
||||
<tr>
|
||||
<td>.</td><td>Any character except newline</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\w \d \s</td><td>Word, digit, whitespace</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\w \d \s</td><td>Word, digit, whitespace</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>[abc]</td><td>Any of a, b, or c</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>[^abc]</td><td>Not a, b, or c</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>[a-f]</td><td>Character between a & f</td>
|
||||
</tr>
|
||||
|
||||
<tr><th>Anchors</th></tr>
|
||||
<tr>
|
||||
<td>^abc$</td><td>^ is the start of the string, $ end of string</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\b \B</td><td>Word, not-word boundary</td>
|
||||
</tr>
|
||||
|
||||
<tr><th>Escaped characters</th></tr>
|
||||
<tr>
|
||||
<td>\.\*\\</td><td>Escaped special characters</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\t\n\r</td><td>tab, linefeed, carriage return</td>
|
||||
</tr>
|
||||
|
||||
<tr><th>Groups & Lookaround</th></tr>
|
||||
<tr>
|
||||
<td>(abc)</td><td>capture group</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>\1</td><td>Backreference to group #1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>(?:abc)</td><td>Non-capturing group</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>(?=abc)</td><td>positive lookahead</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>(?!abc)</td><td>negative lookahead</td>
|
||||
</tr>
|
||||
|
||||
<tr><th>Quantifiers & Alternation</th></tr>
|
||||
<tr>
|
||||
<td>a*a+a?</td><td>0 or more, 1 or more, 0 or 1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>a{5}a{2,}</td><td>exactly five a's, two or more a's</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>a{1,3}</td><td>between one & three a's</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>a+?a{2,}?</td><td>match as few as possible</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ab|cd</td><td>match ab or cd</td>
|
||||
</tr>
|
||||
</table>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import StyledTextarea from "../../components/StyledTextarea";
|
||||
|
||||
export default {
|
||||
name: "RegexMemo",
|
||||
data() {
|
||||
return {
|
||||
inputRegex: '',
|
||||
inputText: '',
|
||||
tips: [
|
||||
{
|
||||
section: 'Character Classes',
|
||||
child: [
|
||||
{
|
||||
text: 'Any character except newline',
|
||||
code: '.'
|
||||
},
|
||||
{
|
||||
text: 'Word, digit, whitespace',
|
||||
code: '\\w \\d \\s'
|
||||
},
|
||||
{
|
||||
text: 'Not word, digit, whitespace',
|
||||
code: '\\W \\D \\S'
|
||||
},
|
||||
{
|
||||
text: 'Any of a, b, or c',
|
||||
code: '[abc]'
|
||||
},
|
||||
{
|
||||
text: 'Not a, b, or c',
|
||||
code: '[^abc]'
|
||||
},
|
||||
{
|
||||
text: 'Character between a & f',
|
||||
code: '[a-f]'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
section: 'Anchors',
|
||||
child: [
|
||||
{
|
||||
text: '^ is the start of the string, $ end of string',
|
||||
code: '^abc$'
|
||||
},
|
||||
{
|
||||
text: 'Word, not word boundary',
|
||||
code: '\\b \\B'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
section: 'I\'ve made a mistake',
|
||||
child: [
|
||||
{
|
||||
text: 'Change last commit message',
|
||||
code: 'git commit --amend'
|
||||
},
|
||||
{
|
||||
text: 'Undo most recent commit and keep changes',
|
||||
code: 'git reset HEAD~1'
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
section: 'Setup SSH',
|
||||
child: [
|
||||
[
|
||||
{
|
||||
text: '1). Generate an SSH key.',
|
||||
code: 'ssh-keygen -t rsa -b 4096 -C "[email]"'
|
||||
},
|
||||
{
|
||||
text: '2). Start the ssh-agent in the background.',
|
||||
code: 'eval "$(ssh-agent -s)"'
|
||||
},
|
||||
|
||||
]
|
||||
]
|
||||
},
|
||||
{
|
||||
section: 'Merge and rebase',
|
||||
child: [
|
||||
{
|
||||
text: 'Merge a branch into the current',
|
||||
code: 'git merge [branch]'
|
||||
},
|
||||
{
|
||||
text: 'Abort merge (conflicts)',
|
||||
code: 'git merge --abort'
|
||||
},
|
||||
{
|
||||
text: 'Continue merge after resolving conflicts',
|
||||
code: 'git merge --continue'
|
||||
},
|
||||
]
|
||||
},
|
||||
]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleRegexInput () {
|
||||
this.$refs.styledTextarea.updateInput(false);
|
||||
},
|
||||
handleInput(str) {
|
||||
let output = str;
|
||||
if(this.inputRegex) {
|
||||
try {
|
||||
let regex = new RegExp(this.inputRegex, 'g');
|
||||
|
||||
const matches = [...str.matchAll(regex)];
|
||||
const matchMap = {};
|
||||
for(const match of matches) {
|
||||
const idx = match.index;
|
||||
const val = match[0];
|
||||
matchMap[idx]=val;
|
||||
}
|
||||
|
||||
let formattedString = '';
|
||||
for(let i =0; i < str.length; i++){
|
||||
let c = str[i];
|
||||
if(matchMap[i]){
|
||||
formattedString += `<span class='highlighted'>${matchMap[i]}</span>`;
|
||||
i += matchMap[i].length-1;
|
||||
} else {
|
||||
formattedString += c;
|
||||
}
|
||||
}
|
||||
output = formattedString;
|
||||
} catch (e) {
|
||||
return str;
|
||||
}
|
||||
}
|
||||
return output;
|
||||
}
|
||||
},
|
||||
components: {
|
||||
StyledTextarea,
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
table {
|
||||
width: 100%;
|
||||
margin-left: 10%;
|
||||
}
|
||||
th {
|
||||
padding-top: 15px;
|
||||
text-align: left;
|
||||
}
|
||||
.highlighted {
|
||||
background-color: rgb(76, 175, 80);
|
||||
margin: 0px 1px;
|
||||
color: black;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user