Jump to content
neophron

Calendar function with four stages

Recommended Posts

Hi,

I'm looking for a calendar solution. It should be like this: http://www.graalmueritz.net/plan-aurum.php

The important part is, that the calendar should show 4 different stages:
1. free
2. arrival
3. departure
4. occupied
and the actual date.

This is for a german website. The client wants to manage the calendar be themself.

I need detailed offers/estimations in €.

 

thank you, Nikolai

 

Bildschirmfoto 2019-03-29 um 13.56.43.jpg

Share this post


Link to post
Share on other sites

  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By HerzBlut
      Hello, 
      I'm looking for a developer to write me an extension for "https://modules.processwire.com/modules/process-graph-ql/". It's about Custom Fields (Repeater and Pro Repeater Matrix). So that I can connect and read them via GraphQL with React. It must be possible to read the different fields of the matrix and get their type (e.g. news, slider, blog etc.).
      If you are interested just leave Skype or e-mail. I am looking forward to possible inquiries
    • By VeiJari
      Hello forum! 
      Our customer wants to choose only 15 minute intervals in the inputfield Datetime. So the dropdown values would be: 0, 15, 30 and 45.
      Is there an easy way to achieve this?
      Any help is appreciated 🙂
    • By flashmaster
      Hi, i need some help with a calendar script (Full Calendar)
      Issue 1
      Its not saving to the database. This function dont work either when the script is running alone outside Processwire.
      Issue 2 (Fixed)
      When i click to ad an event and click save it wont turn up in blue, it just disapear. This function works when the script is running alone outside Processwire.
      ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
      I have attached the script running alone so you can se how it works. I have also pasted the code below that im trying to work under the template folder inside Processwire. If you can look at the code and se whats wrong with it. Im not that good at PHP or Javascript so i need you help.

      demo
      http://demos.phplift.net/jquery-fullcalendar-integration-bootstrap-php-mysql/
       
      home.php
      <?php include( "database.php" ); if ( isset( $_POST[ 'action' ] )or isset( $_GET[ 'view' ] ) ) //show all events { if ( isset( $_GET[ 'view' ] ) ) { header( 'Content-Type: application/json' ); $start = mysqli_real_escape_string( $connection, $_GET[ "start" ] ); $end = mysqli_real_escape_string( $connection, $_GET[ "end" ] ); $result = mysqli_query( $connection, "SELECT id, start ,end ,title FROM events where (date(start) >= ‘$start’ AND date(start) <= ‘$end’)" ); while ( $row = mysqli_fetch_assoc( $result ) ) { $events[] = $row; } echo json_encode( $events ); exit; } elseif ( $_POST[ 'action' ] == "add" ) // add new event section { mysqli_query( $connection, "INSERT INTO events ( title , start , end ) VALUES ( '" . mysqli_real_escape_string( $connection, $_POST[ "title" ] ) . "', '" . mysqli_real_escape_string( $connection, date( 'Y-m-d H:i:s', strtotime( $_POST[ "start" ] ) ) ) . "‘, '" . mysqli_real_escape_string( $connection, date( 'Y-m-d H:i:s', strtotime( $_POST[ "end" ] ) ) ) . "‘ )" ); header( 'Content-Type: application/json' ); echo '{"id":"' . mysqli_insert_id( $connection ) . '"}'; exit; } elseif ( $_POST[ 'action' ] == "update" ) // update event { mysqli_query( $connection, "UPDATE events set start = '" . mysqli_real_escape_string( $connection, date( 'Y-m-d H:i:s', strtotime( $_POST[ "start" ] ) ) ) . "', end = '" . mysqli_real_escape_string( $connection, date( 'Y-m-d H:i:s', strtotime( $_POST[ "end" ] ) ) ) . "' where id = '" . mysqli_real_escape_string( $connection, $_POST[ "id" ] ) . "'" ); exit; } elseif ( $_POST[ 'action' ] == "delete" ) // remove event { mysqli_query( $connection, "DELETE from events where id = '" . mysqli_real_escape_string( $connection, $_POST[ "id" ] ) . "'" ); if ( mysqli_affected_rows( $connection ) > 0 ) { echo "1"; } exit; } } ?> <!doctype html> <html lang="sv-se"> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/> <style type="text/css"> img { border-width: 0 } * { font-family: 'Lucida Grande', sans-serif; } </style> <style type="text/css"> .block a:hover { color: silver; } .block a { color: #fff; } .block { position: fixed; background: #2184cd; padding: 20px; z-index: 1; top: 240px; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> <script src="<?=$config->urls->templates;?>js/script.js" type="text/javascript"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" crossorigin="anonymous"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"> <link href="<?=$config->urls->templates;?>css/fullcalendar.css" rel="stylesheet"/> <link href="<?=$config->urls->templates;?>css/fullcalendar.print.css" rel="stylesheet" media="print"/> <script src="<?=$config->urls->templates;?>js/moment.min.js"></script> <script src="<?=$config->urls->templates;?>js/fullcalendar.js"></script> </head> <body> <div class="container">fsefsefes <div class="row"> <div id="calendar"></div> </div> </div> <!-- Modal --> <div id="createEventModal" class="modal fade" role="dialog"> <div class="modal-dialog"> <!-- Modal content--> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">Add Event</h4> </div> <div class="modal-body"> <div class="control-group"> <label class="control-label" for="inputPatient">Event:</label> <div class="field desc"> <input class="form-control" id="title" name="title" placeholder="Event" type="text" value=""> </div> </div> <input type="hidden" id="startTime"/> <input type="hidden" id="endTime"/> <div class="control-group"> <label class="control-label" for="when">When:</label> <div class="controls controls-row" id="when" style="margin-top:5px;"> </div> </div> </div> <div class="modal-footer"> <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button> <button type="submit" class="btn btn-primary" id="submitButton">Save</button> </div> </div> </div> </div> <div id="calendarModal" class="modal fade"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal">&times;</button> <h4 class="modal-title">Event Details</h4> </div> <div id="modalBody" class="modal-body"> <h4 id="modalTitle" class="modal-title"></h4> <div id="modalWhen" style="margin-top:5px;"></div> </div> <input type="hidden" id="eventID"/> <div class="modal-footer"> <button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button> <button type="submit" class="btn btn-danger" id="deleteButton">Delete</button> </div> </div> </div> </div> <!--Modal--> <div style='margin-left: auto;margin-right: auto;text-align: center;'> </div> </body> </html>  
      database.php (i have configure this in my file at localhost) this is just an example.
      <?php $connection = mysqli_connect('host','username','password','database') or die(mysqli_error($connection)); ?>  
      js/script.js
      $(document).ready(function(){ var calendar = $('#calendar').fullCalendar({ header:{ left: 'prev,next today', center: 'title', right: 'agendaWeek,agendaDay' }, defaultView: 'agendaWeek', editable: true, selectable: true, allDaySlot: false, events: "home.php?view=1", eventClick: function(event, jsEvent, view) { endtime = $.fullCalendar.moment(event.end).format('h:mm'); starttime = $.fullCalendar.moment(event.start).format('dddd, MMMM Do YYYY, h:mm'); var mywhen = starttime + ' - ' + endtime; $('#modalTitle').html(event.title); $('#modalWhen').text(mywhen); $('#eventID').val(event.id); $('#calendarModal').modal(); }, //header and other values select: function(start, end, jsEvent) { endtime = $.fullCalendar.moment(end).format('h:mm'); starttime = $.fullCalendar.moment(start).format('dddd, MMMM Do YYYY, h:mm'); var mywhen = starttime + ' - ' + endtime; start = moment(start).format(); end = moment(end).format(); $('#createEventModal #startTime').val(start); $('#createEventModal #endTime').val(end); $('#createEventModal #when').text(mywhen); $('#createEventModal').modal('toggle'); }, eventDrop: function(event, delta){ $.ajax({ url: 'home.php', data: 'action=update&title='+event.title+'&start='+moment(event.start).format()+'&end='+moment(event.end).format()+'&id='+event.id , type: "POST", success: function(json) { //alert(json); } }); }, eventResize: function(event) { $.ajax({ url: 'home.php', data: 'action=update&title='+event.title+'&start='+moment(event.start).format()+'&end='+moment(event.end).format()+'&id='+event.id, type: "POST", success: function(json) { //alert(json); } }); } }); $('#submitButton').on('click', function(e){ // We don't want this to act as a link so cancel the link action e.preventDefault(); doSubmit(); }); $('#deleteButton').on('click', function(e){ // We don't want this to act as a link so cancel the link action e.preventDefault(); doDelete(); }); function doDelete(){ $("#calendarModal").modal('hide'); var eventID = $('#eventID').val(); $.ajax({ url: 'home.php', data: 'action=delete&id='+eventID, type: "POST", success: function(json) { if(json == 1) $("#calendar").fullCalendar('removeEvents',eventID); else return false; } }); } function doSubmit(){ $("#createEventModal").modal('hide'); var title = $('#title').val(); var startTime = $('#startTime').val(); var endTime = $('#endTime').val(); $.ajax({ url: 'home.php', data: 'action=add&title='+title+'&start='+startTime+'&end='+endTime, type: "POST", success: function(json) { $("#calendar").fullCalendar('renderEvent', { id: json.id, title: title, start: startTime, end: endTime, }, true); } }); } });  
      database table
      CREATE TABLE events ( id int(11) NOT NULL AUTO_INCREMENT, start datetime DEFAULT NULL, end datetime DEFAULT NULL, title text, PRIMARY KEY (id) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=1 ;  
      fullcalendar.rar

    • By Livius
      Hello dear Processwire Users
      I am still fairly new to Process Wire and I've been looking for a Calendar solution on my Website.
      I wonder what other PCW Users use for their websites as i have found no Module for a Basic Calendar which I could use.
      I have heard that most Websites simply use the Google Calendar but i don't know if that is true.
      I thought that a solution that includes the PCW Backend would be pretty neat
      Thank you in advance!
    • By joshuag
      Introducing our newest [commercial] module:
      Recurme
      Processwire Recurring Dates Field & Custom Calendar Module.
      http://www.99lime.com/modules/recurme/
      One Field to Recur them ALL…
      A Recurring Dates InputField for your Processwire templates. The InputField you’ve been waiting for.
      Complex RRule date repeating in a simple and fast user interface.
      Use the super simple, & powerful API to output them into your templates.
      example:
      <? // easy to get recurring events $events = $recurme->find(); // events for this day $events = $recurme->day(); // events for this week $events = $recurme->week(); // events for this month $events = $recurme->month(); ?> <? // Loop through your events foreach($events as $event){ echo $event->title; echo $event->start_date; echo $event->rrule; echo $event->original->url; ... } ?> Unlimited Custom Calendars.
      Imagine you could create any calendar you wanted on your website. Use recurring events with the Recurme field, or use your own Processwire pages and date fields to render calendars… it’s up to you. Fully customizable. Make as many calendars as you like. Get events from anywhere. Recurme does all the hard date work for you.
      Unlimited Custom Admin Calendars too.
      Hope you like it  ,
       Joshua & Eduardo from 99Lime.
       





       
      ## [1.0.1] - 2017-05-29
      ### changed
      - Fixed $options[weekStartDay] offset in Calendar
      - Fixed ->renderCalendar() Blank Days
      - Fixed missing ->renderList() [renderMonth][xAfter]
      - Removed ->renderCalendar() <table> attributes border, border-spacing
      - Fixed ->renderCalendar() excluded dates
      - Fixed rrule-giu.js exclude dates
      - Fixed ->renderList missing space in attr ID
      (shout out to @Juergen for multiple suggestions & feedback).
×
×
  • Create New...