Close event new/edit dialog when clicking outside the dialog
This commit is contained in:
Bart Visscher
parent
2353f02d9a
commit
0fde26c86c
6 changed files with 77 additions and 100 deletions
|
|
@ -62,3 +62,9 @@
|
|||
.event_popup {width: 280px; height: 40px; padding: 10px;}
|
||||
|
||||
input[type="button"].active {color: #0098E4}
|
||||
#fromtime, #totime {
|
||||
color:#333;
|
||||
}
|
||||
#fromtime.disabled, #totime.disabled {
|
||||
color:#A9A9A9;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -274,18 +274,52 @@ Calendar={
|
|||
.data('event_info', event)
|
||||
.hover(this.createEventPopup,
|
||||
this.hideEventPopup)
|
||||
.click(this.editEventPopup);
|
||||
.click(this.editEvent);
|
||||
eventcontainer.append(event_holder);
|
||||
},
|
||||
editEventPopup:function(event){
|
||||
newEvent:function(selector, time){
|
||||
var date_info = $(selector).data('date_info');
|
||||
var dayofmonth = date_info.getDate();
|
||||
var month = date_info.getMonth();
|
||||
var year = date_info.getFullYear();
|
||||
if(dayofmonth <= 9){
|
||||
dayofmonth = '0' + dayofmonth;
|
||||
}
|
||||
month++;
|
||||
if(month <= 9){
|
||||
month = '0' + month;
|
||||
}
|
||||
var date = String(dayofmonth) + String(month) + String(year);
|
||||
if($('#event').dialog('isOpen') == true){
|
||||
// TODO: save event
|
||||
$('#event').dialog('destroy').remove();
|
||||
}else{
|
||||
$('#dialog_holder').load(oc_webroot + '/apps/calendar/ajax/neweventform.php?d=' + date + '&t=' + time, function(){
|
||||
$('#event').dialog({
|
||||
width : 500,
|
||||
close : function(event, ui) {
|
||||
$(this).dialog('destroy').remove();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
editEvent:function(event){
|
||||
event.stopPropagation();
|
||||
var event_data = $(this).data('event_info');
|
||||
var id = event_data.id;
|
||||
if(oc_cal_opendialog == 0){
|
||||
$("#dialog_holder").load(oc_webroot + "/apps/calendar/ajax/editeventform.php?id="+id);
|
||||
oc_cal_opendialog = 1;
|
||||
if($('#event').dialog('isOpen') == true){
|
||||
// TODO: save event
|
||||
$('#event').dialog('destroy').remove();
|
||||
}else{
|
||||
alert(t("calendar", "You can't open more than one dialog per site!"));
|
||||
$('#dialog_holder').load(oc_webroot + '/apps/calendar/ajax/editeventform.php?id=' + id, function(){
|
||||
$('#event').dialog({
|
||||
width : 500,
|
||||
close : function(event, ui) {
|
||||
$(this).dialog('destroy').remove();
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
createEventPopup:function(e){
|
||||
|
|
@ -334,6 +368,19 @@ Calendar={
|
|||
Calendar.Date.current = new Date();
|
||||
Calendar.UI.updateView();
|
||||
},
|
||||
lockTime:function(){
|
||||
if($('#allday_checkbox').is(':checked')) {
|
||||
$("#fromtime").attr('disabled', true)
|
||||
.addClass('disabled');
|
||||
$("#totime").attr('disabled', true)
|
||||
.addClass('disabled');
|
||||
} else {
|
||||
$("#fromtime").attr('disabled', false)
|
||||
.removeClass('disabled');
|
||||
$("#totime").attr('disabled', false)
|
||||
.removeClass('disabled');
|
||||
}
|
||||
},
|
||||
Calendar:{
|
||||
overview:function(){
|
||||
if(oc_cal_opendialog == 0){
|
||||
|
|
@ -756,26 +803,6 @@ $(document).ready(function(){
|
|||
Calendar.UI.loadEvents();
|
||||
|
||||
var oc_cal_opendialog = 0;
|
||||
function oc_cal_newevent(selector, time){
|
||||
var date_info = $(selector).data('date_info');
|
||||
var dayofmonth = date_info.getDate();
|
||||
var month = date_info.getMonth();
|
||||
var year = date_info.getFullYear();
|
||||
if(dayofmonth <= 9){
|
||||
dayofmonth = "0" + dayofmonth;
|
||||
}
|
||||
month++;
|
||||
if(month <= 9){
|
||||
month = "0" + month;
|
||||
}
|
||||
var date = String(dayofmonth) + String(month) + String(year);
|
||||
if(oc_cal_opendialog == 0){
|
||||
$("#dialog_holder").load(oc_webroot + "/apps/calendar/ajax/neweventform.php?d=" + date + "&t=" + time);
|
||||
oc_cal_opendialog = 1;
|
||||
}else{
|
||||
alert(t("calendar", "You can't open more than one dialog per site!"));
|
||||
}
|
||||
}
|
||||
|
||||
function validate_event_form(url){
|
||||
var post = $( "#event_form" ).serialize();
|
||||
|
|
|
|||
|
|
@ -71,14 +71,14 @@ $weekdays = array('monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'satur
|
|||
<thead>
|
||||
<tr>
|
||||
<th class="calendar_time"><?php echo $l->t("Time");?></th>
|
||||
<th id="onedayview_today" class="calendar_row" onclick="oc_cal_newevent('#onedayview_today');"></th>
|
||||
<th id="onedayview_today" class="calendar_row" onclick="Calendar.UI.newEvent('#onedayview_today');"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach($hours as $time => $time_label): ?>
|
||||
<tr>
|
||||
<td class="calendar_time"><?php echo $time_label ?></td>
|
||||
<td class="calendar_row <?php echo $time ?>" onclick="oc_cal_newevent('#onedayview_today', '<?php echo $time ?>');"></td>
|
||||
<td class="calendar_row <?php echo $time ?>" onclick="Calendar.UI.newEvent('#onedayview_today', '<?php echo $time ?>');"></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
|
|
@ -90,7 +90,7 @@ $weekdays = array('monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'satur
|
|||
<tr>
|
||||
<th class="calendar_time"><?php echo $l->t("Time");?></th>
|
||||
<?php foreach($weekdays as $weekdaynr => $weekday): ?>
|
||||
<th class="calendar_row <?php echo $weekday ?> <?php echo $weekdaynr > 4 ? 'weekend_thead' : '' ?>" onclick="oc_cal_newevent('#oneweekview th.<?php echo $weekday ?>');"></th>
|
||||
<th class="calendar_row <?php echo $weekday ?> <?php echo $weekdaynr > 4 ? 'weekend_thead' : '' ?>" onclick="Calendar.UI.newEvent('#oneweekview th.<?php echo $weekday ?>');"></th>
|
||||
<?php endforeach; ?>
|
||||
</tr>
|
||||
</thead>
|
||||
|
|
@ -99,7 +99,7 @@ $weekdays = array('monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'satur
|
|||
<tr>
|
||||
<td class="calendar_time"><?php echo $time_label?></td>
|
||||
<?php foreach($weekdays as $weekdaynr => $weekday): ?>
|
||||
<td class="<?php echo $weekday ?> <?php echo $time ?> calendar_row <?php echo $weekdaynr > 4 ? 'weekend_row' : '' ?>" onclick="oc_cal_newevent('#oneweekview th.<?php echo $weekday ?>', '<?php echo $time ?>');"></td>
|
||||
<td class="<?php echo $weekday ?> <?php echo $time ?> calendar_row <?php echo $weekdaynr > 4 ? 'weekend_row' : '' ?>" onclick="Calendar.UI.newEvent('#oneweekview th.<?php echo $weekday ?>', '<?php echo $time ?>');"></td>
|
||||
<?php endforeach; ?>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
|
|
@ -121,7 +121,7 @@ $weekdays = array('monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'satur
|
|||
<tr class="week_<?php echo $week ?>">
|
||||
<td class="calw"></td>
|
||||
<?php foreach($weekdays as $weekdaynr => $weekday): ?>
|
||||
<td class="day <?php echo $weekday ?> <?php echo $weekdaynr > 4 ? 'weekend' : '' ?>" onclick="oc_cal_newevent('#fourweeksview .week_<?php echo $week ?> .<?php echo $weekday ?>')">
|
||||
<td class="day <?php echo $weekday ?> <?php echo $weekdaynr > 4 ? 'weekend' : '' ?>" onclick="Calendar.UI.newEvent('#fourweeksview .week_<?php echo $week ?> .<?php echo $weekday ?>')">
|
||||
<div class="dateinfo"></div>
|
||||
<div class="events"></div>
|
||||
</td>
|
||||
|
|
@ -144,7 +144,7 @@ $weekdays = array('monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'satur
|
|||
<?php foreach(range(1, 6) as $week): ?>
|
||||
<tr class="week_<?php echo $week ?>">
|
||||
<?php foreach($weekdays as $weekdaynr => $weekday): ?>
|
||||
<td class="day <?php echo $weekday ?> <?php echo $weekdaynr > 4 ? 'weekend' : '' ?>" onclick="oc_cal_newevent('#onemonthview .week_<?php echo $week ?> .<?php echo $weekday ?>')">
|
||||
<td class="day <?php echo $weekday ?> <?php echo $weekdaynr > 4 ? 'weekend' : '' ?>" onclick="Calendar.UI.newEvent('#onemonthview .week_<?php echo $week ?> .<?php echo $weekday ?>')">
|
||||
<div class="dateinfo"></div>
|
||||
<div class="events"></div>
|
||||
</td>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="editevent" title="<?php echo $l->t("Edit an event");?>">
|
||||
<div id="event" title="<?php echo $l->t("Edit an event");?>">
|
||||
<form id="event_form">
|
||||
<input type="hidden" name="id" value="<?php echo $_['id'] ?>">
|
||||
<?php echo $this->inc("part.eventform"); ?>
|
||||
|
|
@ -8,35 +8,3 @@
|
|||
</span>
|
||||
</form>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$( "#editevent" ).dialog({
|
||||
width : 500,
|
||||
close : function() {
|
||||
oc_cal_opendialog = 0;
|
||||
var lastchild = document.getElementById("body-user").lastChild
|
||||
while(lastchild.id != "lightbox"){
|
||||
document.getElementById("body-user").removeChild(lastchild);
|
||||
lastchild = document.getElementById("body-user").lastChild;
|
||||
}
|
||||
}
|
||||
});
|
||||
$( "#from" ).datepicker({
|
||||
dateFormat : 'dd-mm-yy'
|
||||
});
|
||||
$( "#to" ).datepicker({
|
||||
dateFormat : 'dd-mm-yy'
|
||||
});
|
||||
function lock_time() {
|
||||
if(document.getElementById("totime").disabled == true) {
|
||||
document.getElementById("fromtime").disabled = false;
|
||||
document.getElementById("totime").disabled = false;
|
||||
$("#fromtime").css('color', "#333");
|
||||
$("#totime").css('color', "#333");
|
||||
} else {
|
||||
document.getElementById("fromtime").disabled = true;
|
||||
document.getElementById("totime").disabled = true;
|
||||
$("#fromtime").css('color', "#A9A9A9");
|
||||
$("#totime").css('color', "#A9A9A9");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -39,8 +39,7 @@
|
|||
<tr>
|
||||
<th width="75px"></th>
|
||||
<td>
|
||||
<input onclick="lock_time();" type="checkbox"<?php if($_['allday']){echo 'checked="checked"';} ?> id="allday_checkbox" name="allday">
|
||||
<?php if($_['allday']){echo '<script type="text/javascript">document.getElementById("fromtime").disabled = true;document.getElementById("totime").disabled = true;document.getElementById("fromtime").style.color = "#A9A9A9";document.getElementById("totime").style.color = "#A9A9A9";</script>';}?>
|
||||
<input onclick="Calendar.UI.lockTime();" type="checkbox"<?php if($_['allday']){echo 'checked="checked"';} ?> id="allday_checkbox" name="allday">
|
||||
<label for="allday_checkbox"><?php echo $l->t("All Day Event");?></label></td>
|
||||
</tr>
|
||||
<tr>
|
||||
|
|
@ -86,3 +85,12 @@
|
|||
<td><textarea style="width:350px;height: 150px;" placeholder="<?php echo $l->t("Description of the Event");?>" name="description"><?php echo $_['description'] ?></textarea></td>
|
||||
</tr>
|
||||
</table>
|
||||
<script type="text/javascript">
|
||||
Calendar.UI.lockTime();
|
||||
$( "#from" ).datepicker({
|
||||
dateFormat : 'dd-mm-yy'
|
||||
});
|
||||
$( "#to" ).datepicker({
|
||||
dateFormat : 'dd-mm-yy'
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="newevent" title="<?php echo $l->t("Create a new event");?>">
|
||||
<div id="event" title="<?php echo $l->t("Create a new event");?>">
|
||||
<form id="event_form">
|
||||
<?php echo $this->inc("part.eventform"); ?>
|
||||
<div style="width: 100%;text-align: center;color: #FF1D1D;" id="errorbox"></div>
|
||||
|
|
@ -7,35 +7,3 @@
|
|||
</span>
|
||||
</form>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$("#newevent").dialog({
|
||||
width : 500,
|
||||
close : function() {
|
||||
oc_cal_opendialog = 0;
|
||||
var lastchild = document.getElementById("body-user").lastChild
|
||||
while(lastchild.id != "lightbox"){
|
||||
document.getElementById("body-user").removeChild(lastchild);
|
||||
lastchild = document.getElementById("body-user").lastChild;
|
||||
}
|
||||
}
|
||||
});
|
||||
$( "#from" ).datepicker({
|
||||
dateFormat : 'dd-mm-yy'
|
||||
});
|
||||
$( "#to" ).datepicker({
|
||||
dateFormat : 'dd-mm-yy'
|
||||
});
|
||||
function lock_time() {
|
||||
if(document.getElementById("totime").disabled == true) {
|
||||
document.getElementById("fromtime").disabled = false;
|
||||
document.getElementById("totime").disabled = false;
|
||||
$("#fromtime").css('color', "#333");
|
||||
$("#totime").css('color', "#333");
|
||||
} else {
|
||||
document.getElementById("fromtime").disabled = true;
|
||||
document.getElementById("totime").disabled = true;
|
||||
$("#fromtime").css('color', "#A9A9A9");
|
||||
$("#totime").css('color', "#A9A9A9");
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in a new issue