@pix3/cli 1.6.0

package/templates/recipe-bouncer-2d/files/scenes/main.pix3scene

@@ -0,0 +1,615 @@
+# Pix3 Scene File (YAML)
+# Bouncer 2D — the GAME scene, and the editor's startup scene: iterate here.
+# A full build boots the MENU (menu.pix3scene), whose PLAY transitions here.
+#
+# The physics is NOT engine physics. `scripts/BallBody.ts` runs a swept
+# (continuous) circle solver and reads its colliders from the LIVE WORLD
+# TRANSFORMS of the marker nodes below — so rotating `paddle` (or adding
+# flippers) works with no extra code, and no `core:Hitbox2D` is involved:
+#   walls/*   -> oriented boxes    bumpers/* -> circles
+#   paddles/* -> oriented boxes    drain     -> trigger box (lose a ball)
+# `board-trim` is DECORATION ONLY — it hangs off `board`, not off `walls`, so
+# its strips are not colliders. Never move a visual into a collider group.
+#
+# The neon look is three cheap ingredients, all authored here:
+#   1. `post-fx` (PostProcess, affect2D) — bloom picks up whatever is bright
+#      (cyan trim, gold paddle, white ball, bumper cores) + a light vignette.
+#   2. `bg-glow` — a near-white radial-gradient placeholder tinted violet, over
+#      the darkest ColorRect (`game-background`). ColorRect2D has no gradient.
+#   3. HUD `Label2D` glow (`glowColor`/`glowStrength`): the HUD is a
+#      CanvasLayer2D, drawn AFTER post-processing, so it can never bloom —
+#      its glow is canvas-drawn instead. (`outlineColor`/`outlineWidth` are the
+#      matching knobs for text that has to sit over busy gameplay; the HUD here
+#      sits over plain background, so glow alone carries it.)
+#
+# Stable node ids (design/recipe.md is the contract — do not rename these):
+#   post-fx, game-root, game-background, bg-glow, board, board-floor,
+#   board-trim, walls, wall-left, wall-right, wall-top, bumpers, bumper-a,
+#   bumper-b, bumper-c, paddles, paddle, ball, drain,
+#   hud, score-label, time-label, lives-bar, menu-button,
+#   result-overlay, result-label, retry-button (scenes/ui/result.pix3scene)
+#
+# Full-screen UI lives in its own file under scenes/ui/ and is instanced here
+# hidden (`visible: false` = editor only), so opening this scene shows the game
+# rather than a GAME OVER card.
+#
+# 2D coordinates: origin at the canvas centre, X right, Y UP. Node order in the
+# tree is paint order (later/deeper draws on top). `rotation` here is DEGREES.
+version: 1.0.0
+metadata:
+  author: Pix3 Recipe
+  description: Bouncer gameplay — a ball under gravity, a paddle, bumpers and a drain
+root:
+  # Renders nothing; the renderer picks it up and builds the effect stack.
+  # `bloomIntensity` is a recipe tunable (design/recipe.md) — the Flow theme
+  # pack turns it up for neon; a pastel / light look RAISES `bloomThreshold`
+  # (~0.9) instead — a pale ground over 0.58 blooms the whole screen.
+  - id: post-fx
+    type: PostProcess
+    name: Post FX
+    properties:
+      affect2D: true
+      bloomEnabled: true
+      bloomIntensity: 0.9
+      bloomThreshold: 0.58
+      bloomSmoothing: 0.2
+      bloomRadius: 0.78
+      vignetteEnabled: true
+      vignetteOffset: 0.3
+      vignetteDarkness: 0.5
+      chromaticAberrationEnabled: false
+    children: []
+  - id: game-root
+    type: Group2D
+    name: Game Root
+    properties:
+      width: 1080
+      height: 1920
+      layout:
+        enabled: true
+        horizontalAlign: stretch
+        verticalAlign: stretch
+    components:
+      - id: game-rules
+        type: user:GameRules
+        enabled: true
+        config:
+          winMode: score
+          targetScore: 1500
+          timeLimitSec: 0
+          startingLives: 3
+          resultNode: result-overlay
+          resultLabel: result-label
+          winText: "YOU WIN!"
+          loseText: "GAME OVER"
+          retryButton: retry-button
+          menuButton: menu-button
+          menuScene: res://scenes/menu.pix3scene
+          gameScene: res://scenes/main.pix3scene
+          freezeNodes: ball,paddle
+      - id: touch-rules
+        type: user:TouchRules
+        enabled: true
+        config:
+          ballNode: ball
+          rules: "bumper:score:100;paddle:score:10;drain:damage:1"
+          minImpactSpeed: 60
+          punchAmount: 0.34
+          hitstopMs: 50
+          burstCount: 18
+          popupFormat: "+{value}"
+          feedbackColor: "#ffe066"
+          sfxEnabled: true
+          scoreSound: ""
+          damageSound: ""
+    children:
+      - id: game-background
+        type: ColorRect2D
+        name: Game Background
+        properties:
+          width: 1080
+          height: 1920
+          color: "#05030f"
+          transform:
+            position: [0, 0]
+            scale: [1, 1]
+            rotation: 0
+          layout:
+            enabled: true
+            horizontalAlign: stretch
+            verticalAlign: stretch
+        children: []
+      - id: bg-glow
+        type: Sprite2D
+        name: Background Glow
+        properties:
+          texture: { type: 'texture', url: 'res://sprites/ph-bg.png' }
+          width: 1080
+          height: 1920
+          effects:
+            - type: core:tint
+              params: { color: "#5a2df0", amount: 1 }
+          transform:
+            position: [0, 0]
+            scale: [1, 1]
+            rotation: 0
+          layout:
+            enabled: true
+            horizontalAlign: stretch
+            verticalAlign: stretch
+        children: []
+      - id: board
+        type: Group2D
+        name: Board
+        properties:
+          width: 1000
+          height: 1600
+          transform:
+            position: [0, -60]
+            scale: [1, 1]
+            rotation: 0
+        children:
+          # Translucent so the background glow reads through the playfield.
+          - id: board-floor
+            type: ColorRect2D
+            name: Board Floor
+            properties:
+              width: 1000
+              height: 1600
+              color: "#120a33"
+              opacity: 0.62
+              transform:
+                position: [0, 0]
+                scale: [1, 1]
+                rotation: 0
+            children: []
+          - id: drain
+            type: ColorRect2D
+            name: Drain
+            properties:
+              width: 1000
+              height: 160
+              color: "#ff2d6f"
+              opacity: 0.18
+              transform:
+                position: [0, -760]
+                scale: [1, 1]
+                rotation: 0
+            children: []
+          - id: walls
+            type: Group2D
+            name: Walls
+            properties:
+              width: 1000
+              height: 1600
+              transform:
+                position: [0, 0]
+                scale: [1, 1]
+                rotation: 0
+            children:
+              - id: wall-left
+                type: ColorRect2D
+                name: Wall Left
+                properties:
+                  width: 40
+                  height: 1600
+                  color: "#1c1245"
+                  transform:
+                    position: [-480, 0]
+                    scale: [1, 1]
+                    rotation: 0
+                children: []
+              - id: wall-right
+                type: ColorRect2D
+                name: Wall Right
+                properties:
+                  width: 40
+                  height: 1600
+                  color: "#1c1245"
+                  transform:
+                    position: [480, 0]
+                    scale: [1, 1]
+                    rotation: 0
+                children: []
+              - id: wall-top
+                type: ColorRect2D
+                name: Wall Top
+                properties:
+                  width: 1000
+                  height: 40
+                  color: "#1c1245"
+                  transform:
+                    position: [0, 780]
+                    scale: [1, 1]
+                    rotation: 0
+                children: []
+          # Decoration only (see the header): thin bright strips hugging the
+          # inner faces of the walls. Bright enough to cross the bloom
+          # threshold, thin enough to read as a neon tube rather than a slab.
+          - id: board-trim
+            type: Group2D
+            name: Board Trim
+            properties:
+              width: 1000
+              height: 1600
+              transform:
+                position: [0, 0]
+                scale: [1, 1]
+                rotation: 0
+            children:
+              - id: trim-left
+                type: ColorRect2D
+                name: Trim Left
+                properties:
+                  width: 10
+                  height: 1560
+                  color: "#2ef2ff"
+                  transform:
+                    position: [-455, -20]
+                    scale: [1, 1]
+                    rotation: 0
+                children: []
+              - id: trim-right
+                type: ColorRect2D
+                name: Trim Right
+                properties:
+                  width: 10
+                  height: 1560
+                  color: "#2ef2ff"
+                  transform:
+                    position: [455, -20]
+                    scale: [1, 1]
+                    rotation: 0
+                children: []
+              - id: trim-top
+                type: ColorRect2D
+                name: Trim Top
+                properties:
+                  width: 920
+                  height: 10
+                  color: "#2ef2ff"
+                  transform:
+                    position: [0, 755]
+                    scale: [1, 1]
+                    rotation: 0
+                children: []
+              - id: trim-drain
+                type: ColorRect2D
+                name: Trim Drain Line
+                properties:
+                  width: 920
+                  height: 6
+                  color: "#ff2d6f"
+                  transform:
+                    position: [0, -676]
+                    scale: [1, 1]
+                    rotation: 0
+                children: []
+          # Each bumper is a Group2D so its collider stays one circle
+          # (radius = width/2) while the visual is two concentric rings: a
+          # magenta corona and a bright core that bloom-glows. `punchScale`
+          # on the group pops both together.
+          - id: bumpers
+            type: Group2D
+            name: Bumpers
+            properties:
+              width: 1000
+              height: 1600
+              transform:
+                position: [0, 0]
+                scale: [1, 1]
+                rotation: 0
+            children:
+              - id: bumper-a
+                type: Group2D
+                name: Bumper A
+                properties:
+                  width: 160
+                  height: 160
+                  transform:
+                    position: [-230, 260]
+                    scale: [1, 1]
+                    rotation: 0
+                children:
+                  - id: bumper-a-halo
+                    type: Sprite2D
+                    name: Bumper A Halo
+                    properties:
+                      texture: { type: 'texture', url: 'res://sprites/ph-bumper.png' }
+                      width: 216
+                      height: 216
+                      opacity: 0.55
+                      effects:
+                        - type: core:tint
+                          params: { color: "#ff6cf2", amount: 1 }
+                      transform:
+                        position: [0, 0]
+                        scale: [1, 1]
+                        rotation: 0
+                    children: []
+                  - id: bumper-a-core
+                    type: Sprite2D
+                    name: Bumper A Core
+                    properties:
+                      texture: { type: 'texture', url: 'res://sprites/ph-bumper.png' }
+                      width: 160
+                      height: 160
+                      effects:
+                        - type: core:tint
+                          params: { color: "#8ffcff", amount: 1 }
+                      transform:
+                        position: [0, 0]
+                        scale: [1, 1]
+                        rotation: 0
+                    children: []
+              - id: bumper-b
+                type: Group2D
+                name: Bumper B
+                properties:
+                  width: 160
+                  height: 160
+                  transform:
+                    position: [230, 260]
+                    scale: [1, 1]
+                    rotation: 0
+                children:
+                  - id: bumper-b-halo
+                    type: Sprite2D
+                    name: Bumper B Halo
+                    properties:
+                      texture: { type: 'texture', url: 'res://sprites/ph-bumper.png' }
+                      width: 216
+                      height: 216
+                      opacity: 0.55
+                      effects:
+                        - type: core:tint
+                          params: { color: "#ff6cf2", amount: 1 }
+                      transform:
+                        position: [0, 0]
+                        scale: [1, 1]
+                        rotation: 0
+                    children: []
+                  - id: bumper-b-core
+                    type: Sprite2D
+                    name: Bumper B Core
+                    properties:
+                      texture: { type: 'texture', url: 'res://sprites/ph-bumper.png' }
+                      width: 160
+                      height: 160
+                      effects:
+                        - type: core:tint
+                          params: { color: "#8ffcff", amount: 1 }
+                      transform:
+                        position: [0, 0]
+                        scale: [1, 1]
+                        rotation: 0
+                    children: []
+              - id: bumper-c
+                type: Group2D
+                name: Bumper C
+                properties:
+                  width: 160
+                  height: 160
+                  transform:
+                    position: [0, 520]
+                    scale: [1, 1]
+                    rotation: 0
+                children:
+                  - id: bumper-c-halo
+                    type: Sprite2D
+                    name: Bumper C Halo
+                    properties:
+                      texture: { type: 'texture', url: 'res://sprites/ph-bumper.png' }
+                      width: 216
+                      height: 216
+                      opacity: 0.55
+                      effects:
+                        - type: core:tint
+                          params: { color: "#ff6cf2", amount: 1 }
+                      transform:
+                        position: [0, 0]
+                        scale: [1, 1]
+                        rotation: 0
+                    children: []
+                  - id: bumper-c-core
+                    type: Sprite2D
+                    name: Bumper C Core
+                    properties:
+                      texture: { type: 'texture', url: 'res://sprites/ph-bumper.png' }
+                      width: 160
+                      height: 160
+                      effects:
+                        - type: core:tint
+                          params: { color: "#8ffcff", amount: 1 }
+                      transform:
+                        position: [0, 0]
+                        scale: [1, 1]
+                        rotation: 0
+                    children: []
+          - id: paddles
+            type: Group2D
+            name: Paddles
+            properties:
+              width: 1000
+              height: 1600
+              transform:
+                position: [0, 0]
+                scale: [1, 1]
+                rotation: 0
+            children:
+              - id: paddle
+                type: Sprite2D
+                name: Paddle
+                properties:
+                  texture: { type: 'texture', url: 'res://sprites/ph-paddle.png' }
+                  width: 300
+                  height: 60
+                  effects:
+                    - type: core:tint
+                      params: { color: "#ffd23f", amount: 1 }
+                  transform:
+                    position: [0, -620]
+                    scale: [1, 1]
+                    rotation: 0
+                components:
+                  - id: paddle-controller
+                    type: user:PaddleController
+                    enabled: true
+                    config:
+                      mode: pointer
+                      speed: 1800
+                      halfWidth: 150
+                      boundsNode: board
+                children: []
+          - id: ball
+            type: Sprite2D
+            name: Ball
+            properties:
+              texture: { type: 'texture', url: 'res://sprites/ph-ball.png' }
+              width: 60
+              height: 60
+              effects:
+                - type: core:tint
+                  params: { color: "#ffffff", amount: 1 }
+              transform:
+                position: [0, 120]
+                scale: [1, 1]
+                rotation: 0
+            components:
+              - id: ball-body
+                type: user:BallBody
+                enabled: true
+                config:
+                  radius: 30
+                  gravity: -1600
+                  maxSpeed: 1900
+                  minSpeed: 380
+                  damping: 0.999
+                  substeps: 4
+                  launchSpeed: 900
+                  launchAngleDeg: 72
+                  wallsNode: walls
+                  paddlesNode: paddles
+                  bumpersNode: bumpers
+                  drainNode: drain
+                  wallRestitution: 1
+                  paddleRestitution: 1.05
+                  bumperRestitution: 1.3
+                  resetDelaySec: 0.7
+            children: []
+      # A CanvasLayer2D is drawn after post-processing and is never bloomed —
+      # that is deliberate (HUD text stays crisp). Its glow comes from
+      # Label2D's own canvas-drawn `glowColor`/`glowStrength`.
+      - id: hud
+        type: CanvasLayer2D
+        name: HUD
+        properties:
+          width: 1080
+          height: 1920
+          layout:
+            enabled: true
+            horizontalAlign: stretch
+            verticalAlign: stretch
+        components:
+          - id: score-hud
+            type: user:ScoreHud
+            enabled: true
+            config:
+              sourceNode: game-root
+              scoreLabel: score-label
+              scoreFormat: "SCORE {value}"
+              timeLabel: time-label
+              timeFormat: "{value}s"
+              livesBar: lives-bar
+        children:
+          - id: score-label
+            type: Label2D
+            name: Score Label
+            properties:
+              label: "SCORE 0"
+              labelFontSize: 56
+              labelColor: "#ffffff"
+              labelAlign: left
+              glowColor: "#2ef2ff"
+              glowStrength: 2
+              transform:
+                position: [-340, 880]
+                scale: [1, 1]
+                rotation: 0
+              layout:
+                enabled: true
+                horizontalAlign: left
+                verticalAlign: top
+            children: []
+          - id: time-label
+            type: Label2D
+            name: Time Label
+            properties:
+              label: "0s"
+              labelFontSize: 46
+              labelColor: "#ffe066"
+              labelAlign: center
+              glowColor: "#ffd23f"
+              glowStrength: 1.5
+              transform:
+                position: [0, 880]
+                scale: [1, 1]
+                rotation: 0
+              layout:
+                enabled: true
+                horizontalAlign: center
+                verticalAlign: top
+            children: []
+          - id: lives-bar
+            type: Bar2D
+            name: Lives Bar
+            properties:
+              width: 240
+              height: 28
+              minValue: 0
+              maxValue: 3
+              value: 3
+              barColor: "#ff2d6f"
+              backBackgroundColor: "#1c1245"
+              showBorder: false
+              transform:
+                position: [340, 885]
+                scale: [1, 1]
+                rotation: 0
+              layout:
+                enabled: true
+                horizontalAlign: right
+                verticalAlign: top
+            children: []
+          - id: menu-button
+            type: Button2D
+            name: Menu Button
+            properties:
+              width: 200
+              height: 72
+              label: "MENU"
+              labelFontSize: 30
+              labelColor: "#8ffcff"
+              backgroundColor: "#1c1245"
+              hoverColor: "#2a1a63"
+              pressedColor: "#0d0724"
+              buttonAction: back-to-menu
+              transform:
+                position: [-400, -900]
+                scale: [1, 1]
+                rotation: 0
+              layout:
+                enabled: true
+                horizontalAlign: left
+                verticalAlign: bottom
+            children: []
+          # Win/lose screen — authored in scenes/ui/result.pix3scene so this
+          # scene opens on the GAME, not on a GAME OVER card. `visible: false`
+          # hides it in the EDITOR only; `initiallyVisible` (in the overlay
+          # file) is what play mode reads, and GameRules reveals it on the
+          # win/lose transition. Tick the eye to preview it over the field.
+          - id: result-overlay
+            name: Result Overlay
+            instance: res://scenes/ui/result.pix3scene
+            properties:
+              visible: false