项目作者: andrey-hilux

项目描述 :
The Extreme programming (XP) solution
高级语言: HTML
项目地址: git://github.com/andrey-hilux/vscode.extension.usefulPanel.git


{% include styles.html %}

{% include github-corner.html %}

USEFUL PANEL | Ready(98.12%)

Firstly, it was the tool-based emergency system designed around the capability API of a VS Code IDE.
As maximum and convenient, flexible, super-fast Extreme programming (XP) platform was aimed at the create more features, methods, and capabilities for emergency cases arising from sudden bugs out of new updates, rules, changes, .etc. Allowing programmers to design temporary or permanent solution in no-time.

Attention! This extension uses the weak or still development, documented background features of NodeJS, and can cause additional unforeseen and unpredictable issues.

! If you are not sure what you do, don’t use it and thus strictly recommend it for only personal use!

Visual Studio Code USEFUL PANEL

Yes, I’m using it for a long time, in spite of their “you can’t use the entire XP framework in many situations”, And I’m used to it now. You right, it shouldn’t stop you from using as many of the practices as possible given your context.

USEFUL PANELVisual Studio Code USEFUL PANEL
Adds a panel for accessing frequently used files, Internet addresses, programs, commands, snippets. Beefed up by “Webpack Config” like behavior configure module.

vscode.extension.usefulPanel

{% include tutorial.html url=”JTdCJTIwJTIyY29uZiUyMiUzQSUyMCUyMmh0dHBzJTNBJTJGJTJGYW5kcmV5LWhpbHV4LmdpdGh1Yi5pbyUyRnZzY29kZS5leHRlbnNpb24udXNlZnVsUGFuZWwlMkZwcmV2aWV3JTJGdmlkZW8lMkZobHMlMkZ0dXRvcmlhbC5jb25mLmpzb24lMjIlMjAlN0Q=” %}

This is derived work based on Favorites Panel by Sabitov Vladimir. Extended with our development kit for specific extreme urgency cases.

The integrated AutoFormat automatically formats a document as you save it and as a result there are no sense for try this !

)

Auto-config

It’s running only when active “Useful Panel”, triggers automatically when its first starts, or for all time when configuration compiles errors. Always triggers automatically on save and it is automatically enabled or can’t be disabled.

Source navigation

The specific links on the panel allow you easily navigate to the line which describes its arguments parameter. Set the {_nav:1}, to generate a default sample when the document will be saved.

Extension Settings

The extension will initial demo configuration if none in .vscode/.favoritesSideBar.js.

  1. () => {
  2. const howTo = {
  3. ...
  4. }
  5. "favoritesSideBar": {
  6. commands ": [ {
  7. ...
  8. }
  9. ]
  10. }
  11. }

List of available icons

Environment

Sandbox environment-variables. Includes:

  1. {
  2. require,
  3. _, // lodash
  4. vscode,
  5. env.name // extension name
  6. env.workspaceFolder // project root directory
  7. envontext // vscode.ExtensionContext
  8. env.prettier // integrated AutoFormat configuration
  9. }
  10. // env.prettier.semi = false
  11. // env.prettier["singleQuote"] = true

Default config generate:

  • $$$masterScript$$$ - ✨bonus✨ generate master script, outside commands block samples, for general config body of code.
  • {_nav:1}, or {_nav:<whatever>}, - generate navigation default sample.
  • {help:1}, or {help:<whatever>}, - generate generate “HOW TO” commands branch.
  • {end:1}, or {end:<whatever>}, - generate “config” end “about” commands.

Features (basic)

  • Quick access to your favorite files
  • Quick access to favorite URLs
  • Fast launch of applications
  • Quick access to your favorite files
  • Quick access to favorite commands
  • Setting icons for commands

Go to Definition for Includes

Easy navigate between your files references via the different !include… tags using ‘f12’ / ‘Go to Definition’.

