* Calendar: Add new feature to the calendar app, in order to be able to sort calendars in day and week views

This commit is contained in:
Hadi Nategh 2014-12-05 11:32:08 +00:00
parent 6ffc302835
commit 700d0d78e5
5 changed files with 351 additions and 320 deletions

View File

@ -141,7 +141,7 @@ class calendar_uiviews extends calendar_ui
/**
* Constructor
*
* @param array $set_states=null to manualy set / change one of the states, default NULL = use $_REQUEST
* @param array $set_states = null to manualy set / change one of the states, default NULL = use $_REQUEST
*/
function __construct($set_states=null)
{
@ -283,7 +283,7 @@ class calendar_uiviews extends calendar_ui
/**
* Displays the planner view
*
* @param boolean $home=false if true return content suitable for home-page
* @param boolean $home = false if true return content suitable for home-page
*/
function &planner($home=false)
{
@ -367,7 +367,7 @@ class calendar_uiviews extends calendar_ui
/**
* Displays a multiple week-view
*
* @param boolean $home=false if true return content suitable for home-page
* @param boolean $home = false if true return content suitable for home-page
*/
function &weekN($home=false)
{
@ -382,7 +382,7 @@ class calendar_uiviews extends calendar_ui
/**
* Displays a year view
*
* @param boolean $home=false if true return content suitable for home-page
* @param boolean $home = false if true return content suitable for home-page
*/
function &year($home=false)
{
@ -613,8 +613,8 @@ class calendar_uiviews extends calendar_ui
/**
* Displays the monthview or a multiple week-view
*
* @param int $weeks=0 number of weeks to show, if 0 (default) all weeks of one month are shown
* @param boolean $home=false if true return content suitable for home-page
* @param int $weeks = 0 number of weeks to show, if 0 (default) all weeks of one month are shown
* @param boolean $home = false if true return content suitable for home-page
*/
function &month($weeks=0,$home=false)
{
@ -720,7 +720,7 @@ class calendar_uiviews extends calendar_ui
*
* @param int &$first timestamp 0h of first day of week containing the first of the current month
* @param int &$last timestamp 23:59:59 of last day of week containg the last day of the current month
* @param int $day=1 should the alignment be based on the 1. of the month or an other date, eg. the 15.
* @param int $day = 1 should the alignment be based on the 1. of the month or an other date, eg. the 15.
*/
function _week_align_month(&$first,&$last,$day=1)
{
@ -768,7 +768,7 @@ class calendar_uiviews extends calendar_ui
/**
* Four days view, everythings done by the week-view code ...
*
* @param boolean $home=false if true return content suitable for home-page
* @param boolean $home = false if true return content suitable for home-page
* @return string
*/
function day4($home=false)
@ -794,8 +794,8 @@ class calendar_uiviews extends calendar_ui
/**
* Displays the weekview, with 5 or 7 days
*
* @param int $days=0 number of days to show, if 0 (default) the value from the URL or the prefs is used
* @param boolean $home=false if true return content suitable for home-page
* @param int $days = 0 number of days to show, if 0 (default) the value from the URL or the prefs is used
* @param boolean $home = false if true return content suitable for home-page
*/
function week($days=0,$home=false)
{
@ -897,6 +897,7 @@ class calendar_uiviews extends calendar_ui
$headerCounter = 0;
foreach($this->_get_planner_users(false) as $uid => $label)
{
$content .= '<div data-sortable-id="'.$uid.'">';
$search_params['users'] = $uid;
$content .= '<b>'.$label."</b>\n";
$content .= $this->close_button($uid);
@ -907,7 +908,9 @@ class calendar_uiviews extends calendar_ui
{
$content .= $navHeader;
}
$content .= '</div>';
}
$content = '<div class="cal_is_sortable">'.$content.'</div>';
}
$content = $navHeader.$content;
@ -926,7 +929,7 @@ class calendar_uiviews extends calendar_ui
/**
* Displays the dayview
*
* @param boolean $home=false if true return content suitable for home-page
* @param boolean $home = false if true return content suitable for home-page
*/
function &day($home=false)
{
@ -1169,7 +1172,7 @@ class calendar_uiviews extends calendar_ui
*
* @param int $start time in minutes
* @param int $end time in minutes
* @param int $minimum=0 minimum height
* @param int $minimum = 0 minimum height
* @return float height in percent
*/
function times2height($start,$end,$minimum=0)
@ -1188,12 +1191,12 @@ class calendar_uiviews extends calendar_ui
* Uses the dayColWidget to display each day.
*
* @param $daysEvents array with subarrays of events for each day to show, day as YYYYMMDD as key
* @param int $granularity_m=30 granularity in minutes of the rows
* @param int $height=400 height of the widget
* @param string $indent='' string for correct indention
* @param string $title='' title of the time-grid
* @param int/array $owner=0 owner of the calendar (default 0 = $this->owner) or array with owner for each column
* @param boolean $last=true last timeGrid displayed, default true
* @param int $granularity_m = 30 granularity in minutes of the rows
* @param int $height = 400 height of the widget
* @param string $indent = '' string for correct indention
* @param string $title = '' title of the time-grid
* @param int/array $owner = 0 owner of the calendar (default 0 = $this->owner) or array with owner for each column
* @param boolean $last = true last timeGrid displayed, default true
*/
function &timeGridWidget($daysEvents,$granularity_m=30,$height=400,$indent='',$title='',$owner=0,$last=true)
{
@ -1388,16 +1391,16 @@ class calendar_uiviews extends calendar_ui
* @param int $pleft start of the widget
* @param int $pwidth width of the widget
* @param string $indent string for correct indention
* @param boolean/string $short_title=True should we add a label (weekday, day) with link to the day-view above each day or string with title
* @param boolean $on_off=false start with row_on or row_off, default false=row_off
* @param int $owner=0 if != 0 owner to add to the add-event link
* @param boolean/string $short_title = True should we add a label (weekday, day) with link to the day-view above each day or string with title
* @param boolean $on_off = false start with row_on or row_off, default false=row_off
* @param int $owner = 0 if != 0 owner to add to the add-event link
*/
function dayColWidget($day_ymd,$events,$pleft,$pwidth,$indent,$short_title=True,$on_off=False,$owner=0)
{
if ($this->debug > 1 || $this->debug==='dayColWidget') $this->bo->debug_message('uiviews::dayColWidget(%1,%2,left=%3,width=%4,)',False,$day_ymd,$events,$pleft,$pwidth);
$html = $indent.'<div id="calColumn'.$this->calColumnCounter++.'" class="calendar_calDayCol" style="left: '.$pleft.
'%; width: '.$pwidth.'%;">'."\n";
$html = $indent.'<div id="calColumn'.$this->calColumnCounter++.'" class="calendar_calDayCol" '.'data-sortable-id="'.$owner.'" style="left: '.$pleft.
'%;width: '.$pwidth.'%;">'."\n";
// Creation of the header-column with date, evtl. holiday-names and a matching background-color
$ts = $this->bo->date2ts((string)$day_ymd);
@ -1525,8 +1528,8 @@ class calendar_uiviews extends calendar_ui
* @param string $day_ymd date
* @param string &$class class to use
* @param string &$holidays commaseparted holidays or empty if none
* @param boolean $only_weekend=false show only the weekend in header-color, otherwise every second days is shown too
* @param boolean $show_bdays=true If available, also show birthdays (or hide Bdays)
* @param boolean $only_weekend = false show only the weekend in header-color, otherwise every second days is shown too
* @param boolean $show_bdays = true If available, also show birthdays (or hide Bdays)
* Note that this is not the place to disable a preference.
* If the preferences allow birthdays to be displayed, they are cached within the holidays structure.
* This setting just suppressing the available data in the view.
@ -1631,8 +1634,8 @@ class calendar_uiviews extends calendar_ui
* @param $width int width of the widget
* @param string $indent string for correct indention
* @param int $owner owner of the calendar the event is in
* @param boolean $return_array=false should an array with keys(tooltip,popup,html) be returned or the complete widget as string
* @param string $block='event_widget' template used the render the widget
* @param boolean $return_array = false should an array with keys(tooltip,popup,html) be returned or the complete widget as string
* @param string $block = 'event_widget' template used the render the widget
* @param int $z_index is the z-index of the drag-drobable outer box of the event.
* @return string/array
*/
@ -2088,7 +2091,7 @@ class calendar_uiviews extends calendar_ui
* @param mixed $start start-time of the grid
* @param mixed $end end-time of the grid
* @param string|int $by_cat rows by sub-categories of $by_cat (cat_id or 0 for upmost level) or by 'user' or 'month'
* @param string $indent='' string for correct indention
* @param string $indent = '' string for correct indention
* @return string with widget
*/
function &plannerWidget(&$events,$start,$end,$by_cat=0,$indent='')
@ -2261,7 +2264,7 @@ class calendar_uiviews extends calendar_ui
/**
* get all users to display in the planner_by_user
*
* @param boolean $enum_groups=true should groups be returned as there members (eg. planner) or not (day & week)
* @param boolean $enum_groups = true should groups be returned as there members (eg. planner) or not (day & week)
* @return array with uid => label pairs, first all users alphabetically sorted, then all resources
*/
function _get_planner_users($enum_groups=true)
@ -2289,8 +2292,12 @@ class calendar_uiviews extends calendar_ui
$users[$user] = $this->bo->participant_name($user);
}
}
asort($users);
asort($resources);
// Only sort users in planner views
if ($enum_groups)
{
asort($users);
asort($resources);
}
return $users+$resources;
}
@ -2348,7 +2355,7 @@ class calendar_uiviews extends calendar_ui
*
* @param int $start start-time (12h) of the scale
* @param int $days number of days to display
* @param string $indent='' string for correct indention
* @param string $indent = '' string for correct indention
* @return string with scale
*/
function plannerMonthScale($start,$days,$indent)
@ -2438,7 +2445,7 @@ class calendar_uiviews extends calendar_ui
*
* @param int $start start-time (12h) of the scale
* @param int $days number of days to display
* @param string $indent='' string for correct indention
* @param string $indent = '' string for correct indention
* @return string with scale
*/
function plannerWeekScale($start,$days,$indent)
@ -2483,7 +2490,7 @@ class calendar_uiviews extends calendar_ui
*
* @param int $start start-time (12h) of the scale
* @param int $days number of days to display
* @param string $indent='' string for correct indention
* @param string $indent = '' string for correct indention
* @return string with scale
*/
function plannerDayScale($start,$days,$indent)
@ -2607,7 +2614,7 @@ class calendar_uiviews extends calendar_ui
*
* @param int $start start-time (12h) of the scale
* @param int $days number of days to display
* @param string $indent='' string for correct indention
* @param string $indent = '' string for correct indention
* @return string with scale
*/
function plannerHourScale($start,$days,$indent)
@ -2652,7 +2659,7 @@ class calendar_uiviews extends calendar_ui
* @param int $end end-time of the row
* @param string $header user or category name for the row-header
* @param string $class additional css class for the row
* @param string $indent='' string for correct indention
* @param string $indent = '' string for correct indention
* @return string with widget
*/
function plannerRowWidget($events,$start,$end,$header,$class,$indent='')
@ -2709,7 +2716,7 @@ class calendar_uiviews extends calendar_ui
*
* @param int $start timestamp of start of row
* @param int $days number of days in month of row
* @param string $indent=''
* @param string $indent = ''
* @return string
*/
function yearlyPlannerMarkDays($start,$days,$indent='')
@ -2739,7 +2746,7 @@ class calendar_uiviews extends calendar_ui
* @param array $events non-overlapping events to show
* @param int $start start-time of the row
* @param int $end end-time of the row
* @param string $indent='' string for correct indention
* @param string $indent = '' string for correct indention
* @return string with widget
*/
function eventRowWidget($events,$start,$end,$indent='')

View File

@ -225,209 +225,209 @@ app.classes.calendar = AppJS.extend(
var that = this;
//Draggable & Resizable selector
jQuery("div[id^='drag_']")
//draggable event handler
.draggable
({
stack: jQuery("div[id^='drag_']"),
revert: "invalid",
delay: 50,
var $drag = jQuery("div[id^='drag_']")
//draggable event handler
.draggable
({
stack: jQuery("div[id^='drag_']"),
revert: "invalid",
delay: 50,
cursorAt:{top:0,left:0},
containment: ".egw_fw_content_browser_iframe",
scroll: true,
opacity: .6,
cursor: "move",
cursorAt:{top:0,left:0},
containment: ".egw_fw_content_browser_iframe",
scroll: true,
opacity: .6,
cursor: "move",
/**
* Triggered when the dragging of calEvent stoped.
*
* @param {event} event
* @param {Object} ui
*/
stop: function(event, ui)
{
ui.helper.width(oldWidth);
ui.helper[0].innerHTML = oldInnerHTML;
},
/**
* Triggered when the dragging of calEvent stoped.
*
* @param {event} event
* @param {Object} ui
*/
stop: function(event, ui)
{
ui.helper.width(oldWidth);
ui.helper[0].innerHTML = oldInnerHTML;
},
/**
* Triggered while dragging a calEvent.
*
* @param {event} event
* @param {Object} ui
*
*/
drag:function(event, ui)
{
//that.dragEvent();
},
/**
* Triggered when the dragging of calEvent started.
*
* @param {event} event
* @param {Object} ui
*
*/
start: function(event, ui)
{
oldInnerHTML = ui.helper[0].innerHTML;
oldWidth = ui.helper.width();
ui.helper.width(jQuery("#calColumn").width());
}
})
//Resizable event handler
.resizable
({
distance: 10,
/**
* Triggered when the resizable is created.
*
* @param {event} event
* @param {Object} ui
*/
create:function(event, ui)
{
var resizeHelper = event.target.getAttribute('data-resize').split("|")[3];
if (resizeHelper == 'WD' || resizeHelper == 'WDS')
{
$j(this).resizable('destroy');
}
},
/**
* Triggered at start of resizing a calEvent
*
* @param {event} event
* @param {Object} ui
*/
start:function(event, ui)
{
var resizeHelper = event.target.getAttribute('data-resize');
var dataResize = resizeHelper.split("|");
var time = dataResize[1].split(":");
this.dropStart = that.resizeHelper(ui.element[0].getBoundingClientRect().left,ui.element[0].getBoundingClientRect().top);
this.dropDate = dataResize[0]+"T"+time[0]+time[1];
//$j(this).resizable("option","containment",".calendar_calDayCol");
},
/**
* Triggered at the end of resizing the calEvent.
*
* @param {event} event
* @param {Object} ui
*/
stop:function(event, ui)
{
var eventFlag = event.target.getAttribute('data-resize').split("|")[3];
var dropdate = that.cal_dnd_tZone_converter(this.dropDate);
var sT = parseInt((dropdate.split("T")[1].substr(0,2)* 60)) + parseInt(dropdate.split("T")[1].substr(2,2));
if (this.dropEnd != 'undefined' && this.dropEnd)
{
var eT = parseInt(this.dropEnd.getAttribute('data-date').split("|")[1] * 60) + parseInt(this.dropEnd.getAttribute('data-date').split("|")[2]);
var newDuration = ((eT - sT)/60) * 3600;
that.dropEvent(this.getAttribute('id'),dropdate,newDuration,eventFlag);
}
},
/**
* Triggered during the resize, on the drag of the resize handler
*
* @param {event} event
* @param {Object} ui
*/
resize:function(event, ui)
{
this.dropEnd = that.resizeHelper(ui.element[0].getBoundingClientRect().left,
ui.element[0].getBoundingClientRect().top+ui.size.height);
if (typeof this.dropEnd != 'undefined' && this.dropEnd)
{
if (this.dropEnd.getAttribute('id').match(/drop_/g))
/**
* Triggered while dragging a calEvent.
*
* @param {event} event
* @param {Object} ui
*
*/
drag:function(event, ui)
{
var dH = this.dropEnd.getAttribute('data-date').split("|")[1];
var dM = this.dropEnd.getAttribute('data-date').split("|")[2];
//that.dragEvent();
},
/**
* Triggered when the dragging of calEvent started.
*
* @param {event} event
* @param {Object} ui
*
*/
start: function(event, ui)
{
oldInnerHTML = ui.helper[0].innerHTML;
oldWidth = ui.helper.width();
ui.helper.width(jQuery("#calColumn").width());
}
var dataResize = event.target.getAttribute('data-resize').split("|");
this.innerHTML = '<div style="font-size: 1.1em; text-align:center; font-weight: bold; height:100%;"><span class="calendar_timeDemo" >'+dH+':'+dM+'</span></div>';
}
else
{
this.innerHTML = '<div class="calendar_d-n-d_forbiden"></div>';
}
}
});
})
//Resizable event handler
.resizable
({
distance: 10,
/**
* Triggered when the resizable is created.
*
* @param {event} event
* @param {Object} ui
*/
create:function(event, ui)
{
var resizeHelper = event.target.getAttribute('data-resize').split("|")[3];
if (resizeHelper == 'WD' || resizeHelper == 'WDS')
{
jQuery(this).resizable('destroy');
}
},
/**
* Triggered at start of resizing a calEvent
*
* @param {event} event
* @param {Object} ui
*/
start:function(event, ui)
{
var resizeHelper = event.target.getAttribute('data-resize');
var dataResize = resizeHelper.split("|");
var time = dataResize[1].split(":");
this.dropStart = that.resizeHelper(ui.element[0].getBoundingClientRect().left,ui.element[0].getBoundingClientRect().top);
this.dropDate = dataResize[0]+"T"+time[0]+time[1];
//$j(this).resizable("option","containment",".calendar_calDayCol");
},
/**
* Triggered at the end of resizing the calEvent.
*
* @param {event} event
* @param {Object} ui
*/
stop:function(event, ui)
{
var eventFlag = event.target.getAttribute('data-resize').split("|")[3];
var dropdate = that.cal_dnd_tZone_converter(this.dropDate);
var sT = parseInt((dropdate.split("T")[1].substr(0,2)* 60)) + parseInt(dropdate.split("T")[1].substr(2,2));
if (this.dropEnd != 'undefined' && this.dropEnd)
{
var eT = parseInt(this.dropEnd.getAttribute('data-date').split("|")[1] * 60) + parseInt(this.dropEnd.getAttribute('data-date').split("|")[2]);
var newDuration = ((eT - sT)/60) * 3600;
that.dropEvent(this.getAttribute('id'),dropdate,newDuration,eventFlag);
}
},
/**
* Triggered during the resize, on the drag of the resize handler
*
* @param {event} event
* @param {Object} ui
*/
resize:function(event, ui)
{
this.dropEnd = that.resizeHelper(ui.element[0].getBoundingClientRect().left,
ui.element[0].getBoundingClientRect().top+ui.size.height);
if (typeof this.dropEnd != 'undefined' && this.dropEnd)
{
if (this.dropEnd.getAttribute('id').match(/drop_/g))
{
var dH = this.dropEnd.getAttribute('data-date').split("|")[1];
var dM = this.dropEnd.getAttribute('data-date').split("|")[2];
}
var dataResize = event.target.getAttribute('data-resize').split("|");
this.innerHTML = '<div style="font-size: 1.1em; text-align:center; font-weight: bold; height:100%;"><span class="calendar_timeDemo" >'+dH+':'+dM+'</span></div>';
}
else
{
this.innerHTML = '<div class="calendar_d-n-d_forbiden"></div>';
}
}
});
//Droppable selector
jQuery("div[id^='drop_']")
//Droppable event handler
.droppable
({
/**
* Make all draggable calEvents acceptable
*
*/
accept:function()
{
return true;
},
tolerance:'pointer',
var $drop = jQuery("div[id^='drop_']")
//Droppable event handler
.droppable
({
/**
* Make all draggable calEvents acceptable
*
*/
accept:function()
{
return true;
},
tolerance:'pointer',
/**
* Triggered when the calEvent dropped.
*
* @param {event} event
* @param {Object} ui
*/
drop:function(event, ui)
{
var dgId = ui.draggable[0].getAttribute('id');
var dgOwner = dgId.substring(dgId.lastIndexOf("_C")+2,dgId.lastIndexOf(""));
var dpOwner = event.target.getAttribute('data-owner');
var eventFlag = ui.draggable[0].getAttribute('data-resize').split("|")[3];
if (dpOwner == null) dpOwner = dgOwner;
if (dpOwner == dgOwner )
{
that.dropEvent(ui.draggable[0].id, event.target.getAttribute('id').substring(event.target.getAttribute('id').lastIndexOf("drop_")+5, event.target.getAttribute('id').lastIndexOf("_O")),null,eventFlag);
}
else
{
jQuery(ui.draggable).draggable("option","revert",true);
}
/**
* Triggered when the calEvent dropped.
*
* @param {event} event
* @param {Object} ui
*/
drop:function(event, ui)
{
var dgId = ui.draggable[0].getAttribute('id');
var dgOwner = dgId.substring(dgId.lastIndexOf("_C")+2,dgId.lastIndexOf(""));
var dpOwner = event.target.getAttribute('data-owner');
var eventFlag = ui.draggable[0].getAttribute('data-resize').split("|")[3];
if (dpOwner == null) dpOwner = dgOwner;
if (dpOwner == dgOwner )
{
that.dropEvent(ui.draggable[0].id, event.target.getAttribute('id').substring(event.target.getAttribute('id').lastIndexOf("drop_")+5, event.target.getAttribute('id').lastIndexOf("_O")),null,eventFlag);
}
else
{
jQuery(ui.draggable).draggable("option","revert",true);
}
},
},
/**
* Triggered when draggable calEvent is over a droppable calCell.
*
* @param {event} event
* @param {Object} ui
*/
over:function(event, ui)
{
var timeDemo = event.target.id.substring(event.target.id.lastIndexOf("T")+1,event.target.id.lastIndexOf("_O"));
var dgId = ui.draggable[0].getAttribute('id');
var dgOwner = dgId.substring(dgId.lastIndexOf("_C")+2,dgId.lastIndexOf(""));
var dpOwner = event.target.getAttribute('data-owner');
if (dpOwner == null) dpOwner = dgOwner;
if (dpOwner === dgOwner )
{
ui.helper[0].innerHTML = '<div class="calendar_d-n-d_timeCounter"><span>'+timeDemo+'</span></div>';
}
else
{
ui.helper[0].innerHTML = '<div class="calendar_d-n-d_forbiden"></div>';
}
}
});
/**
* Triggered when draggable calEvent is over a droppable calCell.
*
* @param {event} event
* @param {Object} ui
*/
over:function(event, ui)
{
var timeDemo = event.target.id.substring(event.target.id.lastIndexOf("T")+1,event.target.id.lastIndexOf("_O"));
var dgId = ui.draggable[0].getAttribute('id');
var dgOwner = dgId.substring(dgId.lastIndexOf("_C")+2,dgId.lastIndexOf(""));
var dpOwner = event.target.getAttribute('data-owner');
if (dpOwner == null) dpOwner = dgOwner;
if (dpOwner === dgOwner )
{
ui.helper[0].innerHTML = '<div class="calendar_d-n-d_timeCounter"><span>'+timeDemo+'</span></div>';
}
else
{
ui.helper[0].innerHTML = '<div class="calendar_d-n-d_forbiden"></div>';
}
}
});
//jQuery Calendar Event selector
jQuery("body")
var $iframeBody = jQuery("body")
//mouseover event handler for calendar tooltip
.on("mouseover", "div[data-tooltip]",function(){
var $ttp = jQuery(this);
@ -530,16 +530,15 @@ app.classes.calendar = AppJS.extend(
}
}
var eventInfo =
{
date: timestamp[0],
hour: timestamp[1],
minute: timestamp[2]
};
var eventInfo = {
date: timestamp[0],
hour: timestamp[1],
minute: timestamp[2]
};
if (typeof ownerId !='undefined' && ownerId != 0)
{
$j(eventInfo).extend(eventInfo,{owner: ownerId});
jQuery(eventInfo).extend(eventInfo,{owner: ownerId});
}
that.egw.open(null, 'calendar', 'add', eventInfo , '_blank');
@ -552,6 +551,74 @@ app.classes.calendar = AppJS.extend(
that.egw.open_link(link,'_blank',windowSize);
return false;
});
//******************************** Calendar Sortable ************************
// Calender current state
var state = this.getState();
if (state && state.view === "day"
&& typeof state.owner != 'undefined'
&& typeof state.owner == 'string' && state.owner.split(',').length > 1)
{
$iframeBody.find('#calendar_calDayCols')
.addClass('cal_is_sortable')
.css({"white-space":"nowrap"})
.children().each(function(){
// Change day view columns position in order to get sortable placeholder working
jQuery(this).css({position:"relative",display:"inline-block", left:"none"});
});
}
$iframeBody.find('.cal_is_sortable').sortable ({
cancel: "#divAppboxHeader, .calendar_calWeekNavHeader, .calendar_plannerHeader",
placeholder: "srotable_cal_wk_ph",
axis:"y",
revert: true,
helper:"clone",
create: function ()
{
var $sortItem = jQuery(this);
var options = {};
switch (state.view)
{
case "day":
options = {
placeholder:"srotable_cal_day_ph",
axis:"x"
};
$sortItem.sortable('option', options);
break;
case "week":
options = {
placeholder:"srotable_cal_wk_ph",
axis:"y"
};
$sortItem.sortable('option', options);
break;
default:
$sortItem.sortable('destroy');
}
},
start: function ()
{
$drag.draggable('disable');
$drop.droppable('disable');
},
stop: function ()
{
$drag.draggable('enable');
$drop.droppable('enable');
},
update: function ()
{
if (state && typeof state.owner !== 'undefined')
{
var sortedArr = jQuery(this).sortable('toArray', {attribute:"data-sortable-id"});
state.owner = sortedArr.join(',');
that.setState({state:state});
}
}
});
},
/**
@ -564,16 +631,16 @@ app.classes.calendar = AppJS.extend(
*/
resizeHelper: function(_X,_Y)
{
var drops = jQuery("div[id^='drop_']");
var $drops = jQuery("div[id^='drop_']");
var top = Math.round(_Y);
var left = Math.round(_X);
for (var i=0;i < drops.length;i++)
for (var i=0;i < $drops.length;i++)
{
if (top >= Math.round(drops[i].getBoundingClientRect().top)
&& top <= Math.round(drops[i].getBoundingClientRect().bottom)
&& left >= Math.round(drops[i].getBoundingClientRect().left)
&& left <= Math.round(drops[i].getBoundingClientRect().right))
return drops[i];
if (top >= Math.round($drops[i].getBoundingClientRect().top)
&& top <= Math.round($drops[i].getBoundingClientRect().bottom)
&& left >= Math.round($drops[i].getBoundingClientRect().left)
&& left <= Math.round($drops[i].getBoundingClientRect().right))
return $drops[i];
}
return false;
},

View File

@ -650,3 +650,19 @@ img.calendar_print_button, img.calendar_print_appicon {
height: 24px;
width: 24px;
}
/*Sortable views*/
.srotable_cal_wk_ph {
border: 2px dashed gray;
height: 230px;
width: 99%;
background-color: #ece2f7;
}
.srotable_cal_day_ph {
position: relative;
width: 33.333333%;
height: 99%;
border: 2px dashed gray;
background-color: #ece2f7;
display: inline-block;
}

View File

@ -11,7 +11,7 @@
* @package calendar
* @version $Id$
*/
/* $Id: app.css 48463 2014-09-04 13:37:46Z ralfbecker $ */
/* $Id: app.css 49287 2014-11-04 15:34:51Z hnategh $ */
/*Media print classes*/
@media print {
.th td,
@ -660,6 +660,21 @@ img.calendar_print_appicon {
height: 24px;
width: 24px;
}
/*Sortable views*/
.srotable_cal_wk_ph {
border: 2px dashed gray;
height: 230px;
width: 99%;
background-color: #ece2f7;
}
.srotable_cal_day_ph {
position: relative;
width: 33.333333%;
height: 99%;
border: 2px dashed gray;
background-color: #ece2f7;
display: inline-block;
}
/*generell*/
.egw_fw_content_browser_iframe img[src$="svg"] {
background-color: #828282 !important;
@ -1386,40 +1401,6 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
font-size: 8pt;
text-align: left;
}
/* contains (multiple) dayCol's
*/
.calendar_calDayCols,
.calendar_calDayCols12h,
.calendar_calDayColsNoGrid {
position: absolute;
top: 0px;
/* bottom: 0px; does NOT work in IE, IE needs height: 100%! */
height: 100%;
left: 45px;
right: 0px;
}
/* 12h timeformat with am/pm
*/
.calendar_calDayCols12h {
left: 65px;
}
/* no time grid --> no time column
*/
.calendar_calDayColsNoTime {
left: 0px;
}
/* contains (multiple) eventCol's
*/
.calendar_calDayCol {
position: absolute;
top: 0px;
height: 100%;
/* set via inline style on runtime:
* left:
* width:
*/
border-left: 1px solid silver;
}
/* Calendar Id #
*/
#calendar-edit_id:before {
@ -1452,9 +1433,6 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
.calendar_calGridHeader {
border: none;
}
.calendar_calDayColHeader img {
vertical-align: middle;
}
/*header for the weekCol*/
.calendar_calWeekNavHeader,
.calendar_calMonthNavHeader {

View File

@ -848,39 +848,6 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
text-align: left;
}
/* contains (multiple) dayCol's
*/
.calendar_calDayCols,.calendar_calDayCols12h,.calendar_calDayColsNoGrid{
position: absolute;
top: 0px;
/* bottom: 0px; does NOT work in IE, IE needs height: 100%! */
height: 100%;
left: 45px;
right: 0px;
}
/* 12h timeformat with am/pm
*/
.calendar_calDayCols12h{
left: 65px;
}
/* no time grid --> no time column
*/
.calendar_calDayColsNoTime{
left: 0px;
}
/* contains (multiple) eventCol's
*/
.calendar_calDayCol{
position: absolute;
top: 0px;
height: 100%;
/* set via inline style on runtime:
* left:
* width:
*/
border-left: 1px solid silver;
}
/* Calendar Id #
*/
#calendar-edit_id:before { content:"#"}
@ -915,10 +882,6 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
.calendar_calGridHeader{ border: none; }
.calendar_calDayColHeader img {
vertical-align: middle;
}
/*header for the weekCol*/
.calendar_calWeekNavHeader,.calendar_calMonthNavHeader{