| Issue 289: | List View (similar to Google Calendar's "Agenda" view) |
1 of 80
Next ›
|
|
144 people starred this issue.
Comments by non-members will not trigger notification emails to users who starred this issue. |
Back to list |
Hi! It would be great to see a feature request for Google Calendar-like agendaYear view, which is very helpful in seeing a list of events. Is there currently a way to do this?
Jan 13, 2010
#1
travisco...@gmail.com
Jan 19, 2010
I agree, would probably call this "list" view do differentiate it from fullcalendar's agenda views, since it is so different. instead of display all events within a year, i think its time-range should be configurable. also, it'd be cool to configure groups of events in the near future, like "this week" or "this month" not going to "accept" this yet because there are plenty of other features/bugs that take a higher priority, but this seems like something that [either i or someone else] could implement atop the plugin architecture i plan to have in 1.5 thanks
Summary:
List View (similar to Google Calendar's "Agenda" view)
Labels: -Type-Defect Type-Enhancement
Feb 14, 2010
Yeah, this would be a great feature for FullCalendar imo
Mar 17, 2010
This would be a great addition to this project! I agree with you Adam, limiting the Timeframe of upcoming events is essential. One other idea I had was that if we could have it to only display events from specified 'className' (or multiple class names). - the idea being, that we would have this "List View" maybe on the homepage of a website, and then we could only have the IMPORTANT/Special events listed in this view, and the regular weekly stuff would not be displayed. - therefore minimizing the number of events in view, to the important ones. Thanks! -J
Jul 30, 2010
useful feature.
Aug 19, 2010
it would be nice to be able to create custom views, agreed. I would like to have a "Pay period" view which is essentially the month view but cut into two week segments according to a specific start and stop boundary...
Aug 24, 2010
This feature would be great—I'd love to be able to list events in a simple <ul>. The current Agenda views art cutting it for my current project.
Aug 24, 2010
Yeah,Would love to have this feature.It makes great sense displaying all the events in a list.(sorted by latest)
Sep 20, 2010
Would really be a usefull feature!
Oct 7, 2010
(No comment was entered for this change.)
Status:
MaybePlugin
Oct 13, 2010
Having access to a configurable list view of events (including the ability to toggle on/off calendar layers on a per-list-view-basis) is the deciding factor whether to standardize on Google calendar or not. It would be immensely useful to managing event data and display in our organization, and aid in adoption of a single master calendar.
Oct 27, 2010
+1 for upcoming events or list view
Nov 5, 2010
+1 As well... this would be a huge win!
Nov 17, 2010
Is this planned for a release any time soon? I need this feature too!
Nov 17, 2010
That would be a great feature for me as well! +1
Nov 21, 2010
Yes, I very much need this. I hope this can be added to Google calendar as an option for an embedded view. The regular calendar view is not always the best way to display information. In many cases, an embedded list would be a lot more helpful. Maybe then we could choose to list one week's events, one months' events, a quarter's worth of events or a year's. Thanks for all the comments here. I hope it happens.
Feb 2, 2011
You already saved Google Calender from the scrapbin by fixing their lack of word wrap! This is the last feature I need to make my Club's website calender functionality perfect. I am trying to put a simple list in a sidebar for "Next X Events" and the built in Agenda view in Google Calender is too clunky.
Feb 9, 2011
Would love this feature, but I don't like how Google calendar agenda view repeats multiple-day events every day. It would be nice if the list view was at least configurable to only list the event only once (twice at the most--once on the event actual start date and once on the current date/calendar initial date if the event start date was before the current date/calendar initial date and ended after the current date/calendar initial date).
Apr 1, 2011
Issue 877 has been merged into this issue.
Apr 1, 2011
Very much indeed needed :) And starred. Thanks- searched but did not find this issue. Sorry for duplicating.
Apr 6, 2011
Hi I have been trying to change the code my self in an attempt to create some sort of list. I noticed everything is based on buildSkeleton() If you look at the basicWeek view I want to rotate the table -90 degrees. Have the days on the left and entries horizontally displayed. But it seems that the way buildSkeloton() builds the html table in a static manner. head then body. I tried flipping this logic but it seems the rest of the code relies that the table be built like this. essentially trying to build a flipped table internally using buildSkelton() seems impossible? This is driving me a bit mental. I could use clientEvents to render my own list.. but more ajax calls and styling issues.. its a nightmare :( Look at this wherer the agenda has many (in my case potentially up to 120 entries) per day are possible.. And what i want to get is something like the sketch
May 13, 2011
Mind boggling that such a basic issue has received so little attention from Google. I imagine that many people have been observing this issue without commenting in hopes of resolution. My case is simple: I would like to send teachers a recap (as in agenda view) of the classes they have to teach from Sept through June. I understand there may be some work-around solutions, but that's not what I look for in a calendar. So here's my move from the presumably silent majority to those voicing a simple "C'mon guys already" to the Google team.
May 13, 2011
Google team? I doubt Google I working on this code. And yes! this is a MASSIVE pitfall to the calendar- as my previous post shows.. But i tell you something Adam Shaw has done a brilliant free plugin otherwise! The wait continues..
May 13, 2011
fullcalendar ist NOT a Google project... ;-) https://code.google.com/p/fullcalendar/people/list
Jun 26, 2011
Same as p.studioz, I would even go a bit further by implementing a timeline in the header of the list, so the user can drag and drop events along that time line during the day. I have the same issue, more than 100 events per day makes it unreadable. I'll update this thread with my code soon (hopefully). ++
Aug 10, 2011
Version 1.5 has shipped. Is there a plugin architecture to build custom views atop?
Sep 3, 2011
Well, how about pledging a certain amount to have this done. I'd certainly be willing to put in $10. Anyone else willing to add more?
Nov 15, 2011
Yes a "list" view would be very nice. at that point you have a js library that will be able to do just about anything someone would want to do with a calendar
Nov 19, 2011
I would like to see a listview / timeline implemented also. Maybe something resembling http://www.dhtmlx.com/docs/products/dhtmlxScheduler/sample_timeline.shtml
Nov 30, 2011
I would throw in AT LEAST $10 on it.
Nov 30, 2011
I've spend already 100$...
Jan 4, 2012
Yes, please. Make a list function.... Please...
Jan 11, 2012
If you realy need it now, you can start with this quickly made php (and smarty) code.
the rest of the code you can find above.
<div id="agenda">
<table>
<?smarty foreach from=$items key=key item=item ?>
<?smarty foreach from=$item item=i ?></body>
<tr>
<td style="width:200px;text-align:right;"><?smarty $key|date_format:"%A, %e %B" ?></td>
<td style="width:200px;"><?smarty if $i.allDay == 1 ?>Hele dag<?smarty else ?><?smarty $i.time_start ?> - <?smarty $i.time_end ?><?smarty /if ?></td>
<td style="width:200px;text-align:left;"><?smarty $i.title ?></td>
</tr>
<?smarty /foreach ?>
<?smarty /foreach ?>
</table>
</div>
to get the events from my database i use:
function getEventsStartingToday() {
global $obj_db;
$str_query = 'SELECT * , event_id AS id, concat_ws( " ", date_start, time_start ) AS
START , concat_ws( " ", date_end, time_end ) AS
END FROM EVENTS WHERE date_start >= DATE( NOW( ) )
OR (
date_start < DATE( NOW( ) )
AND date_end > DATE( NOW( ) )
)
ORDER BY date_start ';
$obj_result = mysqli_query($obj_db, $str_query);
while ($arr_line = mysqli_fetch_array($obj_result, MYSQLI_ASSOC)) {
$arr_content[] = $arr_line;
}
$arr_result = array();
foreach($arr_content as $event) {
// several days event
if($event['date_end'] != $event['date_start']) {
$days_in_between = getDays($event['date_start'], $event['date_end']);
foreach($days_in_between as $day) {
$arr_result[$day][] = $event;
}
} else {
$arr_result[$event['date_start']][] = $event;
}
}
$obj_smarty = new Smarty();
$obj_smarty->compile_dir = '../templates_c/';
$obj_smarty->assign('items', $arr_result);
$obj_smarty->display(FULLCAL_DIR.'/view/agenda.html');
}
To find all the days in moredays events i use this function:
function getDays($sStartDate, $sEndDate){
$sStartDate = date("Y-m-d", strtotime($sStartDate));
$sEndDate = date("Y-m-d", strtotime($sEndDate));
$aDays[] = $sStartDate;
$sCurrentDate = $sStartDate;
while($sCurrentDate < $sEndDate){
$sCurrentDate = date("Y-m-d", strtotime("+1 day", strtotime($sCurrentDate)));
$aDays[] = $sCurrentDate;
}
return $aDays;
}
Jan 11, 2012
forgot the screenshot
Mar 5, 2012
I will also donate if this is done.
Mar 7, 2012
I made it look a bit more like google calendar agendaview. http://www.paulthedutchman.nl/calendar_standalone/?action=agenda <style type='text/css'> body { margin-top: 40px; text-align: center; font-size: 14px; font-family: arial,"Lucida Grande",Helvetica,Arial,Verdana,sans-serif; } #wrap { width: 1100px; margin: 0 auto; } .agenda_title { background: none repeat scroll 0 0 #E5ECF9; font-size: small; padding:3px 3px 3px 6px; font-weight:bold; } .agenda_item { background-color:#fff; border-bottom: 1px solid #E5ECF9; font-size: small; padding:3px 3px 3px 6px; } </style> </head> <body> <div id="wrap"> <a href="<?smarty $smarty.const.FULLCAL_URL ?>">Go to the calendar</a> <div id="agenda" style="text-align:left;background-color:#E5ECF9;padding:4px;"> <?smarty foreach from=$items key=key item=item ?> <div class="agenda_title"><?smarty $key|date_format:"%A, %e %B" ?></div> <?smarty foreach from=$item item=i ?> <div class="agenda_item"><?smarty if $i.allDay == 1 ?><?smarty else ?> <?smarty $i.time_start|date_format:"%H:%M" ?> - <?smarty $i.time_end|date_format:"%H:%M" ?><?smarty /if ?> <?smarty $i.title ?></div> <?smarty /foreach ?> <?smarty /foreach ?> </div> </div>
Mar 7, 2012
Looks great...would be nice to have it integrated into fullcalendar itself.
Apr 5, 2012
+1 to this... Right now it's a drawback in my current project.
May 5, 2012
I've hacked in fullcalendar.js a bit to add a button and an agendaview. Hopefully Adam will make something like this in the future integrated in fullceldnar itself, but for now it's enough for me... http://screencast.com/t/vb9sjfdRU I will put the code here in a few days. I still can't upload attachments, otherwise i would have send the js file right now..
May 5, 2012
I've updated the example calendar: http://www.paulthedutchman.nl/calendar_standalone/ So you could get the fullcalendar.js from there ... (if you have firebug) in the fullcalendar function you have to add one line: $('#calendar').fullCalendar({ header: { left: 'prev,next today', center: 'title', right: 'month,agendaWeek,agendaDay' }, showAgendaButton: true, <----- this line ....
May 8, 2012
It looks really promising!! But since this project is pretty much dead I guess your code wouldn't make it into the official release....
Feb 7, 2013
This looks great @paul... Although I can't get the button to show up. I've added your fullcalendar.js and I've set showAgendaButton as true... Anything I need to do in the header or w/e with the calendar_standalone. And does this work with Google Calendar ? Thanks
Feb 8, 2013
hmm, you have downloaded all my code? it should work then ... Did you include the shoAgendaButton: true in the right place? Any errors? do you mean does the agendaview work with google calendar? not out of the box i' m afraid. i have it working on my local pc. . i am using the ical url from my google calendar and use that to build the agendaview. if you want to see google cals in fullcalendar you have to include gcal.js and do some programming to mmake it work. I can post some code to help you get started. I try to post it this weekend ..
Mar 4, 2013
I am working on an upgrade to a project that will require a calendar list view. We already have one we created, but the client would really like to have it available in the same tab list as the other views (in fullCalendar). I believe they would be willing to pay you to make this part of fullCalendar. If this is possible Adam, please let me know.
Mar 4, 2013
I took a stab at creating a list view for my usage. Demo: http://static.nwesd.org/fullcalendar-listview/current/demos/list-views.html My Git Repo: http://static.nwesd.org/fullcalendar-listview/listview.git/ Chris
Mar 4, 2013
not bad, i have an idea: you could hide days, which have no events.
Mar 4, 2013
demo https://c9.io/hasanozgan/fullcalendar/workspace/fullcalendar/demos/agenda-list.html my code repo https://github.com/hasanozgan/fullcalendar/ pull request https://github.com/arshaw/fullcalendar/pull/60
Mar 7, 2013
nice work. I see a timeline.js too. Is that working? How can i get that view working? i tried to add 'timeline' to the header/right buttons, but that doesn't work..
Mar 7, 2013
hi paul,
timeline works weekly and daily view. You can see my demo page. optons default { timeline: true }
https://c9.io/hasanozgan/fullcalendar/workspace/fullcalendar/demos/agenda-list.html
Mar 7, 2013
ah ok, now i see it, the red line, nice feature btw, i thought it might be a timelineview like i put on my example page: http://www.paulthedutchman.nl/calendar_standalone/
Mar 17, 2013
i agree with Florian, the days with no events should be hidden. like the google listview... and now there are shown 2 weeks in the listview, i think it would be nicer if that would a month.
Apr 26, 2013
Yes please! List view, with configurable time window, e.g. "this calendar year" or "next 30 days".
May 2, 2013
@hasanoz I really like your agenda list. Is there a way to limit the change the list size? (ie. 10 or even 50 events)
May 2, 2013
I noticed that the start time for the event list defaults to 12:00. Is this a bug or is there a certain format to follow?
May 7, 2013
Hi hasanozgan, You really provided a very good solution, but you are using jquery-1.7.1.min.js, which itself has many issues for example datpicker doesnot work with this. Please upgrade the jquery version or if can provide som solution so that on agnda list view, I can place datepicker and button, on button click i get the events for selected date in date picker. Thanks,
May 7, 2013
Hi,
Another issue , though datepickr is not working, if you try to pull the events between two dates and set the header title to the from date then it will allways display events for 30 days from the fromDate.
Is there any way so that it will actually display the events for daterange(60 days)?
I'm using following code:
function GetAgendaEvents(datefrom, dateTo) {
var fromDate = new Date($("#from").val());
var toDate = new Date($("#to").val());
if (fromDate.getTime() <= toDate.getTime()) {
$('#fullcal').fullCalendar('removeEvents').fullCalendar('addEventSource', events);
$('#fullcal').fullCalendar('refetchEvents');
var filteredEvent = $('#fullcal').fullCalendar('clientEvents', function (event) {
return event.start >= fromDate && event.start <= toDate;
});
$('#fullcal').fullCalendar('removeEvents').fullCalendar('addEventSource', filteredEvent);
$('#fullcal').fullCalendar('refetchEvents');
$('#fullcal').fullCalendar('gotoDate', fromDate.getFullYear(), fromDate.getMonth(), fromDate.getDate());
$('#fullcal').fullCalendar('changeView', 'agenda'/* or 'basicDay' */);
}
else {
alert("Please enter correct date range");
}
}
the above script is called from button click on agendalist view.
May 9, 2013
This piece of code is perfect bar the lack of a google like "agenda" or list view. It would allow the simple creation of scrollable agenda widgets to be used anywhere on a webpage.
Jun 9, 2013
Hi everybody, Posting here the solution for adding a new view in fullcalendar.js. I needed to implement an Agenda or List view in fullcalendar.js for one of my projects. In this process, I got a chance to reverse engineer the code by Adam. I must say that this plugin uses some very good coding practices and javascript concepts. I think that it would be useful for users if I share my findings and solution here. Included list view has following features: - Fully functional and customizable List/Agenda View - Pagination using the included arrow buttons - Click/Hover effects on the events - Dynamic calling of events for the list view using pagination First of all, we CAN NOT do it without touching the fullcalendar sourcecode. Javascript does not allow that kind of extensibility. Howvever, I have kept things as simple as possible and I am also posting the steps to replicate it from scratch along with the sourcecode. This will be helpful in case of future updates of fullcalendar.js 1. First of all we need to define a new view for showing the list of events. Views are defined as objects in fullcalendar.js and can be added using constructor functions. You can find the construction function for list view on this URL https://gist.github.com/amitesh-m/5744528. This function defines and initializes a new view called "list". Inside it, renderEvents is the main member function that renders the available events on this view and attaches the click/hover event triggers. 2. Next we need to change the updateEvents function of Calendar object (around line# 500). This is done to unlink the default event calling behavior of fullcalendar.js for the list view. This function is available on this URL: https://gist.github.com/amitesh-m/5744558. Everything will work as earlier for other views but now the calendar will send a slightly different request to the event server for the list view. The event data is managed on fullcalendar.js as shown on this URL: http://arshaw.com/fullcalendar/docs/event_data/events_json_feed/. Now fullcalendar will set "start=0" and "end=1" when somebody clicks on the list view. Number of items to show on the page is to be managed by the server. 3. Next, we need to make a change in renderView() function of the calendar object (around line#374). This is to enable pagination on our list based on the arrow buttons which are alreaedy included in fullcalendar.js. This code is available on https://gist.github.com/amitesh-m/5744639. Now, when somebody clicks on previous or next buttons, the calendar will send a request for new event data to the server. Value of "start" will remain 0 throughout for the list view, while the value for "end" will represent the subsequent page numbers. 4. That's it. All you need to do now is call the list view in your full calendar options. This can be done by adding "list" to the "right" of header object as follows header: { left: 'prev,next today', center: 'title', right: 'list,month,agendaWeek,agendaDay' } Here is a quick and dirty PHP file that sends back the event data to full calendar with listview. https://gist.github.com/amitesh-m/5745224 The demo is available on this URL: http://tas.co.in/fullcalendar-with-listview/
Jun 12, 2013
amites, thanks for sharing your code, looks great!
Jun 12, 2013
Rundcube implemented the list view long time ago on their fork. Adam just didn't include the pull request https://github.com/arshaw/fullcalendar/pull/48 . I merged the roundcube code with the latest version 1.6.1, the demo can be found here http://joomla.digital-peak.com/demo/dpc . They implemented also a table view which I didn't use at the end. I thought this will be of interest for some of you guys. The whole project is a Joomla calendar extension from Digital Peak http://joomla.digital-peak.com. Perhaps you guys can add votes to the pull request that it get's included into the official code base that we don't have to hack the code anymore :-)
Jun 13, 2013
I've changed Amitesh's view a bit (so it looks more like my view :o)):
function renderEvents(events, modifiedEventId) {
var html = $("<div style='border-bottom:1px solid #CCCCCC;'></div>");
// Fetch and Show events.
for (evt in events) {
var dt, tm;
var olddt = dt;
if (events[evt]) {
dt = formatDate(events[evt].start, 'dddd, MMM d, yyyy');
tm = formatDate(events[evt].start, 'h(:mm)tt');
//tm = formatDate(events[evt].start, 'h:mm');
if (dt !== olddt) {
dtelem = $("<div style='border:1px solid #CCCCCC;background-color:#FFF;font-size:small;padding-left:3px;padding-bottom:5px;padding-top:5px;'><b>" + dt + "</b></div>").appendTo(html);
}
eventelem = $("<div>" +
"<div style='background-color:#FFFFCC;border-left:1px solid #CCCCCC;border-right:1px solid #CCCCCC;padding:3px;'><span style=''>" + (!events[evt].allDay ? tm : '') +' ' + events[evt].title + "</span></div>" +
"</div>").appendTo(html);
eventElementHandlers(events[evt], eventelem);
}
}
$(element).html(html);
}
Jul 19, 2013
Hi All,
Adam Shaw plugin is great work he did and easy to customize. The only think we needed was to add list view and once you read the existing code, it is easy to add this. I made changes without touching any other function to make life easier once a new release is out, you can just copy and paste again these changes or maybe the new reelease will have the function intergrated.
Feel free to grab the code below and paste it at the end of your file and all you need is to follow these two steps below.
1. Add the code below at end of your fullcalendar.js
2. Add agendaList to your header object to call your list view
header: {
left: 'prev,next today',
center: 'title',
right: 'month,basicWeek,basicDay,agendaList'
}
3. That's all you need, you are good !
PS: I have used unordered list to display the events and some css file to make it look nice
I have also designed the function to display events of one month at time but, this can be changed by modifying the code inside renderEvents function.
The rest of the code looks similar to agendaDay and agendaWeek code.
Here is the example of the list view
http://apex.oracle.com/pls/apex/f?p=28419:1
and here is the code
// new view and its button
fcViews.agendaList = agendaListView;
defaults.buttonText.agendaList='Agenda';
defaults.titleFormat.agendaList='MMMM yyyy';
defaults.agendaDisType = true;
function agendaListView(element, calendar) {
var t = this;
// exports
t.render = render;
// imports
ListView.call(t, element, calendar );
var opt = t.opt;
var renderAgendaList = t.renderAgendaList;
var formatDate = calendar.formatDate;
function render(date, delta) {
if (delta) {
addMonths(date, delta);
date.setDate(1);
}
var start, end, visStart, visEnd;
start = cloneDate(date, true);
start.setDate(1);
end = addMonths(cloneDate(start), 1);
visStart = cloneDate(start);
visEnd = cloneDate(end);
// I will keep all params and discuss with the group about the header
// as well as if we should use June 1st or start of the calendar view date
t.title = formatDate(start, opt('titleFormat'));
t.start = start;
t.end = end;
t.visStart = visStart;
t.visEnd = visEnd;
renderAgendaList(false);
}
}
function ListView(element, calendar) {
var t = this;
// exports
t.renderAgendaList = renderAgendaList;
t.setHeight = setHeight;
t.setWidth = setWidth;
t.renderEvents = renderEvents;
t.clearEvents = clearEvents;
t.cellIsAllDay = function () {
return true
};
t.getColWidth = function () {
return colWidth
};
t.getDaySegmentContainer = function () {
return daySegmentContainer
};
// imports
View.call(t, element, calendar, 'agendaList' );
OverlayManager.call(t);
SelectionManager.call(t);
var opt = t.opt;
var trigger = t.trigger;
var renderOverlay = t.renderOverlay;
var clearOverlays = t.clearOverlays;
var daySelectionMousedown = t.daySelectionMousedown;
var formatDate = calendar.formatDate;
// locals
var updateEvents = t.calendar.updateEvents;
var table;
var head;
var headCells;
var body;
var bodyRows;
var bodyCells;
var bodyFirstCells;
var bodyCellTopInners;
var daySegmentContainer;
var viewWidth;
var viewHeight;
var colWidth;
var weekNumberWidth;
var rowCnt, colCnt;
var coordinateGrid;
var hoverListener;
var colContentPositions;
var rtl, dis, dit;
var firstDay;
var nwe;
var tm;
var colFormat;
var showWeekNumbers;
var weekNumberTitle;
var weekNumberFormat;
var eventElementHandlers = t.eventElementHandlers;
function renderAgendaList() {
var firstTime = !body;
if (firstTime) {
buildTable();
} else {
clearEvents();
}
}
function buildTable() {
body = true;
}
function setHeight(height) {
viewHeight = height;
var bodyHeight = viewHeight;
}
function setWidth(width) {
viewWidth = width;
}
var reportEventClear = t.reportEventClear;
var getDaySegmentContainer = t.getDaySegmentContainer;
function renderEvents(events, modifiedEventId) {
var html = $("<div class='fc-listcalendar'></div>");
$("<ul class='listCalendar'></ul>").appendTo(html);
var lMonth, lDay, lTime, lDate, lUrl, lTitle;
var temp, i = 0;
var vMonth = formatDate(t.visStart, 'MM');
var arr = [];
for (i in events) {
z = i;
eMonth = formatDate(events[i].start, 'MM');
if ( eMonth == vMonth ) {
lMonth = formatDate(events[i].start, 'MMM');
lDay = formatDate(events[i].start, 'dddd');
lDate = formatDate(events[i].start, 'MMM d');
lDDay = formatDate(events[i].start, 'dddd, MMM d');
lTitle = events[i].title;
allDay = events[i].allDay;
lTime = formatDate(events[i].start, 'h(:mm)tt');
lUrl = events[i].url;
if (lUrl != null) {
lTitle = "<a href='"+htmlEscape(lUrl)+"'>"+lTitle+"</a>";
}
if (i != temp) {
if ( ! dayHeaderExists(arr, lDDay) ) {
$("<li class='dayHeader'>"+lDDay+"</li>").appendTo(html);
temp = z;
arr.push(lDDay);
console.log(i+' '+arr);
}
}
if (i % 2 == 0) {
if (allDay) {
eventdisplay = $("<li class='dayDetails even'>"+lTitle+"</a><span style='float:right'>"+ opt('allDayText') +"</span></li>").appendTo(html);
}
else {
eventdisplay = $("<li class='dayDetails even'>"+lTitle+"</a><span style='float:right'>"+lTime+"</span></li>").appendTo(html);
}
}
else {
if (allDay) {
eventdisplay = $("<li class='dayDetails odd'>"+lTitle+"</a><span style='float:right'>"+ opt('allDayText') +"</span></li>").appendTo(html);
}
else {
eventdisplay = $("<li class='dayDetails odd'>"+lTitle+"</a><span style='float:right'>"+lTime+"</span></li>").appendTo(html);
}
}
eventElementHandlers(events[i], eventdisplay);
}
else{
console.log('out');
}
}
eventdisplay = $("<li class='listEndCap'> </li>").appendTo(html);
$(element).html(html);
trigger('eventAfterAllRender');
}
function dayHeaderExists( arr, header ) {
for (var i = 0; i < arr.length; i++ ) {
if ( arr[i] == header ) return true;
}
return false;
}
function clearEvents() {
reportEventClear();
}
}
;
Jul 20, 2013
Great work Patrick! btw, there are still 2 console.logs in your code, so IE users will get js errors ! So anyone who implements the code, first remove the console.log lines.
Jul 22, 2013
Thanks Paul ! My mistake, I forgot to remove them.. hope everyone will catch that.
Jul 27, 2013
some adaptation in renderEvents function :
- use the timeFormat
lTime = formatDate(events[i].start, opt('timeFormat'))
- use the event.textcolor and event.ClassName
Following the function.
@ patricke : thanks a lot !
function renderEvents(events, modifiedEventId) {
var html = $("<div class='fc-listcalendar'></div>");
var ClassName = "" ;
$("<ul class='listCalendar'></ul>").appendTo(html);
var lMonth, lDay, lTime, lDate, lUrl, lTitle;
var temp, i = 0;
var vMonth = formatDate(t.visStart, 'MM');
var arr = [];
for (i in events) {
z = i;
eMonth = formatDate(events[i].start, 'MM');
if ( eMonth == vMonth ) {
lMonth = formatDate(events[i].start, 'MMM');
lDay = formatDate(events[i].start, 'dddd');
lDate = formatDate(events[i].start, 'MMM d');
lDDay = formatDate(events[i].start, 'dddd, MMM d');
lTitle = events[i].title;
allDay = events[i].allDay;
ClassName = events[i].className ;
textColor = events[i].textColor ;
lTime = formatDate(events[i].start, opt('timeFormat'))
//lTime = formatDate(events[i].start, 'h(:mm)tt');
lUrl = events[i].url;
if (lUrl != null) {
lTitle = "<a href='"+htmlEscape(lUrl)+"'>"+lTitle+"</a>";
}
if (i != temp) {
if ( ! dayHeaderExists(arr, lDDay) ) {
$("<li class='dayHeader ui-widget-header'>"+lDDay+"</li>").appendTo(html);
temp = z;
arr.push(lDDay);
// console.log(i+' '+arr);
}
}
if (i % 2 == 0) {
if (allDay) {
eventdisplay = $("<li style='color:"+textColor+";' class='"+ClassName.join(' ')+" dayDetails even'>"+lTitle+"</a><span style='float:right'>"+ opt('allDayText') +"</span></li>").appendTo(html);
}
else {
eventdisplay = $("<li style='color:"+textColor+";' class='"+ClassName.join(' ')+" dayDetails even'>"+lTitle+"</a><span style='float:right'>"+lTime+"</span></li>").appendTo(html);
}
}
else {
if (allDay) {
eventdisplay = $("<li style='color:"+textColor+";' class='"+ClassName.join(' ')+" dayDetails odd'>"+lTitle+"</a><span style='float:right'>"+ opt('allDayText') +"</span></li>").appendTo(html);
}
else {
eventdisplay = $("<li style='color:"+textColor+";' class='"+ClassName.join(' ')+" dayDetails odd'>"+lTitle+"</a><span style='float:right'>"+lTime+"</span></li>").appendTo(html);
}
}
eventElementHandlers(events[i], eventdisplay);
}
else{
// console.log('out');
}
}
eventdisplay = $("<li class='listEndCap'> </li>").appendTo(html);
$(element).html(html);
trigger('eventAfterAllRender');
}
Jul 29, 2013
Thanks Lecoester ! Looks good.
Jul 30, 2013
If you are interested in using different time formats, I would advise to use the locale technique. where you will have the file that is picked up depending on the language of your browser. I can provide example if anyone is interested. This is not necessary related to list view but the whole fullcalendar. Patrick
Aug 13, 2013
(No comment was entered for this change.)
Status:
Accepted
Labels: -Type-Enhancement Type-Feature Status-Discussing
Aug 13, 2013
(No comment was entered for this change.)
Labels:
-Status-Discussing
Aug 13, 2013
(No comment was entered for this change.)
Status:
Discussing
Aug 13, 2013
(No comment was entered for this change.)
Status:
Accepted
Aug 14, 2013
Issue 1214 has been merged into this issue.
Aug 15, 2013
Issue 1572 has been merged into this issue.
Aug 15, 2013
Issue 1266 has been merged into this issue.
Aug 15, 2013
Issue 1374 has been merged into this issue.
Aug 15, 2013
Issue 1374 has been merged into this issue.
Aug 18, 2013
Issue 1471 has been merged into this issue.
Aug 20, 2013
Hurray for "Accepted"! Thank you Adam!!
Aug 22, 2013
Issue 1705 has been merged into this issue.
Aug 23, 2013
Issue 1735 has been merged into this issue.
Aug 29, 2013
Hey Adam, Any update on when this might be done? I'll donate some money depending on the date when it will be ready. Thanks Rob
Aug 31, 2013
for information
this code is not compatible with the version 1.6.3 due to the disparition of the reportEventClear function.
Impact : thes prev & next button generate a error
Above my new code (very simple correction)
//---------------------------------------------------------------
//
// FULLCALENDAR LIST
//
//---------------------------------------------------------------
// new view and its button
fcViews.agendaList = agendaListView;
defaults.buttonText.agendaList = 'Agenda';
defaults.titleFormat.agendaList = 'MMMM yyyy';
defaults.agendaDisType = true;
function agendaListView(element, calendar)
{
var t = this;
// exports
t.render = render;
// imports
ListView.call(t, element, calendar);
var opt = t.opt;
var renderAgendaList = t.renderAgendaList;
var formatDate = calendar.formatDate;
function render(date, delta)
{
if (delta)
{
addMonths(date, delta);
date.setDate(1);
}
var start, end, visStart, visEnd;
start = cloneDate(date, true);
start.setDate(1);
end = addMonths(cloneDate(start), 1);
visStart = cloneDate(start);
visEnd = cloneDate(end);
// I will keep all params and discuss with the group about the header
// as well as if we should use June 1st or start of the calendar view date
t.title = formatDate(start, opt('titleFormat'));
t.start = start;
t.end = end;
t.visStart = visStart;
t.visEnd = visEnd;
renderAgendaList(false);
}
}
function ListView(element, calendar)
{
var t = this;
// exports
t.renderAgendaList = renderAgendaList;
t.setHeight = setHeight;
t.setWidth = setWidth;
t.renderEvents = renderEvents;
t.clearEvents = clearEvents;
t.cellIsAllDay = function ()
{
return true
};
t.getColWidth = function ()
{
return colWidth
};
t.getDaySegmentContainer = function ()
{
return daySegmentContainer
};
// imports
View.call(t, element, calendar, 'agendaList');
OverlayManager.call(t);
SelectionManager.call(t);
var opt = t.opt;
var trigger = t.trigger;
var renderOverlay = t.renderOverlay;
var clearOverlays = t.clearOverlays;
var daySelectionMousedown = t.daySelectionMousedown;
var formatDate = calendar.formatDate;
// locals
var updateEvents = t.calendar.updateEvents;
var table;
var head;
var headCells;
var body;
var bodyRows;
var bodyCells;
var bodyFirstCells;
var bodyCellTopInners;
var daySegmentContainer;
var viewWidth;
var viewHeight;
var colWidth;
var weekNumberWidth;
var rowCnt, colCnt;
var coordinateGrid;
var hoverListener;
var colContentPositions;
var rtl, dis, dit;
var firstDay;
var nwe;
var tm;
var colFormat;
var showWeekNumbers;
var weekNumberTitle;
var weekNumberFormat;
var eventElementHandlers = t.eventElementHandlers;
function renderAgendaList()
{
var firstTime = !body;
if (firstTime)
{
buildTable();
}
else
{
clearEvents();
}
}
function buildTable()
{
body = true;
}
function setHeight(height)
{
viewHeight = height;
var bodyHeight = viewHeight;
}
function setWidth(width)
{
viewWidth = width;
}
//var reportEventClear = t.reportEventClear;
var getDaySegmentContainer = t.getDaySegmentContainer;
function renderEvents(events, modifiedEventId)
{
var EmptyMonth = true ;
var html = $("<div class='fc-listcalendar'></div>");
var ClassName = "";
$("<ul class='listCalendar'></ul>").appendTo(html);
var lMonth, lDay, lTime, lDate, lUrl, lTitle;
var temp, i = 0;
var vMonth = formatDate(t.visStart, 'MM');
var arr = [];
for (i in events)
{
z = i;
eMonth = formatDate(events[i].start, 'MM');
if (eMonth == vMonth)
{
EmptyMonth = false ;
lMonth = formatDate(events[i].start, 'MMM');
lDay = formatDate(events[i].start, 'dddd');
lDate = formatDate(events[i].start, 'd MMM');
lDDay = formatDate(events[i].start, 'dddd, d MMM');
lTitle = events[i].title;
allDay = events[i].allDay;
ClassName = events[i].className;
textColor = events[i].textColor;
if (formatDate(events[i].start, 'd MMM') == formatDate(events[i].end, 'd MMM'))
{
lTime = formatDate(events[i].start, opt('timeFormat')) + ' - ' + formatDate(events[i].end, opt('timeFormat'))
}
else
{
//alert (events[i].end) ;
if ( events[i].end == null)
{
lTime = formatDate(events[i].start, opt('timeFormat')) ;
}
else
{
lTime = '=> '+ formatDate(events[i].end, 'd MMM') ;
}
}
lUrl = events[i].url;
if (lUrl != null)
{
lTitle = "<a href='" + htmlEscape(lUrl) + "'>" + lTitle + "</a>";
}
if (i != temp)
{
if (!dayHeaderExists(arr, lDDay))
{
$("<li class='dayHeader ui-widget-header'>" + lDDay + "</li>").appendTo(html);
temp = z;
arr.push(lDDay);
}
}
if (i % 2 == 0)
{
if (allDay)
{
eventdisplay = $("<li style='color:" + textColor + ";' class='" + ClassName.join(' ') + " dayDetails even'>" + lTitle + "</a><span style='float:right'>" + opt('allDayText') + "</span></li>").appendTo(html);
}
else
{
eventdisplay = $("<li style='color:" + textColor + ";' class='" + ClassName.join(' ') + " dayDetails even'>" + lTitle + "</a><span style='float:right'>" + lTime + "</span></li>").appendTo(html);
}
}
else
{
if (allDay)
{
eventdisplay = $("<li style='color:" + textColor + ";' class='" + ClassName.join(' ') + " dayDetails odd'>" + lTitle + "</a><span style='float:right'>" + opt('allDayText') + "</span></li>").appendTo(html);
}
else
{
eventdisplay = $("<li style='color:" + textColor + ";' class='" + ClassName.join(' ') + " dayDetails odd'>" + lTitle + "</a><span style='float:right'>" + lTime + "</span></li>").appendTo(html);
}
}
eventElementHandlers(events[i], eventdisplay);
}
}
if (EmptyMonth == true)
{
$("<div>Aucun evenement</div>").appendTo(html)
}
else
{
eventdisplay = $("<li class='listEndCap'> </li>").appendTo(html);
}
$(element).html(html);
trigger('eventAfterAllRender');
}
function dayHeaderExists(arr, header)
{
for (var i = 0; i < arr.length; i++)
{
if (arr[i] == header) return true;
}
return false;
}
function clearEvents()
{
//reportEventClear();
}
}
;
Aug 31, 2013
Do you have a demo available? Sent from my android.
Aug 31, 2013
http://st-andre.sgdf-lille-flandres.fr/index.php?option=com_allevents&task=display&view=fullcalendar
Sep 4, 2013
When you include a google feed with another local source of event data, the list view above is not sequence correctly by date. Any plans to incorporate this feature?
Sep 17, 2013
I think this could be also the solution to make the FC more responsive. Would it be handy if you could change the view between agendaList and the basic calendar, based on the current viewport size? For example week view on desktop, and agenda list if using a mobile device.
Nov 4, 2013
@ m37651: try sorting your google feed by adding "?orderby=starttime&sortorder=ascending" to the url.
Nov 7, 2013
@elecoest - thanks, i had not yet updated my file I recently made the code much cleaner and shorter and compartible with 1.6.4 and fixed issue with sorting. you can find a demo here (using fullcalendar v. 1.6.4) : http://apex.oracle.com/pls/apex/f?p=28419:1:581090523204::::: I am attaching sample css file as well or you can get it from the above link again big thanks to Adam ... this is great work ! //-------------- LIST VIEW -------------- fcViews.agendaList = agendaListView; defaults.buttonText.agendaList='Agenda'; defaults.titleFormat.agendaList='MMMM yyyy'; defaults.agendaDisType = true; function agendaListView(element, calendar) { var t = this; // exports t.render = render; // imports ListView.call(t, element, calendar ); var opt = t.opt; //var renderAgendaList = t.renderAgendaList; var formatDate = calendar.formatDate; function render(date, delta) { if (delta) { addMonths(date, delta); date.setDate(1); } var start, end, visStart, visEnd; start = cloneDate(date, true); start.setDate(1); end = addMonths(cloneDate(start), 1); visStart = cloneDate(start); visEnd = cloneDate(end); t.title = formatDate(start, opt('titleFormat')); t.start = start; t.end = end; t.visStart = visStart; t.visEnd = visEnd; } } function ListView(element, calendar) { var t = this; // exports //t.renderAgendaList = renderAgendaList; t.setHeight = setHeight; t.setWidth = setWidth; t.renderEvents = renderEvents; t.clearEvents = clearEvents; t.cellIsAllDay = function () { return true }; t.getColWidth = function () { return colWidth }; t.getDaySegmentContainer = function () { return daySegmentContainer }; // imports View.call(t, element, calendar, 'agendaList' ); OverlayManager.call(t); SelectionManager.call(t); var opt = t.opt; var trigger = t.trigger; var formatDate = calendar.formatDate; // locals var updateEvents = t.calendar.updateEvents; var body; var viewWidth; var viewHeight; var colWidth; var firstDay; var eventElementHandlers = t.eventElementHandlers; function buildTable() { body = false; } function setHeight(height) { viewHeight = height; var bodyHeight = viewHeight; } function setWidth(width) { viewWidth = width; } var reportEventClear = t.reportEventClear; var getDaySegmentContainer = t.getDaySegmentContainer; function renderEvents(events, modifiedEventId) { //Duplicate the list of events to be used during the display //For repeating and multi-days events, we wanna make sure we add those days each event happens //for example event that start from 1st to 4th, we will add on our list displayeventlist 1,2,3 and 4th this event // We could have used other methods like scanning the dates and checking each event, but this seem to be more efficient var displayeventlist = []; var tstart, tend; var j = 0; for(i in events) { displayeventlist[j] = Object.create(events[i]); tstart = cloneDate(events[i].start); tend = cloneDate(events[i].end); while( (tend - tstart) > 0 ) { j = j + 1; displayeventlist[j] = Object.create(events[i]); tstart = addDays(tstart, 1); displayeventlist[j].start = cloneDate(tstart); } j = j + 1; } // sort our display list, makes easier to display displayeventlist.sort(function(a,b) { var dateA = new Date(a.start); var dateB = new Date(b.start); return dateA-dateB; }); //Start displaying our sorted list var html = $("<ul class='fc-agendaList'></ul>"); var mm, dd, tt, dt, lurl, ltitle, em; var temp, i = 0; var vm = formatDate(t.visStart, 'MM'); for (i in displayeventlist) { z = i; em = formatDate(displayeventlist[i].start, 'MM'); // make sure we display the current view month events only // this can be changed and may be display events from today + 30 days (google does sth like this) // these css classes, can cleaned up much better to have fullcalendar consistent view if ( em == vm ) { dd = formatDate(displayeventlist[i].start, 'dddd'); lday = formatDate(displayeventlist[i].start, 'MMMM d, yyyy'); ltitle = displayeventlist[i].title; allDay = displayeventlist[i].allDay; st = formatDate(displayeventlist[i].start, 'h(:mm)tt'); et = formatDate(displayeventlist[i].end, 'h(:mm)tt'); lurl = displayeventlist[i].url; classes = displayeventlist[i].className; if (lday != temp) { $("<li class='fc-agendaList-dayHeader ui-widget-header'>" + "<span class='fc-agendaList-day'>"+dd+"</span>" + "<span class='fc-agendaList-date'>"+lday+"</span>" + "</li>").appendTo(html); temp = lday; } if (allDay) { eventdisplay = $("<li class='fc-agendaList-item fc-today fc-thu'>"+ "<"+ (lurl ? "a href='"+ lurl +"'" : "div") + " class='fc-agendaList-event fc-eventlist "+classes+"'>"+ "<div class='fc-event-time'>"+ "<span class='fc-event-all-day'>All Day</span>"+ "</div>"+ "<div class='fc-agendaList-eventDetails'>"+ "<div class='fc-eventlist-title'>"+ltitle+"</div>"+ "<div class='fc-eventlist-desc'>"+ltitle+"</div>"+ "</div>"+ "</" + (lurl ? "a" : "div") + ">"+ "</li>").appendTo(html); } else { eventdisplay = $("<li class='fc-agendaList-item fc-today fc-thu'>"+ "<"+ (lurl ? "a href='"+ lurl +"'" : "div") + " class='fc-agendaList-event fc-eventlist "+classes+"'>"+ "<div class='fc-event-time'>"+ "<span class='fc-event-start-time'>"+st+"</span> "+ "<span class='fc-event-end-time'>"+et+"</span>"+ "</div>"+ "<div class='fc-agendaList-eventDetails'>"+ "<div class='fc-eventlist-title'>"+ltitle+"</div>"+ "<div class='fc-eventlist-desc'>"+ltitle+"</div>"+ "</div>"+ "</" + (lurl ? "a" : "div") + ">"+ "</li>").appendTo(html); } eventElementHandlers(displayeventlist[i], eventdisplay); } } $(element).html(html); trigger('eventAfterAllRender'); } } ;;
Dec 5, 2013
Hi Patrick and Thanks to you for this code.
I had problem with your code, all of my events where duplicated.
Here is the solution, in your code (renderEvents function)
replace :
tstart = cloneDate(events[i].start);
tend = cloneDate(events[i].end);
with :
tstart = cloneDate(events[i].start,true);
tend = cloneDate(events[i].end,true);
I have also adapted it to show the week events instead of the month.
Once again many thanks, great job
/***************** List View *********************/
// PMANIRAHO : adding a list view
//add new view and its button
fcViews.agendaList = agendaListView;
defaults.buttonText.agendaList='Agenda';
defaults.titleFormat.agendaList='W';
defaults.agendaDisType = true;
function agendaListView(element, calendar) {
var t = this;
// exports
t.render = render;
// imports
ListView.call(t, element, calendar );
var opt = t.opt;
//var renderAgendaList = t.renderAgendaList;
var formatDate = calendar.formatDate;
function render(date, delta) {
if (delta) {
addDays(date, delta * 7);
}
var start = addDays(cloneDate(date), -((date.getDay() - opt('firstDay') + 7) % 7));
var end = addDays(cloneDate(start), 7);
var visStart = cloneDate(start);
var visEnd = cloneDate(end);
var weekends = opt('weekends');
if (!weekends) {
skipWeekend(visStart);
skipWeekend(visEnd, -1, true);
}
t.title = formatDates(
visStart,
addDays(cloneDate(visEnd), -1),
opt('titleFormat')
);
t.start = start;
t.end = end;
t.visStart = visStart;
t.visEnd = visEnd;
//renderAgendaList(false);
}
}
function ListView(element, calendar) {
var t = this;
// exports
//t.renderAgendaList = renderAgendaList;
t.setHeight = setHeight;
t.setWidth = setWidth;
t.renderEvents = renderEvents;
t.clearEvents = clearEvents;
t.cellIsAllDay = function () {
return true
};
t.getColWidth = function () {
return colWidth
};
t.getDaySegmentContainer = function () {
return daySegmentContainer
};
// imports
View.call(t, element, calendar, 'agendaList' );
OverlayManager.call(t);
SelectionManager.call(t);
var opt = t.opt;
var trigger = t.trigger;
var formatDate = calendar.formatDate;
// locals
var updateEvents = t.calendar.updateEvents;
var body;
var viewWidth;
var viewHeight;
var colWidth;
var firstDay;
var eventElementHandlers = t.eventElementHandlers;
// We are switching to List display, hence no need of this function anymore
// But if you would prefer the consistency, we can swicth and have table based listview
/*
function renderAgendaList() {
if (!body) {
buildTable();
} else {
clearEvents();
}
}*/
function buildTable() {
body = false;
}
function setHeight(height) {
viewHeight = height;
var bodyHeight = viewHeight;
}
function setWidth(width) {
viewWidth = width;
}
var reportEventClear = t.reportEventClear;
var getDaySegmentContainer = t.getDaySegmentContainer;
/*Date.prototype.addDays = function( days ) {
this.setDate(this.getDate() + days );
return this;
}*/
function renderEvents(events, modifiedEventId) {
//Duplicate the list of events to be used during the display
//For repeating and multi-days events, we wanna make sure we add those days each event happens
//for example event that start from 1st to 4th, we will add on our list displayeventlist 1,2,3 and 4th this event
// We could have used other methods like scanning the dates and checking each event, but this seem to be more efficient
var displayeventlist = [];
var tstart, tend;
var j = 0;
for(i in events) {
displayeventlist[j] = Object.create(events[i]);
tstart = cloneDate(events[i].start,true);
tend = cloneDate(events[i].end,true);
console.log(" Event start date "+ displayeventlist[i].start +" end date "+ displayeventlist[i].end+" "+ displayeventlist[i].title);
while( (tend - tstart) > 0 ) {
j = j + 1;
displayeventlist[j] = Object.create(events[i]);
tstart = addDays(tstart, 1);
displayeventlist[j].start = cloneDate(tstart);
}
j = j + 1;
}
// sort our display list, makes easier to display
displayeventlist.sort(function(a,b) {
var dateA = new Date(a.start);
var dateB = new Date(b.start);
return dateA-dateB;
});
//Start displaying our sorted list
var html = $("<ul class='fc-agendaList'></ul>");
var mm, dd, tt, dt, lurl, ltitle, em;
var temp, i = 0;
var vm = formatDate(t.visStart, 'W');
for (i in displayeventlist) {
//console.log(" Event start date "+ displayeventlist[i].start +" end date "+ displayeventlist[i].end+" "+ displayeventlist[i].title);
z = i;
em = formatDate(displayeventlist[i].start, 'W');
// retrieve only current view week events
if ( em == vm ) {
dd = formatDate(displayeventlist[i].start, 'dddd');
lday = formatDate(displayeventlist[i].start, 'd MMMM yyyy');
ltitle = displayeventlist[i].title;
allDay = displayeventlist[i].allDay;
st = formatDate(displayeventlist[i].start, 'H:mm');
et = formatDate(displayeventlist[i].end, 'H:mm');
lurl = displayeventlist[i].url;
classes = displayeventlist[i].className;
if (lday != temp) { //on change de jour
$("<li class='fc-agendaList-dayHeader ui-widget-header'>" +
"<span class='fc-agendaList-day'>"+dd+"</span>" +
"<span class='fc-agendaList-date'>"+lday+"</span>" +
"</li>").appendTo(html);
temp = lday;
}
if (allDay) {
eventdisplay = $("<li class='fc-agendaList-item fc-today fc-thu'>"+
"<"+ (lurl ? "a href='"+ lurl +"'" : "div") + " class='fc-agendaList-event fc-eventlist "+classes+"'>"+
"<div class='fc-event-time'>"+
"<span class='fc-event-all-day'>All Day</span>"+
"</div>"+
"<div class='fc-agendaList-eventDetails'>"+
"<div class='fc-eventlist-title'>"+ltitle+"</div>"+
"<div class='fc-eventlist-desc'>"+ldesc+"</div>"+
"</div>"+
"</" + (lurl ? "a" : "div") + ">"+
"</li>").appendTo(html);
} else {
eventdisplay = $("<li class='fc-agendaList-item fc-today fc-thu'>"+
"<"+ (lurl ? "a href='"+ lurl +"'" : "div") + " class='fc-agendaList-event fc-eventlist "+classes+"'>"+
"<div class='fc-event-time'>"+
"<span class='fc-event-start-time'>"+st+"</span> "+
"<span class='fc-event-end-time'>"+et+"</span>"+
"</div>"+
"<div class='fc-agendaList-eventDetails'>"+
"<div class='fc-eventlist-title'>"+ltitle+"</div>"+
"<div class='fc-eventlist-desc'>"+ltitle+"</div>"+
"</div>"+
"</" + (lurl ? "a" : "div") + ">"+
"</li>").appendTo(html);
}
eventElementHandlers(displayeventlist[i], eventdisplay);
}
}
$(element).html(html);
trigger('eventAfterAllRender');
}
function clearEvents() {
//implement this in case we wanna do list based display
}
}
;;
Dec 8, 2013
there was one thing in the css that messes up the start- and endtime in the agendaListview.
change this:
.fc-event-time {
display: inline-block;
vertical-align: top;
width: 15%;
margin-right: 8px;
}
to:
.fc-agendaList .fc-event-time {
display: inline-block;
vertical-align: top;
width: 15%;
margin-right: 8px;
}
Dec 8, 2013
and when you want to show the times like this: 9:00 - 12:00 (next to eachother instead of beneath eachother) change this in renderEvents: "<span class='fc-event-start-time'>"+st+"</span> "+ "<span class='fc-event-start-time'>"+et+"</span> "+ in: "<span class='fc-event-start-time'>"+st+(et ? " - "+et : "")+"</span> "+
Feb 6, 2014
In the examples people have given of how to make a list view, the two newest ones say in some part: // make sure we display the current view month events only // this can be changed and may be display events from today + 30 days (google does sth like this) // these css classes, can cleaned up much better to have fullcalendar consistent view How would one go about changing the code to display events from today + 30 days?
Feb 10, 2014
@Crazy... I used one of the links above, then copied their version of the list view. And it's working for me. I have attached my working copy. Hope this helps.
Feb 14, 2014
Got month and agenda views to work perfectly :) Thank you for the AgendaList feature! Is there a way to edit the style of past events so that each event is updated once the day has passed? I know this is available for the month view via css with the class ".fc-view-month .fc-past" but this does not effect the agenda view and the agendalist is undocumented on Arshaw's site. Thank you in advance.
Feb 21, 2014
I don't believe this agenda view hanldes multi-day events correctly. A seven-day event is appear as 7 hours on the last day of the event.
Feb 22, 2014
per the multiple day issue, if you sent parameters to:
events: [
{
title: 'Long Event - multiple days',
location: 'This is the location 2',
start: new Date(y, m, d-2),
end: new Date(y, m, d+1)
}
your will end up with the display:
Sunday February 23, 2014
All Day Long Event - multiple days
This is the location 2
All Day Long Event - multiple days
This is the location 2
All Day Long Event - multiple days
This is the location 2
All Day Long Event - multiple days
This is the location 2
Hope this helps
Feb 25, 2014
@crazy n all, I will make changes and push the new code soon.. we will have current month or today+30 days. Actually I am thinking ability to scroll up/down as needed would be better.. what do you think ?
Feb 25, 2014
If you are asking for feedback, I wouuld love to see you add the following options: 1) a parameter that would start the listing at the current day (default); 2) a parameter (possibly the same one) that would start the listing at the beginning of the month (vs the current day); 3) a parameter that would allow the list to go for today+18 months (ok, so ideally this would be a variable so for someone else it might be 1 month or 3 months). My current calendar goes 18 months out; 4) a parameter that would organize the events be months vs the weeks that you have it now (weeks would be nice), but if I go 18 months out as I currently do, months is more appropriate; 5) There are other customizations that I would pay you to do too.
Apr 28, 2014
would be great if an (agenda) list item had a border-left to show the calendar color/ event color. I'm using multiple calendars so it would be great to see the right colors. About a year ago i hacked in my own listview and it had the colors, but Patrick's real fullcalendarview is much better ofcourse..
Apr 28, 2014
ah, already found out. I changed the code a bit to show the colors. (btw. i accidentally posted the last comment with the googleaccount of my mother in law :o)
Apr 28, 2014
pcolor = displayeventlist[i].color;
"<"+ (lurl ? "a href='"+ lurl +"'" : "div") + " class='fc-agendaList-event fc-eventlist "+classes+"' style='border-left:4px solid "+pcolor+"'>"+
Jun 6, 2014
@hasanozgan, in his fork, has implemented this: https://github.com/arshaw/fullcalendar/pull/60 It's based on a pretty old version of the code, and I have not extensively tested it, but might be worth checking out.
Jun 13, 2014
I have started working on this feature for integration with the latest version of fullcalendar (currently 2.0.0). Here is my plan: - Rather than showing a set range of time, I intend to show a configurable number of events limited by a configurable time period. - Furthermore, I intend to request for events at a configurable interval (the request interval) so if you want to show 10 events with a limit of a one year time period and a 30 day request interval then starting from the currently configured date, if the next month contains only 3 events then it will go to the next month and so on and so forth until 10 events are found or until it reaches one year. - It is also my intention to add buttons so that the user can configure how many events to be shown on each page. - For simplicity this will be limited to three buttons with defaults of 5, 10 and 25 (also configurable) - Furthermore, the back button will still be supported so that users may view past events - this will also have a separate configurable time period limiting how far in the past the user will be able to view events - The limits to how far forward or how far backward one will be able to view events will be anchored by the current date. Please share your thoughts, comments, concerns and/or criticisms. I hope to have a working sample up this weekend.
Jun 20, 2014
In case anyone is waiting for an update on this, I had to postpone work on this until at least after July 11th weekend due to my involvement with a new business venture, but I still intend to implement this once I have the time
Jun 25, 2014
I would be interested. I have been waiting for Patrick to make some updates to fix the all date feature in his listing.
Jun 30, 2014
I am just about to start a project where list view is the preferred default view. Right now I am planning on a separate ajax function to populate a div separate from FullCalendar, and having the nav switch between views (making the event source also available to FC of course.) Obviously, it would be very handy to keep everything in FC. What is described in #111 would be awesome if implemented.
Jul 14, 2014
I'm also very interested in this. #111 sounds like a brilliant plan. I'm not 100% sure what options & features are ideal, but am happy to provide feedback and work on it as well.
Jul 14, 2014
Again Thanks to Adam, great work !!! I have not been checking this thread for a while. I just got sometime to go through 2.0.2 version and have made updates to my previous code. if you come across some issues, I will be happy to look at it again I always try to keep the fullcalendar code intact, so my changes start from 7084, and you can grab he new version and paste those changes and you should be good to go here is the css file again agendalist.css, i might have made some updates or it is the same as the previous version the rest, do forget momentjs ofcourse https://apex.oracle.com/pls/apex/f?p=28419:1:108144054600559
Jul 26, 2014
Hello, is there a way to port this feature back to the 1.6.4 version? I use Fullcalendar as a Drupal module and it works only with 1.x version of FC
Jul 29, 2014
Hi Patrick, i'm using your previous version. Great work, there is just one little thing, i don't know is somebody else also saw it. I have a two-day event with start- and endtime 19:00 - 22:00, but the second day the starttime is rendered as 00:00 - 22:00 ... it should also be 19:00 - 22:00. Thanks, Paul
Jul 29, 2014
Patrick , i fixed it. i changed this (the _ in front of 'start') : st = formatDate(displayeventlist[i]._start, 'H:mm'); for some reason my 'start' was 00:00 or null
Aug 12, 2014
Hi Patrick, thank You for your work, ListViev works great. Can you please tell me is there a way to change the list viev for a week list viev, not a motnh list viev ? Thanks, Maciej
Aug 26, 2014
Hello Adam, great to see FullCalendar 2.1.0 made available! Is there an update on the proposed "plugin architecture" that would allow anyone to extend FC with custom views? Many thanks and best regards
Aug 27, 2014
@f.albonico, sorry no, same status as before: there actually already is a plugin architecture (that the built-in views use as well), but it is not finalized or documented yet. for now, you can explore the source to get an idea for how it works.
Aug 27, 2014
FYI I ended up abandoning my work on this and decided to work with a bootstrap-compatible calendar that better fit my needs
Aug 31, 2014
tO patrick.maniraho@gmail.com Hi, Patrick, I liked your latest patch of agendalist with fullcalendar 2.0.2. I am wondering if you can patch the latest fullcalendar 2.1.0, which adds some important features that we need. I tried to copy your agendalist code to it, but it does not work. Thanks for your contribution. George
Sep 2, 2014
Hi George, I will be looking into this coming weeks. @Maciej, Yes, it is easy to change the view of the list.. actually, I was thinking of adding a scrollable view, which would allow a fixed set of number of events to be listed and then scroll up and down
Sep 16, 2014
I'm working on this atm and it's almost done. Would be wonderful if someone with better insight into this code could check if i'm making use of the correct mechanics (of the huge codebase).. Anyone interested?
Sep 19, 2014
Here is my fork with an added list view inspired by the old roundcube fork https://github.com/samedii/fullcalendar
Sep 19, 2014
@same, I've checked out your code but the basicList view looks identical to the dayView with the exception of the title showing a range of days rather than just one day. The list does not appear to be showing all events in this range, only the first day's events show, just like the dayView. Am I missing something?
Sep 22, 2014
@rbend, Dist files are pushed now
Sep 22, 2014
This new dist still supports the list? I tried it out didn't get anything when I replaced the previous version I had on a page.
Sep 22, 2014
This is what I have (of basic views demo) Arshaw is ignoring the lib files (which include jquery and moment.js). He wouldn't want me to include those (if I'm gonna make a pull request later). You can just use it in your own project or if you want to run the demos you need to run "sudo npm install" and "bower install" and it will install everything you need p.s. I just corrected the default column format
Oct 20, 2014
any chance we can get a vertical month view as well?
Oct 23, 2014
Hey ! It is been crazy days !! I just finished updated my changes to fc 2.1.1. Adam has refactored many function and I changed the previous code to follow the same coding style.I have again kept the changes out of the main code, so that upgrading will be much easier. will update my demo page shortly https://apex.oracle.com/pls/apex/f?p=28419:1:108144054600559 Patrick
Nov 10, 2014
hi, can you give me the pagination in the agenda list view?
Nov 13, 2014
Patrick, I think if you add
this.trigger('eventRender', displayeventlist[i], displayeventlist[i], eventdisplay);
after line 8579, the eventRender hook will work properly again for the displayed elements, in my limited experience.
Still looking how to fix eventClick.
Nov 13, 2014
Also, you might want to change line 8533 to lurl = displayeventlist[i].url ? htmlEscape(displayeventlist[i].url) : false; to avoid lurl being defined as 'undefined' and all the items getting that as the url even for events without an url property.
Nov 13, 2014
If you apply #138 you can then handle the funcionality of eventClick in a roundabout manner by doing a bind in eventRender - so it doesn't matter anymore that eventClick doesn't work directly. Somewhat ugly but it does the job in a pinch.
Nov 25, 2014
This modification is great, is there anyway to make it do just a week at a time? Many thanks
Dec 2, 2014
Patrick, Thanks for all your work on this addition! I'm currently working it in to FC 2.2.3. All my events come from a Google calendar, using the latest gcal.js and the new API. Events in the Google calendar that have start and end times (i.e. aren't "all day") are showing up in agenda list view with the full date repeated (e.g. "December 11, 2014 / December 11, 2014") instead of the start and end times. Could the API switch have cause some confusion in the startDate and endDate variables?
Dec 2, 2014
I had the same problem with the date being displayed in list view instead of the time. I changed the default columnFormat.agendaList property to 'HH:mm' instead of 'MMMM D, YYYY' at line 8398, to get the time to display. I'm curious because the demo displays the time, so we may have a little source code disconnect from what was provided late october. I'm pretty new to this so, I may have missed downloading an update or something.
Dec 5, 2014
Well, my solution was based on a lack of experience and a less than full understanding of the code. Instead of changing the value of the property for columnFormat.agendaList, add another line after 8398 to:
defaults.timeFormat.agendaList = 'HH:mm';
Then I added the following statements around 8532 to create a formatted time using the timeFormat option for the start and end times:
startTime = htmlEscape(formatDate(displayeventlist[i].start, this.opt('timeFormat')));
endTime = htmlEscape(formatDate(displayeventlist[i].end, this.opt('timeFormat')));
Then use startTime and endTime around 8571 where the times are generated.
I'm sure there's a more efficient way to do this, but I just wanted to get something working.
Dec 17, 2014
are these changes in a github repo somewhere so that I can pull into my branch to try to get working or finish the functionality? Thanks
Dec 17, 2014
I am also looking for an updated version of the source with clicking on the event processing the eventClick property in agendaList mode (it works in everything but agendaList). I've tried #138 without any success. Thank you
Dec 18, 2014
I made a basic list view here, works well for what I need: https://github.com/marcucio/fullcalendar WhenI'm done cleaning up I'll submit a pull request into the main branch to see if they will accept it.
Dec 23, 2014
Any update on a two week view? should we have a separate issue to track votes/people wanting that exact enhancement?
Dec 30, 2014
two week view is now possible with the latest changes (check in yesterday) just by setting the duration.weeks = 2. See screen shot for what this looks like
Dec 30, 2014
I updated my list view to be able to display the dates to the left (like in my previous screen shot) or above the day like in the other examples listed in this thread. Attached is what it looks like. all changes are checked in here: https://github.com/marcucio/fullcalendar
Jan 28, 2015
Hello, is any of these agendaLists already integrated in the code? It seems so reading this thread but I can't see any in the docs.
Feb 4, 2015
Hey! There is a way to do this now. The view is called "agendaDay". You can see an example on the site.
Feb 21, 2015
No, "agendaDay" is not the list view that is asked on this post. @marcucio : Thanks for your code. I would like to display the month like on your screenshot for example December 2014 and not a range. For the moment I get a range from the current day + 30 days added ?.. Also, I would like to hide empty days, when there is no event. Thanks for your help.
Mar 31, 2015
Hello, any update about the implementation of this feature ?
Apr 1, 2015
@frankcau, i need the same feature what you expecting in full calendar.. if you find some thing please post in this thread..
Apr 23, 2015
@mmarcu did you ever submit a pull request for your commit last December for the list view? That view is really the only complete, mobile friendly view available for FullCalendar.
Apr 28, 2015
You should use the plugin method now. Here's an example of how I did it
Apr 29, 2015
Very nice, many thanks samedii.
I am trying to format the title to get something like the AgendaWeek View : 29th april 20015 - 8th May 2015 (instead of 29th april 20015)
Here is my actual config
views: {
list: {
type: 'ListView',
duration: { days: 10 },
buttonText: 'Liste',
titleFormat: 'D MMMM YYYY'
}
}
I have tried titleFormat: 'D MMMM YYYY, D MMMM YYYY' and 'D MMMM YYYY [D MMMM YYYY]'
Do you have any idea how can I achive this ?
Regards and thanks for your view
May 7, 2015
Maybe delete in listView.js :
computeTitle: function() {
return moment().format(this.opt('titleFormat'));
},
and use :
titleFormat: 'll'
you'll obtain sth like
"7 mai — 4 août 2015"
May 26, 2015
Issue 2500 has been merged into this issue.
Jun 16, 2015
Hi there, I am trying to implement the latest version of Fullcalendar (2.3.2) with the samedii listview plugin (attach below). I get this error : Uncaught TypeError: Cannot read property 'apply' of undefined (line 50) which correspond to View.prototype.render.apply(this, arguments); in the render function I have tried and search for a solution without any success. Anyone can help on this ? Regards
Jun 16, 2015
Hallo, I must appreciate samedii's effort as I am using his listview.js file for my project. However there is an issue I need your help. In computeRange method we can set the day range(e.g. days: 10). So, each time events are loading for 10 days. Now if I don't have any events from Jun 16 to Jun 25 (10 days) it is not showing any events but may be there are events after Jun 25. I can see them on click Next button. So, I want to show all upcoming events without any date range. I want to show upcoming events from now to whenever the last event. Thank you
Jun 17, 2015
I am trying to use samedii's solution, but it isn't having any effect. This probably means I'm doing it wrong. I have pasted samedii's code into a file, followed by:
$('#events-full-calendar').fullCalendar({
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay,ListView'
},
timeFormat: 'H:mm',
columnFormat: {
month: 'ddd',
week: 'ddd, DD/MM',
day: 'dddd'
},
firstDay: emCalendarArgs.firstWeekDay,
events: emCalendarArgs.events,
editable: false
});
That is having no effect on my site. Do I need to do something else to make the code work?
Jun 25, 2015
@wpalch Using samedii's plug-in, the view is called "list" not "ListView. So... right: 'month,agendaWeek,agendaDay,list' @marcucio Your branch does not work at all with the latest Google Calendar plug-in. Too bad. It's the best list view here.
Jun 25, 2015
@gaspar That appears to be a bug. A discrepancy between the minified and non-minified code? If you use fullcalendar.min.js all should be well.
Jun 25, 2015
Thank you, @madmadmad! Like gaspar, I am getting error messages from line 50: TypeError: View.prototype.render is undefined For now, I am using @mercucio's fork, and that is working very nicely - thank you!
Jun 29, 2015
Hello and thanks for answering madmadmad. I have also tried with the non minified version of Fullcalendar and the error is still there. I am working with 2.3.2 version of Fullcalendar Here you can reproduce the problem http://jsbin.com/qotedicubo/1/edit?html,js,output Click on the List button to get the error
Jun 29, 2015
@gaspar Looks like there's something amiss between 2.3.1 and 2.3.2. I tried 2.3.1 in your jsbin and the list view worked.
Jun 29, 2015
Also... if y'all are using @samdii's plugin (listview.js) and you want to pick up the class names via the Google Calendar plug-in (gcal.js), it's at or around line 136. Change this: <tr class="fc-row fc-event-container fc-content">\ To this: <tr class="fc-row fc-event-container fc-content '+ e.source.className[0]+'">\ Here's a work in progress using FullCalendar, listview.js (modified) and multiple Google cals via gcal.js plugin: http://woodlane.madmadmad.net/cal/g.html
Jun 30, 2015
If you want to use Samedii's list view work with Fullcalendar 2.3.2 here is the file.
It is actually the same file than samedii's one, I just commented the lines that used to create the bug
render: function() {
// responsible for displaying the skeleton of the view within the already-defined
// this.el, a jQuery element.
//View.prototype.render.apply(this, arguments);
},
.... and ....
destroyEvents: function() {
// responsible for undoing everything in renderEvents
//View.prototype.destroyEvents.apply(this, arguments);
},
Aug 8, 2015
All -
I've had a great amount of luck in digesting and reprocessing a more custom configuration that includes "month" "week" "day" and "list" views. These are coming from 4 separate Google Calendar feeds and have clickability of showing details in a modal pop up. I want to thank each of you that have posted your issues and code fixes that have helped knowledge and understanding of this project. At the end of the day I'm really left with only one "simple" question. The darn code organizes the events by calendar feed order and pays no attention to the event time. I have struggled with this for the past two days without any success. I would think a simple order based on start time would be easy....... I have found it was not. Any help in this endeavor would be greatly appreciated. The ListView code I'm using is below. This is currently working in conjunction with FullCalendar 2.3.2
(function() {
'strict';
var FC = $.fullCalendar, // a reference to FullCalendar's root namespace
View = FC.View, // the class that all views must inherit from
ListView; // our subclass
ListView = View.extend({ // make a subclass of View
computeRange: function(date) {
var intervalDuration = moment.duration(this.opt('duration') || this.constructor.duration || {
days: 10
});
var intervalUnit = 'day';
var intervalStart = date.clone().startOf(intervalUnit);
var intervalEnd = intervalStart.clone().add(intervalDuration);
var start, end;
// normalize the range's time-ambiguity
intervalStart.stripTime();
intervalEnd.stripTime();
start = intervalStart.clone();
start = this.skipHiddenDays(start);
end = intervalEnd.clone();
end = this.skipHiddenDays(end, -1, true); // exclusively move backwards
return {
intervalDuration: intervalDuration,
intervalUnit: intervalUnit,
intervalStart: intervalStart,
intervalEnd: intervalEnd,
start: start,
end: end
};
},
initialize: function() {
// called once when the view is instantiated, when the user switches to the view.
// initialize member variables or do other setup tasks.
View.prototype.initialize.apply(this, arguments);
},
render: function() {
// responsible for displaying the skeleton of the view within the already-defined
// this.el, a jQuery element.
//View.prototype.render.apply(this, arguments);
},
computeTitle: function() {
// return moment().format(this.opt('titleFormat'));
return moment(this.start).format('MMM D') + " - " + moment(this.end).format('MMM D, YYYY');
},
setHeight: function(height, isAuto) {
// responsible for adjusting the pixel-height of the view. if isAuto is true, the
// view may be its natural height, and `height` becomes merely a suggestion.
this.el.height(height);
View.prototype.setHeight.apply(this, arguments);
},
renderEvents: function(events) {
// reponsible for rendering the given Event Objects
var noDebug = true;
noDebug || console.log(events);
var eventsCopy = events.slice().reverse(); //copy and reverse so we can modify while looping
var tbody = $('<ul class="fc-agendaList"></ul>');
this.scrollerEl = this.el.addClass('fc-scroller');
this.el.html('')
.append('<div></div>').children()
.append(tbody);
var periodEnd = this.end.clone(); //clone so as to not accidentally modify
noDebug || console.log('Period start: ' + this.start.format("YYYY MM DD HH:mm:ss Z") + ', and end: ' + this.end.format("YYYY MM DD HH:mm:ss Z"));
var currentDayStart = this.start.clone();
while (currentDayStart.isBefore(periodEnd)) {
var didAddDayHeader = false;
var currentDayEnd = currentDayStart.clone().add(1, 'days');
noDebug || console.log('=== this day start: ' + currentDayStart.format("YYYY MM DD HH:mm:ss Z") + ', and end: ' + currentDayEnd.format("YYYY MM DD HH:mm:ss Z"));
//Assume events were ordered descending originally (notice we reversed them)
for (var i = eventsCopy.length - 1; i >= 0; --i) {
var e = eventsCopy[i];
var eventStart = e.start.clone();
var eventEnd = this.calendar.getEventEnd(e);
if (!noDebug) {
console.log(e.title);
console.log('event index: ' + (events.length - i - 1) + ', and in copy: ' + i);
console.log('event start: ' + eventStart.format("YYYY MM DD HH:mm:ss Z"));
console.log('event end: ' + this.calendar.getEventEnd(e).format("YYYY MM DD HH:mm:ss Z"));
console.log('currentDayEnd: ' + currentDayEnd.format("YYYY MM DD HH:mm:ss Z"));
console.log(currentDayEnd.isAfter(eventStart));
}
if (currentDayStart.isAfter(eventEnd) || (currentDayStart.isSame(eventEnd) && !eventStart.isSame(eventEnd)) || periodEnd.isBefore(eventStart)) {
eventsCopy.splice(i, 1);
noDebug || console.log("--- Removed the above event");
} else if (currentDayEnd.isAfter(eventStart)) {
//We found an event to display
noDebug || console.log("+++ We added the above event");
if (!didAddDayHeader) {
tbody.append("<li class='fc-agendaList-dayHeader ui-widget-header'>" +
"<span class='fc-agendaList-day'>"+ currentDayStart.format('dddd') +"</span>" +
" <span class='fc-agendaList-date'>"+ currentDayStart.format("Do MMMM YYYY") +"</span>" +
"</li>");
didAddDayHeader = true;
}
/*
<td class="fc-event-handle">\
<span class="fc-event"></span>\
</td>\
*/
var segEl = $("<li class='fc-agendaList-item fc-today fc-thu'>"+
"<div class='fc-agendaList-event-"+ e.source.className[0]+" fc-eventlist'>"+
"<div class='fc-event-time'>"+
"<span class='fc-event-start-time'>"+ (e.allDay ? this.opt('allDayText') : e.start.format('(h:mm)t') +"</span> "+
"<span class='fc-event-time-space'>"+ ' - ' +
"<span class='fc-event-end-time'>"+ e.end.format('(h:mm)t')) +"</span>"+
"</div>"+
"<span class='fc-eventlist-title'>"+e.title+"</span><br />"+
"<div class='fc-eventlist-desc'>"+e.description+"</div>"+
"</div>"+
"</li>");
tbody.append(segEl);
//Tried to use fullcalendar code for this stuff but to no avail
(function(_this, myEvent, mySegEl) { //temp bug fix because 'e' seems to change
segEl.on('click', function(ev) {
return _this.trigger('eventClick', mySegEl, myEvent, ev);
});
})(this, e, segEl);
}
}
currentDayStart.add(1, 'days');
}
this.updateHeight();
View.prototype.renderEvents.apply(this, arguments);
},
destroyEvents: function() {
// responsible for undoing everything in renderEvents
//View.prototype.destroyEvents.apply(this, arguments);
},
renderSelection: function(range) {
// accepts a {start,end} object made of Moments, and must render the selection
View.prototype.renderSelection.apply(this, arguments);
},
destroySelection: function() {
// responsible for undoing everything in renderSelection
View.prototype.destroySelection.apply(this, arguments);
}
});
FC.views.list = ListView; // register our class with the view system
})();
Aug 8, 2015
A screen shot to go along with my post above.
Aug 22, 2015
Discussion for this issue has moved to the following URL: https://github.com/fullcalendar/fullcalendar/issues/560 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 |