While working with a plugin for JQuery for week calendars. I came across a very annoying little bug. Using mouseover/out events did not seem to work correctly when hovering over the title and time. It just wouldn’t do what it should of.

Well after debugging and messing around for a while, I was able to figure out how to resolve this issue. In jquery.weekcalendar.js open up the file and locate:

          if ($target.hasClass('wc-cal-event')) {
            options.eventMouseover($target.data('calEvent'), $target, event);
          }

After that code we want to add:

          if ($target.hasClass('wc-time') || $target.hasClass('wc-title')) {
            options.eventMouseover($target.parents('.wc-cal-event').data('calEvent'), $target, event);
          }

A little further down the file is:

          if ($target.hasClass('wc-cal-event')) {
            if ($target.data('sizing')) { return;}
            options.eventMouseout($target.data('calEvent'), $target, event);
          }

We want to add after that:

          if ($target.hasClass('wc-time') || $target.hasClass('wc-title')) {
            if ($target.data('sizing')) { return;}
            options.eventMouseout($target.parents('.wc-cal-event').data('calEvent'), $target, event);
          }

This makes it work as I excepted it to. My thoughts here are that the inner divs are removing the mouseover events. So by attaching an event to them as well, it makes it work as well.

As a good GitHub person does, I submitted a pull request with these fixes in hopes that it gets merged into the plugin.

JQuery has a nice plugin called . Very simple to use and I was able to integrate it into the database to handle pulling scheduling data. However I came across one issue. Reoccurring events.

Well after scrambling the web, I came to the conclusion that it wasn’t possible in the code by default. So away into the code I went. To say the least, my solution is nowhere near perfect nor does it allow for reoccurring events yet from different weeks or months. It was decided to take another course of action rather than trying to hack reoccurring events into the code. I just wanted to post what I had so far:

In jquery.weekcalendar.js we have this code:

              //put back the initial start date

Now before this and the block of code before it, I added in:

			if ($.isArray(recurring))
			{
				var cur_date = new Date();
				var cur_dayofweek = cur_date.getDay();
				var org_start_date = calEvent.start.getDate();
				var org_end_date = calEvent.end.getDate();

				for(var i= 0; i<recurring.length; i++)
				{
					calEvent.readOnly = true;
					var value = recurring[i];
					var offset = value - cur_dayofweek;
					
					calEvent.start.setDate(cur_date.getDate() + offset);
					calEvent.end.setDate(cur_date.getDate() + offset);

					if (($weekDay = self._findWeekDayForEvent(calEvent, $weekDayColumns))) {
						self._renderEvent(calEvent, $weekDay);
					}
				}

				calEvent.start.setDate(org_start_date);
				calEvent.end.setDate(org_end_date);
				calEvent.readOnly = false;
			}

This lets me do reoccurring events for the current week. I am sure it could be greatly improved and somebody may be able to make it support multiple weeks.

In case anybody else wondered, this simply just needs a json array in the data of the weekday numbers (0-6). The key is recurring.

				{
					"id":15,
					"start": "Sun, 4 Dec 2011 21:00:00 -0500",
					"end": "Sun, 4 Dec 2011 22:30:00 -0500",
					"title":"Reoccurring",
					"recurring": [1,2,5,6]
				}