Posted by mgifford on June 14, 2010 at 9:18pm
I want examples of great looking & great functioning calendars. I've been asking on Twitter but haven't had any responses.
What calendars are there out there that people are really proud of? What's new, different, innovative or even just simply beautiful in this area?
Can we have some examples of different ways to implement calendaring systems and the advantages/disadvantages of them?
At this point I want to point out some possible options for displaying calendar information.
Comments
not a calendar of events, but
For the ixda.org redesign we implemented an archive that shows conversations by the day where they ended. I think the content is less important than the design ;)
http://www.ixda.org/discussion in the top right spot on the sidebar - it only works with Javascript enabled.
This seems like a decent tool to use when
1. You've got a relatively small space to show the data
2. You've got a lot of data to show on each day
It allows navigation back and forth (and caches the results so that subsequent requests to move forward/back are all done client side).
This is based on http://drupal.org/project/calendar_block module which was improved in various ways through the project. It also relies on a custom callback that gets data for a specific month/day combination.
knaddison blog | Morris Animal Foundation
Pretty cool. I like the popup
Pretty cool. I like the popup with the threads.
Is this opensourced?
Is this opensourced?
Hello, Please take a moment
Hello, Please take a moment to check out the calendar our team at the Indianapolis Museum of Art put together for our recently launched drupal site. This calendar is highly custom, but we feel it brings a breath of fresh air into calendar design. At the top you will see what we call the "Eventilyzer" which looks very similar to an equalizer (pun intended). The eventilyzer was built in flash and utilizes services/amfphp/views to populate itself with data. Each tick on the graph is an event, and the color represents what type of event per the legend.
The interface relies heavily on jquery and making sure jquery can talk to flash.
Our events can have any number of combination's of dates and times, so a single repeating date field would not cut it for us. So each node has 3 separate Date API fields, a single occurrence, repeating occurrence, and an all day field. And then there is a lot of custom code behind the scenes to tie those three fields together.
feel free to poke around, any questions or feedback on our design are greatly encouraged
http://www.imamuseum.org/calendar
amazing calendar! O_O
Wow, that museum calendar is amazing.
I've been trying (and failing) to build something along those lines for our Water Company. We have to show what's happening in 15 different districts at any given time. I really love how you can interactively drill down to each type of event without submitting or refreshing anything.
I wonder if there's anyone to do something like this without flash? (yeah, I admit, I've never learned flash... mostly because I've never had the time to do it :S)
You guys should consider packaging this design and selling it :)
Great work!
I like your calendar implementation immensely. Your users will think how "simple" it is, never knowing that there are so many complex background processes to make the end result "simple."
As you've asked for feedback, I'll volunteer one suggestion. It would be nice if there were (even primitive) navigation for those who have JavaScript turned off. Even some simple "<< Previous day ... Next day >>" links enclosed in a noscript tag might make a big difference, though I do recognize that most of your visitors won't need this aid.
Really great calendar
Really great calendar implementation - I love the way you really re-thought the problem. It's simple and effective - great navigation with the quick scan of events/day in the horizontal scroll. But it scales really well - easily handles a lot events on a day.
It would be great to have a pure jquery implementation of this or at least an html5/canvas version.
Great job!
Hi cangeceiro, Your calendar
Hi cangeceiro,
Your calendar looks awesome!!!
We are working on an event site also.
You mentioned "So each node has 3 separate Date API fields, a single occurrence, repeating occurrence, and an all day field. And then there is a lot of custom code behind the scenes to tie those three fields together."
How did you deal with an event like the following Dance performance?:
Dance performance:
Wed-Fri at 7pm-9pm
Sat at 2pm-4pm and 7-9pm
Sun 2pm-4pm
Thank you very much !
This calendar
This calendar (http://www.imamuseum.org/calendar) is pretty phenomenal. I definitely like the originality. Has me thinking/wondering about alternate non-flash ways of implementing something like this.
Congrats--good job.
great module...
Is there one like it somewhere that I can use on my website? (How would I go about finding it?)
I loved your implementation
I loved your implementation so much I used it as a basis for my own except in pure html and jquery. Our organization runs more by month rather than by day like a museum, so I only filtered down that deep.
I will post a link when we launch in a few weeks.
Ryan Hartman
Web Developer
www.devkinetic.com
Nice work, kudos to your team
I know I'm seeing this post two years later, but I am very impressed by your calendar's design. I have to mention that I am not a big fan of Flash in general, but this is really brilliant work. Thank you for the inspiration. If I lived anywhere near Indianapolis I would surely come visit the museum simply based on the effort that I see put into this website.
Beautiful
On top of the calendar, this is one of the smoothest, quickest, most attractive drupal sites I've ever seen.
I don't mean to get off topic, but how large of a team worked on it, and how long did the initial site take to develop? Are you in house or was it contract work?
Those two are great!
@greggles & @cangecerio thanks so much for your links & details. I've added screenshots & links back to my collection of calendars on Flickr.
Both of the links provided are nice and step away from the rather generic approach that most Drupal sites run with. Nice to see so much flexibility. Having details behind how they are implemented is also terrific!
--
OpenConcept | Twitter @mgifford | Drupal Security Guide
Thank you for the flickr
Thank you for the flickr link. :-)
Can't think of a better place to ask...
Since it looks like there're some real calendar gurus here, I'm going to take a risk and ask if anyone knows how to do something like this: http://drupal.org/node/830918. crossed fingers
Check out a patched version of the calendar module
I've recently supplied a patch that extends drupal calendaring functionality, it's at http://drupal.org/node/931392. It themes multi-day events and provides overlapping time slots on the week/day views. I have a running demo of this and the eventbookings module I developed at http://www.okeel.com/demo/calendar.
Unlike google or fullcalendar, the calendar is rendered server-side with the calendar module, requiring no javascript. Additionally, unlike google or fullcalendar, there is no restriction on the height of the single day items - so you can display more information that you can with either google or fullcalendar.
This is a great patch! I'm
This is a great patch! I'm going to install this today and see how it looks/works!
Matthew Connerton | matthew@aspiringweb.com
Aspiring Web a design & development agency
Really Really Really great Calendar
Really Really Really great Calendar!!!
I was trying to do a Corporate Calendar, with office separation, notify and messagging system and i was using OpenAtrium to do that (because i thought it was simpler with OA, even if i noticed that Calendar feature is very incomplete with poor functionality). I want try implement a calendar like yours in OA, or simply begin the project again, but i want that! Can you please list the modules and views you used to achieve that visulizations?
Many many thanks
PS: great patch! Drupal users are close to get a Calendar almost like the Google one
I second that! OA
I second that!
I've been trying to do something similar (as described here https://community.openatrium.com/issues/node/1776) and I also think this implementation would be a great start. crossing fingers
I'm glad you like it!
I'm glad you like it! Calendar is a crucial part of a cms/web app eco-system and Drupal needs a best-of-breed implementation. Google seems to grok this and theirs is really the one to beat. I actually think Drupal's can be even better!
Regarding my demo site. It's a pretty simple implementation actually. I've documented parts of it in other places, so I'll try to wrap it together here:
So this demo site is a sandbox to test out my ideas and code and solicit feedback. I'd be interested in what folks thinks works and doesn't work. Also, I'd be happy to export the views/templates/modules and send them to anyone who'd like them. They were written for the sake of the demo - so they aren't generalized or following best-practices - they are experiment. But I'm happy to share.
Impressive!
Great work, developer-x. Hats off.
I'd like to suggest a "View Today's Events" or "Go to Today" or just "Today" button so that one can easily navigate back to the current month, day, week, or whatever, that they are currently viewing.
Keep up the good work.
Impressive!
Great work, developer-x. Hats off.
I'd like to suggest a "View Today's Events" or "Go to Today" or just "Today" button so that one can easily navigate back to the current month, day, week, or whatever, that they are currently viewing.
Keep up the good work.
Calendar
"So this demo site is a sandbox to test out my ideas and code and solicit feedback. I'd be interested in what folks thinks works and doesn't work. Also, I'd be happy to export the views/templates/modules and send them to anyone who'd like them. They were written for the sake of the demo - so they aren't generalized or following best-practices - they are experiment. But I'm happy to share."
Can you really do that! I tring to follow your suggestion, but i didnt achieve it!
Can you post the configuration of modules , views, .tpl.php and custom modules? I really want to try to do a better calendar respect the OpenAtrium one and yours seems the best out there. I'm am currently developing a simple site for my new in-line hockey team, and i want try implement your calendar in it. If you can help me, i'm going to put your credits there. Many thanks for your work!
I'd be happy to help. Can
I'd be happy to help. Can you be more specific on what you want? As you can see in my post, I made a number of changes. Seems like you are mostly interested in having a calendar that looks like litecal (openatrium). So, I'd recommend first applying just the multi-day patch at http://drupal.org/node/931392.
Once that is working ok - let me know what you want next - and I'll try to guide you thru that.
Starting point :)
Maybe it's very simpe but...how did you get the detailed "week" and "day" view? I looked into the week and day tab inside the view, but i didn't find these settings. And i have just this http://awesomescreenshot.com/07e3ficb0. Then i managed to obtain a detaile week/day view through Fullcalendar View [http://awesomescreenshot.com/0473fifab] , but it's less configurable and your seems quite better.
Then i began with drupal just a couple of months ago, and i still haven't used a patch. I read this post http://drupal.org/patch/apply but i dont' now where to put the command (i'm working on a remote server)...any way i just downloaded the how-to video, later i will give a look.
Try this...
You're only going to have the detailed "week" and "day" view with overlapping events (like on the demo) after to have applied the multi-day patch. The patch is located at http://drupal.org/node/931392
If you are on a shared server, you might want to do the following:
patch -p0 < calendar-multi-day_6.patchfrom within your local calendar directoryHopefully this helps
Yeeeee. Thanks your patch is
Yeeeee. Thanks your patch is great, as well was your help (my first pathc!)!! Now my calendar looks good! Many thanks.
I'm workin on this now and i want create "filters" on the calendar.
What I want is the ability to create "group", and then assign users to one or more group. Each user can see only events posted in their groups.
I think this could be easily achieved by taxonomy, but perhaps there are other betters methods! Organic group module?
I'm gonna try with Community Tags module - http://drupal.org/project/community_tags -, or even better with Content Profile module - http://drupal.org/project/content_profile -, but if anybody out there knows which is the best solution for this, please let me know.
I'd recommend OG
The great/frustrating thing about Drupal is that there are a number of various ways to accomplish something. In your case I'd go OG - it's built to do exactly what you want. I've implemented a solution for my church's school using OG to maintain separate "classrooms". The teacher has admin privledges, their own calendar, their own document and photo directories and the own set of pages/posts. Initially, I also had "membership" where the parents could join their children's classes as members to view the content - but the administration decided to have open access - so I dropped that. But OG is purpose built for this type of functionality. You might be able to achieve what you want with the other modules - but at first glance, it doesn't seem as straightforward as OG.
Almost Done
As you said, OG perfectly fits my needs. I added some tweaks trough css and tpl.php for a better looking, but I miss one thing, the important one: color coding!
As you write, I put a single cck field with a color picker in the content type "group" (i'm using OG) and using the php views header i query the field. Now I have this in the top of my calendar
.my-group-class {background-color:#xxxxxx !important}But how i put the class in his container's div? I saw you put the class in the class="calendar monthview" div. If i simply rewrite the fields and wrapping it with my div in views looks bad.
How I do that with views? Or do I have to tweak the tpl.php?
(sorry for the bad English)
Many thanks, calendar Jedi.
Hopefully this helps
Sorry, I've been a bit out of commission with other things. I did the following to include the classes into each container:
I hope this helps
By the way, the calendar patch is now in the calendar module!! So you can download the latest 6.x dev version or upgrade to D7 - it's in the head branch distro of calendar.
Help
Hi developer X,
Can I have a copy of your exported views , templates, and modules for this demo. i really need it for my project :D thanks so much :D
How did you create this calendar
I am really interested on how you developed this calendar, it looks awesome and functions great. Can you please tell me all the modules and steps you took to develop this calendar. I am trying to create the same functional calendar for a administrative side so individuals would login and then view/edit the calendar. This this is awesome, any help would be most appreciated.
http://www.okeel.com/demo/calendar.
Read carefully
Read carefully this comment http://groups.drupal.org/node/74998#comment-334259 and the followings replies....
The big change is done by the patch!
A problem with Calendar module
That I have noticed and that I see also your calendar is suffering from is that the module looses track of the selected date when you move from year view to a month, week or day. It goes to December!
I have that problem whenever I go from any bigger selection to a smaller (like from month to week or from week to day). For you it just seems to be when you move from the year.
I have seen the issue on the Calendar project popping up every now and then through the years but no-one has ever been assigned to solving it and it just seems to lay there.
I tried a very clean installation with just
drupal 6.20
calendar-6.x-2.4
cck-6.x-2.9
date-6.x-2.7
views-6.x-2.12
And still the same problem. Have you noticed this before?
Create A google type calender and it's all functionalty
I want to create acalender just like google calender. can you plz help me to develop that.
Check out FullCalendar
There is a great module that has most of the Google calendar functionality built in. http://drupal.org/project/fullcalendar
Editing indvidual instances of repeating events
Hello all,
I'm hopeful that someone in this group has solved the issue of needing to associate different information with different instances of a repeating event utilizing CCK and Date (see discussion here http://drupal.org/node/298334). I realize that Date comes with the Date Repeat API. The problem being that each repeating date is associated with the one node and not "editable" on it's own.
In other words, we need functionality like can be found on Google Calendar and Meetup.com where, when you create a repeating event (i.e. once per week, once per month, etc.), it creates each instance of that event as a node so that it can then be edited separately from the original. Ideally (like in Google's implementation) the instances of the event would still be linked in some way (nodereference?) so that the user would have the option of applying edits to multiple instances of the event.
I would love to hear that someone has a solution for this that doesn't involve custom coding!
First day of week
I notice the examples are all working with the first day of the week as Sunday. How did you accomplish this? So far every thread I've been able to find has this as an old issue which keeps popping up and labeled as "fixed" (with fixed meaning it's not a bug and it won't be fixed). If you don't know what I'm talking about, just google drupal calendar first day of week. The date defaults to Sunday as the first day of the week, but Calendar is hard coded to Monday (apparently for php date iso reasons which only support monday as the first day of the week for calculations). The only fix I've been able to find so far is to set Monday as the first day of your week for date module which fixes the misalignment of dates in the calendar grid, but means you have to have a calendar view with monday as the first column and sunday as the last.
Yet here I see all these examples working with Sunday as the first day of the week -- how did you all do it?
Goto "Site configuration" >
Goto "Site configuration" > "Date and Time". In the settings screen, you can specify the first day of the week - the calendar uses this value.
Got it working -- kind of
Thanks for your reply dev-x, I was actually just coming back to rescind my question. I got it working, but I'm not entirely sure what I changed. Originally it wasn't working, and I was only able to get it working by visiting the Date and Time configuration and setting the first day of the week to Monday. That fixed one problem, but created a separate problem. After I posted the question I looked around and still couldn't find anything. I finally tried setting it back to Sunday, and bam, that time it worked. My only guess is that at the same time I set it back to Sunday, I also selected a timezone. Maybe not having a timezone selected was part of my original problem. I'll play around for a little while and see if I can diagnose it a little better, but I'm glad to see I have it working with out of the box code for now.
What version of Date and Calendar are you using?
This is kinda ringing a bell. What versions of date and calendar are you using? This may be a bug.
That's another moving part...
I just updated a number of modules today in hopes that the update would just magically fix the issue. I went from calendar 6.2.2 to 6.2.4. I also updated date and views at the same time. I thought this was still broken after the upgrades, but it's possible I'm remembering my timeline wrong. On the bright side I'm just playing around at the moment so I intend to throw away my last few hours of work and revert to the state I was at before I even turned the calendar module on. Gotta love source code management =)
Looking for help with calendar implementation!
I think this is a really interesting thread going here, and I am interested in putting together a robust calendar system for my website. Does anybody out there think they can help me with this? I have a small budget and admin access to the site.... I just need help implementing it in Drupal. Something similar to the calendars posted above would be fantastic for my site. I have a small budget, but if you are at all interested, don't hesitate to contact me... I'm sure we could arrange something if you can help. Thanks all!
In my opinion, with the bug
In my opinion, with the bug that makes the calendar loose track of the date when switching between week, day and month view this module is not usable (unless you only need one view in which case this bug will never be noticed).
The bug was noticed over two years ago but has never been addressed by anyone on the core team as far as I can see in the history of the issue (http://drupal.org/node/344079 http://drupal.org/node/396152 and http://drupal.org/node/1023684).
Your Views, Templates, and Modules
Hello Developer X,
I am trying to create a rideshare program where users can add or request rides. This looks like a great place to start. Will you send me an export of your views, templates, and modules.
Thank you.
Fix the loose track of date bug.
I'm mostly a newb to php programming but I think I've found a fix for the issue with loosing track of the date when switching between week, day and month view. I just went into the sites/all/modules/calendar/theme directory and modified the calendar-main.tpl.php file.
after this line
<?phpif (!empty($calendar_add_date)) print $calendar_add_date;
?>
I added this code
<?php
$myyear=date("Y", time());
$mymonth=date("Y-m", time());
$oneweekback=date("W",time());
$currentweek=$oneweekback+1;
$myweek=$myyear."-W".$currentweek;
$myday=date("Y-m-d", time());
echo "<ul class = \"links\">";
echo "<li> <a href = \"/eventcalendar/".$myyear."\" rel=\"nofollow\">Year</a></li>";
echo "<li> <a href = \"/eventcalendar/".$mymonth."\" rel=\"nofollow\">Month</a></li>";
echo "<li> <a href = \"/eventcalendar/".$myweek."\" rel=\"nofollow\">Week</a></li>";
echo "<li> <a href = \"/eventcalendar/".$myday."\" rel=\"nofollow\">Day</a></li>";
echo "</ul>";
?>
then I changed this line
<?phpif (empty($block)) print theme('links', $calendar_links);
?>
to
<?phpif (empty($block)) print theme('links', $mystring);
?>
so that it would pull up an empty string.
That seems to have fixed any problems of course this is version 6.x-2.4 of the calendar module
This works. But it only works
This works. But it only works if your calendar is located at /eventcalendar/ how do i make it pull the data from the view to populate the reference?
Because i changed the code to work for my /resource_schedule/all/ view but when i try to use it for the resources which would be on resource_schedule/1702 it keeps switching it back to all.
modified tpl.php gives wrong week?
In response to "Fix the loose track of date bug" by kirabell03, I would expect - and am seeing - that
$oneweekback=date("W",time());
gives this week, and
$currentweek=$oneweekback+1;
gives next week.
Need Help Implementing
Hello Everyone,
I am trying to set this calendar up for a non-profit website and I am in over my head. Can anyone tell me if there are detailed instructions somewhere on how to implement this? I am trying to create a calendar very similar to the demo site calendar. I have downloaded and installed all of the modules listed but I am unsure how to continue.
I would also be willing to pay someone to help me. This is for a green initiative that helps people find rides in order to carpool. Any help you can give me is greatly appreciated. If you can help you can get a hold of me by going to universityrideshare.org and submitting the 'Contact Us' form.
Thank you,
Admin @ UniversityRideshare.org
tutorial
Have you checked out
http://vimeo.com/26853285
??
cb
Specific kind of Calendar
I'm wondering if Drupal will be a good tool to use for my Calendar needs.
10 real estate people, each must have their own calendar.
When they log into their account (mostly by phone), they see all the closings they have scheduled for that particular day, and of course weeks out.
Once the admin adds new closings, an email should be generated to the specific user..
I've done searches for specific items, but will a calendar allow for a user's info to be searched and displayed by the calendar days, or by a users zip code?
Drupal is pretty cool, although it runs excruciatingly slow on GoDaddy. My own site take up to 23 seconds before it actually goes to the page. Other times it loads just fine (3-5 seconds). Godaddy says you must have a virtual hosted and not shared to resolve these issues. Not wanting to take their word for it, I have started looking for a different hosting company that can run Drupal on a shared account, and not have it take forevr just to get to the page. Any suggestions?
new type of calendar functionality
Hi there, I'm looking to commission a new calendar for our university, and I would like something visual (love the asia society calendar and the IMA calendar at the beginning of this thread).
But I have another idea - does anyone know if it's possible to create a web calendar that works just like you're reading a brochure of events? I.e. pages that can flick over in date order, with little sections with image and basic information which users can click through to see more info? I'm thinking something like an integrated web platform version of this:
http://viewer.zmags.com/publication/7d4a33a6#/7d4a33a6/1
Other functions we need the site to have is:
I know this is asking a lot, but I'm sure it should be possible with drupal...
Sounds good, site down...
I am interested in seeing the demo and details of this calendar, but all the demos are inaccessible because the site is down. Anybody have a running version of this that a gal could see live?
Create A google type calender and it's all functionalty
i want to create a calender just like google calender . i user views, cck, calender, date etc module but i am unable to get the same functionality as i found in google claender.
Did somebody knows...
I would lie to create a calender for a friend of mine which allows him that his customers can make appointments online all over the week? The customers should only be able to see his own appointments and the free available dates. Like a dentist only from monday to friday from 7-12 and from 13-18 o'clock. Is this possible to make this with the calender module? I am able to write some code, but I have no experience yet with the calender module and how much tme it will consume to write such an extension. Is somebody out there which have some experience with this kind of task? Thx !
calendar
certainly possible. Please see www.dance-ottawa.com where subscribers post their own events
Example Site I made
I recently completed one for a drupal site I was working on. I had to match the fliers we hand out to the club, not the other way round, so using a custom template and css I managed this: http://www.oudancesport.co.uk/Timetable
I think it turned out okay, and I added in some preprocessor functions to better organise the data, along with some clever tricks for the colors. I doubt the solution is as elegant as could be. Certainly stylistically it could be better to look at but it does the job.
this one is Awesome!
http://www.imamuseum.org/calendar
Check it out, it's great. I was looking into how to implement something like this in my calendar..
Is Flash now Open Source?
Wow. Great news if it's true.