Week calendar

Demo of week calendar. Data is om week 47 and 48 (2016).

Source for the page

01: <?php
02: //----------------------------------------------------------------------
03: //  Copyright Raditex Control AB, gorhas@raditex.nu
04: //----------------------------------------------------------------------
05: 
06: include_once('framework-config.php');   // configuration data
07: include_once('raditex-library.php');  // main library
08: include_once('framework-lists.php');    // lists - like menues an other
09: include_once('libs/rbis-library-widgets.php');
10: include_once('libs/rbis-library-html.php');
11: include_once('libs/rwtk-library-calendar-week.php');
12: 
13: //php_session_start(); // Optitional - If we need login or cookies 
14: 
15: //error_reporting(0);
16: 
17: page_start();
18: 
19: $week_number = rbis_variable_retrieve('week_number', 'now');
20: 
21: page_header($header_image,"User: gorhas@demo.se");
22: page_drop_down_menu($site_menu);
23: 
24: page_menu($framework_widgets_menu);
25: 
26: page_row_start();
27: page_column_start_left();
28: 
29: // Main content of site
30: html_h('Week calendar', 1);
31: 
32: html_p("Not that this is just a demo. It is not possible to jump between weeks.");
33: 
34: $records = array(
35:            array("calendar_date" => "2016-11-21", "object_uuid" => "df17b398-b362-11e6-971b-b305dfb5de95", 
36:                  "start_time" => "2016-01-07 10:02:30", "description" => "Möte om avtal", "name" => "Möte med kund."),
37:            array("calendar_date" => "2016-11-22", "object_uuid" => "059ab006-b363-11e6-a771-bb2b571c261b", 
38:                  "start_time" => "2016-01-07 11:03:22", "description" => "Volvo", "name" => "Service av bil"),
39:            array("calendar_date" => "2016-11-23", "object_uuid" => "0ee2ea84-b363-11e6-bb7d-83c0eb7651fe", 
40:                  "start_time" => "2016-01-07 14:01:13", "description" => "Volvo", "name" => "Service av bil2"),
41:            array("calendar_date" => "2016-11-23", "object_uuid" => "1657a1a6-b363-11e6-be85-a76153962e2e", 
42:                  "start_time" => "2016-01-07 13:00:02", "description" => "Volvo", "name" => "Service av bil3"),
43:            array("calendar_date" => "2016-11-28", "object_uuid" => "1d8ec904-b363-11e6-888f-e3ff52aece59", 
44:                  "start_time" => "2016-01-07 15:00:03", "description" => "Volvo", "name" => "Service av bil4"),
45:            array("calendar_date" => "2016-11-29", "object_uuid" => "2524fdaa-b363-11e6-bbf3-5f2a3e40d7de", 
46:                  "start_time" => "2016-01-07 11:11:01", "description" => "Volvo", "name" => "Service av bil5"),
47:            array("calendar_date" => "2016-11-30", "object_uuid" => "2bf2491c-b363-11e6-94de-1b0cf4152f44", 
48:                  "start_time" => "2016-01-07 12:01:44", "description" => "Volvo", "name" => "Service av bil6")
49:            );
50: 
51: rwtk_widget_calendar_week($week_number, 'Meeting calendar', 'calendar-week.php', 'object_edit.php',  $records);
52: 
53: 
54: 
55: html_h("Sourcecode", 2);
56: 
57: html_p("Source for the page");
58: 
59: // html-version of this file
60: 
61: include_once("src/calendar-week.php.html");
62: 
63: html_p("Source for library");
64: 
65: include_once("src/rwtk-library-calendar-week.php.html");
66: 
67: page_column_end();
68: 
69: page_row_end();
70: 
71: page_footer("http://www.raditex.nu","Raditex Konsult","http://www.rscada.se","rScada");
72: page_end();
73: print("<script src='libs/rbis-library-utils.js'></script>");
74: print("<script src='http://d3js.org/d3.v3.js'></script>");
75: print("<script src='libs/graph-simple.js'></script>");
76: 
77: //----------------------------------------------------------------------
78: //
79: //----------------------------------------------------------------------
80: ?>
81: 

