diff options
author | Mario <mario@mariovavti.com> | 2023-01-25 13:08:05 +0000 |
---|---|---|
committer | Mario <mario@mariovavti.com> | 2023-01-25 13:08:05 +0000 |
commit | 08e925758e920b898ac2d08710eab2f9638fe276 (patch) | |
tree | fed0f7b2ee8251c6534d446b3166096889c9aeb3 /library/fullcalendar/examples/external-dragging-builtin.html | |
parent | 213c8a6eeccc16c34d3a34229a810bd213837c56 (diff) | |
download | volse-hubzilla-08e925758e920b898ac2d08710eab2f9638fe276.tar.gz volse-hubzilla-08e925758e920b898ac2d08710eab2f9638fe276.tar.bz2 volse-hubzilla-08e925758e920b898ac2d08710eab2f9638fe276.zip |
update fullcalendar library
Diffstat (limited to 'library/fullcalendar/examples/external-dragging-builtin.html')
-rw-r--r-- | library/fullcalendar/examples/external-dragging-builtin.html | 68 |
1 files changed, 34 insertions, 34 deletions
diff --git a/library/fullcalendar/examples/external-dragging-builtin.html b/library/fullcalendar/examples/external-dragging-builtin.html index f9471b0ef..78fcd89f9 100644 --- a/library/fullcalendar/examples/external-dragging-builtin.html +++ b/library/fullcalendar/examples/external-dragging-builtin.html @@ -2,26 +2,16 @@ <html> <head> <meta charset='utf-8' /> -<link href='../packages/core/main.css' rel='stylesheet' /> -<link href='../packages/daygrid/main.css' rel='stylesheet' /> -<link href='../packages/timegrid/main.css' rel='stylesheet' /> -<link href='../packages/list/main.css' rel='stylesheet' /> -<script src='../packages/core/main.js'></script> -<script src='../packages/interaction/main.js'></script> -<script src='../packages/daygrid/main.js'></script> -<script src='../packages/timegrid/main.js'></script> -<script src='../packages/list/main.js'></script> +<script src='../dist/index.global.js'></script> <script> document.addEventListener('DOMContentLoaded', function() { - var Calendar = FullCalendar.Calendar; - var Draggable = FullCalendarInteraction.Draggable /* initialize the external events -----------------------------------------------------------------*/ var containerEl = document.getElementById('external-events-list'); - new Draggable(containerEl, { + new FullCalendar.Draggable(containerEl, { itemSelector: '.fc-event', eventData: function(eventEl) { return { @@ -36,7 +26,7 @@ // containerEl.querySelectorAll('.fc-event') // ); // eventEls.forEach(function(eventEl) { - // new Draggable(eventEl, { + // new FullCalendar.Draggable(eventEl, { // eventData: { // title: eventEl.innerText.trim(), // } @@ -47,9 +37,8 @@ -----------------------------------------------------------------*/ var calendarEl = document.getElementById('calendar'); - var calendar = new Calendar(calendarEl, { - plugins: [ 'interaction', 'dayGrid', 'timeGrid', 'list' ], - header: { + var calendar = new FullCalendar.Calendar(calendarEl, { + headerToolbar: { left: 'prev,next today', center: 'title', right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek' @@ -77,13 +66,10 @@ font-family: Arial, Helvetica Neue, Helvetica, sans-serif; } - #wrap { - width: 1100px; - margin: 0 auto; - } - #external-events { - float: left; + position: fixed; + left: 20px; + top: 20px; width: 150px; padding: 0 10px; border: 1px solid #ccc; @@ -98,8 +84,8 @@ } #external-events .fc-event { - margin: 10px 0; - cursor: pointer; + margin: 3px 0; + cursor: move; } #external-events p { @@ -113,9 +99,13 @@ vertical-align: middle; } + #calendar-wrap { + margin-left: 200px; + } + #calendar { - float: right; - width: 900px; + max-width: 1100px; + margin: 0 auto; } </style> @@ -127,11 +117,21 @@ <h4>Draggable Events</h4> <div id='external-events-list'> - <div class='fc-event'>My Event 1</div> - <div class='fc-event'>My Event 2</div> - <div class='fc-event'>My Event 3</div> - <div class='fc-event'>My Event 4</div> - <div class='fc-event'>My Event 5</div> + <div class='fc-event fc-h-event fc-daygrid-event fc-daygrid-block-event'> + <div class='fc-event-main'>My Event 1</div> + </div> + <div class='fc-event fc-h-event fc-daygrid-event fc-daygrid-block-event'> + <div class='fc-event-main'>My Event 2</div> + </div> + <div class='fc-event fc-h-event fc-daygrid-event fc-daygrid-block-event'> + <div class='fc-event-main'>My Event 3</div> + </div> + <div class='fc-event fc-h-event fc-daygrid-event fc-daygrid-block-event'> + <div class='fc-event-main'>My Event 4</div> + </div> + <div class='fc-event fc-h-event fc-daygrid-event fc-daygrid-block-event'> + <div class='fc-event-main'>My Event 5</div> + </div> </div> <p> @@ -140,9 +140,9 @@ </p> </div> - <div id='calendar'></div> - - <div style='clear:both'></div> + <div id='calendar-wrap'> + <div id='calendar'></div> + </div> </div> </body> |