Change Colour/Thickness and Add Rotation to SAM Radius (#2348)

## Description:

Change Colour/Thickness and Add Rotation to SAM Radius



https://github.com/user-attachments/assets/c701c877-4b71-4266-ad86-bf8e8d61756a



https://github.com/user-attachments/assets/2ea24df7-ae8f-425e-bb07-19c731529ab6



## Please complete the following:

- [x] I have added screenshots for all UI updates
- [x] I process any text displayed to the user through translateText()
and I've added it to the en.json file
- [x] I have added relevant tests to the test directory
- [x] I confirm I have thoroughly tested these changes and take full
responsibility for any bugs introduced

## Please put your Discord username so you can be contacted if a bug or
regression is found:

w.o.n
This commit is contained in:
Ryan Barlow
2025-11-01 02:30:49 +00:00
committed by GitHub
parent 380307e386
commit daf3fee14d
+17 -4
View File
@@ -19,6 +19,9 @@ export class SAMRadiusLayer implements Layer {
private hoveredShow: boolean = false;
private ghostShow: boolean = false;
private showStroke: boolean = false;
private dashOffset = 0;
private rotationSpeed = 14; // px per second
private lastTickTime = Date.now();
private handleToggleStructure(e: ToggleStructureEvent) {
const types = e.structureTypes;
@@ -112,6 +115,17 @@ export class SAMRadiusLayer implements Layer {
this.updateStrokeVisibility();
// Redraw if transform changed or if we need to redraw
const now = Date.now();
const dt = now - this.lastTickTime;
this.lastTickTime = now;
if (this.showStroke) {
this.dashOffset += (this.rotationSpeed * dt) / 1000;
if (this.dashOffset > 1e6) this.dashOffset = this.dashOffset % 1000000;
// animate by redrawing each frame whilst visible
this.needsRedraw = true;
}
if (this.transformHandler.hasChanged() || this.needsRedraw) {
this.redraw();
this.needsRedraw = false;
@@ -168,9 +182,7 @@ export class SAMRadiusLayer implements Layer {
if (circles.length === 0) return;
// styles
const strokeStyleOuter =
this.game.myPlayer()?.borderColor().toRgbString() ??
"rgba(230, 230, 230, 0.9)";
const strokeStyleOuter = "rgba(0, 0, 0, 1)";
// 1) Fill union simply by drawing all full circle paths and filling once
ctx.save();
@@ -187,8 +199,9 @@ export class SAMRadiusLayer implements Layer {
if (!this.showStroke) return;
ctx.save();
ctx.lineWidth = 1;
ctx.lineWidth = 2;
ctx.setLineDash([12, 6]);
ctx.lineDashOffset = this.dashOffset;
ctx.strokeStyle = strokeStyleOuter;
const TWO_PI = Math.PI * 2;