Source for library

001: <?php
002: //----------------------------------------------------------------------
003: // Copyright Raditex Control AB, 2015-11-02, gorhas@raditex.nu
004: // Widget för a calendar week view
005: //----------------------------------------------------------------------
006: 
007: include_once("libs/rbis-library-main.php");
008: include_once("libs/rbis-library-lists.php");
009: include_once("libs/rbis-library-widgets.php");
010: include_once("libs/rbis-library-utils.php");
011: 
012: //----------------------------------------------------------------------
013: //
014: //----------------------------------------------------------------------
015: function get_week($date)
016: {
017: 
018:    $date_stamp = strtotime(date('Y-m-d', strtotime($date)));
019: 
020:    //check date is sunday or monday
021:    $stamp = date('l', $date_stamp);      
022:    $timestamp = strtotime($date);
023: 
024:    //start week
025:    if(date('D', $timestamp) == 'Mon')
026:    {            
027:       $week_start = $date;
028:    }
029:    else
030:    {
031:       $week_start = date('Y-m-d', strtotime('Last Monday', $date_stamp));
032:    }
033: 
034:    //end week
035:    if($stamp == 'Sunday')
036:    {
037:       $week_end = $date;
038:    }
039:    else
040:    {
041:       $week_end = date('Y-m-d', strtotime('Next Sunday', $date_stamp));
042:    }
043:    return array($week_start, $week_end, $week_number);
044: }
045: 
046: //----------------------------------------------------------------------
047: //
048: //----------------------------------------------------------------------
049: function time_for_week_day($day_name, $ref_time=null)
050: {
051: 
052:    $monday = strtotime(date('o-\WW',$ref_time));
053: 
054:    if(substr(strtoupper($day_name),0,3) === "MON")
055:    {
056:       return $monday;
057:    }
058:    else
059:    {
060:       return strtotime("next $day_name",$monday);
061:    }
062: 
063: }
064: 
065: //----------------------------------------------------------------------
066: //
067: //----------------------------------------------------------------------
068: function get_fist_last_from_week( $week, $year)
069: {
070:     
071:     $time = strtotime("1 January $year", time());
072:     $day = date('w', $time);
073:     $time += ((7*$week)+1-$day)*24*3600;
074:     $return[0] = date('Y-n-j', $time);
075:     $time += 6*24*3600;
076:     $return[1] = date('Y-n-j', $time);
077:     return $return;
078: }
079: 
080: //----------------------------------------------------------------------
081: //
082: //----------------------------------------------------------------------
083: function week_date($week, $year){
084: 
085:     $date = new DateTime();
086:     $rt[0] = $date->setISODate($year, $week, "1")->format('Y-m-d');
087:     $rt[1] = $date->setISODate($year, $week, "7")->format('Y-m-d'); 
088: 
089:     return $rt;
090: }
091: 
092: //----------------------------------------------------------------------
093: //
094: // FIXIT: Rewrite so we use first day of week
095: //        instead of week-counter
096: //----------------------------------------------------------------------
097: function rwtk_widget_calendar_week($week_number='1', 
098:                                    $calendar_title='Calendar',
099:                                    $calendar_url='index.php',
100:                                    $object_url='object_url.php', 
101:                                    $records)
102: {
103: 
104: 
105:    //$monday = strtotime(date('o-\WW'));
106:    //$friday = strtotime("next friday",$monday);
107: 
108:     if($week_number == 0)
109:     {
110:         $current_week = date("W", strtotime("now"));
111:         $week_number = $current_week;
112:         $_SESSION['week_number'] = $current_week;
113:     }
114:     else
115:     {
116:         $_SESSION['week_number'] = $week_number;
117:     }
118: 
119: 
120: 
121:     $monday = date(strtotime('next monday', strtotime('previous sunday')));
122:     $friday = date(strtotime('next friday', strtotime('previous sunday')));
123: 
124:     //html_message_info("Date start of week: " . $monday . " : " . date("Y", $monday) );
125: 
126:     $mf= week_date($week_number, date("Y", $monday) );
127: 
128:     $current_week = date("W", strtotime("now"));
129:     $prev_week = $_SESSION['week_number'] - 1;
130:     $next_week = $_SESSION['week_number'] + 1;
131:     
132:    echo("<table border='1' class='calendar-week'>\n");
133:    
134:    printf("<tr id='calendar-week-header-top'> <th class='calendar-week-header-top' colspan='7'>%s " . _(" vecka - ") . "%s</th> </tr>\n", $calendar_title, $week_number);
135: 
136: 
137:    //$left = rwtk_widget_button_week_arrow_left(_("Previous"));
138:    //$right =  rwtk_widget_button_week_arrow_right(_("Next"));
139: 
140:    $left = rbis_widget_button_week_arrow_left($prev_week);
141:    $right =  rbis_widget_button_week_arrow_right($next_week);
142: 
143:   printf("<tr class='calendar-week-header-row'>" .
144:          "<th class='calendar-week-header-bb'><a href='".$calendar_url."?week_number=" . $prev_week . "'>" . $left . "</a></th>" .
145:          "<th class='calendar-week-header' colspan='5'><a href='".$calendar_url."?week_number=" . $current_week . "'> " .
146:          "<button type=button class='button-in-week-header-aa'>". _("Gå till aktuell vecka") . "</button><br /></a></th>".
147:          "<th class='calendar-week-header-bb'><a href='".$calendar_url."?week_number=" . $next_week . "'>" . $right . "</a></th> </tr>\n", $week_number);
148: 
149: 
150:    printf("<tr>");
151: 
152:    $day_names = rbis_week_days();
153: 
154:    for($i=0; $i < 7; $i++)
155:    {
156:       
157:       $the_date = date('Y-m-d', strtotime($mf[0] ." +".$i." days" ));
158:       
159:       printf("<td class='calendar-week-day'>%s<br>%s", $day_names[$i], $the_date );
160: 
161:       html_hr(2);
162: 
163:       foreach($records as $record)
164:       {
165: 
166: 
167:           if($the_date == $record['calendar_date'])
168:           {
169: 
170: 
171:               $description = empty($record['description']) ? "No info" : $record['description'];
172:               $name = empty($record['name']) ? "No info" : $record['name'];
173: 
174:               $balloon_text = "Description: " .  $description . "<br>" .
175:                               "Name: " . $name . "";
176: 
177: 
178:           //$start_time = date_parse($record['start_time']);
179: 
180: 
181:           $temp_time = DateTime::createFromFormat('Y-m-d H:i:s', $record['start_time']);
182: 
183: 
184:           $display_time = "[" . $temp_time->format('H:i') . "]";
185: 
186:           printf("<a href='" . $object_url . "?object_uuid=%s'  >" .
187:                  "<div title='" . $balloon_text . "' class='calendar-week-row-item'>%s  %s</div></a>", $record['object_uuid'], $display_time,  $record['name']);
188: 
189:           }
190:           else
191:           {
192:            
193:           }
194: 
195:       }
196:       printf("</td>");
197:    }
198:    
199:    printf("</tr>");
200:    
201:    printf("</table>\n");
202: 
203: }
204: //----------------------------------------------------------------------
205: // EOF
206: //----------------------------------------------------------------------
207: ?>
208: 

