fix(dncl): multi-arg display, suppress furigana in DNCL, hide @ruby comment bubbles#665
Merged
Merged
Conversation
…ruby metadata bubbles - Ruby→Blocks: chained `+` of `operator_join` results now produces another `operator_join` instead of `operator_add`, so DNCL `表示する(i, " ", Data[i])` actually shows all three arguments. - DNCL mode: furigana annotations are skipped when the editor shows Japanese pseudo-code (initial state respects localStorage; render paths guard on `dnclModeRef`; mode toggle clears/restores). - Block workspace: Blockly v12 renders attached collapsed comments as visible bars, which cluttered the workspace with `@ruby:*` metadata (e.g. 11 bars stacked above the first block for a 10-element array literal). Hide metadata-only comments via injected CSS, and reorder user-merged comments to put user text first so the collapsed preview bar shows the user's text. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
|
🚀 Preview deployed: https://smalruby.jp/smalruby3-editor/fix/dncl-mode-display-furigana-comments/ |
Attached comment x/y was always (0,0) by default. Blockly v11 ignored saved values and auto-positioned bubbles at the block anchor, so this went unnoticed. Blockly v12 treats x/y as workspace absolute coordinates, so every metadata bubble would render at the workspace origin in any viewer that doesn't apply the Smalruby hide-CSS — most notably scratch.mit.edu when opening a Smalruby-saved .sb3. Walk each comment's blockId up to the topLevel ancestor and arrange the comments in a vertical strip 350 px to the right of that block, 35 px apart. Value-block-attached comments use the same logic via the parent chain. User comments share the same arrangement so they sit next to the block they describe. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Disable the CSS rule that hides metadata bubbles so we can visually verify the new x/y positioning (which is what scratch.mit.edu will show when opening a Smalruby-saved sb3). Will be reverted before merging.
…l block" This reverts commit 2526118.
Replace the previous (rejected) approach that placed every comment sequentially below the topLevel block. Instead, walk each comment's blockId up the parent chain to the nearest non-value (statement/hat) block, count its hops from the topLevel ancestor, and seed the comment's x/y at (topLevel.x + 350, topLevel.y + depth * 48). Why this matches Blockly's natural anchor: - Statement-block comments land near the matching block in the chain (e.g. the 11 array-literal annotations no longer share a single y). - Value-block comments inherit the position of their enclosing statement, which is where Blockly would render them anyway. - Multiple comments anchored to the same statement still cluster, but near that block — not at the workspace origin. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
When several comments anchor to the same non-value block (e.g. the multiple value-block annotations on a single looks_sayforsecs), the prior block-anchor layout placed them all at the same coordinate and they visually merged into one bubble in viewers without the metadata-hide CSS. Add per-anchor index (24, 16) offsets so each subsequent comment slides diagonally down-right from its peers. Single-anchor comments are untouched. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Drop the previous depth*48 approximation in target-applier — it diverged from Blockly's actual rendering for deep chains, so the deferred setBubbleLocation snap (whose distance heuristic only suppresses ≤100px drift) would jump those bubbles to the approximated coordinate, often off-screen. Instead, after the comment icon's bubble is constructed at its natural anchor, capture that position via getRelativeToSurfaceXY() and write it directly to target.comments[id].x/y. The capture runs once on the next tick and once at the end of the post-load suppress window, so we get the final layout regardless of which timing wins. This makes the saved sb3 reflect exactly where the bubble visually appeared in Smalruby — viewers without the metadata-hide CSS (e.g. scratch.mit.edu) open with bubbles next to their attached blocks. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Three call sites in looks.js explicitly passed x=200, y=0 to createComment for puts/say variants. With the natural-anchor capture in comment-icon-patch, this hardcoded coordinate caused those bubbles to be created at (200, 0) — far enough from the looks_sayforsecs's actual anchor that the deferred setBubbleLocation snap fired and pinned them at (200, 0) instead of the natural rendering position. Drop the hardcoded coords; the icon patch will write the true rendered position into the VM after the bubble settles, so saved sb3 files and scratch.mit.edu reopens place these bubbles next to the say block they describe. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
All five extra arguments matched _createComment's defaults. Keeping just (text, blockId) makes the call sites consistent with the rest of the converter and clarifies that no specific position or pin state is intended — natural-anchor capture handles positioning.
Re-enable the rule that was temporarily disabled while verifying bubble x/y placement. Now that natural-anchor capture writes the true rendered position into the VM, the saved sb3 places bubbles correctly in scratch.mit.edu, and Smalruby itself can hide them with the CSS rule.
github-actions Bot
pushed a commit
that referenced
this pull request
May 10, 2026
…-display-furigana-comments fix(dncl): multi-arg display, suppress furigana in DNCL, hide @ruby comment bubbles
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
DNCL モード関連の3件の不具合を修正:
表示する(i, " ", Data[i])の引数が一部しか表示されない(i.to_s + " ") + Data[i].to_sのような連鎖した文字列結合の外側+がoperator_addになっていた。math+ハンドラは receiver がoperator_joinブロックの場合nullを返し、string+ハンドラに委ねるよう修正。DNCL モードでもふりがなが表示される
dnclMode=trueの状態でリロードすると、Ruby tab でふりがなが描画されていた。初期 state を localStorage で抑制し、renderFurigana()/scheduleFuriganaUpdate()にdnclModeRefガードを追加。モード切替時にもクリア/復元。コードタブ遷移時に
@ruby:メタデータコメントが第1ブロックと重なるdata-smalruby-meta属性 + 注入 CSS でメタデータのみのコメントをdisplay:noneに。@ruby:comment_position:inlineマーカーより前に並べることで、collapsed プレビューにユーザーテキストが表示されるよう変更（generator は行ごとにフィルタするため round-trip に影響なし）。Test plan
eslint --max-warnings 0)表示する(i, " ", Data[i])を変換すると 4 個のlooks_sayforsecsMESSAGE 入力がoperator_join(text concat) になる🤖 Generated with Claude Code