Open vipperxvr opened 2 months ago
First time with javascript, I did the following:
Created the function below in index.js
make_grid_current_time(view_mode) {
let tick_x = 0;
let tick_y = this.options.header_height + this.options.padding / 2;
let tick_height = (this.options.bar_height + this.options.padding) * this.tasks.length;
let $current_time = createSVG("g", { class: 'current_time', append_to: this.layers.grid });
let today = date_utils.today();
for (let date of this.dates) {
if (date.toString() === today.toString()) {
let current_time_class = "current-time";
let day_columns = 1;
if (view_mode === VIEW_MODE.HOUR) {
day_columns = 24;
}
if (view_mode === VIEW_MODE.QUARTER_DAY) {
day_columns = 4;
}
if (view_mode === VIEW_MODE.HALF_DAY) {
day_columns = 2;
}
let tick_secs = (this.options.column_width * day_columns) / 86400;
let timestamp = Math.floor(new Date().getTime()) / 1000;
let today_timestamp = Math.floor(new Date(today).getTime()) / 1000;
let today_secs = timestamp - today_timestamp;
tick_x += today_secs * tick_secs;
createSVG("path", {
d: `M ${tick_x} ${tick_y} v ${tick_height}`,
class: current_time_class,
append_to: this.layers.grid,
});
return;
}
tick_x += this.options.column_width;
}
}
And call it on make_grid_extras();
make_grid_extras() {
this.make_grid_highlights();
this.make_grid_ticks();
this.make_grid_current_time(this.options.view_mode);
}
Worked on modes Hour, Day, Quarter Day and Half Day (Weed, Month and Year didn't have the date array) but in Half Day it is showing on 12 instead of 00. The code logic is the same, so looks like there is a problem in this view mode.
Almost forget to add the CSS:
.gantt .current-time {
stroke: red;
stroke-width: 1px;
}
It would be great if we could highlight today in the rest of view modes. This would make the solution provided in this comment work for all the view modes: https://github.com/frappe/gantt/issues/112#issuecomment-1431341918
I implemented the current hour highlight, there is a highlight for today on Day and Week view modes.
First I would like to thank everyone for this great project.
Please would you create a vertical line to highlight the current time in the Quarter Day and Half Day view modes ?
Thanks in advance.