125 lines
3.1 KiB
JavaScript
125 lines
3.1 KiB
JavaScript
class BBTimelineForegroundCanvas extends BBTimelineCanvas {
|
|
constructor(parentEl, el) {
|
|
super(parentEl, el);
|
|
|
|
const a = this;
|
|
|
|
a.initialiseComponents();
|
|
}
|
|
|
|
initialiseComponents() {
|
|
super.initialiseComponents();
|
|
|
|
const a = this;
|
|
|
|
a.Invalidate();
|
|
}
|
|
|
|
Invalidate() {
|
|
const a = this;
|
|
const rect = a.Parent.Layer.Background.GraphRectangle;
|
|
const margin = a.Parent.Layer.Background.Margin;
|
|
|
|
a.Clear();
|
|
|
|
const startPosY = (rect.Y + a.Parent.Marker.Width);
|
|
|
|
const visibleEvents = a.Parent.FindVisibleEvents();
|
|
visibleEvents.forEach(function (e, i) {
|
|
// Calculate Y position
|
|
let posY = a.calcMarkerPosition(e.Position.X, startPosY);
|
|
|
|
a.drawVerticalLine(e.Position.X, posY);
|
|
|
|
const markerRectangle = a.drawMarker(e.Position.X, posY, e.BorderColour, e.BackColour);
|
|
const labelSize = a.drawText((markerRectangle.X + markerRectangle.W + margin), markerRectangle.Y, e.Label, a.Parent.Marker.Font, a.Parent.Marker.ForeColour, "left");
|
|
|
|
e.Position = { X: e.Position.X, Y: posY };
|
|
|
|
e.HitBox = {
|
|
X: markerRectangle.X,
|
|
Y: markerRectangle.Y,
|
|
W: (markerRectangle.W + margin + labelSize.Width + a.Parent.Marker.CollisionMargin),
|
|
H: markerRectangle.H
|
|
};
|
|
|
|
if (a.Parent.Debug) a.drawRectangle(e.HitBox, "red");
|
|
if (a.Parent.Debug) console.log(e);
|
|
});
|
|
}
|
|
|
|
|
|
calcMarkerPosition(x, y) {
|
|
const a = this;
|
|
const rect = a.Parent.Layer.Background.GraphRectangle;
|
|
|
|
// Calculate Y position
|
|
let hasMoved = false;
|
|
let posY = y;
|
|
for (let i=0; i<a.Parent.Layer.Background.NoStep; i++)
|
|
{
|
|
posY = y + (a.Parent.Layer.Background.StepHeight * i);
|
|
|
|
var clippedEvent = a.Parent.FindEventsByCoords(x, posY);
|
|
if (clippedEvent == null) {
|
|
hasMoved = true;
|
|
break;
|
|
}
|
|
}
|
|
|
|
if (!hasMoved) {
|
|
posY = y;
|
|
}
|
|
|
|
return posY;
|
|
}
|
|
|
|
drawMarker(x, y, borderColour, backColour) {
|
|
const a = this;
|
|
const width = a.Parent.Marker.Width - (a.Parent.Marker.BorderWidth * 2);
|
|
|
|
a.CTX.beginPath();
|
|
a.CTX.arc(x, y, width, 0, 2 * Math.PI, false);
|
|
a.CTX.fillStyle = backColour;
|
|
a.CTX.fill();
|
|
a.CTX.lineWidth = a.Parent.Marker.BorderWidth;
|
|
a.CTX.strokeStyle = borderColour;
|
|
a.CTX.stroke();
|
|
|
|
return a.measureMarker(x, y);
|
|
}
|
|
|
|
drawVerticalLine(x, y) {
|
|
const a = this;
|
|
const rect = a.Parent.Layer.Background.GraphRectangle;
|
|
const highlightLine = a.Parent.HighlightLine;
|
|
const linePosY = (rect.Y + rect.H);
|
|
|
|
if (y <= 0) {
|
|
y = (rect.Y + highlightLine.Width);
|
|
}
|
|
|
|
a.CTX.beginPath();
|
|
a.CTX.moveTo(x, y);
|
|
a.CTX.lineTo(x, (linePosY - highlightLine.Width));
|
|
a.CTX.lineWidth = highlightLine.Width;
|
|
a.CTX.strokeStyle = highlightLine.Colour;
|
|
a.CTX.stroke();
|
|
}
|
|
|
|
measureMarker(x, y) {
|
|
const a = this;
|
|
const offset = a.half(a.Parent.Marker.Width);
|
|
|
|
const result = {
|
|
X: x - (offset + a.Parent.Marker.BorderWidth),
|
|
Y: y - (offset + a.Parent.Marker.BorderWidth),
|
|
W: (a.Parent.Marker.Width + (a.Parent.Marker.BorderWidth * 2)),
|
|
H: (a.Parent.Marker.Width + (a.Parent.Marker.BorderWidth * 2))
|
|
};
|
|
|
|
return result;
|
|
}
|
|
|
|
|
|
} |