How to show calendar events in modal dialogs in SharePoint 2013

!!! UPDATE !!!

I noticed that my code won't always work, especially when you change to another month in the calendar. So I've rewritten it, you can find the new and correct code in this post. 

_________________________

I have a calendar on a page. When you make a new event in the calendar, you get to make it in a default SharePoint modal dialog (I enabled this in the advanced settings of the calendar). However, when you open an existing event in the calendar, it goes to a new page and shows that event as if I never even enabled modal dialogs.
This is some unwanted behavior, what I really want is that any event in the calendar is shown in a modal dialog, just like when you make or edit an event.

So, I decided to write some code. I added comments to the code to explain to you what it does and what it's for.

// When called, this function opens the dialog.
function openDialog(pUrl) { 
var options = {
 width : 600,
 height : 400,
 url : pUrl };
 
 SP.SOD.execute("sp.ui.dialog.js", "SP.UI.ModalDialog.showModalDialog", 
 options);
}

// When the class "ms-acal-month" is loaded, add an onclick attribute to
// all the links ending with "DispForm.aspx" so that the calendar items 
// will open in a dialog instead of on a new page.
$(".ms-acal-month").ready(function () { 
 setTimeout(function modal() {
  $("a[href*='DispForm.aspx']").each(function() {
   $(this).attr("onclick", "openDialog('" + $(this).attr("href") + "')");
   $(this).attr("href","javascript:void(0)"); 
  });
 }, 500);
});

// This function adds an onclick attribute to the class "ms-cal-nav" (the
// a tag that shows/hides extra items), code is needed when there are 
// more than three calendar items on a day. 
$(".ms-acal-month").ready( function() {
 setTimeout(function() {
  $("a.ms-cal-nav").attr("onclick", "clickMe()");
 }, 500);
});

// This function is called when the onclick attribute has been triggered.
// It needs to add the onclick attribute again, since SP automatically 
// removes this attribute as soon as the function was triggered. 
function clickMe() {
 setTimeout(function() {
  $("a.ms-cal-nav").attr('onclick', "clickMe()");
  $("a[href*='DispForm.aspx']").each(function() {
   $(this).attr("onclick", "openDialog('" + $(this).attr("href") + "')");
   $(this).attr("href","javascript:void(0)");
  });
 }, 500);
}

I saved my code in a file named "calendar.js", under a folder named "Scripts" in the "Style library" directory.
In order for the code to do its work, you'll have to put a reference to it on the page with the calendar. Edit the page with the calendar, and at the bottom of a page, add a new script editor web part. Add the following code to that web part:

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"
type="text/javascript"></script>
<script type="text/javascript" 
src="~sitecollection/Style%20Library/Scripts/calendar.js"></script>

Now save the page, make sure it is checked in and published, and try it out. If all went well, you'll now be able to open events in a calendar in a modal dialog! ;)

If you have any questions or if you are having problems with the code (not working, errors, unwanted behavior,...) feel free to ask!