Ray/literyzjs-timeline
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Updated demo page

Browse Source
This commit is contained in:
Ray 2023-10-03 00:04:03 +01:00
parent f935d337d6
commit ecce768399
2 changed files with 46 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
bbtimeline.js
View File

@ -48,6 +48,7 @@ class BBTimeline {
a.Events = [];
a.StartDate = a.DateToString(new Date(), "yyyy-MM-dd");
a.ShowDate = a.StartDate;
a.LastDate = null;
a.GraphRectangle = a.calcGraphArea();
a.Enabled = false;
a.Debug = false;
@ -62,11 +63,11 @@ class BBTimeline {
AddEvent(date, label, options) {
const a = this;
const _options = Object.assign(a.GetEventItem(), options);
const _options = Object.assign(a.GenerateEventItem(), options);
let event = a.FindEvent(date);
if (event == null) {
a.Events.push(a.GetEvent(date));
a.Events.push(a.GenerateEvent(date));
event = a.FindEvent(date);
}
@ -87,6 +88,7 @@ class BBTimeline {
a.ShowDate = a.StartDate;
a.Enabled = false;
a.Events = [];
a.LastDate = null;
}
DeleteMarker(date)
@ -295,7 +297,7 @@ class BBTimeline {
}
GetEvent(date) {
GenerateEvent(date) {
const a = this;
return {
@ -309,7 +311,7 @@ class BBTimeline {
};
}
GetEventItem() {
GenerateEventItem() {
return {
Title: "",
Description: "",
@ -509,6 +511,8 @@ class BBTimeline {
const labelSize = a.drawText(e.X, (y + a.Axis.X.DayLineHeight), a.DateToString(date, "dd"), a.Axis.Font, a.Axis.LabelColour, "center");
const label2Spacing = 6;
a.LastDate = a.DateToString(date, "yyyy-MM-dd");
// Write month on first of the month
if (writeLabel) {
a.drawText(e.X, (y + a.Axis.X.DayLineHeight + labelSize.Height + label2Spacing), a.DateToString(date, "MMMM yyyy"), a.Axis.Font, a.Axis.LabelColour, "left");

39
demo-test.html
View File

@ -34,7 +34,12 @@
<button onclick="UpdateMarker()">Update Marker</button>
<button onclick="DeleteMarker()">Delete Marker</button>
</p>
<p>
<button onclick="GetDisplayedDateRange()">Get Displayed Date Range</button>
<button onclick="FindEvent()">Find Event</button>
<button onclick="FindDatePosition()">Find Date Position</button>
<button onclick="FindVisibleEvents()">Find Visible Events</button>
</p>
<style>
body {
@ -129,6 +134,38 @@ function DeleteMarker()
timeline1.Invalidate(false, true);
}
function GetDisplayedDateRange()
{
alert(timeline1.ShowDate + " - " + timeline1.LastDate);
}
function FindEvent()
{
const result = timeline1.FindEvent("2023-10-26");
console.log(result);
alert(JSON.stringify(result));
}
function FindDatePosition()
{
const result = timeline1.FindDatePosition("2023-10-26");
console.log(result);
alert(JSON.stringify(result));
}
function FindVisibleEvents()
{
const result = timeline1.FindVisibleEvents()
console.log(result);
alert(JSON.stringify(result));
}
</script>