deac/fullcalendar
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

bugfixes and final touches for 1.3

Browse source
This commit is contained in:
Adam Shaw 2009-09-21 10:11:08 +00:00
parent 44526dbe3d
commit bed7a3df9b
19 changed files with 120 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
changelog.txt
View file

@ -1,5 +1,5 @@
version 1.3 (9/15/09)
version 1.3 (9/21/09)
- different 'views': month/basicWeek/basicDay
- more flexible 'header' system for buttons
- themable by jQuery UI themes

2
docs/methods.txt
View file

@ -74,5 +74,5 @@ jQuery object:
Rerenders all events on the screen.
**refetchEvents** - .fullCalendar(``'refetchEvents'``)
Refetches events from all event sources and rerenders them on the screen.
Refetches events from all sources and rerenders them on the screen.

4
examples/basic.html
View file

@ -20,7 +20,7 @@
<script type='text/javascript' src='../jquery/ui.core.js'></script>
<script type='text/javascript' src='../jquery/ui.draggable.js'></script>
<script type='text/javascript' src='../jquery/ui.resizable.js'></script>
<script type='text/javascript' src='../fullcalendar.js'></script>
<script type='text/javascript' src='../fullcalendar.min.js'></script>
</dist>
-->
<script type='text/javascript'>
@ -78,7 +78,7 @@
body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-size: 13px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}

5
examples/gcal.html
View file

@ -15,7 +15,7 @@
<dist>
<link rel='stylesheet' type='text/css' href='../fullcalendar.css' />
<script type='text/javascript' src='../jquery/jquery.js'></script>
<script type='text/javascript' src='../fullcalendar.js'></script>
<script type='text/javascript' src='../fullcalendar.min.js'></script>
<script type='text/javascript' src='../gcal.js'></script>
</dist>
-->
@ -29,6 +29,7 @@
events: $.fullCalendar.gcalFeed('http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic'),
eventClick: function(event) {
// opens events in a popup window
window.open(event.url, 'gcalevent', 'width=700,height=600');
return false;
},
@ -48,7 +49,7 @@
body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-size: 13px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}

4
examples/json-events.php
View file

@ -6,14 +6,14 @@
echo json_encode(array(
array(
'id' => 1,
'id' => 111,
'title' => "Event1",
'start' => "$year-$month-10",
'url' => "http://yahoo.com/"
),
array(
'id' => 2,
'id' => 222,
'title' => "Event2",
'start' => "$year-$month-20",
'end' => "$year-$month-22",

4
examples/json.html
View file

@ -20,7 +20,7 @@
<script type='text/javascript' src='../jquery/ui.core.js'></script>
<script type='text/javascript' src='../jquery/ui.draggable.js'></script>
<script type='text/javascript' src='../jquery/ui.resizable.js'></script>
<script type='text/javascript' src='../fullcalendar.js'></script>
<script type='text/javascript' src='../fullcalendar.min.js'></script>
</dist>
-->
<script type='text/javascript'>
@ -53,7 +53,7 @@
body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-size: 13px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}

4
examples/theme.html
View file

@ -21,7 +21,7 @@
<script type='text/javascript' src='../jquery/ui.core.js'></script>
<script type='text/javascript' src='../jquery/ui.draggable.js'></script>
<script type='text/javascript' src='../jquery/ui.resizable.js'></script>
<script type='text/javascript' src='../fullcalendar.js'></script>
<script type='text/javascript' src='../fullcalendar.min.js'></script>
</dist>
-->
<script type='text/javascript'>
@ -85,7 +85,7 @@
body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-size: 13px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
}

4
examples/views.html
View file

@ -20,7 +20,7 @@
<script type='text/javascript' src='../jquery/ui.core.js'></script>
<script type='text/javascript' src='../jquery/ui.draggable.js'></script>
<script type='text/javascript' src='../jquery/ui.resizable.js'></script>
<script type='text/javascript' src='../fullcalendar.js'></script>
<script type='text/javascript' src='../fullcalendar.min.js'></script>
</dist>
-->
<script type='text/javascript'>
@ -83,7 +83,7 @@
body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-size: 13px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
text-align: left;
}