Editing code

  1. {
  2. "label": "lowercase ➜ UPPER CASE",
  3. "description": "",
  4. "icon": "debug-step-out",
  5. "command": "runCommand",
  6. "arguments": [
  7. "editor.action.transformToUppercase"
  8. ]
  9. }

Opening file

File in project

Settings for opening file in project

  1. {
  2. "label": "README",
  3. "description": "- read me",
  4. "command": "openFile",
  5. "arguments": ["README.MD"]
  6. }

File is out project

Settings for opening file in project

  1. {
  2. "label": "Hosts",
  3. "description": "Windows hosts file",
  4. "command": "openFile",
  5. "arguments": ["C:\\Windows\\System32\\drivers\\etc\\hosts", "external"]
  6. }

Open Search panel

command: workbench.action.findInFiles

arguments:

  • query?: string;
  • isRegex?: boolean;
  • triggerSearch?: boolean;
  • filesToInclude?: string;
  • filesToExclude?: string;
  • isCaseSensitive?: boolean;
  1. {
  2. "label": "Find in files",
  3. "description": "",
  4. "command": "runCommand",
  5. "arguments": ["workbench.action.findInFiles", {"query": "SearchPattern", "triggerSearch": true}],
  6. },

Insert text

Search and insert text by regexp pattern. Searches until the first match.

  1. {
  2. "label": "Replace",
  3. "description": "",
  4. "icon": "find-replace",
  5. "command": "insertNewCode",
  6. "arguments": ["ui/components/tableItem.ts", "<td className=\"col-date-time\">", "<div className=\"new\">NewText</div>", "before"],
  7. }

Replace text

Search and replace text by regexp pattern. Searches until the first match.

  1. {
  2. "label": "Replace",
  3. "description": "",
  4. "icon": "find-replace",
  5. "command": "insertNewCode",
  6. "arguments": ["ui/components/tableItem.ts", "<td className=\"col-date-time\">", "<div className=\"WOW\"></div>", "replace"]
  7. }

Replace All text

Search and replace text by regexp pattern. Searches all match.

  1. {
  2. "label": "ReplaceAll",
  3. "description": "",
  4. "icon": "find-replace",
  5. "command": "insertNewCode",
  6. "arguments": ["ui/components/tableItem.ts", "<td className=\"col-date-time\">", "<div className=\"WOW\"></div>", "replaceALL"]
  7. }

Features (Extended)

Extend (runCommand):

(runCommand) Samples:


  • basic
  1. {
  2. label: "CMD",
  3. description: "1",
  4. icon: "play",
  5. command: "runCommand",
  6. arguments: [
  7. "cmd",
  8. `
  9. "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"
  10. --user-data-dir="D:\\sets\\Chrome\\plnx.acc"
  11. https://observablehq.com/@observablehq/a-taste-of-observable?collection=@observablehq/overview
  12. `,
  13. ],
  14. }


  • with line arguments
  1. {
  2. id: "ID is needed only for [label,description] identify collision issues!",
  3. label: "CMD",
  4. description: "2",
  5. icon: "play",
  6. command: "runCommand",
  7. arguments: [
  8. "cmd",
  9. '"C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"',
  10. '--user-data-dir="D:\\sets\\Chrome\\plnx.acc"',
  11. "https://observablehq.com/@observablehq/a-taste-of-observable?collection=@observablehq/overview",
  12. ],
  13. }


  • with parameter switches list silent
  1. {
  2. label: "CMD",
  3. description: "3: list,git ...",
  4. icon: "github",
  5. command: "runCommand",
  6. arguments: [
  7. "cmd",
  8. "list silent",
  9. `
  10. cd /D "D:\\<your git directory>"
  11. git config user.email "<your git email>"
  12. git config user.name "<your git name>"
  13. git config core.autocrlf true
  14. git checkout -b main
  15. git remote rm origin
  16. git remote add origin https://<your git name>:<your git password>@github.com/<your git name>/<your git repo>.git
  17. git rm -r --cached <repo force forder for delete> -f
  18. git add ./
  19. git commit -m "main ✨ HOW TO commit"
  20. git push origin main -u -f
  21. `,
  22. ],
  23. }

