PHP + Javascript Event Calendar

Recently there was a need to create a calendar of events, where each date in the calendar will be highlighted with a link if any event is present for each number. If I’m allowed to leave a link, here’s a demonstration of how the calendar works .

The task seems to be not complicated, but among the few solutions on the Internet I did not find the right one for the following reasons: too complicated and incomprehensible code, slow queries to the database (this is especially felt if there are many records in the database), using the jQuery library to which I belong not very good.

So, the advantages of my calendar include the following:
')

1. All code is placed in 200 lines and consists of one file, which is connected via include
2. The script consists of pure php + javascript without using the jQuery library
3. Simple and optimized database queries are used.
4. The next (previous) month is loaded via AJAX

Now everything is in order.

Logics

The calendar is generated by php for the current month. For each day, we check if there are any records in the database, if any, we form a link to the event. We add the javascript code for browsing months that accesses the script via ajax. The task is complicated by the fact that events are stretched in time, that is, they begin in one day and end in a few days or even months. On the entire time span, the existence of the event should be highlighted with a link for each day.

We generate a calendar for PHP

<?php //,      .  ,   . if (isset($_REQUEST['date'])) { //,     ... $pattern = "/^([0-9]{4})-([0-9]{2})-([0-9]{2})$/"; if (preg_match($pattern, $_REQUEST['date'])) { $date = $_REQUEST['date']; } else { die(' '); } } else { $date=date("Ymd"); } $sd = explode("-", $date); $year = $sd[0]; $month = $sd[1]; $day = $sd[2]; //       $dayofmonth = date('t', mktime(0, 0, 0, $month, 1, $year)); //    $todate = "$year-$month-$dayofmonth"; $fromdate = "$year-$month-01"; $query = "SELECT date,enddate from sobytia WHERE startdate<='$todate' AND enddate>=$fromdate"; $res_db = $db->sql($query); 

Thus, we have selected all the records that are in the current month.

Then the most interesting thing: fill the bypass array. In order not to twist it all over again, if a match is found, the element of the array is removed and the next cycle has less iterations.

 $d = array();$k=array(); for($i = 1; $i<=$dayofmonth; $i++){ $k[$i] = $i; } $i=0; while ($a = mysqli_fetch_row($res_db)) { //for($i = 1; $i<=$dayofmonth; $i++){ foreach ($k as $i) { // 0   if($i<10) $cd = "$year-$month-0".$i; else $cd = "$year-$month-$i"; if ($cd >= $a[0] && $cd <= $a[1]) { $d[$i] = $cd; unset($k[$i]); } } } 

Actually, the calendar itself:

 //     $day_count = 1; // 1.   $num = 0; for($i = 0; $i < 7; $i++) { //       $dayofweek = date('w', mktime(0, 0, 0, $month, $day_count, $year)); //      1 - , ..., 6 -  $dayofweek = $dayofweek - 1; if($dayofweek == -1) $dayofweek = 6; if($dayofweek == $i) { //    , //   $week //   $week[$num][$i] = $day_count; $day_count++; } else { $week[$num][$i] = ""; } } // 2.    while(true) { $num++; for($i = 0; $i < 7; $i++) { $week[$num][$i] = $day_count; $day_count++; //     -  //   if($day_count > $dayofmonth) break; } //     -  //   if($day_count > $dayofmonth) break; } // 3.    $week //    //   echo '<table id="calendar">'; // $rusdays = array('','','','','','',''); $rusmonth = array('','','','','','','','','','','',''); echo '<thead> <tr> <td onclick="monthf(\'prev\');"><</td> <td colspan="5">'.$rusmonth[$month-1].', '.$year.'</td> <td onclick="monthf(\'next\');">></td> </tr>'; echo '<tr>'; foreach ($rusdays as $rusday){ echo '<td>'.$rusday.'</td>'; } echo '</tr>'; echo '</thead>'; //  for($i = 0; $i < count($week); $i++) { echo "<tr>"; for($j = 0; $j < 7; $j++) { if(!empty($week[$i][$j])) { //        ee if($week[$i][$j]==$day) { echo '<td class="today">'; } else { echo '<td>'; } //        ,   if($d[$week[$i][$j]]) { echo '<a href="/afisha/'.$d[$week[$i][$j]].'/">'.$week[$i][$j].'</a>'; } else { echo $week[$i][$j]; } echo '</td>'; } else echo "<td> </td>"; } echo "</tr>"; } ?> 

Javascript code for rewinding months

It is slightly simplified for clarity (there are no sliding effects):

 <script> var mon = parseInt("<?php echo $month; ?>"); var year = parseInt(<?php echo $year; ?>); function monthf(pn){ if (pn == 'next'){ mon++; }else if (pn == 'prev'){ mon--; }else{ alert(' '); return false; } if (mon > 12){ year ++; mon = 1; } if (mon < 1){ year --; mon = 12; } if ((mon < 10) && (mon >= 1)){ mon = '0'+mon; } var nextDate = year+'-'+mon+'-00'; var ajaxaddr = "___?date='+nextDate; var http = new XMLHttpRequest(); if (http) { http.open('get', ajaxaddr); http.onreadystatechange = function () { if(http.readyState == 4){ if (http.status == 200) { document.getElementById('calendar').innerHTML = http.responseText; } } } http.send(null); } } </script> 

Close the table tag:

 <?php echo "</table>"; ?> 

findings

Thus, we have a simple and easily embedded calendar of events that works quickly and is easily configured, working in pure PHP + javascript without additional libraries.

Literature

1. PHP Calendar
2. Javascript calendars
3. Sampling from the database - the answers to the toaster