Ensure grayscale angle shading renders in 2D view

[kryptokommunist]

Summary

• pass the shade-by-angle toggle through the render pipeline so grayscale fills are applied in 2D SVG output

Testing

• not run (not requested)

---

Codex Task

[gemini-code-assist]

Summary of Changes

Hello @kryptokommunist, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request introduces a new visual feature to the Doyle Spiral Studio, enabling users to render 2D regions with grayscale shading based on the angle of the lines. This enhancement provides an alternative visualization mode, allowing for a different perspective on the generated spirals by mapping line angles to a black-to-white gradient. The changes span the UI, application defaults, and the core rendering engine to seamlessly integrate this new functionality.

Highlights

• User Interface: A new checkbox has been added to the advanced settings in index.html allowing users to toggle 'Colour 2D regions by line angle (grayscale)'.
• Default Settings: A new shade_by_angle property, defaulting to false, has been introduced in app.js to manage the state of the new grayscale shading feature.
• Rendering Engine Updates: The doyle_spiral_engine.js file has been significantly updated to support solid fills for ArcGroup objects and to pass the shadeByAngle parameter through the rendering pipeline. This includes modifications to ArcGroup methods, _createArcGroupsForCircles, and renderSpiral.
• Grayscale Calculation Logic: New logic has been implemented in doyle_spiral_engine.js to calculate a grayscale color based on the normalized angle of each arc group (modulo 180°) when the shadeByAngle option is active. This overrides any existing pattern fills.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

This pull request successfully introduces a new feature for grayscale angle shading in the 2D view. The changes are well-structured, adding a UI toggle in the HTML, passing the new shade_by_angle parameter through the JavaScript application layers, and implementing the core rendering logic in doyle_spiral_engine.js. The implementation of the solid fill based on angle is clean. I have one suggestion to improve the robustness of how the representative angle of an arc group is determined, which will lead to more predictable coloring. Overall, this is a solid contribution.

[gemini-code-assist]

The current implementation uses find to select the first valid arc from the group to determine the angle for shading. This might not be representative of the group's overall orientation, especially for complex groups composed of multiple arcs with different lengths and orientations (e.g., after _extendGroupsWithNeighbours runs). A more robust approach would be to use the longest arc in the group, as its orientation is more likely to be representative. This will lead to more stable and predictable coloring.

Suggested change

	const referenceArc = group.arcs.find(arc => arc?.start && arc?.end);
	const referenceArc = group.arcs.filter(arc => arc?.start && arc?.end).sort((a, b) => Math.hypot(b.end.re - b.start.re, b.end.im - b.start.im) - Math.hypot(a.end.re - a.start.re, a.end.im - a.start.im))[0];