Run NodeJS


  • eval
  1. {
  2. label: "node",
  3. description: "2: server",
  4. icon: "beaker",
  5. command: "runCommand",
  6. arguments: [
  7. "node",
  8. "-e",
  9. `
  10. var http = require('http'),
  11. // open = require('open'),
  12. server;
  13. server = http.createServer(function (req, res) {
  14. res.writeHead(200, {'Content-Type': 'text/plain'});
  15. res.end('Hello World\\n');
  16. });
  17. server.listen(1337, '127.0.0.1',function(){
  18. // console.log('Launching the browser on http://127.0.0.1:1337!');
  19. // open('http://127.0.0.1:1337');
  20. });
  21. `,
  22. ],
  23. }


  • or script
  1. {
  2. label: "node",
  3. description: "1: error no module",
  4. icon: "beaker",
  5. command: "runCommand",
  6. arguments: [
  7. "node",
  8. "./node_modules/prettier/bin-prettier",
  9. "./<your>.js",
  10. "--write",
  11. ],
  12. }

Run in Terminal


  • package.json scripts
  1. {
  2. label: "dev:spa",
  3. description: "",
  4. icon: "chevron-right",
  5. command: "runCommand",
  6. arguments: ["terminal", "quasar dev -m spa"],
  7. }


  • plain text
  1. {
  2. label: "TERMINAL",
  3. description: "1: block",
  4. icon: "terminal",
  5. command: "runCommand",
  6. arguments: [
  7. "terminal",
  8. `
  9. "C:\\Program Files (x86)\\Google\\Chrome\\Application\\chrome.exe"
  10. --user-data-dir="D:\\sets\\Chrome\\plnx.acc"
  11. https://observablehq.com/@observablehq/a-taste-of-observable?collection=@observablehq/overview
  12. `,
  13. ],
  14. }


  • lines with environment-variables
  1. {
  2. label: "TERMINAL",
  3. description: "2: lines params",
  4. icon: "terminal",
  5. command: "runCommand",
  6. arguments: [
  7. "terminal",
  8. "cls",
  9. 'echo "Hello terminal world"',
  10. `node -e "console.log('%chello %s','color:yellow', 'node','prettier : ${howTo.prettier()}');"`,
  11. `echo "Hello extension сontext" && echo "${howTo.сontext()}"`,
  12. `echo "Hello code.exe" && code -v`,
  13. `echo "Hello vscode" && echo "${howTo.vscode.version}"`,
  14. ],
  15. }

sel


  • manipulate selected string
  1. {
  2. label: "camelCase",
  3. description: "",
  4. icon: "ellipsis",
  5. command: "runCommand",
  6. arguments: ["sel", (_sel) => _.camelCase(_sel)],
  7. }

