VSCode language extension for WinBatch

Started by cssyphus, October 16, 2021, 03:05:29 PM

Previous topic - Next topic

cssyphus

Casting no shade on the venerable WinBatch Studio IDE...

For those who use the Microsoft VSCode editor/IDE, here is a language extension for WBT files in VSCode. It took a while to cobble it together, and it's not quite perfect, but it works. Say hello to: code folding, multiple cursor editing, diffing files (i.e. "compare"), highlighting all instances of selected text, etc.

How To Install: installation is Very simple. 

1. Extract the zipfile and copy the included WBT folder (with all contents) to this location:
C:\Users\[your user account]\.vscode\extensions

2. Restart VSCode. Done.

FWIW, the "meat" of the language extension is found in this file:
WBT\syntaxes\wbt.tmLanguage.json

That's where you'll find each keyword / operator / etc itemized and colorized.

If anyone takes this, runs with it, and improves it... it would be great if you could upload your revised extension here.

### Update 22-11-19

The zipfile containing the WBT lang extension was replaced on Nov 19/22 in order to fix a disappointing bug introduced in the previous version. I finally had a chance to sit down for a couple of hours and poke-n-prod the wbt.tmLanguage.json file, and I like this one much betterer. To keep this first article short, I will document the changes in a new post in this thread.  Look for post titled "UPDATE 221119" for some useful information (esp. for those who desire to tweak).  ** For those wondering, the attached WBT language extension was replaced on 22-11-19 and the download stats (below) are for this latest version (3rd release). The previously-attached versions, however, were downloaded 10+ times. FWIW, because someone asked. **
Is this a pandemic... or an IQ test? newz.icu

JTaylor


stanl


cssyphus

Uploaded version 2 of the VSCode WBT Language Extension

The big change is that the commands are now case insensitive, so the various capitalization options for each keyword are no longer expressly spelled-out. Therefore intellisense "quick-suggestions" will work correctly now.

Also, I discovered a few keywords that I had missed, so those have been included. The missing keywords were: fwdscan|backscan|to

IF ANYONE ELSE discovers keywords that were missed, please make note of them here so I can add them into the master for everyone else.

Next step: I'm looking at how to create a Shift+F1 context sensitive help capability that will open the Consolidated Help File at the desired function. Stay tuned for that.

Since this is pretty much a BUGFIX release, I've replaced the originally-uploaded wbt.zip attached to the OP with this new version. Installation instructions are as before - but I would advise deleting the old wbt folder (in ...\.vscode\extensions) before schlepping this one into its place. (If you wish to retain the old folder until you are confident this new one has no problems, MOVE it out of the extensions folder, do not simply rename it). And if, for any reason, you later wish a copy of the original wbt.zip, PM me and I'll email.
Is this a pandemic... or an IQ test? newz.icu

JTaylor


mhall

Just wanted to say thanks for this! I appreciate the work.

I'm not doing a lot of WBT editing these days, but I spend a lot of time in VSCode, so it's nice to be able to open them in the same editor I'm working in and get colorization and code folding, etc.

cssyphus

UPDATE 221119

As mentioned in the initial post,  the "meat" of the language extension is found in this file:
C:\Users\[your user account]\.vscode\extensions\WBT\syntaxes\wbt.tmLanguage.json

That's where you'll find each keyword / operator / etc itemized and colorized.

Here's the skinny.

The WinBatch IDE editor primarily uses five colors that I've been able to identify:
* WB Operators - (if/else/GoSub/Return/IntControl) ----- PURPLE
* WB Functions - (winExist, timeYmdHms, isDefined) ---- LAPIS-LAZULI BLUE
* Comments - (no description required just space) ------ FOREST GREEN
* Strings - (anything between sing/double quotes) ------ TOMATO RED (red)
* Extender Funcs - (additional funcs added by ext) ------ BRIGHT PURPLY-PINK

I've been able to identify six unique colors I can use in VSCode lang extensions:
* keyword.control.wbt --------- purple (similar to WB)
* keyword.other.wbt ----------- lapis-lazuli blue (similar to WB)
* variable.other.wbt ------------ lighter, brighter, cyan-ish blue
* entity.name.function.wbt ---- pale yellow
* support.type.wbt ------------- emerald green
* string.quoted.single.wbt ----- tangerine orange (more orange than the WB strings color)
* string.quoted.double.wbt ---- tangerine orange (more orange than the WB strings color)
* unidentified but works - COMMENTS are forest green, quite similar to WB
I have not found where these colors are actually defined -- I suspect they are defined within the theme you are currently using.
Here is a potential SO article re modifying theme colors:
https://stackoverflow.com/questions/63455950/how-can-i-find-the-folder-of-the-theme-im-using-in-vs-code
NOTE: I am currently using the "Dark+ (default dark)" theme

In the wbt.tmLanguage.json file:
1. The section containing an array of objects called "patterns" is a list of all the color definitions that will be INCLUDEd from those following below.
2. Next after "patterns" is "repository" - this contains each of the included color definitions itemized above
3. The "key" (operators/commands/keywords/special/etc) should be included in the initial "patterns" list (number (1) above)
4. Each color definition (operators / commands / keywords / special  / etc) has a "name" and a "match" string
5. The "name" references the set of color definitions that will colorize these keywords (I don't yet know where they are defined, probably in the current Theme)
6. The "match" string contains the commands that will be colorized with that color

Notes:
a. You can swap the colors of different pattern definitions by swapping their names. For example, if you want the WinBatch included functions to be purple instead of blue, change the "keywords" pattern from keyword.other.wbt to keyword.control.wbt.
b. To create a new color group and move some commands into that new color group:

  • Duplicate (for example) the "operators" def group
  • Paste it into that list and rename the key (e.g. "summatnew" instead of "operators")
  • Change the name to one of the unique color defs not yet used, for e.g. [ variable.other.wbt ]
  • Update the commands in the 'match" line (between the (parentheses)
  • Ensure to remove those commands from the other match lines where they were previously defined
  • SAVE the wbt.tmLanguage.json file
  • QUIT VSCODE and restart it
True VSCode happiness will be yours.

Final Notes:
* I suspect the reason the previous version "broke" (stopped working, at least for me) is because it was using [ keyword.control.wbt ] for the "operators" pattern/group. Probably that "name" is not defined in the Dark+ theme, and when I switched to that theme the if/else/gosub/etc operators stopped being colorized. Just a guess based on what I now understand about how the tmLanguage.json file works.

*** Attached is the latest/greatest wbt.zip file (identical to the one now available in the first post).  Installation instruction are in the first post in this thread. ***
Is this a pandemic... or an IQ test? newz.icu