mirror of
https://github.com/schlagmichdoch/PairDrop.git
synced 2026-04-05 17:33:49 +00:00
Make sure older webkit/blink based browsers are able to render opacity of circles
This commit is contained in:
@@ -461,7 +461,14 @@ class BackgroundCanvas {
|
||||
opacity *= (8 * dw - radius) / dw
|
||||
}
|
||||
|
||||
ctx.strokeStyle = `rgb(${baseColor} / ${opacity})`;
|
||||
if (ctx.setStrokeColor) {
|
||||
// older blink/webkit browsers do not understand opacity in strokeStyle. Use deprecated setStrokeColor
|
||||
let baseColorRgb = baseColor.split(" ");
|
||||
ctx.setStrokeColor(baseColorRgb[0], baseColorRgb[1], baseColorRgb[2], opacity);
|
||||
}
|
||||
else {
|
||||
ctx.strokeStyle = `rgb(${baseColor} / ${opacity})`;
|
||||
}
|
||||
ctx.beginPath();
|
||||
ctx.arc(x0, y0, radius, 0, 2 * Math.PI);
|
||||
ctx.stroke();
|
||||
|
||||
@@ -96,7 +96,15 @@ function drawCircle(ctx, radius) {
|
||||
opacity *= (8 * dw - radius) / dw
|
||||
}
|
||||
|
||||
ctx.strokeStyle = `rgb(${baseColor} / ${opacity})`;
|
||||
if (ctx.setStrokeColor) {
|
||||
// older blink/webkit based browsers do not understand opacity in strokeStyle. Use deprecated setStrokeColor instead
|
||||
// https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/strokeStyle#webkitblink-specific_note
|
||||
let baseColorRgb = baseColor.split(" ");
|
||||
ctx.setStrokeColor(baseColorRgb[0], baseColorRgb[1], baseColorRgb[2], opacity);
|
||||
}
|
||||
else {
|
||||
ctx.strokeStyle = `rgb(${baseColor} / ${opacity})`;
|
||||
}
|
||||
ctx.beginPath();
|
||||
ctx.arc(x0, y0, radius, 0, 2 * Math.PI);
|
||||
ctx.stroke();
|
||||
|
||||
Reference in New Issue
Block a user