My favorites | Sign in
Project Home Issues
New issue   Search
for
  Advanced search   Search tips   Subscriptions
Issue 271: problems with className
1 person starred this issue and may be notified of changes. Back to list
Status:  Done
Owner:  ----
Closed:  Jan 2010


Sign in to add a comment
 
Reported by DragonsW...@yahoo.com, Jan 6, 2010

im trying to make googles cal the way i want to show it.

and from what i read so far at
http://arshaw.com/fullcalendar/docs/google-calendar.php
*note: shows classname in example - tried that see my code snip

and i viewed here too
http://arshaw.com/fullcalendar/docs/#calevent-objects
as well as here
http://arshaw.com/fullcalendar/docs/colors-and-theming.php

heres what ive tried: (code snip in gcal.html)
<script type='text/javascript'>

	$(document).ready(function() {

		$('#calendar').fullCalendar({
			header: {
				left: 'prev,next today',
				center: 'title',
				right: 'month,basicWeek,basicDay'
			},

			// US Holidays
			events: 
$.fullCalendar.gcalFeed('http://www.google.com/calendar/feeds/admin@familie
sinchrist.org/public/basic'),
			//America/New_York

			// breaks output
			//className: 'gcal-events',

			 /* breaks output
			 events: $.fullCalendar.gcalFeed(
				  
"http://www.google.com/calendar/feeds/admin@familiesinchrist.org/public/bas
ic",   // feed URL
				  //{ className: 'gcal-events' }                  
// optional options
			   )
			   */

			eventClick: function(event) {
				// opens events in a popup window
				
window.open(event.url+"&ctz=America/New_York", 'gcalevent', 
'width=400,height=250');
				return false;
			},


			/* works needs worked on
			eventMouseover: function(event) {
				// opens events in a popup window
				window.open(event.url, 'gcalevent', 
'width=300,height=200');
			},
			eventMouseout: function(event) {
				// opens events in a popup window
				window.close(event.url, 'gcalevent', 
'width=300,height=200');
			},
			*/

			loading: function(bool) {
				if (bool) {
					$('#loading').show();
				}else{
					$('#loading').hide();
				}
			}

		});

	});

</script>

heres my css snip (fullcalendar.css)

/* Global Event Styles
------------------------------------------------------------------------*/

.fc-event,
.fc-agenda .fc-event-time,
.fc-event a {
	border-style: solid; 
	//border-color: #36c;     /* default BORDER color (probably the 
same as background-color) */
	//background-color: #36c; /* default BACKGROUND color */
	//color: #fff;            /* default TEXT color */
		border-color: #708090;     /* default BORDER color 
(probably the same as background-color) */
		background-color: #ffffff; /* default BACKGROUND color */
		color: #000;            /* default TEXT color */

	}
/* Use the 'className' CalEvent property and the following
 * example CSS to change event color on a per-event basis:
 */
 .gcal-events,
 .fc-agenda .gcal-events .fc-event-time,
 .gcal-events a {
     background-color: black;
     border-color: black;
     color: red;
     }

	
	/* Use the 'className' CalEvent property and the following
	 * example CSS to change event color on a per-event basis:
	 *
	 * .myclass,
	 * .fc-agenda .myclass .fc-event-time,
	 * .myclass a {
	 *     background-color: black;
	 *     border-color: black;
	 *     color: red;
	 *     }
	 */
	 
.fc-event {
	text-align: left;
	}



i cant get it to work at all it breaks everything i try
it either does not simple load or is blank

what am i doing wrong and how does one do this please
thanks in advance for any code or help you may provide
Johnny
Jan 8, 2010
#1 DragonsW...@yahoo.com
classname needs to be with each event
ill try and expand on this later
but i answered my own question

i guess you can delete this post

docs are needed bad with examples and rendering shots or output BADLY

Jan 19, 2010
Project Member #2 adamrs...@gmail.com
hey dragonsworkshop,

glad you got it to work

i just released new docs. they are much easier to navigate than the old ones. i also
added some more examples. things could still be better, but i hope my changes help

http://arshaw.com/fullcalendar/docs/
Status: Done
Sign in to add a comment

Powered by Google Project Hosting