1 <?xml version=
"1.0" encoding=
"UTF-8"?>
2 <!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3 <html xmlns=
"http://www.w3.org/1999/xhtml">
5 <title>Coming Next
</title>
6 <style type=
"text/css">
7 /* -----------------------------------------------------------------------
8 here you can customize background color, font color, font size etc...
9 --------------------------------------------------------------------------- */
10 .background { color:#ffffff; background-color:#
000000; font:normal
12pt; } /* Defines the background of the widget. If you want to use a background image, set useBackgroundImage = true below */
11 /* for the default themes, black, gray, and light blue, codes are #
292029, #e7dfe7, #
009aef */
12 .weekDay { } /* Defines the appearance of all week day texts */
13 .date { } /* Defines the appearance of all date texts */
14 .today { color:#ff0000; } /* Defines the appearance of
"Today" text */
15 .time { } /* Defines the appearance of all time texts */
16 .now { color:#ff00ff; } /* Defines the appearance of
"Now" text */
17 .description { } /* Defines the appearance of all event descriptions */
18 .icon { width:
15px; height:
15px; } /* Defines size and appearance of icons */
21 //---------------------------------------------------------------
22 // The following section contains settings you may want to tweak
23 //---------------------------------------------------------------
24 var monthRange =
2; // number of months to include in the event list
25 var includeTodos = true; // disable to remove ToDos from event list
26 var useBackgroundImage = true; // use background_portrait.png and background_landscape.png to fake transparency. Set to
"false" to use a solid background color
27 var showCombinedDateTime = false;// only show the time for events happening today, otherwise just show the date
28 var showLocation = true; // show the location for meeting events
29 var showTodayAsText = true; // if enabled, the current date will be shown as
"Today" instead of
"31.12"
30 var todayText = 'Today'; // text to display for
"Today"
31 var showNowAsText = true; // if enabled, the appointment time will be shown as
"Now" instead of
"12:00"
32 var nowText = 'Now'; // text to display for
"Now"
33 var dateSeparator = '.'; // separator for dates. e.g.
"31.12" or
"31/12"
34 var dateFormat = 'auto' // how dates will be displayed. 'auto' will autodetect your phone's date format setting. 'MMDD' will write month first, 'DDMM' will write day first
35 var weekDayLength =
2; // defines how many characters of the weekday will be shown. E.g.
2 will cut
"Friday" to
"Fr"
36 var updateDataInterval =
5; // how many minutes to wait before updating the displayed data. The higher the number, the less battery is used
37 var calendarApp =
0x10005901; // UID of the calendar app to run when clicking the widget.
0x10005901 = buildin calendar,
0x20004ec1 = Epocware Handy Calendar
38 var eventsPerWidget =
4; // number of events to show per widget. Default is
4
39 var showNothingText = true; // if set to
"true", show a text if no events are in the list
40 var nothingText = 'No further events within '+monthRange+' months'; // text to show when no events are in the list
42 //-------------------------------------------------------
43 // Nothing of interest from here on...
44 //-------------------------------------------------------
45 var panelNum =
1; // use
1 for second panel
46 var calendarService = null;
47 var cacheEntriesHtml = [];
48 var months_translated = [];
53 window.onresize = updateScreen;
54 window.onshow = updateScreen;
56 function error(message){
57 console.info('Error: ' + message);
58 document.getElementById(
"calendarList").innerHTML = 'Error: ' + message;
61 function collectLocales(){
62 if (months_translated.length
> 0){
65 var tmpyear = ((panelNum ==
0) ?
2000 :
2001);
67 for(month =
0; month <
12; month++){
68 var startDate = new Date(tmpyear, month,
15);
69 var item = new Object();
70 item.Type =
"DayEvent";
71 item.StartTime = startDate;
72 item.Summary =
"__temp" + month;
74 var criteria = new Object();
75 criteria.Type =
"CalendarEntry";
79 var result = calendarService.IDataSource.Add(criteria);
80 if (result.ErrorCode){
81 error(result.ErrorMessage);
85 error(
"collectLocales: " + e + ', line ' + e.line);
89 var startTime = new Date(tmpyear,
0,
1);
90 var endTime = new Date(tmpyear,
11,
31);
94 StartRange: startTime,
100 var result = calendarService.IDataSource.GetList(listFiltering);
101 if (result.ErrorCode){
102 error(result.ErrorMessage);
105 var list = result.ReturnValue;
107 error(e + ', line ' + e.line);
110 var ids = new Array();
115 while( list && (entry = list.getNext()) != undefined ){
116 dateArr = entry.StartTime.replace(/,/g,'').replace(/\./g,':').replace(/ /g,' ').split(' ');
117 var day = dateArr[
1];
118 var month = dateArr[
2];
119 var year = dateArr[
3];
120 // make sure month is set properly
121 if (isNaN(parseInt(day))){
126 else if (isNaN(parseInt(year))){
131 console.info(entry.StartTime + ' -
> ' + month + ' ' + counter);
132 ids[counter] = entry.id;
133 months_translated[month] = counter +
1;
137 error(e + ', line ' + e.line);
142 var criteria = new Object();
143 criteria.Type =
"CalendarEntry";
147 var result = calendarService.IDataSource.Delete(criteria);
148 if (result.ErrorCode)
149 error(result.ErrorMessage);
151 error('deleting temp calendar entries:' + e + ', line ' + e.line);
156 function requestNotification(){
157 var criteria = new Object();
158 criteria.Type =
"CalendarEntry";
160 var result = calendarService.IDataSource.RequestNotification(criteria, callback);
161 if (result.ErrorCode)
162 error('loading Calendar items list');
165 error(
"requestNotification: " + e + ', line ' + e.line);
169 function callback(transId, eventCode, result){
173 function parseDate(dateString)
176 Dates my look very differently. Also keep in mind that the names are localized!!! These are the possibilities depending on the users date format setting:
177 Wednesday,
26 August,
2009 24:
00:
00
178 Wednesday,
26 August,
2009 12:
00:
00 am
179 Wednesday, August
26,
2009 12:
00:
00 am
180 Wednesday,
2009 August,
26 12:
00:
00 am
181 Wednesday,
2009 August,
28 8.00.00 pm
182 Wednesday,
2009 August,
28 08:
00:
00 PM
184 if (dateString ==
"" || dateString == null)
187 var dateArr = dateString.replace(/,/g,'').replace(/\./g,':').replace(/ /g,' ').split(' ');
189 if (dateArr.length !=
5 && dateArr.length !=
6)
193 var weekDay = dateArr[
0];
194 var day = dateArr[
1];
195 var month = dateArr[
2];
196 var year = dateArr[
3];
197 // make sure month is set properly
198 if (isNaN(parseInt(day))){
203 else if (isNaN(parseInt(year))){
208 // make sure day and year are set properly
209 if (Number(day)
> Number(year))
215 month = months_translated[month];
218 var timeArr = dateArr[
4].split(':');
219 if (timeArr.length !=
3)
221 var hours = Number(timeArr[
0]);
222 var minutes = Number(timeArr[
1]);
223 var seconds = Number(timeArr[
2]);
224 if (dateArr.length ==
6 && dateArr[
5].toLowerCase() == 'pm' && hours <
12)
226 if (dateArr.length ==
6 && dateArr[
5].toLowerCase() == 'am' && hours ==
12)
229 console.info('year=' + year + ' month=' + month + ' day=' + day + ' hours=' + hours + ' minutes=' + minutes+ ' seconds=' + seconds);
231 return new Date(year, month -
1, day, hours, minutes, seconds);
234 // returns a short date as string (
"31.12" or
"12.31") based on the format string which should look like
"Wednesday, 26 August, 2009 12:00:00 am"
235 function formatDate(date, format)
237 var day = date.getDate().toString();
238 var month = (date.getMonth() +
1).toString();
239 while (day.length <
2) { day = '
0' + day; }
240 while (month.length <
2) { month = '
0' + month; }
242 if (showTodayAsText && now.getDate() == date.getDate() && now.getMonth() == date.getMonth())
243 return '
<span class=
"today">' + todayText + '
</span>';
245 var dateArr = format.replace(/,/g,'').replace(/\./g,':').replace(/ /g,' ').split(' ');
247 if (dateArr.length !=
5 && dateArr.length !=
6){
248 // we don't know how to format this
249 if (dateFormat == 'auto' || dateFormat == 'DDMM')
250 return day + dateSeparator + month;
252 return month + dateSeparator + day;
256 if (dateFormat == 'MMDD')
258 else if (dateFormat == 'DDMM')
260 else { // dateFormat == 'auto', try to detect system setting
262 var day_ = dateArr[
1];
263 var month_ = dateArr[
2];
264 var year_ = dateArr[
3];
265 // make sure month is set properly
266 if (isNaN(parseInt(day_))){
272 else if (isNaN(parseInt(year_))){
278 // make sure day and year are set properly
279 if (Number(day_)
> Number(year_))
284 return day + dateSeparator + month;
286 return month + dateSeparator + day;
289 function formatTime(date)
291 // date is a Date() object
292 date.setSeconds(
0); // we don't care about seconds
293 var time = date.toLocaleTimeString().replace(/[\.:]
00/, ''); // remove seconds from string
294 if (time.replace(/\./, ':').split(':')[
0].length <
2)
296 if (showNowAsText && date.getTime() == now.getTime())
297 time = '
<span class=
"now">' + nowText + '
</span>';
301 function updateData(){
303 // meetings have time
304 // note: anniveraries have a start time of
12:
00am. So since we want to include them, we have to query the whole day and check if events have passed later
306 var meetingListFiltering = {
307 Type:'CalendarEntry',
309 StartRange: (new Date(now.getFullYear(), now.getMonth(), now.getDate(),
0,
0,
0)),
310 EndRange: (new Date(now.getFullYear(), now.getMonth() + monthRange, now.getDate(),
0,
0,
0))
313 var meetingResult = calendarService.IDataSource.GetList(meetingListFiltering);
314 var meetingList = meetingResult.ReturnValue;
315 // todos don't, they start on
00:
00 hrs., but should be visible anyway
316 // this will generate a list of passed todos. We have to check if they have been marked as
"done" yet
318 var todayTodoListFiltering = {
319 Type:'CalendarEntry',
322 StartRange: (new Date(now.getFullYear() -
1, now.getMonth(), now.getDate(),
0,
0,
0)),
323 EndRange: (new Date(now.getFullYear(), now.getMonth(), now.getDate(),
0,
0,
1))
326 var todayTodoResult = calendarService.IDataSource.GetList(todayTodoListFiltering);
327 var todayTodoList = todayTodoResult.ReturnValue;
328 var entryLists = [todayTodoList, meetingList];
330 var entryLists = [meetingList];
333 error('loading Calendar items list:' + e + ', line ' + e.line);
342 var entriesHtml = '
<table>';
344 var max = ((panelNum ==
0) ? eventsPerWidget :
2 * eventsPerWidget);
345 // the first outer loop iteration is for passed ToDos, the second loop is for all upcomming events (may also include ToDos)
346 for(var i=
0; counter < max && i < entryLists.length; i++){
347 while( counter < max && (entry = entryLists[i].getNext()) != undefined ){
350 // output event info for debugging
352 'event: Id=' + entry.id +
353 ',Type=' + entry.Type +
354 ',Summary=' + entry.Summary +
355 ',Location=' + entry.Location +
356 ',Status=' + entry.Status +
357 ',StartTime=' + entry.StartTime +
358 ',EndTime=' + entry.EndTime +
359 ',InstanceStartTime=' + entry.InstanceStartTime +
360 ',InstanceEndTime=' + entry.InstanceEndTime
363 // we don't want ToDos when includeTodos == false or when they are completed
364 if (entry.Type == 'ToDo' && (entry.Status ==
"TodoCompleted" || !includeTodos)){
365 console.info('skipping ' + entry.id );
370 // make sure that we don't include an event twice (useful for ToDos that might come up twice)
371 if (eventIds[entry.id] ==
1){
372 console.info('skipped (already included) ' + entry.id);
376 eventIds[entry.id] =
1;
378 // summary can be undefined!
379 var Summary = ((entry.Summary == null) ? '' : entry.Summary);
380 if (entry.Type == 'Meeting' && entry.Location != '' && showLocation){
381 Summary += ', ' + entry.Location;
384 // fix by yves: determine start and end dates/times
385 entryStartTime = ((entry.InstanceStartTime == null) ? entry.StartTime : entry.InstanceStartTime);
386 entryEndTime = ((entry.InstanceEndTime == null) ? entry.EndTime : entry.InstanceEndTime);
388 // there can be ToDos that have no date at all!
389 if (entry.Type == 'ToDo' && entry.EndTime == null)
390 entryDate =
""; // this will cause parseDate(entryDate) to return null;
392 entryDate = ((entry.Type == 'ToDo') ? entryEndTime : entryStartTime); // ToDo's use their EndTime, the rest use StartTime
394 // Convert date/time string to Date object
395 var date = parseDate(entryDate);
396 console.info('date: ' + date);
397 var endDate = ((entryEndTime == null) ? null : parseDate(entryEndTime));
398 console.info('endDate: ' + endDate);
400 // check if meeting event has already passed
401 if (entry.Type == 'Meeting'){
402 var compareTime = ((endDate == null) ? date.getTime() : endDate.getTime());
403 if (now.getTime()
> compareTime){
404 console.info('skipping Meeting (already passed) ' + entry.id);
406 eventIds[entry.id] =
0;
411 // check if anniversary passed (not sure why they are in the list, the query was only for today - nokia?)
412 if (entry.Type == 'Anniversary'){
413 var tmp = new Date(now.getFullYear(), now.getMonth(), now.getDate(),
0,
0,
0);
414 if ( date.getTime() < tmp.getTime() ){
415 console.info('skipping Anniversary (already passed) ' + entry.id);
417 eventIds[entry.id] =
0;
422 // fix DayEvents end time. End times are off by
1 Second. It's possible that the event has already passed
423 if (entry.Type == 'DayEvent' && endDate != null){
424 endDate.setMinutes(endDate.getMinutes() -
1);
425 console.info('fixing DayEvent endDate: ' + endDate);
426 if (now.getTime()
> endDate.getTime()){
427 console.info('event already passed ' + entry.id);
429 eventIds[entry.id] =
0;
434 // check if the event is currently taking place
435 if (entryStartTime != null && entryEndTime != null && date != null && endDate != null)
437 // check if we are between start and endtime
438 if ((date.getTime() < now.getTime()) && (now.getTime() < endDate.getTime())) {
439 date = now; // change appointment date/time to now
440 console.info('event is currently taking place: ' + date);
444 // skip events for the first panel in case this is the second one
445 if (panelNum ==
1 && counter < eventsPerWidget +
1){
446 console.info('skipping (already in first widget) ' + entry.id);
450 // generate html output
451 entriesHtml += '
<tr><td><img class=
"icon" src=
"' + entry.Type + '.png" /></td>';
452 if(date == null){ // some languages have very strange locale date formats, can't parse all those. Also some todos don't have dates at all.
453 entriesHtml += '
<td colspan=
"4"><span class=
"date">' + entryDate + '
</span> ';
455 var weekDay = date.toLocaleDateString().substr(
0,weekDayLength);
456 var time = formatTime(date);
457 var dateStr = formatDate(date, entryDate);
458 if( entry.Type == 'ToDo' || entry.Type == 'Anniversary' || entry.Type == 'DayEvent' || entry.Type == 'Reminder' ){
459 // decide if we want to leave off the weekday
460 if (dateStr.search(/Today/) != -
1)
461 entriesHtml += '
<td colspan=
"4"><span class=
"date">'+ dateStr +'
</span> ';
463 entriesHtml += '
<td><span class=
"weekDay">' + weekDay +'
</span></td><td><span class=
"date">'+ dateStr +'
</span></td><td colspan=
"2">';
464 }else if( entry.Type == 'Meeting' ){
465 if (showCombinedDateTime) {
466 if (now.getDate() == date.getDate() && now.getMonth() == date.getMonth())
467 entriesHtml += '
<td colspan=
"4"><span class=
"today">'+ time +'
</span> ';
469 // decide if we want to leave off the weekday
470 if (dateStr.search(/Today/) != -
1)
471 entriesHtml += '
<td colspan=
"4"><span class=
"date">'+ dateStr +'
</span> ';
473 entriesHtml += '
<td><span class=
"weekDay">' + weekDay +'
</span></td><td><span class=
"date">'+ dateStr +'
</span></td><td colspan=
"2">';
476 // decide if we want to leave off the weekday
477 if (dateStr.search(/Today/) != -
1)
478 entriesHtml += '
<td colspan=
"4"><span class=
"date">'+ dateStr +'
</span> <span class=
"time">'+ time +'
</span> ';
480 entriesHtml += '
<td><span class=
"weekDay">' + weekDay +'
</span></td><td><span class=
"date">'+ dateStr +'
</span></td><td width=
"1px"><span class=
"time">'+ time +'
</span></td><td>';
484 entriesHtml += '
<span class=
"description">' + Summary +'
</span></td></tr>';
487 entriesHtml += '
</table>';
488 if (showNothingText && entriesHtml == '
<table></table>')
489 entriesHtml = '
<div style=
"width:295px; height:75px; text-align:center; line-height:75px; overflow:visible;">' + nothingText + '
</div>';
490 if( cacheEntriesHtml != entriesHtml ){
491 document.getElementById('calendarList').innerHTML = entriesHtml;
492 cacheEntriesHtml = entriesHtml;
495 error('displaying list:' + e + ', line ' + e.line);
500 function updateScreen(){
501 // Check if opening fullscreen
502 if( window.innerHeight
> 91){
506 if (useBackgroundImage){
507 // check for screen rotation
508 if (orientation != 'portrait' && screen.width ==
360 && screen.height ==
640){
509 window.widget.prepareForTransition(
"fade");
510 orientation = 'portrait';
511 document.getElementById('body').style.backgroundImage = 'url(background_' + orientation + '.png)';
512 document.getElementById('body').style.backgroundColor = 'none';
513 window.widget.performTransition();
514 }else if (orientation != 'landscape' && screen.width ==
640 && screen.height ==
360){
515 window.widget.prepareForTransition(
"fade");
516 orientation = 'landscape';
517 document.getElementById('body').style.backgroundImage = 'url(background_' + orientation + '.png)';
518 document.getElementById('body').style.backgroundColor = 'none';
519 window.widget.performTransition();
524 function launchCalendar(){
526 widget.openApplication(calendarApp,
"");
529 error('starting Calendar App');
536 calendarService = device.getServiceObject(
"Service.Calendar",
"IDataSource"); // call calendar service
538 error('loading Calendar service');
543 requestNotification();
544 window.setInterval('updateData()',
1000 *
60 * updateDataInterval); // start update interval every
5 minutes
547 if (useBackgroundImage)
548 window.setInterval('updateScreen()',
1000 *
3); // check for screen rotation every
3 secs
551 <style type=
"text/css">
552 table{ margin:
0px; padding:
0px; border-spacing:
0px; }
553 td{ padding:
0px
5px
0px
0px; white-space:nowrap; overflow:hidden; }
554 #homescreenView{ width:
315px; height:
91px; overflow:hidden; }
555 #calendarList{ position:absolute; left:
10px; top:
4px; width:
295px; height:
75px; overflow:hidden; }
558 <body id=
"body" class=
"background">
559 <div id=
"homescreenView">
560 <div id=
"calendarList"></div>