1 #include <infodrom.style>
4 <page func="Infodrom Oldenburg" title="Termine">
5 <script type="text/javascript" src="<root_prefix>jquery.editable.js"></script>
7 <style type="text/css">
8 @media only screen and (max-device-width: 400px) {
14 @media only screen and (max-device-width: 980px) {
28 table#calendar tr.row:hover {
31 table#calendar tr.newkw td {
32 border-top: 1px solid #999;
34 table#calendar tr.month {
37 table#calendar tr.current {
40 div.bimonth div.monthcolumn {
44 div.onemonth div.monthcolumn {
50 border-bottom: 1px solid #ccc;
55 border-bottom: 1px solid #ccc;
58 border-bottom: 1px solid black;
79 div.month table thead td.title {
82 div.month table tbody td {
87 div.month table tbody td.empty {
90 div.month table tbody td span {
104 border-bottom: 1px solid #8f8f8f;
110 border: 1px solid #8f8f8f;
123 div.popup_body div#log div.caltitle {
124 border-top: 0px !important;
133 div.popup_body div#log div.row0,
134 div.popup_body div#log div.row1 {
138 border-top: 1px solid #ccc;
140 div.popup_body div#log div.row0
147 $textbrowser = strpos($_SERVER['HTTP_USER_AGENT'], 'Lynx/') !== false || strpos($_SERVER['HTTP_USER_AGENT'], 'w3m/') !== false;
150 <input type="hidden" id="thismonth">
153 if ($textbrowser || (isset($_GET['month']) && $_GET['month'] == 'normal')) {
155 <table id="calendar" width="100%" class="smallfont border" cellspacing="0" summary="">
157 <th width="5%">KW</th>
158 <th width="20%">Datum</th>
159 <th width="55%">Beschreibung</th>
160 <th width="20%">Location</th>
164 setlocale('LC_TIME', 'de_DE');
165 $now = date('Y-m-d H:i:s');
166 $pivot = date('Y-m-d H:i:s', time()+(7*24*60*60));
168 $item = new Calendar();
171 if (empty($_GET['year'])) {
175 $from = mktime(0,0,0,1,1,intval($_GET['year']));
176 $to = mktime(0,0,0,1,1,intval($_GET['year'])+1) - 1;
179 foreach ($item->getItems($from, $to) as $row) {
180 $start = new DateTime($row->dtstart);
181 $newmonth = $start->format('F Y');
182 if ($month != $newmonth) {
185 printf('<tr><td colspan="4"> </td></tr>');
186 printf('<tr class="month" month="%s"><td colspan="4">%s</td></tr>',
187 $start->format('Y-m'), $month);
192 if (strlen($row->description))
193 $tooltip = sprintf(' title="%s"', htmlspecialchars($row->description));
196 if ($row->dtstart >= $now && $row->dtstart < $pivot)
197 $class .= ' current';
198 if (strlen($kw) && $kw != $row->kw)
201 $item = new Calendar_Item($row->dav_id);
202 printf('<tr id="%d" class="%s"><td>%s</td><td>%s</td><td>%s</td><td>%s</td></tr>',
205 $kw != $row->kw ? $row->kw : ' ',
206 Calendar::formatTimespan($row->dtstart, $row->dtend),
207 utf8_decode($item->toSpan()),
208 utf8_decode($row->location));
216 } // $textbrowser || month == 'monat'
219 <div class="clear"></div>
221 <div id="menu" class="menu" style="display:none;">
222 <span class="menu_title" onmouseup="\$(this).parent().hide()">Titel</span>
223 <span class="menu" onmouseup="add_comment()">Comment</span>
224 <span class="menu" onmouseup="show_log()">Protocol</span>
225 <span class="menu" onmouseup="colorise()">Color</span>
226 <span class="menu" onmouseup="menu_close()">close</span>
229 <select name="colorpicker" style="display:none;">
230 <option value="#5484ed">Bold blue</option>
231 <option value="#a4bdfc">Blue</option>
232 <option value="#63b8ff">Steel blue</option>
233 <option value="#87ceeb">Sky blue</option>
234 <option value="#46d6db">Turquoise</option>
235 <option value="#7ae7bf">Light green</option>
236 <option value="#c0ff3e">Olive</option>
237 <option value="#7bd148">Green</option>
238 <option value="#51b749">Bold green</option>
239 <option value="#ffff00">Yellow</option>
240 <option value="#fbd75b">Yellow</option>
241 <option value="#ffb878">Orange</option>
242 <option value="#f4a460">Sandy brown</option>
243 <option value="#ff6a6a">IndianRed</option>
244 <option value="#ffa500">Orange</option>
245 <option value="#ff8247">Sienna</option>
246 <option value="#ff887c">Red</option>
247 <option value="#dc2127">Bold red</option>
248 <option value="#ff7f00">Dark orange</option>
249 <option value="#ee82ee">Violett</option>
250 <option value="#dbadff">Purple</option>
251 <option value="#ff00ff">Magenta</option>
252 <option value="#d4d4d4">Gray</option>
253 <option value="#e1e1e1">Gray</option>
254 <option value="#ededed">Light gray</option>
257 <protect><script type="text/javascript">
258 function menu_close()
260 $('div#menu').hide();
263 function dom_enhance()
265 var html = ['<div class="view">',
266 '<button id="prev" style="display:none;"><img src="'+site_url('pix/left.png')+'" /></button>',
268 '<button id="sync" style="display:none;"><img src="'+site_url('pix/sync.png')+'" /></button>',
270 '<button id="next" style="display:none;"><img src="'+site_url('pix/right.png')+'" /></button>',
272 '<select id="month" style="display:none;">',
273 '<option value="">jetzt</option>',
276 '<select id="view">',
277 '<option value="normal">Normal</option>',
278 '<option value="bimonth">2 Monate</option>',
279 '<option value="onemonth">1 Monat</option>',
280 '<option value="month">Monat</option>',
284 $(html.join('')).insertAfter('h3');
285 $.invoke('Calendar/Months');
288 var logwindow = false;
294 logwindow = new Popup('Protocol', '460px', false, '<div id="log"></div>');
295 logwindow.centerPopup();
297 logwindow.openPopup();
300 $.invoke('Calendar_Item/Log', {id: $('div#menu').attr('dav_id')}, function(data){
302 make_editable('div#log div.editable');
306 var commentwindow = false;
307 function add_comment()
311 if (!commentwindow) {
312 var html = ['<form id="comment">',
313 '<input type="hidden" name="id">',
314 '<label for="name">Name</label>',
315 '<input name="name" style="width: 296px;">',
316 '<label for="url">Link</label>',
317 '<input name="url" style="width: 296px;">',
318 '<label for="comment">Bemerkung</label>',
319 '<textarea name="comment" style="width: 296px; height:65px;"></textarea>',
320 '<div style="text-align: center; margin-top: 5px;"><input type="submit" value="Speichern"></div>',
322 commentwindow = new Popup('Bemerkung hinzufügen', '300px', false, html.join(''));
323 commentwindow.centerPopup();
324 $('form#comment input[type="submit"]').click(function(e){
325 $.invoke('Calendar_Item/AddLog', $('form#comment').serialize(), function(data){
326 commentwindow.closePopup();
331 commentwindow.openPopup();
333 $('form#comment input,form#comment textarea').not('form#comment input[type="submit"]').val('');
334 $('form#comment input[name="id"]').val($('div#menu').attr('dav_id'));
335 $('form#comment input[name="name"]').focus();
338 var incolorise = false;
343 $('select[name="colorpicker"]').simplecolorpicker({
345 }).change(function(e) {
346 if (incolorise) return;
349 var color = $('select[name="colorpicker"]').val();
350 var id = $('div#menu').attr('dav_id');
352 $('span[dav_id="'+id+'"]').css('background-color', color);
354 $.invoke('Calendar_Item/SetColor', {id: id, color: color}, function(data){
358 $('select[name="colorpicker"]').simplecolorpicker('destroy');
359 $('select[name="colorpicker"]').hide();
363 function month_actions(data)
365 $('#termine span').contextmenu(function(e){
366 $('select[name="colorpicker"]').simplecolorpicker('destroy');
367 $('select[name="colorpicker"]').hide();
368 $('div#menu').attr('dav_id', $(this).attr('dav_id'));
369 $('div#menu').positionOn($(this), 'center').show();
372 $('#termine span').click(function(e){
373 $('div#menu').attr('dav_id', $(this).attr('dav_id'));
377 $('select#month').val($('#thismonth').val());
383 $('#view').val('normal').change(function(e){
384 if ($('#view').val() == 'normal') {
385 document.location.href = document.location.href.split('?')[0] + '?month=normal';
386 } else if ($('#view').val() == 'bimonth') {
387 $('#month,div.view button').show();
388 $.invoke('Calendar/BiMonth', {month: $('#thismonth').val()}, month_actions);
389 } else if ($('#view').val() == 'onemonth') {
390 $('#month,div.view button').show();
391 $.invoke('Calendar/OneMonth', {month: $('#thismonth').val()}, month_actions);
392 } else if ($('#view').val() == 'month') {
393 $('#month,div.view button').show();
394 $.invoke('Calendar/Month', {month: $('#thismonth').val()}, month_actions);
397 $('#month').change(function(e){
398 if ($('#view').val() == 'bimonth') {
399 $.invoke('Calendar/BiMonth', {month: $('#month').val()}, month_actions);
400 } else if ($('#view').val() == 'month') {
401 $.invoke('Calendar/Month', {month: $('#month').val()}, month_actions);
405 $('div.view button').click(function(e){
407 if ($(this).attr('id') != 'sync')
408 direction = $(this).attr('id') == 'prev' ? 'prev' : 'next';
409 if ($('#view').val() == 'bimonth') {
410 $.invoke('Calendar/BiMonth',
411 {month: $('#thismonth').val(),
412 direction: direction}, month_actions);
413 } else if ($('#view').val() == 'onemonth') {
414 $.invoke('Calendar/OneMonth',
415 {month: $('#thismonth').val(),
416 direction: direction}, month_actions);
417 } else if ($('#view').val() == 'month') {
418 $.invoke('Calendar/Month',
419 {month: $('#thismonth').val(),
420 direction: direction}, month_actions);
423 if (document.location.href.indexOf('month=normal') == -1) {
425 $('<meta name="viewport" content="width=device-width, initial-scale=0.75" />').insertAfter('title');
426 $('#view').val('onemonth');
427 $.invoke('Calendar/OneMonth', {month: '<?=date('Y-m')?>'}, month_actions);
428 $('select#view').hide();
430 $('#view').val('bimonth');
431 $.invoke('Calendar/BiMonth', {month: '<?=date('Y-m')?>'}, month_actions);
434 $('#month,div.view button').show();