<future>
<page func="Infodrom Oldenburg" title="Termine">
+<script type="text/javascript" src="<root_prefix>jquery.editable.js"></script>
<style type="text/css">
-div#termine {
- margin-bottom: 10px;
+@media only screen and (max-device-width: 400px) {
+ div.view {
+ margin-left: 100px;
+ }
+}
+
+@media only screen and (max-device-width: 980px) {
+ button {
+ width: 3em;
+ }
+}
+
+div.view {
+ float:right;
+ margin-top:-30px;
+}
+div.clear {
+ clear: both;
+ margin-bottom: 3px;
}
table#calendar tr.row:hover {
background: yellow;
table#calendar tr.current {
background: orange;
}
+div.bimonth div.monthcolumn {
+ float: left;
+ width: 50%;
+}
+div.onemonth div.monthcolumn {
+ float: left;
+ width: 100%;
+}
+div.head {
+ font-weight: bold;
+ border-bottom: 1px solid #ccc;
+ text-align: center;
+}
+div.day {
+ position: relative;
+ border-bottom: 1px solid #ccc;
+}
+div.sunday {
+ border-bottom: 1px solid black;
+}
+div.today {
+ background: #90ee90;
+}
+div div.wday {
+ width: 1.6em;
+ margin-right: 2px;
+ float: left;
+}
+div div.date {
+ width: 1.6em;
+ margin-right: 2px;
+ float: left;
+}
+div.kw {
+ position: absolute;
+ top: 0px;
+ right: 1px;
+ color: #999;
+}
+div.month table thead td.title {
+ background: #b0e2ff;
+}
+div.month table tbody td {
+ height: 100px;
+ vertical-align: top;
+ position: relative;
+}
+div.month table tbody td.empty {
+ background: #ddd;
+}
+div.month table tbody td span {
+ font-size: 90%;
+}
+
+div#termine span {
+ padding-left: 1px;
+ padding-right: 1px;
+}
+
+span.menu_title {
+ padding-left: 2px;
+ padding-right: 2px;
+ background: #e0e0e0;
+ font-weight: bold;
+ border-bottom: 1px solid #8f8f8f;
+ display: block;
+}
+div.menu {
+ background: #fffb71;
+ position: absolute;
+ border: 1px solid #8f8f8f;
+ z-index: 10;
+}
+span.menu {
+ padding-left: 2px;
+ padding-right: 2px;
+ display: block;
+ cursor: default;
+}
+span.menu:hover {
+ background: #96ccff;
+}
+
+div.popup_body div#log div.caltitle {
+ border-top: 0px !important;
+}
+div.logl {
+ float: left;
+ width: 120px;
+}
+div.logr {
+ float: left;
+}
+div.popup_body div#log div.row0,
+div.popup_body div#log div.row1 {
+ margin: 0;
+ padding: 0;
+ font-size: 90%;
+ border-top: 1px solid #ccc;
+}
+div.popup_body div#log div.row0
+{
+ background: #eee;
+}
</style>
+<?php
+ $textbrowser = strpos($_SERVER['HTTP_USER_AGENT'], 'Lynx/') !== false || strpos($_SERVER['HTTP_USER_AGENT'], 'w3m/') !== false;
+?>
+
+<input type="hidden" id="thismonth">
<div id="termine">
+<?php
+ if ($textbrowser || (isset($_GET['month']) && $_GET['month'] == 'normal')) {
+?>
<table id="calendar" width="100%" class="smallfont border" cellspacing="0" summary="">
<tr class="head">
<th width="5%">KW</th>
$newmonth = $start->format('F Y');
if ($month != $newmonth) {
$month = $newmonth;
+ if ($textbrowser)
+ printf('<tr><td colspan="4"> </td></tr>');
printf('<tr class="month" month="%s"><td colspan="4">%s</td></tr>',
$start->format('Y-m'), $month);
$kw = '';
if (strlen($kw) && $kw != $row->kw)
$class .= ' newkw';
- printf('<tr id="%d" class="%s"><td>%s</td><td>%s</td><td%s>%s</td><td>%s</td></tr>',
+ $item = new Calendar_Item($row->dav_id);
+ printf('<tr id="%d" class="%s"><td>%s</td><td>%s</td><td>%s</td><td>%s</td></tr>',
$row->dav_id,
$class,
$kw != $row->kw ? $row->kw : ' ',
Calendar::formatTimespan($row->dtstart, $row->dtend),
- utf8_decode($tooltip),
- utf8_decode($row->summary),
+ utf8_decode($item->toSpan()),
utf8_decode($row->location));
$kw = $row->kw;
}
?>
</table>
+<?php
+ } // $textbrowser || month == 'monat'
+?>
</div>
+<div class="clear"></div>
+
+<div id="menu" class="menu" style="display:none;">
+<span class="menu_title" onmouseup="\$(this).parent().hide()">Titel</span>
+<span class="menu" onmouseup="add_comment()">Comment</span>
+<span class="menu" onmouseup="show_log()">Protocol</span>
+<span class="menu" onmouseup="colorise()">Color</span>
+<span class="menu" onmouseup="menu_close()">close</span>
+</div>
+
+<select name="colorpicker" style="display:none;">
+ <option value="#5484ed">Bold blue</option>
+ <option value="#a4bdfc">Blue</option>
+ <option value="#63b8ff">Steel blue</option>
+ <option value="#87ceeb">Sky blue</option>
+ <option value="#46d6db">Turquoise</option>
+ <option value="#7ae7bf">Light green</option>
+ <option value="#c0ff3e">Olive</option>
+ <option value="#7bd148">Green</option>
+ <option value="#51b749">Bold green</option>
+ <option value="#ffff00">Yellow</option>
+ <option value="#fbd75b">Yellow</option>
+ <option value="#ffb878">Orange</option>
+ <option value="#f4a460">Sandy brown</option>
+ <option value="#ff6a6a">IndianRed</option>
+ <option value="#ffa500">Orange</option>
+ <option value="#ff8247">Sienna</option>
+ <option value="#ff887c">Red</option>
+ <option value="#dc2127">Bold red</option>
+ <option value="#ff7f00">Dark orange</option>
+ <option value="#ee82ee">Violett</option>
+ <option value="#dbadff">Purple</option>
+ <option value="#ff00ff">Magenta</option>
+ <option value="#d4d4d4">Gray</option>
+ <option value="#e1e1e1">Gray</option>
+ <option value="#ededed">Light gray</option>
+</select>
+
+<protect><script type="text/javascript">
+var POPUP_TITLE_COMMENT = '<?php echo utf8_encode('Bemerkung hinzufügen'); ?>';
+function menu_close()
+{
+ $('div#menu').hide();
+}
+
+function dom_enhance()
+{
+ var html = ['<div class="view">',
+ '<button id="prev" style="display:none;"><img src="'+site_url('pix/left.png')+'" /></button>',
+ ' ',
+ '<button id="sync" style="display:none;"><img src="'+site_url('pix/sync.png')+'" /></button>',
+ ' ',
+ '<button id="next" style="display:none;"><img src="'+site_url('pix/right.png')+'" /></button>',
+ ' ',
+ '<select id="month" style="display:none;">',
+ '<option value="">jetzt</option>',
+ '</select>',
+ ' ',
+ '<select id="view">',
+ '<option value="normal">Normal</option>',
+ '<option value="bimonth">2 Monate</option>',
+ '<option value="onemonth">1 Monat</option>',
+ '<option value="month">Monat</option>',
+ '</select>',
+ '</div>'];
+
+ $(html.join('')).insertAfter('h3');
+ $.invoke('Calendar/Months');
+}
+
+var logwindow = false;
+function show_log()
+{
+ menu_close()
+
+ if (!logwindow) {
+ logwindow = new Popup('Protocol', '460px', false, '<div id="log"></div>');
+ logwindow.centerPopup();
+ } else {
+ logwindow.openPopup();
+ }
+
+ $.invoke('Calendar_Item/Log', {id: $('div#menu').attr('dav_id')}, function(data){
+ if (!is_mobile())
+ make_editable('div#log div.editable');
+ });
+}
+
+var commentwindow = false;
+function add_comment()
+{
+ menu_close()
+
+ if (!commentwindow) {
+ var html = ['<form id="comment">',
+ '<input type="hidden" name="id">',
+ '<label for="name">Name</label>',
+ '<input name="name" style="width: 296px;">',
+ '<label for="url">Link</label>',
+ '<input name="url" style="width: 296px;">',
+ '<label for="comment">Bemerkung</label>',
+ '<textarea name="comment" style="width: 296px; height:65px;"></textarea>',
+ '<div style="text-align: center; margin-top: 5px;"><input type="submit" value="Speichern"></div>',
+ '</form>'];
+ commentwindow = new Popup(POPUP_TITLE_COMMENT, '300px', false, html.join(''));
+ commentwindow.centerPopup();
+ $('form#comment input[type="submit"]').click(function(e){
+ $.invoke('Calendar_Item/AddLog', $('form#comment').serialize(), function(data){
+ commentwindow.closePopup();
+ });
+ return false;
+ });
+ } else {
+ commentwindow.openPopup();
+ }
+ $('form#comment input,form#comment textarea').not('form#comment input[type="submit"]').val('');
+ $('form#comment input[name="id"]').val($('div#menu').attr('dav_id'));
+ $('form#comment input[name="name"]').focus();
+}
+
+var incolorise = false;
+function colorise()
+{
+ menu_close()
+
+ $('select[name="colorpicker"]').simplecolorpicker({
+ picker: false
+ }).change(function(e) {
+ if (incolorise) return;
+ incolorise = true;
+
+ var color = $('select[name="colorpicker"]').val();
+ var id = $('div#menu').attr('dav_id');
+
+ $('span[dav_id="'+id+'"]').css('background-color', color);
+ $.invoke('Calendar_Item/SetColor', {id: id, color: color}, function(data){
+ incolorise = false;
+ });
+
+ $('select[name="colorpicker"]').simplecolorpicker('destroy');
+ $('select[name="colorpicker"]').hide();
+ });
+}
+
+function month_actions(data)
+{
+ $('#termine span').contextmenu(function(e){
+ $('select[name="colorpicker"]').simplecolorpicker('destroy');
+ $('select[name="colorpicker"]').hide();
+ $('div#menu').attr('dav_id', $(this).attr('dav_id'));
+ $('div#menu').positionOn($(this), 'center').show();
+ return false;
+ });
+ $('#termine span').click(function(e){
+ $('div#menu').attr('dav_id', $(this).attr('dav_id'));
+ show_log();
+ });
+
+ $('select#month').val($('#thismonth').val());
+}
+
+$(function(){
+ dom_enhance();
+ month_actions();
+ $('#view').val('normal').change(function(e){
+ if ($('#view').val() == 'normal') {
+ document.location.href = document.location.href.split('?')[0] + '?month=normal';
+ } else if ($('#view').val() == 'bimonth') {
+ $('#month,div.view button').show();
+ $.invoke('Calendar/BiMonth', {month: $('#thismonth').val()}, month_actions);
+ } else if ($('#view').val() == 'onemonth') {
+ $('#month,div.view button').show();
+ $.invoke('Calendar/OneMonth', {month: $('#thismonth').val()}, month_actions);
+ } else if ($('#view').val() == 'month') {
+ $('#month,div.view button').show();
+ $.invoke('Calendar/Month', {month: $('#thismonth').val()}, month_actions);
+ }
+ });
+ $('#month').change(function(e){
+ if ($('#view').val() == 'bimonth') {
+ $.invoke('Calendar/BiMonth', {month: $('#month').val()}, month_actions);
+ } else if ($('#view').val() == 'month') {
+ $.invoke('Calendar/Month', {month: $('#month').val()}, month_actions);
+ }
+
+ });
+ $('div.view button').click(function(e){
+ var direction = null
+ if ($(this).attr('id') != 'sync')
+ direction = $(this).attr('id') == 'prev' ? 'prev' : 'next';
+ if ($('#view').val() == 'bimonth') {
+ $.invoke('Calendar/BiMonth',
+ {month: $('#thismonth').val(),
+ direction: direction}, month_actions);
+ } else if ($('#view').val() == 'onemonth') {
+ $.invoke('Calendar/OneMonth',
+ {month: $('#thismonth').val(),
+ direction: direction}, month_actions);
+ } else if ($('#view').val() == 'month') {
+ $.invoke('Calendar/Month',
+ {month: $('#thismonth').val(),
+ direction: direction}, month_actions);
+ }
+ });
+ if (document.location.href.indexOf('month=normal') == -1) {
+ if (is_mobile()) {
+ $('<meta name="viewport" content="width=device-width, initial-scale=0.75" />').insertAfter('title');
+ $('#view').val('onemonth');
+ $.invoke('Calendar/OneMonth', {month: '<?=date('Y-m')?>'}, month_actions);
+ $('select#view').hide();
+ } else {
+ $('#view').val('bimonth');
+ $.invoke('Calendar/BiMonth', {month: '<?=date('Y-m')?>'}, month_actions);
+ }
+ }
+ $('#month,div.view button').show();
+});
+</script></protect>
</page>
# Local variables:
projects / infodrom.org / service.infodrom.org / blobdiff