Cocos Daaddy

A readable formatter for Cocos Creator .effect files (YAML + GLSL hybrid) and .json files, plus autocomplete and signature help for .effect GLSL sections.

Takes over the standard Format Document command (Shift+Alt+F / Ctrl+Shift+F) for both file types so you can format directly in the editor.

Features

.effect formatting

• YAML section normalized to uniform 2-space steps. Nesting structure is preserved via an indent-level stack — only indent widths change, keys/values are never touched, so mixed-indent files stay valid. Blank lines inside the YAML block are dropped.
• YAML flow-merge. A key line immediately followed by a more-indented single-line flow value ({ ... } / [ ... ]) is joined onto one line: stopColorsH: + next-line { value: [[1,1,1,1], ...] } → stopColorsH: { value: [[1,1,1,1], ...] }. Multi-line flows stay multi-line.
• GLSL section normalized — the source is scanned to detect the current indent step (2 or 4 spaces), then rescaled to your configured target.
• Consistent operator spacing that reads well and never breaks the code:
  • Binary + - * / == != >= <= > < && || spaced on both sides
  • Ternary ? spaced on both sides
  • Scientific notation 1e-6 / 2.5E+10 left untouched
  • Unary - 0.5 / + 3 (following , ( [ = etc.) tightened to -0.5 / +3
  • i ++ / j ++ tightened to i++
  • )return / )discard / )col = x split with a space after )
  • }else split to } else
  • Assignment = single-spaced (a=b → a = b); compound assign += -= *= /= %= and == >= <= != excluded
  • Call-site ( tightened (foo ( → foo(); keywords if / for / while / switch / return / do / else keep the space (if ( stays)
  • ( inner-left and ) inner-right padding removed (( x → (x)
  • ) / ] tight to following separator () ; → );, ) ) → )), ) , → ),)
  • , single-spaced (a , b / a,b → a, b)
  • Inline braces get inner padding: {return → { return, x;} → x; }
  • #define NAME VALUE collapses excess spaces
  • GLSL blank lines inside CCProgram blocks are dropped

.effect code intelligence

• Autocomplete inside CCEffect blocks: YAML keywords (techniques / passes / blendState / depthStencilState / properties …) and enum values (src_alpha / one_minus_src_alpha / add / none / …).
• Autocomplete inside CCProgram blocks: GLSL types (vec2/vec3/vec4 / mat4 / …), keywords (uniform / in / out / discard …), preprocessor directives (#include / #define / #if …), Cocos built-ins (cc_matViewProj / cc_time / cc_spriteTexture / a_position / v_uv …), built-in functions (texture / mix / smoothstep / dot …), and document-defined symbols (user functions, #define macros, uniforms/locals/params, struct types and struct-typed variables). Document symbols sort above built-ins.
• Signature help for GLSL function calls. Inside CCProgram blocks, when the cursor is inside a function call's argument list, the editor shows the function's signature with the active parameter highlighted. Triggers on ( and ,. Sources: GLSL built-ins parsed from completion snippets at activation; user-defined functions scanned live from the document on each invocation.
• Syntax highlighting (TextMate grammar) for .effect files — CCEffect YAML keys/values, CCProgram GLSL keywords/types/modifiers/built-ins, comments, numbers, preprocessor directives all get distinct scopes.
• Semantic highlighting layered on top of the grammar for CCProgram blocks — GLSL types and uniform/struct block names, #define names and ALL_CAPS constants, user function declarations/calls, GLSL built-in functions each get a semantic token type so themes color them via their semantic palette. Requires editor.semanticHighlighting.enabled.

.json formatting

• Source line layout preserved. A non-empty container that spans a single physical line in the source stays single-line; one that spans multiple lines stays multi-line. Empty {} / [] always render compact. We never expand a single-line container, never collapse a multi-line one.
• String literal whitespace trim. Leading/trailing whitespace inside string values and keys is stripped: " 倒计时 " → "倒计时". Internal whitespace is preserved; escape sequences are untouched.
• One space after : in key/value pairs (both layouts).
• One space after , in single-line arrays ([1, 2, 3]); multi-line arrays put , at the end of each element line. Brackets sit tight against content: ["big"], not [ "big" ].
• Trailing commas dropped — output is always strict JSON, so a stray , before } or ] is removed automatically.
• Tolerant of JSONC input — accepts // line and /* block */ comments (preserved on their own line at the right depth) and trailing commas; output is strict JSON. Comments force multi-line layout.
• Idempotent — re-formatting already-formatted output is a no-op.

Output is UTF-8 without BOM with LF line endings for both file types. No trailing newline at the end of file.

Usage

.effect

1. Open any .effect file.
2. Run Format Document (Shift+Alt+F on Windows/Linux, Shift+Option+F on macOS). Ctrl+Shift+F in Cocos Creator's built-in editor triggers the same command.
3. The formatter rewrites YAML/GLSL sections in place.

.json

Cocos Daaddy declares itself as the default formatter for .effect, .json, and .jsonc via contributes.configurationDefaults. On install, Ctrl+Shift+F / Shift+Alt+F invokes Cocos Daaddy directly — no manual setup.

VSCode's built-in JSON formatter and other installed formatters may still be selected explicitly via Format Document With.... To restore Cocos Daaddy after picking another formatter, run that command and choose Configure Default Formatter → Cocos Daaddy, or set [json].editor.defaultFormatter (and/or [jsonc].editor.defaultFormatter) back to Szrpf.cocos-daaddy.

Configuration

Manual formatting via Format Document (Ctrl+Shift+F / Shift+Alt+F) is always on and cannot be disabled — it is the plugin's core function. The *FormatOnSave flags are opt-in for the save-time workflow.

Example — 2-space indent, auto-format both file types on save:

{
    "CocosDaaddy.indentSize": 2,
    "CocosDaaddy.formatOnSave": true,
    "CocosDaaddy.jsonFormatOnSave": true
}

Two paths to format-on-save

VSCode already ships a global editor.formatOnSave. Both routes work; pick one:

• Plugin-scoped (recommended): set the relevant *FormatOnSave flag (CocosDaaddy.formatOnSave for .effect, CocosDaaddy.jsonFormatOnSave for .json / .jsonc) to true. Only touches that file type, regardless of your global editor.formatOnSave setting.
• VSCode-native language scope: set "[cocos-effect]": { "editor.formatOnSave": true }, "[json]": { "editor.formatOnSave": true }, or "[jsonc]": { "editor.formatOnSave": true } in settings.json. Uses VSCode's built-in save-format pipeline.

If both are set, the plugin defers to the built-in one to avoid formatting twice.

Why not a generic formatter (Prettier / clang-format / …)?

.effect is a YAML + GLSL hybrid. No mainstream formatter understands both languages inside the same file and the CCEffect / CCProgram delimiters, so a custom pass is the only clean way. This extension is a lightweight, deterministic string-rewriter with the rules tuned to match hand-written Cocos shader style.

For .json, this extension preserves the source's single-line vs multi-line layout per container, normalizes spacing (one space after : and ,), and strips trailing commas — without the configuration surface of Prettier or VSCode's built-in formatter. Useful when you want one consistent style across a Cocos project.

License

MIT — see the LICENSE file bundled with the extension.