slicker default styling for buttons.

refactored css & html structure for all views (simpler & will work better with jqui themes). jQuery UI 1.8.9
Grepsy · Jan 24, 2011 · bef6f92 · bef6f92
1 parent 3079c2f
commit bef6f92
Show file tree

Hide file tree

Showing 84 changed files with 1,148 additions and 964 deletions.
diff --git a/demos/cupertino/images/ui-bg_diagonals-thick_90_eeeeee_40x40.png b/demos/cupertino/images/ui-bg_diagonals-thick_90_eeeeee_40x40.png
diff --git a/demos/cupertino/images/ui-bg_flat_15_cd0a0a_40x100.png b/demos/cupertino/images/ui-bg_flat_15_cd0a0a_40x100.png
diff --git a/demos/cupertino/images/ui-bg_glass_100_e4f1fb_1x400.png b/demos/cupertino/images/ui-bg_glass_100_e4f1fb_1x400.png
diff --git a/demos/cupertino/images/ui-bg_glass_50_3baae3_1x400.png b/demos/cupertino/images/ui-bg_glass_50_3baae3_1x400.png
diff --git a/demos/cupertino/images/ui-bg_glass_80_d7ebf9_1x400.png b/demos/cupertino/images/ui-bg_glass_80_d7ebf9_1x400.png
diff --git a/demos/cupertino/images/ui-bg_highlight-hard_100_f2f5f7_1x100.png b/demos/cupertino/images/ui-bg_highlight-hard_100_f2f5f7_1x100.png
diff --git a/demos/cupertino/images/ui-bg_highlight-hard_70_000000_1x100.png b/demos/cupertino/images/ui-bg_highlight-hard_70_000000_1x100.png
diff --git a/demos/cupertino/images/ui-bg_highlight-soft_100_deedf7_1x100.png b/demos/cupertino/images/ui-bg_highlight-soft_100_deedf7_1x100.png
diff --git a/demos/cupertino/images/ui-bg_highlight-soft_25_ffef8f_1x100.png b/demos/cupertino/images/ui-bg_highlight-soft_25_ffef8f_1x100.png
diff --git a/...edmond/images/ui-icons_d8e7f3_256x240.png → ...ertino/images/ui-icons_2694e8_256x240.png b/...edmond/images/ui-icons_d8e7f3_256x240.png → ...ertino/images/ui-icons_2694e8_256x240.png
diff --git a/...edmond/images/ui-icons_2e83ff_256x240.png → ...ertino/images/ui-icons_2e83ff_256x240.png b/...edmond/images/ui-icons_2e83ff_256x240.png → ...ertino/images/ui-icons_2e83ff_256x240.png
diff --git a/...edmond/images/ui-icons_217bc0_256x240.png → ...ertino/images/ui-icons_3d80b3_256x240.png b/...edmond/images/ui-icons_217bc0_256x240.png → ...ertino/images/ui-icons_3d80b3_256x240.png
diff --git a/...edmond/images/ui-icons_469bdd_256x240.png → ...ertino/images/ui-icons_72a7cf_256x240.png b/...edmond/images/ui-icons_469bdd_256x240.png → ...ertino/images/ui-icons_72a7cf_256x240.png
diff --git a/...edmond/images/ui-icons_6da8d5_256x240.png → ...ertino/images/ui-icons_ffffff_256x240.png b/...edmond/images/ui-icons_6da8d5_256x240.png → ...ertino/images/ui-icons_ffffff_256x240.png
diff --git a/tests/themes/start/theme.css → demos/cupertino/theme.css b/tests/themes/start/theme.css → demos/cupertino/theme.css
diff --git a/demos/redmond/images/ui-bg_flat_0_aaaaaa_40x100.png b/demos/redmond/images/ui-bg_flat_0_aaaaaa_40x100.png
diff --git a/demos/redmond/images/ui-bg_flat_55_fbec88_40x100.png b/demos/redmond/images/ui-bg_flat_55_fbec88_40x100.png
diff --git a/demos/redmond/images/ui-bg_glass_75_d0e5f5_1x400.png b/demos/redmond/images/ui-bg_glass_75_d0e5f5_1x400.png
diff --git a/demos/redmond/images/ui-bg_glass_85_dfeffc_1x400.png b/demos/redmond/images/ui-bg_glass_85_dfeffc_1x400.png
diff --git a/demos/redmond/images/ui-bg_glass_95_fef1ec_1x400.png b/demos/redmond/images/ui-bg_glass_95_fef1ec_1x400.png
diff --git a/demos/redmond/images/ui-bg_gloss-wave_55_5c9ccc_500x100.png b/demos/redmond/images/ui-bg_gloss-wave_55_5c9ccc_500x100.png
diff --git a/demos/redmond/images/ui-bg_inset-hard_100_f5f8f9_1x100.png b/demos/redmond/images/ui-bg_inset-hard_100_f5f8f9_1x100.png
diff --git a/demos/redmond/images/ui-bg_inset-hard_100_fcfdfd_1x100.png b/demos/redmond/images/ui-bg_inset-hard_100_fcfdfd_1x100.png
diff --git a/demos/redmond/images/ui-icons_cd0a0a_256x240.png b/demos/redmond/images/ui-icons_cd0a0a_256x240.png
diff --git a/demos/redmond/images/ui-icons_f9bd01_256x240.png b/demos/redmond/images/ui-icons_f9bd01_256x240.png
diff --git a/demos/theme.html b/demos/theme.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html>
 <head>
