@fmsim/machine 0.0.77 → 0.0.79

package/src/stocker-capacity-bar.ts

@@ -4,6 +4,7 @@ import { MCSStatusMixin } from './features/mcs-status-mixin'
 import { LEGEND_CAPACITY, Legend } from './features/mcs-status-default'
 import { safeRound } from './utils/safe-round'
 import { getVaueOnRanges } from './utils/get-value-on-ranges'
+import { roundRect } from './utils/round-rect'
 
 const NATURE: ComponentNature = {
   mutable: false,
@@ -143,7 +144,7 @@ export default class StockerCapacityBar extends MCSStatusMixin(RectPath(Shape))
     context.beginPath()
 
     context.fillStyle = fillStyle
-    context.roundRect(0, 0, width, height, round)
+    roundRect(context, 0, 0, width, height, round)
 
     context.fill()
 
@@ -195,7 +196,7 @@ export default class StockerCapacityBar extends MCSStatusMixin(RectPath(Shape))
     context.setLineDash([])
     context.strokeStyle = strokeStyle
     context.lineWidth = lineWidth
-    context.roundRect(0, 0, width, height, round)
+    roundRect(context, 0, 0, width, height, round)
     context.stroke()
 
     context.beginPath()
@@ -215,7 +216,7 @@ export default class StockerCapacityBar extends MCSStatusMixin(RectPath(Shape))
     context.beginPath()
 
     context.fillStyle = fillStyle
-    context.roundRect(0, 0, width, height, round)
+    roundRect(context, 0, 0, width, height, round)
 
     context.fill()
 
@@ -267,7 +268,7 @@ export default class StockerCapacityBar extends MCSStatusMixin(RectPath(Shape))
     context.setLineDash([])
     context.strokeStyle = strokeStyle
     context.lineWidth = lineWidth
-    context.roundRect(0, 0, width, height, round)
+    roundRect(context, 0, 0, width, height, round)
     context.stroke()
 
     context.beginPath()

package/src/utils/round-rect.ts

@@ -0,0 +1,40 @@
+import { safeRound } from './safe-round'
+
+/**
+ * Draws a rounded rectangle using the current state of the canvas.
+ * If you omit the last three params, it will draw a rectangle
+ * outline with a 5 pixel border radius
+ * @param {CanvasRenderingContext2D} context
+ * @param {Number} x The top left x coordinate
+ * @param {Number} y The top left y coordinate
+ * @param {Number} width The width of the rectangle
+ * @param {Number} height The height of the rectangle
+ * @param {Number|Array<Number>} [radius = 0] The corner radius; It can also be an object
+ *                 to specify different radii for corners
+ * @param {Number} [radius.tl = 0] Top left
+ * @param {Number} [radius.tr = 0] Top right
+ * @param {Number} [radius.br = 0] Bottom right
+ * @param {Number} [radius.bl = 0] Bottom left
+ * @param {Boolean} [fill = false] Whether to fill the rectangle.
+ * @param {Boolean} [stroke = true] Whether to stroke the rectangle.
+ */
+export function roundRect(
+  context: CanvasRenderingContext2D,
+  x: number,
+  y: number,
+  width: number,
+  height: number,
+  round: number = 0
+) {
+  round = safeRound(round, width, height)
+
+  if (round > 0) {
+    context.moveTo(x + round, y)
+    context.arcTo(x + width, y, x + width, y + height, round)
+    context.arcTo(x + width, y + height, x, y + height, round)
+    context.arcTo(x, y + height, x, y, round)
+    context.arcTo(x, y, x + width, y, round)
+  } else {
+    context.rect(x, y, width, height)
+  }
+}

package/src/zone-capacity-bar.ts

@@ -5,6 +5,7 @@ import { safeRound } from './utils/safe-round'
 import { getVaueOnRanges } from './utils/get-value-on-ranges'
 import { MCSZoneMixin, MCSZoneMixinProperties } from './features/mcs-zone-mixin'
 import MCSUnit from './mcs-unit'
+import { roundRect } from './utils/round-rect'
 
 const NATURE: ComponentNature = {
   mutable: false,
@@ -129,7 +130,7 @@ export default class ZoneCapacityBar extends MCSZoneMixin(MCSUnit) {
     context.beginPath()
 
     context.fillStyle = fillStyle
-    context.roundRect(0, 0, width, height, round)
+    roundRect(context, 0, 0, width, height, round)
 
     context.fill()
     context.stroke()
@@ -182,7 +183,7 @@ export default class ZoneCapacityBar extends MCSZoneMixin(MCSUnit) {
     context.setLineDash([])
     context.strokeStyle = strokeStyle
     context.lineWidth = lineWidth
-    context.roundRect(0, 0, width, height, round)
+    roundRect(context, 0, 0, width, height, round)
     context.stroke()
 
     context.beginPath()
@@ -202,7 +203,7 @@ export default class ZoneCapacityBar extends MCSZoneMixin(MCSUnit) {
     context.beginPath()
 
     context.fillStyle = fillStyle
-    context.roundRect(0, 0, width, height, round)
+    roundRect(context, 0, 0, width, height, round)
 
     context.fill()
 
@@ -254,7 +255,7 @@ export default class ZoneCapacityBar extends MCSZoneMixin(MCSUnit) {
     context.setLineDash([])
     context.strokeStyle = strokeStyle
     context.lineWidth = lineWidth
-    context.roundRect(0, 0, width, height, round)
+    roundRect(context, 0, 0, width, height, round)
     context.stroke()
 
     context.beginPath()