JB Language Support for VS Code

This extension provides syntax highlighting and language configuration for the JB custom language.

Features

• Syntax Highlighting: Supports keywords, data types, numbers, operators, identifiers, strings, and comments.
• Embedded Blocks:
  • JBHTML ... END blocks: Embeds full HTML highlighting inside the block.
  • JBPYTHON ... END blocks: Embeds full Python highlighting inside the block.
• Cyberpunk Theme: Includes a pre-configured theme "JB Cyberpunk" highlighting the embedded blocks in neon cyan and neon blue.
• Language Configurations:
  • Auto-closing pairs for parentheses (), brackets [], braces {}, quotes "", '', and backticks .
  • Bracket matching.
  • Line comments (//) and block comments (/* ... */).
  • Toggle comments (Ctrl + / for line comments).

File Association

This extension automatically associates files ending with the .jb extension with the JB language support.

Getting Started / Local Installation

To test and run the extension locally in VS Code:

Method 1: Extension Development Host (Recommended)

1. Open this project directory (PROJECT JB) in VS Code.
2. Press F5 or go to the Run and Debug side bar and click Start Debugging.
3. A new Extension Development Host window will open.
4. In that host window, open or create a file with a .jb extension (e.g., test.jb).
5. Type some JB code to see syntax highlighting in action.

Method 2: Manual Installation

1. Copy the contents of this folder into your local .vscode extensions folder:
   • Windows: %USERPROFILE%\.vscode\extensions\jb-language-extension
   • macOS/Linux: ~/.vscode/extensions/jb-language-extension
2. Restart VS Code.
3. Open any .jb file to see the extension active.

Theme Activation & Scope Customization

Activate Built-in Theme

1. Press Ctrl + K then Ctrl + T (or Cmd + K then Cmd + T on macOS).
2. Select JB Cyberpunk from the theme dropdown.

Custom styling (User settings.json)

If you prefer to style the keywords in your own custom theme, add the following to your VS Code settings.json:

"editor.tokenColorCustomizations": {
    "textMateRules": [
        {
            "scope": [
                "keyword.other.embedded.html.jb",
                "keyword.other.embedded.html.end.jb"
            ],
            "settings": {
                "foreground": "#00f0ff",
                "fontStyle": "bold"
            }
        },
        {
            "scope": [
                "keyword.other.embedded.python.jb",
                "keyword.other.embedded.python.end.jb"
            ],
            "settings": {
                "foreground": "#0055ff",
                "fontStyle": "bold"
            }
        }
    ]
}

Running JB Files (Python Universal Polyglot Runtime)

You can run the .jb file using the Python-based Universal Polyglot Runtime configured in jb_compiler/runner.py. This dev server watches the target file, parses multi-language blocks (JB[LANGUAGE] ... END), executes them sequentially, and serves hot-reloads over a local Python-based HTTP server.

Requirements

• Python 3: Installed and available on your system path.
• Node.js: Needed to run JBNODE or Core JB code blocks.
• G++ / Java: Optional, needed if executing JBCPP or JBJAVA blocks.

How to Start the Dev Server

Run the following command in your terminal from the project root:

python jb_compiler/runner.py sample.jb

The Executors Registry

You can expand the runtime to support new languages. Open jb_compiler/runner.py and add a new entry to the executors dictionary:

executors = {
    # Example: Add Ruby support
    'RUBY': {
        'ext': '.rb',
        'cmd': lambda temp_file, dir_path: f'ruby "{temp_file}"'
    }
}

Now, writing a JBRUBY ... END block inside any .jb file will automatically run it!

Server Workflow

1. Dynamic Block Extraction: On save, the parser isolates any JB[LANG] block closing with a standalone END.
2. State Sharing: Initializes a .jb_state.json file to store cross-language variable mappings. Prepend the JBMemory helper to Python and Core JB code blocks.
3. Sequential Execution: Awaits execution of all blocks in the order they are defined.
4. Core JB Execution: Transpiles and executes the remaining core code via Node.js, displaying outputs under CORE JB.
5. Live Reloading: HTML blocks automatically refresh your browser via a custom HTTP server running silently on port 3000.

Example JB Syntax

Here is an example code snippet that you can use to test the highlighting:

// This is a line comment
/*
   This is a block comment
*/

class Person extends Entity {
    var name = "Jathin";
    let age = 10;
    const isDeveloper = true;

    fn greet(message) {
        if (message == null) {
            message = "Hello!";
        }
        return message + " My name is " + this.name;
    }
}

// Embedded HTML block
JBHTML
  <div class="container">
    <h1>Hello from Embedded HTML!</h1>
    <p>All syntax highlighting inside here is standard HTML.</p>
  </div>
END

// Embedded Python block
JBPYTHON
  import math

  def get_hypotenuse(a, b):
      # standard Python comment
      return math.sqrt(a**2 + b**2)

  print(get_hypotenuse(3, 4))
END

// Numbers and values
let hex = 0x1A2B;
let bin = 0b1010;
let dec = 42.5;

let result = greet("Welcome");