| Issue 591: | Automatically scroll to current time | |
| 13 people starred this issue and may be notified of changes. | Back to list |
A great feature of Google Calendar in Agenda day/week view is that it identifies the current time slot as well as scrolls to that timeslot. This would be a great feature to add to Full Calendar. I've attached screen shots of this for both the agenda week and agenda day view.
Aug 25, 2010
Project Member
#1
adamrs...@gmail.com
Summary:
scroll to current time
Sep 28, 2010
i think scrolling (.focus() ?) to the next event in week view could be better... and yes, if there is not why not to the current hour...
Oct 7, 2010
(No comment was entered for this change.)
Status:
Maybe
Jan 23, 2011
I was able to implement this for agendaWeek and agendaDay view using the jQuery scrollTo plugin(could be done without this plugin but was already using it) and the following piece of code in the viewDisplay callback function.
var viewName = view.name;
if(viewName === "agendaWeek" || viewName === "agendaDay"){
var currentHour = $.fullCalendar.formatDate(new Date(), "hTT").toLowerCase();
var $viewWrapper = $("div.fc-view-" + viewName +" div.fc-agenda-body");
var currentHourLabel = $viewWrapper.find("table tbody tr th:contains('"+ currentHour +"')");
$viewWrapper.scrollTo(currentHourLabel, 1);
}
Feb 13, 2012
Hi there! Are there any plans to put the "scroll to timeslot" feature in an upcoming release? Thank you, Hugo.
Mar 20, 2012
Using scrollTo plugin I did it like this:
in fullCalendar find the following code:
$("<div style='position:absolute;width:100%;overflow-x:hidden;overflow-y:auto'/>")
// for me it's on line#3817
Replace it with this:
$("<div class='scrollableArea' style='position:absolute;width:100%;overflow-x:hidden;overflow-y:auto'/>")
// just added a class
Then call the following function after the calendar has been loaded. You might have to use setTimeout in document.ready() to make sure that the function will be called after the calendar is loaded.
// Set scroll to timeline
function setScrollToTimeline(){
var curTime = new Date();
var curHour = curTime.getHours();
var curMinutes = curTime.getMinutes();
if(curHour>5)
{
var curHoursTwelveHoursFormat = $.fullCalendar.formatDate(curTime.addHours(-5),'htt'); // converting hours to 12-hours format
var scrollTarget = $(".fc-agenda-axis.fc-widget-header:contains('"+curHoursTwelveHoursFormat+"')")
$('.scrollableArea').scrollTo(scrollTarget);
}
}
This will keep the timeline exactly in the middle of the scrollable area.
Aug 13, 2013
(No comment was entered for this change.)
Summary:
Automatically scroll to current time
(was: scroll to current time)
Status: Accepted Labels: -Type-Enhancement Type-Feature
Aug 15, 2013
Issue 1640 has been merged into this issue.
Aug 21, 2015
Discussion for this issue has moved to the following URL: https://github.com/fullcalendar/fullcalendar/issues/861 This is because Google Code is shutting down. Apologies if you are being pestered with these notifications. This is a one-time event. Happy coding, Adam
Status:
ExportedToGithub
|
|
| ► Sign in to add a comment |