Subversion-Projekte lars-tiefland.ci

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
875 lars 1 
<!DOCTYPE html>
2 
<html>
3 
<head>
4 
<meta charset='utf-8' />
5 
<link rel='stylesheet' href='../lib/cupertino/jquery-ui.min.css' />
6 
<link href='../fullcalendar.css' rel='stylesheet' />
7 
<link href='../fullcalendar.print.css' rel='stylesheet' media='print' />
8 
<script src='../lib/moment.min.js'></script>
9 
<script src='../lib/jquery.min.js'></script>
10 
<script src='../fullcalendar.min.js'></script>
11 
<script src='../lang-all.js'></script>
12 
<script>
13 
 
14 
	$(document).ready(function() {
15 
		var currentLangCode = 'en';
16 
 
17 
		// build the language selector's options
18 
		$.each($.fullCalendar.langs, function(langCode) {
19 
			$('#lang-selector').append(
20 
				$('<option/>')
21 
					.attr('value', langCode)
22 
					.prop('selected', langCode == currentLangCode)
23 
					.text(langCode)
24 
			);
25 
		});
26 
 
27 
		// rerender the calendar when the selected option changes
28 
		$('#lang-selector').on('change', function() {
29 
			if (this.value) {
30 
				currentLangCode = this.value;
31 
				$('#calendar').fullCalendar('destroy');
32 
				renderCalendar();
33 
			}
34 
		});
35 
 
36 
		function renderCalendar() {
37 
			$('#calendar').fullCalendar({
38 
				header: {
39 
					left: 'prev,next today',
40 
					center: 'title',
41 
					right: 'year,month,agendaWeek,agendaDay'
42 
				},
43 
				defaultDate: '2015-02-12',
44 
				lang: currentLangCode,
45 
				buttonIcons: false, // show the prev/next text
46 
				weekNumbers: true,
47 
				editable: true,
48 
				eventLimit: true, // allow "more" link when too many events
49 
				events: [
50 
					{
51 
						title: 'All Day Event',
52 
						start: '2015-02-01'
53 
					},
54 
					{
55 
						title: 'Long Event',
56 
						start: '2015-02-07',
57 
						end: '2015-02-10'
58 
					},
59 
					{
60 
						id: 999,
61 
						title: 'Repeating Event',
62 
						start: '2015-02-09T16:00:00'
63 
					},
64 
					{
65 
						id: 999,
66 
						title: 'Repeating Event',
67 
						start: '2015-02-16T16:00:00'
68 
					},
69 
					{
70 
						title: 'Conference',
71 
						start: '2015-02-11',
72 
						end: '2015-02-13'
73 
					},
74 
					{
75 
						title: 'Meeting',
76 
						start: '2015-02-12T10:30:00',
77 
						end: '2015-02-12T12:30:00'
78 
					},
79 
					{
80 
						title: 'Lunch',
81 
						start: '2015-02-12T12:00:00'
82 
					},
83 
					{
84 
						title: 'Meeting',
85 
						start: '2015-02-12T14:30:00'
86 
					},
87 
					{
88 
						title: 'Happy Hour',
89 
						start: '2015-02-12T17:30:00'
90 
					},
91 
					{
92 
						title: 'Dinner',
93 
						start: '2015-02-12T20:00:00'
94 
					},
95 
					{
96 
						title: 'Birthday Party',
97 
						start: '2015-02-13T07:00:00'
98 
					},
99 
					{
100 
						title: 'Click for Google',
101 
						url: 'http://google.com/',
102 
						start: '2015-02-28'
103 
					}
104 
				]
105 
			});
106 
		}
107 
 
108 
		renderCalendar();
109 
	});
110 
 
111 
</script>
112 
<style>
113 
 
114 
	body {
115 
		margin: 0;
116 
		padding: 0;
117 
		font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
118 
		font-size: 14px;
119 
	}
120 
 
121 
	#top {
122 
		background: #eee;
123 
		border-bottom: 1px solid #ddd;
124 
		padding: 0 10px;
125 
		line-height: 40px;
126 
		font-size: 12px;
127 
	}
128 
 
129 
	#calendar {
130 
		max-width: 900px;
131 
		margin: 40px auto;
132 
		padding: 0 10px;
133 
	}
134 
 
135 
</style>
136 
</head>
137 
<body>
138 
 
139 
	<div id='top'>
140 
 
141 
		Language:
142 
		<select id='lang-selector'></select>
143 
 
144 
	</div>
145 
 
146 
	<div id='calendar'></div>
147 
 
148 
</body>
149 
</html>