Add outline decoration for column assist functionality

.github/workflows/test.yaml

@@ -11,6 +11,7 @@ jobs:
       - uses: actions/checkout@v2
         with:
           fetch-depth: 1
+          submodules: true
       - run: npm install
       - run: node ./node_modules/eslint/bin/eslint src/** --no-error-on-unmatched-pattern
       - run: npm run test

extension/client/src/columnAssist.ts

@@ -1,5 +1,5 @@
 
-import { commands, DecorationOptions, ExtensionContext, Range, window } from 'vscode';
+import { commands, DecorationOptions, ExtensionContext, Range, ThemeColor, window } from 'vscode';
 import * as Configuration from "./configuration";
 import { loadBase } from './base';
 
@@ -13,8 +13,16 @@ const notCurrentArea = window.createTextEditorDecorationType({
   border: `1px solid grey`,
 });
 
-import { SpecFieldDef, SpecFieldValue, specs } from './schemas/specs';
-import type { Field } from '@halcyontech/vscode-ibmi-types/api/CustomUI';
+const outlineBar = window.createTextEditorDecorationType({
+  backgroundColor: new ThemeColor(`editor.background`),
+  isWholeLine: true,
+  opacity: `0`,
+});
+
+let rulerEnabled = Configuration.get(Configuration.RULER_ENABLED_BY_DEFAULT) || false
+let currentEditorLine = -1;
+
+import { SpecFieldDef, SpecFieldValue, SpecRulers, specs } from './schemas/specs';
 
 const getAreasForLine = (line: string, index: number) => {
   if (line.length < 6) return undefined;
@@ -28,14 +36,15 @@ const getAreasForLine = (line: string, index: number) => {
 
     return {
       specification,
-      active
+      active,
+      outline: SpecRulers[specLetter]
     };
   }
 }
 
 export function registerColumnAssist(context: ExtensionContext) {
   context.subscriptions.push(
-    commands.registerCommand(`vscode-rpgle.rpgleColumnAssistant`, async () => {
+    commands.registerCommand(`vscode-rpgle.assist.launchUI`, async () => {
       const editor = window.activeTextEditor;
       if (editor) {
         const document = editor.document;
@@ -62,50 +71,95 @@ export function registerColumnAssist(context: ExtensionContext) {
       }
     }),
 
+    commands.registerCommand(`vscode-rpgle.assist.toggleFixedRuler`, async () => {
+      rulerEnabled = !rulerEnabled;
+
+      if (rulerEnabled) {
+        updateRuler();
+      } else {
+        clearRulers();
+      }
+    }),
+
     window.onDidChangeTextEditorSelection(e => {
-      if (Configuration.get(`showFixedFormatOutline`)) {
-        const editor = e.textEditor;
-        const document = editor.document;
+      const editor = e.textEditor;
+      if (rulerEnabled) {
+        updateRuler(editor);
+      } else {
+        clearRulers(editor);
+      }
+    }),
+  )
+}
 
-        if (document.languageId === `rpgle`) {
-          if (document.getText(new Range(0, 0, 0, 6)).toUpperCase() !== `**FREE`) {
-            const lineNumber = editor.selection.start.line;
-            const positionIndex = editor.selection.start.character;
+function updateRuler(editor = window.activeTextEditor) {
+  let clear = true;
 
-            const positionsData = getAreasForLine(
-              document.getText(new Range(lineNumber, 0, lineNumber, 100)), 
-              positionIndex
-            );
+  if (editor) {
+    const document = editor.document;
+    if (document.languageId === `rpgle`) {
+      if (document.getText(new Range(0, 0, 0, 6)).toUpperCase() !== `**FREE`) {
+        const lineNumber = editor.selection.start.line;
+        const positionIndex = editor.selection.start.character;
 
-            if (positionsData) {
-              let decorations: DecorationOptions[] = [];
-
-              positionsData.specification.forEach((box: any, index: number) => {
-                if (index === positionsData.active) {
-                  //There should only be one current.
-                  editor.setDecorations(currentArea, [{
-                    hoverMessage: box.name,
-                    range: new Range(lineNumber, box.start, lineNumber, box.end+1)
-                  }]);
-
-                } else {
-                  decorations.push({
-                    hoverMessage: box.name,
-                    range: new Range(lineNumber, box.start, lineNumber, box.end+1)
-                  })
-                }
-              });
-              editor.setDecorations(notCurrentArea, decorations);
+        const positionsData = getAreasForLine(
+          document.getText(new Range(lineNumber, 0, lineNumber, 100)), 
+          positionIndex
+        );
+
+        if (positionsData) {
+          let decorations: DecorationOptions[] = [];
+
+          positionsData.specification.forEach((box: any, index: number) => {
+            if (index === positionsData.active) {
+              //There should only be one current.
+              editor.setDecorations(currentArea, [{
+                hoverMessage: box.name,
+                range: new Range(lineNumber, box.start, lineNumber, box.end+1)
+              }]);
 
             } else {
-              editor.setDecorations(currentArea, []);
-              editor.setDecorations(notCurrentArea, []);
+              decorations.push({
+                hoverMessage: box.name,
+                range: new Range(lineNumber, box.start, lineNumber, box.end+1)
+              })
             }
+          });
+          editor.setDecorations(notCurrentArea, decorations);
+
+          if (currentEditorLine !== lineNumber && lineNumber > 1) {
+            editor.setDecorations(outlineBar, [
+              {
+                range: new Range(lineNumber-1, 0, lineNumber-1, 80),
+                renderOptions: {
+                  before: {
+                    contentText: positionsData.outline,
+                    color: new ThemeColor(`editorLineNumber.foreground`),
+                  }
+                }
+              },
+            ]);
           }
+
+          clear = false;
         }
+
+        currentEditorLine = lineNumber;
       }
-    }),
-  )
+    }
+  }
+
+  if (clear) {
+    clearRulers(editor);
+  }
+}
+
+function clearRulers(editor = window.activeTextEditor) {
+  if (editor) {
+    editor.setDecorations(currentArea, []);
+    editor.setDecorations(notCurrentArea, []);
+    editor.setDecorations(outlineBar, []);
+  }
 }
 
 interface FieldBox {

extension/client/src/configuration.ts

@@ -1,8 +1,9 @@
-import { workspace } from 'vscode';
+import { ConfigurationTarget, workspace } from 'vscode';
 
-export function get(prop: string) {
+export function get<T>(prop: string) {
 	const globalData = workspace.getConfiguration(`vscode-rpgle`);
-	return globalData.get(prop);
+	return globalData.get<T>(prop);
 }
 
+export const RULER_ENABLED_BY_DEFAULT = `rulerEnabledByDefault`;
 export const projectFilesGlob = `**/*.{rpgle,RPGLE,sqlrpgle,SQLRPGLE,rpgleinc,RPGLEINC}`;

extension/client/src/schemas/specs.ts

@@ -1,6 +1,13 @@
 export type SpecFieldValue = {value: string, text: string};
 export type SpecFieldDef = {id: string, name: string, start: number, end: number, values?: SpecFieldValue[], padStart?: boolean}
 
+export const SpecRulers: {[spec: string]: string} = {
+  C: `.....CL0N01Factor1+++++++Opcode&ExtFactor2+++++++Result++++++++Len++D+HiLoEq`,
+  D: `.....DName+++++++++++ETDsFrom+++To/L+++IDc.Keywords++++++++++++++++++++`,
+  F: `.....FFilename++IPEASFRlen+LKlen+AIDevice+.Keywords++++++++++++++++++++`,
+  P: `.....PName+++++++++++..T...................Keywords++++++++++++++++++++`
+}
+
 export const specs: {[spec: string]: SpecFieldDef[]} = {
   C: [
     {
@@ -52,9 +59,21 @@ export const specs: {[spec: string]: SpecFieldDef[]} = {
       end: 69
     },
     {
-      id: `resultingIndicators`,
-      name: `Resulting Indicators`,
+      id: `resultingIndicatorsA`,
+      name: `Resulting Indicator`,
       start: 70,
+      end: 71
+    },
+    {
+      id: `resultingIndicatorsB`,
+      name: `Resulting Indicator`,
+      start: 72,
+      end: 73
+    },
+    {
+      id: `resultingIndicatorsC`,
+      name: `Resulting Indicator`,
+      start: 74,
       end: 75
     }
   ],

package.json

@@ -12,7 +12,7 @@
 		"url": "https://github.com/halcyon-tech/vscode-rpgle"
 	},
 	"license": "MIT",
-	"version": "0.27.0",
+	"version": "0.27.0-patrick2",
 	"engines": {
 		"vscode": "^1.70.0"
 	},
@@ -35,10 +35,10 @@
 		"configuration": {
 			"title": "RPGLE language tools",
 			"properties": {
-				"vscode-rpgle.showFixedFormatOutline": {
+				"vscode-rpgle.rulerEnabledByDefault": {
 					"type": "boolean",
-					"default": false,
-					"description": "Will provide column assist for writing fixed format RPGLE."
+					"default": true,
+					"description": "Whether to show the fixed-format ruler by default."
 				}
 			}
 		},
@@ -64,15 +64,27 @@
 				"category": "RPGLE"
 			},
 			{
-				"command": "vscode-rpgle.rpgleColumnAssistant",
+				"command": "vscode-rpgle.assist.launchUI",
 				"title": "Launch Column Assistant",
 				"category": "RPGLE",
 				"enablement": "editorLangId == rpgle"
+			},
+			{
+				"command": "vscode-rpgle.assist.toggleFixedRuler",
+				"title": "Toggle Inline Editor Helper",
+				"category": "RPGLE",
+				"enablement": "editorLangId == rpgle"
 			}
 		],
 		"keybindings": [
 			{
-				"command": "vscode-rpgle.rpgleColumnAssistant",
+				"command": "vscode-rpgle.assist.launchUI",
+				"key": "ctrl+shift+f4",
+				"mac": "cmd+shift+f4",
+				"when": "editorLangId == rpgle"
+			},
+			{
+				"command": "vscode-rpgle.assist.toggleFixedRuler",
 				"key": "shift+f4",
 				"mac": "shift+f4",
 				"when": "editorLangId == rpgle"