toLineConfigNavigate:" class="reference-link">toLineConfigNavigate:


  • string
  1. {
  2. label: "cmd",
  3. description: "",
  4. icon: "arrow-small-right",
  5. command: "toLineConfigNavigate",
  6. arguments: [
  7. '"C:\\Program Files (x86)\\Google\\Chrome\\',
  8. ],
  9. }


  • line number
  1. {
  2. label: "How To",
  3. description: "",
  4. icon: "arrow-small-right",
  5. command: "toLineConfigNavigate",
  6. arguments: [
  7. 497,
  8. ],
  9. }


  • RegExp
  1. {
  2. label: "Commands",
  3. description: "",
  4. icon: "arrow-small-right",
  5. command: "toLineConfigNavigate",
  6. arguments: [
  7. / return \{[\w\W]*commands: \[/i
  8. ],
  9. }


setTimeout_worker:

  1. /**
  2. * @example

setTimeoutWorker(
0 // it kill all Workers by timeoutId
, (…args) => {
args[0].cb = (opt, next) => {

  1. print([opt])
  2. next()

}
})

  1. */
  2. const setTimeoutWorker = (
  3. intervalMin,
  4. _next
  5. ) => {
  6. if (
  7. typeof intervalMin === "function"
  8. ) {
  9. _next = intervalMin
  10. intervalMin = 0.1
  11. }
  12. const timeoutId = "308"
  13. if (typeof _next === "function") {
  14. vscode.commands
  15. .executeCommand(
  16. `${env.name}.setTimeout_worker`,
  17. timeoutId,
  18. intervalMin
  19. )
  20. .then((_tick) => {
  21. _next(_tick)
  22. // print([_tick])
  23. })
  24. .catch((err) => { })
  25. } else if (!intervalMin) {
  26. vscode.commands
  27. .executeCommand(
  28. `${env.name}.setTimeout_worker`,
  29. timeoutId,
  30. intervalMin
  31. )
  32. .then((_tick) => {
  33. // print([_tick])
  34. })
  35. .catch((err) => { })
  36. }
  37. }


onSave:

  1. vscode.commands.executeCommand(
  2. `${env.name}.onSave`,
  3. ["${workspaceFolder}/README.md"],
  4. /*
  5. (f, cmd,
  6. ed:{
  7. txt: string,
  8. replace: (txt: string, before?: Function | undefined, after?: Function | undefined): void
  9. },
  10. errors{
  11. add(error: string): void,
  12. show(): void
  13. },
  14. tm: (): string,
  15. print: (_v: any): void
  16. ) =>void
  17. */
  18. (f, cmd) => {
  19. tryFn(() => {
  20. const path = require("path")
  21. const pathFrom = (_s) => {
  22. var p = _s
  23. .trim()
  24. .split(
  25. /^\$\{workspaceFolder\}/i
  26. )
  27. if (p.length > 1) {
  28. p = [
  29. env.workspaceFolder,
  30. ...p.slice(1),
  31. ]
  32. }
  33. return path.join(
  34. p
  35. .join("")
  36. .split(/[\\/]/gi)
  37. .join("/")
  38. )
  39. }
  40. // print([pathFrom("D:\\sites\\GitHub\\git-user\\repo\\README.md"),pathFrom("${workSpacefolder}\\README.md")])
  41. // utils.print([f,`${env.workspaceFolder}\\README.md`,"D:\\sites\\GitHub\\git-user\\README.md"])
  42. const workspaceFolder =
  43. env.workspaceFolder
  44. const dest = pathFrom(
  45. "<repo local forder>"
  46. )
  47. cmd([
  48. "cmd",
  49. "list silent-off",
  50. `
  51. COPY /Y "${workspaceFolder}\\README.md" "${path.join(
  52. dest,
  53. "README.md"
  54. )}"
  55. cd /D "${dest}"
  56. git config user.email "<your git email>"
  57. git config user.name "<your git name>"
  58. git config core.autocrlf true
  59. git checkout -b main
  60. git remote rm origin
  61. git remote add origin https://<your git name>:<your Personal access token>@github.com/<your git name>/<your git repo>.git
  62. git rm -r --cached <repo force forder for delete> -f
  63. git add ./
  64. git commit -m "main ✨ commit on Save"
  65. git push origin main -u -f
  66. `,
  67. ])
  68. })
  69. }
  70. )


jumpTo:

  1. vscode.commands.executeCommand(`${env.name}.jumpTo`, (ti: TreeItem) => {})

Donations

To support this project, you can make a donation to its current maintainer:

patreon
bitcoinpatreon

Release Notes | Ready(98.12%)

0.0.1 | 2021/06/22

  • Added support for jumpTo.
  • Added the ability to move plugin settings into custom files.

More information in the changelog