search envelope-o feed check
Home Unanswered Active Tags New Question
user comment-o

Overlay to indicate days has past

Asked by Ramgaard
8 months ago.

Is there a function to make an overlay or gray out past days (the right side of the black line).

I still want to be able to see old task in scheduler.

I have tried with:

  • cell.backColor
  • cell.cssClass

But I don't get the result i want, in weekends it does not look that good because i use cell.backColor for highlightig weekend, and can't force my shaded image to go on top of the cell without it goes in front of task.

But maybe there is a standard way to do this?

Thank you

Answer posted by Dan Letecky [DayPilot]
8 months ago.

One option is to add custom CSS (using cell.cssClass) and create styles for all different combinations of classes (they are all applied at the same level): .scheduler_default_cell, .scheduler_default_cellparent, .scheduler_default_cell_business + your custom class.

Another option is to insert an active area into the past cells. If you add a semi-transparent image as a background or add opacity style it will still display the original cell background.

This example adds stripes to past cells using an overlay active area:

dp.onBeforeCellRender = function(args) {
  if (args.cell.start < DayPilot.Date.today()) {
      args.cell.areas = [
          { left: 0, right: 0, top: 0, bottom: 0, style: "background-image: linear-gradient(135deg, #ddd 10%, transparent 10%, transparent 50%, #ddd 50%, #ddd 60%, transparent 60%, transparent); background-size: 20px 20px;" }
      ];
  }
};

See also:
https://doc.daypilot.org/scheduler/cell-active-areas/

Comment posted by Ramgaard
8 months ago.

Thank you!

And thanks for the great support!

This question is more than 6 months old and has been closed. Please create a new question if you have anything to add.