harukin/core
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

various calendar UI improvements: make day- and weeknumbers clickable for navigation, hide start and end time fields in month view (only allday events can be generated there), remove the action arg from changeView().

Browse Source 
;


(cherry picked from commit 4f705fc3f8)
This commit is contained in:
Mario Vavti 2019-06-20 16:27:46 +00:00 committed by Mario
parent 028cbdcffa
commit 2fa788b01b
1 changed files with 31 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
view/tpl/cdav_calendar.tpl
View File

@ -39,6 +39,19 @@ $(document).ready(function() {
defaultView: default_view, defaultView: default_view,
defaultDate: default_date, defaultDate: default_date,
weekNumbers: true,
navLinks: true,
navLinkDayClick: function(date, jsEvent) {
calendar.gotoDate( date );
changeView('timeGridDay');
},
navLinkWeekClick: function(date, jsEvent) {
calendar.gotoDate( date );
changeView('timeGridWeek');
},
monthNames: aStr['monthNames'], monthNames: aStr['monthNames'],
monthNamesShort: aStr['monthNamesShort'], monthNamesShort: aStr['monthNamesShort'],
dayNames: aStr['dayNames'], dayNames: aStr['dayNames'],
@ -183,7 +196,6 @@ $(document).ready(function() {
}, },
eventResize: function(info) { eventResize: function(info) {
console.log(info);
var event = info.event._def; var event = info.event._def;
var dtstart = new Date(info.event._instance.range.start); var dtstart = new Date(info.event._instance.range.start);
@ -352,13 +364,24 @@ $(document).ready(function() {
else else
$('#event_submit').html('{{$update}}'); $('#event_submit').html('{{$update}}');
} }
if(default_view === 'dayGridMonth');
$('#id_dtstart_wrapper, #id_dtend_wrapper').hide();
}); });
function changeView(action, viewName) { function changeView(viewName) {
calendar.changeView(viewName); calendar.changeView(viewName);
$('#title').text(calendar.view.title); $('#title').text(calendar.view.title);
$('#view_selector').html(views[calendar.view.type]); $('#view_selector').html(views[calendar.view.type]);
if(viewName === 'dayGridMonth') {
$('#id_dtstart_wrapper, #id_dtend_wrapper').hide();
}
else {
$('#id_dtstart_wrapper, #id_dtend_wrapper').show();
}
return; return;
} }
@ -538,13 +561,13 @@ function exportDate() {
<div class="dropdown"> <div class="dropdown">
<button id="view_selector" type="button" class="btn btn-outline-secondary btn-sm dropdown-toggle" data-toggle="dropdown"></button> <button id="view_selector" type="button" class="btn btn-outline-secondary btn-sm dropdown-toggle" data-toggle="dropdown"></button>
<div class="dropdown-menu"> <div class="dropdown-menu">
<a class="dropdown-item" href="#" onclick="changeView('changeView', 'dayGridMonth'); return false;">{{$month}}</a></li> <a class="dropdown-item" href="#" onclick="changeView('dayGridMonth'); return false;">{{$month}}</a></li>
<a class="dropdown-item" href="#" onclick="changeView('changeView', 'timeGridWeek'); return false;">{{$week}}</a></li> <a class="dropdown-item" href="#" onclick="changeView('timeGridWeek'); return false;">{{$week}}</a></li>
<a class="dropdown-item" href="#" onclick="changeView('changeView', 'timeGridDay'); return false;">{{$day}}</a></li> <a class="dropdown-item" href="#" onclick="changeView('timeGridDay'); return false;">{{$day}}</a></li>
<div class="dropdown-divider"></div> <div class="dropdown-divider"></div>
<a class="dropdown-item" href="#" onclick="changeView('changeView', 'listMonth'); return false;">{{$list_month}}</a></li> <a class="dropdown-item" href="#" onclick="changeView('listMonth'); return false;">{{$list_month}}</a></li>
<a class="dropdown-item" href="#" onclick="changeView('changeView', 'listWeek'); return false;">{{$list_week}}</a></li> <a class="dropdown-item" href="#" onclick="changeView('listWeek'); return false;">{{$list_week}}</a></li>
<a class="dropdown-item" href="#" onclick="changeView('changeView', 'listDay'); return false;">{{$list_day}}</a></li> <a class="dropdown-item" href="#" onclick="changeView('listDay'); return false;">{{$list_day}}</a></li>
</div> </div>
<div class="btn-group"> <div class="btn-group">
<button id="prev-btn" class="btn btn-outline-secondary btn-sm" title="{{$prev}}"><i class="fa fa-backward"></i></button> <button id="prev-btn" class="btn btn-outline-secondary btn-sm" title="{{$prev}}"><i class="fa fa-backward"></i></button>