10
src/css/main.css
View file

@ -275,7 +275,7 @@ table.fc-header {
display: block;
position: absolute;
z-index: 99999;
border: 0 !important; /* important overrides pre jquery ui 1.7 styles */
border: 0; /* important overrides pre jquery ui 1.7 styles */
background: url(data:image/gif;base64,AAAA) !important; /* hover fix for IE */
}
@ -314,10 +314,6 @@ table.fc-header {
}
/* resizable */
.fc-event-hori .ui-resizable-handle {
_height: 14px !important; /* IE6 had 0 height */
}
.fc-event-hori .ui-resizable-e {
top: 0 !important; /* importants override pre jquery ui 1.7 styles */
@ -335,4 +331,8 @@ table.fc-header {
cursor: w-resize;
}
.fc-event-hori .ui-resizable-handle {
_padding-bottom: 14px; /* IE6 had 0 height */
}

35
src/grid.js
View file

@ -256,15 +256,12 @@ function Grid(element, options, methods) {
function updateSize() {
var width = element.width(),
height = Math.round(width / options.aspectRatio),
var height = Math.round(element.width() / options.aspectRatio),
leftTDs = tbody.find('tr td:first-child'),
tbodyHeight = height - thead.height(),
rowHeight1, rowHeight2;
setOuterWidth(
thead.find('th').slice(0, -1),
colWidth = Math.floor(width / colCnt)
);
if (options.weekMode == 'variable') {
rowHeight1 = rowHeight2 = Math.floor(tbodyHeight / (rowCnt==1 ? 2 : 6));
}else{
@ -283,6 +280,7 @@ function Grid(element, options, methods) {
trTopBug = trTop != tdTop;
tbodyTopBug = tbody.position().top != trTop;
}
if (tdHeightBug == undefined) {
// bug in firefox where cell height includes padding
td.height(rowHeight1);
@ -296,6 +294,12 @@ function Grid(element, options, methods) {
setOuterHeight(leftTDs.slice(0, -1), rowHeight1);
setOuterHeight(leftTDs.slice(-1), rowHeight2);
}
setOuterWidth(
thead.find('th').slice(0, -1),
colWidth = Math.floor(element.width() / colCnt)
);
}
@ -370,10 +374,16 @@ function Grid(element, options, methods) {
for (k=0; k<segs.length; k++) {
seg = segs[k];
event = seg.event;
eventClasses = event.className || [];
if (typeof eventClasses == 'string') {
eventClasses = event.className;
if (typeof eventClasses == 'object') { // an array
eventClasses = eventClasses.slice(0);
}
else if (typeof eventClasses == 'string') {
eventClasses = eventClasses.split(' ');
}
else {
eventClasses = [];
}
eventClasses.push('fc-event', 'fc-event-hori');
startElm = seg.isStart ?
tr.find('td:eq('+((seg.start.getDay()-firstDay+colCnt)%colCnt)+') div.fc-day-content div') :
@ -434,7 +444,9 @@ function Grid(element, options, methods) {
eventElementHandlers(event, eventElement);
if (event.editable || event.editable == undefined && options.editable) {
draggableEvent(event, eventElement);
resizableEvent(event, eventElement);
if (seg.isEnd) {
resizableEvent(event, eventElement);
}
}
view.reportEventElement(event, eventElement);
levelHeight = Math.max(levelHeight, eventElement.outerHeight(true));
@ -475,7 +487,7 @@ function Grid(element, options, methods) {
var matrix;
eventElement.draggable({
zIndex: 3,
delay: 100,
delay: 50,
opacity: options.dragOpacity,
revertDuration: options.dragRevertDuration,
start: function(ev, ui) {
@ -535,7 +547,8 @@ function Grid(element, options, methods) {
if (!options.disableResizing && eventElement.resizable) {
eventElement.resizable({
handles: rtl ? 'w' : 'e',
grid: [colWidth, 0],
grid: colWidth,
minWidth: colWidth/2, // need this or else IE throws errors when too small
containment: element,
start: function(ev, ui) {
eventElement.css('z-index', 3);

20
src/main.js
View file

@ -215,14 +215,21 @@ $.fn.fullCalendar = function(options) {
}
}
}
else if (view.sizeDirty) {
view.updateSize();
view.rerenderEvents();
}
else if (view.eventsDirty) {
// ensure events are rerendered if another view messed with them
view.rerenderEvents();
// pass in 'events' b/c event might have been added/removed
view.clearEvents();
view.renderEvents(events);
}
if (header) {
// update title text
header.find('h2.fc-header-title').html(view.title);
}
view.sizeDirty = false;
view.eventsDirty = false;
view.trigger('viewDisplay', _element);
}
@ -236,6 +243,15 @@ $.fn.fullCalendar = function(options) {
});
}
// marks other views' sizes as dirty
function sizesDirtyExcept(exceptView) {
$.each(viewInstances, function() {
if (this != exceptView) {
this.sizeDirty = true;
}
});
}
// called when any event objects have been added/removed/changed, rerenders
function eventsChanged() {
view.clearEvents();
@ -399,6 +415,7 @@ $.fn.fullCalendar = function(options) {
e.end = null;
}
e.title = event.title;
e.url = event.url;
e.allDay = event.allDay;
e.className = event.className;
e.editable = event.editable;
@ -612,6 +629,7 @@ $.fn.fullCalendar = function(options) {
elementWidth = newWidth;
view.updateSize();
view.rerenderEvents(true);
sizesDirtyExcept(view);
view.trigger('windowResize', _element);
}
}

4
tests/gcal.html
View file

@ -15,8 +15,8 @@
$.fullCalendar.gcalFeed(
"http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic",
{
//editable: true,
className: 'holiday'
editable: true,
className: ['holiday']
}
),
/*$.fullCalendar.gcalFeed(

2
tests/loader.js
View file

@ -84,7 +84,7 @@ if (_build) {
}
var _userAgent = navigator.userAgent.toLowerCase();
if (!/mozilla/.test(_userAgent) || /(compatible|webkit)/.test(_userAgent)) {
if (!/mozilla/.test(_userAgent) || /(compatible|webkit)/.test(_userAgent) || !window.console || !window.console.log) {
includeJS('firebug-lite/firebug-lite-compressed.js');
}

31
tests/locale.html
View file

@ -10,16 +10,45 @@
$(document).ready(function() {
$('#calendar').fullCalendar({
header: {
center: 'month,basicWeek,basicDay'
},
editable: true,
isRTL: true,
firstDay: 1,
monthNames: ["januari", "februari", "maart", "april", "mei", "juni","juli", "augustus", "september", "oktober", "november", "december"],
monthNamesShort: ["jan", "feb", "maa", "apr", "mei", "jun", "jul", "aug","sep", "okt", "nov", "dec"],
dayNames: ['zondag', 'maandag', 'dinsdag', 'woensdag','donderdag', 'vrijdag', 'zaterdag'],
dayNamesShort: ["zo", "ma", "di", "wo", "do", "vr", "za", "zo"],
timeFormat: 'H(:mm)t',
weekMode: 'variable',
// TODO: add drag & resize tests
dayClick: function(dayDate, view) {
console.log('dayClick - ' + dayDate + ' - ' + view.title);
},
eventDrop: function(event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view) {
console.log('DROP ' + event.title);
console.log(dayDelta + ' days');
console.log(event.start);
//console.log(minuteDelta + ' minutes');
},
eventResize: function(event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view) {
console.log('RESIZE!! ' + event.title);
console.log(dayDelta + ' days');
console.log(event.end);
//console.log(minuteDelta + ' minutes');
},
events: [
{
id: 1,
@ -76,7 +105,7 @@
</script>
</head>
<body style='font-size:14px'>
<body style='font-size:12px'>
<div id='calendar' style='width:900px;margin:20px auto 0;font-family:arial'></div>
</body>
</html>

21
tests/methods.html
View file

@ -19,6 +19,13 @@
center: 'title',
right: 'month,basicWeek,basicDay'
},
loading: function(bool) {
if (bool) {
$('#loading').show();
}else{
$('#loading').hide();
}
},
events: staticEvents = [
{
id: 1,
@ -77,17 +84,20 @@
var event = cal.fullCalendar('clientEvents', 3)[0];
event.start = new Date(y, m, 25, 10, 30);
event.end = new Date(y, m, 26);
//event.allDay = true;
cal.fullCalendar('updateEvent', event);
}
function updateRepeatingEvent() {
var event = cal.fullCalendar('clientEvents', 2)[0];
event.start = new Date(y, m, 4, 13, 30);
event.end = new Date(y, m, 5, 1, 0);
event.end = new Date(y, m, 5, 2, 0);
event.allDay = false;
event.title = "repeat yo";
//event.editable = false;
event.url = "http://google.com/";
cal.fullCalendar('updateEvent', event);
console.log(cal.fullCalendar('clientEvents', 2));
//console.log(cal.fullCalendar('clientEvents', 2));
}
function renderEvent(stick) {
@ -99,7 +109,7 @@
var gcalFeed = $.fullCalendar.gcalFeed("http://www.google.com/calendar/feeds/usa__en%40holiday.calendar.google.com/public/basic");
var jsonFeed = "../examples/json_events.php";
var jsonFeed = "../examples/json-events.php";
</script>
<style>
@ -117,8 +127,8 @@
<button onclick="cal.fullCalendar('next')">next</button>
<button onclick="cal.fullCalendar('today')">today</button>
<button onclick="cal.fullCalendar('gotoDate', 1999, 9, 31)">Oct 31 1999</button>
<button onclick="cal.fullCalendar('moveDate', 1, 1, 1)">+1 +1 +1</button>
<button onclick="cal.fullCalendar('moveDate', -1, -1, -1)">-1 -1 -1</button>
<button onclick="cal.fullCalendar('incrementDate', 1, 1, 1)">+1 +1 +1</button>
<button onclick="cal.fullCalendar('incrementDate', -1, -1, -1)">-1 -1 -1</button>
<button onclick="updateEventStart()">update event start</button>
<button onclick="updateRepeatingEvent()">update repeating event</button>
@ -145,6 +155,7 @@
<button onclick="cal.fullCalendar('refetchEvents')">refetch</button>
</p>
<div id='loading' style='position:absolute;display:none'>loading...</div>
<div id='calendar' style='width:900px;margin:20px auto 0;font-family:arial'></div>
</body>
</html>

6
tests/options.html
View file

@ -13,8 +13,8 @@
/*
year: 2010,
month: 2,
date: 1,
month: 0,
date: 0,
defaultView: 'basicDay',
@ -33,7 +33,7 @@
dragOpacity: .5,
dragRevertDuration: 100,
//weekMode: 'liquid', //'variable'
weekMode: 'variable',
/*
titleFormat: {

2
tests/sources.html
View file

@ -39,7 +39,7 @@
allDay: false,
//className: 'yellow-event black-text-event',
className: ['yellow-event', 'black-text-event'],
editable: false
editable: true
},
{
id: 4,

2
tests/theming.html
View file

@ -15,6 +15,8 @@
theme: true,
editable: true,
//isRTL: true,
header: {
center: 'month,basicWeek,basicDay'
},

4
tests/triggers.html
View file

@ -94,11 +94,11 @@
eventResizeStart: function(event, jsEvent, ui, view) {
console.log('RESIZE START ' + event.title);
console.log(this);
//console.log(this);
},
eventResizeStop: function(event, jsEvent, ui, view) {
console.log('RESIZE STOP ' + event.title);
console.log(this);
//console.log(this);
},
eventResize: function(event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, view) {
console.log('RESIZE!! ' + event.title);