Source for CSS

001: /**********************************************************************
002: *  calendar-week.css
003: *  Copyright, Raditex Control AB, 2016, 
004: *  Goran Hasse, <gorhas@raditex.nu>
005: ***********************************************************************/
006: 
007: .calendar-week
008: {
009:   width: 100%;
010:   height: 150px;
011: 
012:   border-collapse: collapse;
013: 
014:   font-size: 14px;
015:   font-family: Helvetica, Arial, Sans;
016:   text-align: center;
017:   background-color: rgb(152,209,211);
018: 
019: }
020: 
021: .calendar-week-day
022: {
023: 
024:   font-family: Sans;
025:   font-size: 14px;
026:   vertical-align: top;
027:   text-align: center;
028:   align: center;
029:   background-color: rgb(152,209,211);
030: 
031:   padding: 5px;
032:   margin: 5px;
033: 
034: }
035: 
036: .calendar-week-day-item
037: {
038:   font-family: Helvetica, Arial, sans;
039:   font-size: 14px;
040:   vertical-align: top;
041:   align: center;
042:   text-align: center;
043:   background-color: rgb(226,143,38);
044: 
045: }
046: 
047: 
048: .calendar-week-day br
049: {
050:   font-family: Helvetica, Arial, sans;
051:   font-size: 12px;
052:   vertical-align: top;
053:   align: center;
054:   text-align: center;
055:   background-color: rgb(152,209,211);
056: 
057: }
058: 
059: .calendar-week-header-top
060: {
061: 
062:   font-family: Sans;
063:   font-size: 18px;
064:   color: blue;
065: 
066:   background-color: rgb(152,209,211);
067: 
068:   padding: 10px;
069:   margin: 10px;
070: 
071: 
072: }
073: 
074: .calendar-week-header
075: {
076:   background-color: rgb(152,209,211);
077: }
078: 
079: .calendar-week-row-item
080: {
081: 
082:   font-family: Sans;
083:   font-size: 14px;
084:   color: rgb(0,0,0);
085: 
086:     background-color: rgb(51,255,102);
087: 
088:     margin-top: 2px;
089:     margin-bottom: 2px;
090:     margin-left: 2px;
091:     margin-right: 2px;
092:     padding: 4px;
093: 
094:     width: 200px; 
095: 
096: }
097: 
098: .calendar-week-header-bb
099: {
100: 
101:   font-size: 18px;
102:   background-color: rgb(152,209,211);
103: 
104: 
105: }
106: 
107: .calendar-week-header-new
108: {
109:   background-color: rgb(152,209,0);
110: }
111: 
112: 
113: .button-in-week-header-aa
114: {
115: 
116:     background: rgb(61,161,196);
117:     font-size: 18px;
118:     font-style: Sans;
119:     font-weight: bold;
120:     color: blue;
121: 
122: }
123: 
124: .button-in-week-row
125: {
126:     /* background: #ff0000; */
127:     border: 3px;
128:     font-size: 14px;
129:     font-weight: normal;
130:     padding: 2px 2px 2px 2px;
131: 
132:     margin-top: 2px;
133:     margin-bottom: 2px;
134:    /* margin-bottom: 4px; */
135: 
136:     text-overflow: ellipsis;
137:     color: rgb(0,0,0);
138:     border: 2px;
139:     background: rgb(244,187,58);
140:     border-radius: 6px;
141:     opacity: 1.0;
142:     width: 95%;
143: }
144: 
145: .calendar-week-button-left
146: {
147: 
148:     background: rgb(61,161,196);
149:     font-size: 18px;
150:     color: rgb(0,0,0);
151:     width: 100px;
152: 
153:     background-image: url("http://www.raditex.nu/framework/img/arrow-left.png");
154:     background-repeat: no-repeat;
155: 
156:     background-attatchment: fixed;
157:     background-position: 5%  50%;
158: 
159: 
160: 
161: }
162: 
163: .calendar-week-button-right
164: {
165: 
166:     background: rgb(61,161,196);
167:     font-size: 18px;
168:     color: rgb(0,0,0);
169:     width: 100px;
170: 
171:     background-image: url("http://www.raditex.nu/framework/img/arrow-right.png");
172:     background-repeat: no-repeat;
173: 
174:     background-attatchment: fixed;
175:     background-position: 95%  50%;
176: 
177: 
178: }