MooGenda

• A javascript calendar based on MooTools.
• Read events from a JSON (like this)
• Double click on event to see the deafult event view.
• Double click on month's day to see the default event to add memo to calendar.
• Drag and drop event in month view.
• Drag and drop and resize event in diary view.
• Every change send a request to back end, to store when and what changed in the event

For any doubts and question ask to: Nunzio Fiore or Emanuele Crescentini
see the google group associated

Demo:

First of all the DEMO 1 (month view) | DEMO 2 (week view default) | DEMO 3 (day view default) .

DOWNLOAD

Second step: DOWNLOAD MooGenda

REQUIREMENTS

MooGenda is MooTools1.2 based. See the Mootools site to download the recent package.

Doc

The idea is to use MooGenda to quickly expose your events from a json request. You can customize your event in week view and in day view.

 On startup code reads a json like this (IMPORTANT: read the meaning of each variable to customize your MooGenda):

{
    "events": [
        {
		
//day number
            "day": 1, 
			
//an id
            "elNum": 1, 
			
//a title for the event
            "title": "Lesson about Mootools",
			
//a complete description, it can have also html content 
            "desc": "In Altedo, at <a href=\"http://www.iprov.com\">IPROV</a>, we have our course. "
			
//when the event starts
        	,"timeStart":"8.5",
			
//how long is the event
			"timeLong":"3"
		},
      
....
		   ]
}

A complete JSON is at the demo url: CALENDAR EVENTS' JSON

The request has these POST parameters (for your customization):

1. month : a number (1,..12) for the month we want to retrieve events'
2. requestType :getEventDate (for clean coding purpose)

When an event is moved, resized or dragged MooGenda launch a request to an url to store the new home's configuration choiced from the user. This service gives a JSON response like that:

{
"result":"ok"
}

or like that:

{
"result":"ko"
}

This is a response caused by these parameters:

1. day : the day number that contain our event
2. el: idCont (i.e 4Cont if id is 4) . The id of element that contain our event in diary view (week or day)
3. id: a unique number for every event
4. month: the month number that contain the day for our event (1,..,12)
5. requestType:storeEventDay (for clean coding purpose)
6. timeLong: a number that represent how long is now our event (in hours)
7. timeStart: a number that rapresent when our event starts.

CREATE A MOOGENDA INSTANCE

To create a MooGenda instance use a minimal code like that:

			
				<div id="moogenda"></div>

	
			<script>
			

			window.addEvent('domready',function(){
	var mooGenda = new MooGenda({
							id:'thisMonth',
							dateObject:new Date(),
							where:'moogenda',
							header:'MooGenda: my MooTools based Agenda'});
	mooGenda.write();
});

			</script>
		    

A complete option's list:

1. id: An id for the MooGenda object,
2. dateObject: date when we want moogenda starts (default is the current day),
3. where: the id or div container for moogenda,
4. getEventUrl: an url to get events' json: default, 'data/getEvent.json'
5. storeEventUrl: an url to store events' json: default, 'data/storeEvent.json'
6. state: the view we want moogenda starts with, default is month (admitted value are key.WEEK,key.MONTH,key.DAY)
7. h_start: the starting time for agenda/diary view (default 0)
8. h_stop: the ending time for agenda/diary view (default 24)

customize

To customize event you have to extend MooGenda and override default associated method. For example:
eventDetail: function(ev) {
alert("id:" + ev.retrieve('event_id') + "\n" +
"title:" + ev.retrieve('event_title') +
"\n" + "desc:" + ev.retrieve('event_desc') +
"\n" + "Time long:" + ev.retrieve('event_h') +
"\n" + "Time Start:" + ev.retrieve('event_start') + "\n" +
"Day:" + ev.retrieve('displayNum') + "\n");
},
addEventCal: function(cell) {
alert('This is base action you have to overwrite with your own, to store a new calendar day event on ' + cell.retrieve("dataD"))
},
If you need help in personalization, or you wanna buy a simple or complex customization of these service, write to Nunzio Fiore or Emanuele Crescentini

DEVELOPED BY

MooGenda is developped by Nunzio Fiore ( ajax development: MoonKiKi ), Cosmobile ( creative and internet: Cosmobile's web site ), NetComm ( housing, web development: NetComm's web site )

FACEBOOK GROUP ASSOCIATED

MooGenda has a facebook group where you can post suggestion, question and Link from your web application's where you used MooGenda: MOOGENDA FACEBOOK GROUP

BUG

to be defined

1. tbd