-<link rel='stylesheet' type='text/css' href='redmond/theme.css' />
+<link rel='stylesheet' type='text/css' href='cupertino/theme.css' />
 <script type='text/javascript' src='../src/_loader.js'></script>
 <!--[[
 <link rel='stylesheet' type='text/css' href='../fullcalendar/fullcalendar.css' />

diff --git a/lib/jquery-ui-1.8.6.custom.min.js → lib/jquery-ui-1.8.9.custom.min.js b/lib/jquery-ui-1.8.6.custom.min.js → lib/jquery-ui-1.8.9.custom.min.js
diff --git a/src/Calendar.js b/src/Calendar.js
@@ -82,7 +82,7 @@ function Calendar(element, options, eventSources) {
 		if (options.theme) {
 			element.addClass('ui-widget');
 		}
-		content = $("<div class='fc-content " + tm + "-widget-content' style='position:relative'/>")
+		content = $("<div class='fc-content' style='position:relative'/>")
 			.prependTo(element);
 		header = new Header(t, options);
 		headerElement = header.render();
@@ -132,6 +132,7 @@ function Calendar(element, options, eventSources) {
 	/* View Rendering
 	-----------------------------------------------------------------------------*/
 
+	// TODO: improve view switching (still weird transition in IE, and FF has whiteout problem)
 
 	function changeView(newViewName) {
 		if (!currentView || newViewName != currentView.name) {
@@ -262,7 +263,7 @@ function Calendar(element, options, eventSources) {
 			suggestedViewHeight = options.contentHeight;
 		}
 		else if (options.height) {
-			suggestedViewHeight = options.height - (headerElement ? headerElement.height() : 0) - vsides(content[0]);
+			suggestedViewHeight = options.height - (headerElement ? headerElement.height() : 0) - vsides(content);
 		}
 		else {
 			suggestedViewHeight = Math.round(content.width() / Math.max(options.aspectRatio, .5));

diff --git a/src/Header.js b/src/Header.js
@@ -23,14 +23,13 @@ function Header(calendar, options) {
 		tm = options.theme ? 'ui' : 'fc';
 		var sections = options.header;
 		if (sections) {
-			element = $("<table class='fc-header'/>")
-				.append($("<tr/>")
-					.append($("<td class='fc-header-left'/>")
-						.append(renderSection(sections.left)))
-					.append($("<td class='fc-header-center'/>")
-						.append(renderSection(sections.center)))
-					.append($("<td class='fc-header-right'/>")
-						.append(renderSection(sections.right))));
+			element = $("<table class='fc-header' style='width:100%'/>")
+				.append(
+					$("<tr/>")
+						.append(renderSection('left'))
+						.append(renderSection('center'))
+						.append(renderSection('right'))
+				);
 			return element;
 		}
 	}
@@ -41,17 +40,18 @@ function Header(calendar, options) {
 	}
 
 
-	function renderSection(buttonStr) {
+	function renderSection(position) {
+		var e = $("<td class='fc-header-" + position + "'/>");
+		var buttonStr = options.header[position];
 		if (buttonStr) {
-			var tr = $("<tr/>");
 			$.each(buttonStr.split(' '), function(i) {
 				if (i > 0) {
-					tr.append("<td><span class='fc-header-space'/></td>");
+					e.append("<span class='fc-header-space'/>");
 				}
 				var prevButton;
 				$.each(this.split(','), function(j, buttonName) {
 					if (buttonName == 'title') {
-						tr.append("<td><h2 class='fc-header-title'>&nbsp;</h2></td>");
+						e.append("<span class='fc-header-title'><h2>&nbsp;</h2></span>");
 						if (prevButton) {
 							prevButton.addClass(tm + '-corner-right');
 						}
@@ -68,20 +68,23 @@ function Header(calendar, options) {
 							};
 						}
 						if (buttonClick) {
-							if (prevButton) {
-								prevButton.addClass(tm + '-no-right');
-							}
-							var button;
 							var icon = options.theme ? smartProperty(options.buttonIcons, buttonName) : null;
 							var text = smartProperty(options.buttonText, buttonName);
-							if (icon) {
-								button = $("<div class='fc-button-" + buttonName + " ui-state-default'>" +
-									"<a><span class='ui-icon ui-icon-" + icon + "'/></a></div>");
-							}
-							else if (text) {
-								button = $("<div class='fc-button-" + buttonName + " " + tm + "-state-default'>" +
-									"<a><span>" + text + "</span></a></div>");
-							}
+							var button = $(
+								"<span class='fc-button fc-button-" + buttonName + " " + tm + "-state-default'>" +
+									"<span class='fc-inner'>" +
+										"<span class='fc-button-content'>" +
+											(icon ?
+												"<span class='fc-icon-wrap'>" +
+													"<span class='ui-icon ui-icon-" + icon + "'/>" +
+												"</span>" :
+												text
+												) +
+										"</span>" +
+										"<span class='fc-button-effect'><span></span></span>" +
+									"</span>" +
+								"</span>"
+							);
 							if (button) {
 								button
 									.click(function() {
@@ -111,10 +114,8 @@ function Header(calendar, options) {
 												.removeClass(tm + '-state-down');
 										}
 									)
-									.appendTo($("<td/>").appendTo(tr));
-								if (prevButton) {
-									prevButton.addClass(tm + '-no-right');
-								}else{
+									.appendTo(e);
+								if (!prevButton) {
 									button.addClass(tm + '-corner-left');
 								}
 								prevButton = button;
@@ -126,37 +127,37 @@ function Header(calendar, options) {
 					prevButton.addClass(tm + '-corner-right');
 				}
 			});
-			return $("<table/>").append(tr);
 		}
+		return e;
 	}
 
 
 	function updateTitle(html) {
-		element.find('h2.fc-header-title')
+		element.find('h2')
 			.html(html);
 	}
 
 
 	function activateButton(buttonName) {
-		element.find('div.fc-button-' + buttonName)
+		element.find('span.fc-button-' + buttonName)
 			.addClass(tm + '-state-active');
 	}
 
 
 	function deactivateButton(buttonName) {
-		element.find('div.fc-button-' + buttonName)
+		element.find('span.fc-button-' + buttonName)
 			.removeClass(tm + '-state-active');
 	}
 
 
 	function disableButton(buttonName) {
-		element.find('div.fc-button-' + buttonName)
+		element.find('span.fc-button-' + buttonName)
 			.addClass(tm + '-state-disabled');
 	}
 
 
 	function enableButton(buttonName) {
-		element.find('div.fc-button-' + buttonName)
+		element.find('span.fc-button-' + buttonName)
 			.removeClass(tm + '-state-disabled');
 	}
 

diff --git a/src/_loader.js b/src/_loader.js
@@ -1,7 +1,7 @@
 (function() {
 
 var JQUERY = 'jquery-1.4.4.min.js';
-var JQUERY_UI = 'jquery-ui-1.8.6.custom.min.js';
+var JQUERY_UI = 'jquery-ui-1.8.9.custom.min.js';
 var JQUERY_LEGACY = 'jquery-1.3.2.min.js';
 var JQUERY_UI_LEGACY = 'jquery-ui-1.7.3.custom.min.js';
 
@@ -41,6 +41,8 @@ js('main.js');
 js('Calendar.js');
 js('Header.js');
 js('EventManager.js');
+js('date_util.js');
+js('util.js');
 
 js('basic/MonthView.js');
 js('basic/BasicWeekView.js');
@@ -60,8 +62,6 @@ js('common/OverlayManager.js');
 js('common/CoordinateGrid.js');
 js('common/HoverListener.js');
 js('common/HorizontalPositionCache.js');
-js('common/date.js');
-js('common/util.js');
 
 endload();
 

diff --git a/src/agenda/AgendaEventRenderer.js b/src/agenda/AgendaEventRenderer.js
@@ -246,9 +246,9 @@ function AgendaEventRenderer() {
 			seg = segs[i];
 			if (eventElement = seg.element) {
 				val = vsideCache[key = seg.key = cssKey(eventElement[0])];
-				seg.vsides = val === undefined ? (vsideCache[key] = vsides(eventElement[0], true)) : val;
+				seg.vsides = val === undefined ? (vsideCache[key] = vsides(eventElement, true)) : val;
 				val = hsideCache[key];
-				seg.hsides = val === undefined ? (hsideCache[key] = hsides(eventElement[0], true)) : val;
+				seg.hsides = val === undefined ? (hsideCache[key] = hsides(eventElement, true)) : val;
 				titleSpan = eventElement.find('span.fc-event-title');
 				if (titleSpan.length) {
 					seg.titleTop = titleSpan[0].offsetTop;
@@ -356,8 +356,9 @@ function AgendaEventRenderer() {
 								// mouse is over bottom slots
 								if (isStart && allDay) {
 									// convert event to temporary slot-event
+									eventElement.width(colWidth - 10); // don't use entire width
 									setOuterHeight(
-										eventElement.width(colWidth - 10), // don't use entire width
+										eventElement,
 										slotHeight * Math.round(
 											(event.end ? ((event.end - event.start) / MINUTE_MS) : opt('defaultEventMinutes'))
 											/ opt('slotMinutes')