Difference between revisions of "Widget:Calendar"

From Hackerspace ACKspace
Jump to: navigation, search
m (fixe date logic (31 aug < 2 sep, duh))
m (renamed calendar widget due to wiki header name conflict)
Line 56: Line 56:
  
  
     if ( typeof Calendar === "undefined" )
+
     if ( typeof CalendarWidget === "undefined" )
 
     {
 
     {
 
         window.calendarEvents = null;
 
         window.calendarEvents = null;
Line 71: Line 71:
 
         } );
 
         } );
  
         window.Calendar = function( _date, _showWeekNumber )
+
         window.CalendarWidget = function( _date, _showWeekNumber )
 
         {
 
         {
 
             // Listen for async calendarEvents
 
             // Listen for async calendarEvents
Line 79: Line 79:
 
             this._showWeekNumber = _showWeekNumber || false;
 
             this._showWeekNumber = _showWeekNumber || false;
 
             // Fill in the months and weekdays once
 
             // Fill in the months and weekdays once
             if ( !Calendar.prototype._arrMonths )
+
             if ( !CalendarWidget.prototype._arrMonths )
 
             {
 
             {
 
                 // Check for localization support
 
                 // Check for localization support
Line 85: Line 85:
 
                 {
 
                 {
 
                     var n;
 
                     var n;
                     Calendar.prototype._arrMonths = [];
+
                     CalendarWidget.prototype._arrMonths = [];
                     Calendar.prototype._arrWeekDays = [];
+
                     CalendarWidget.prototype._arrWeekDays = [];
 
              
 
              
 
                     for ( n = 0; n < 12; n++ )
 
                     for ( n = 0; n < 12; n++ )
                         Calendar.prototype._arrMonths.push( new Date( 1 + n + " 20 1970" ).toLocaleString( false, { month: "long" } ) );
+
                         CalendarWidget.prototype._arrMonths.push( new Date( 1 + n + " 20 1970" ).toLocaleString( false, { month: "long" } ) );
 
              
 
              
 
                     for ( n = 0; n < 7; n++ )
 
                     for ( n = 0; n < 7; n++ )
                         Calendar.prototype._arrWeekDays.push( new Date( 5 + n + " jan 1970" ).toLocaleString( false, { weekday: "short" } ) );
+
                         CalendarWidget.prototype._arrWeekDays.push( new Date( 5 + n + " jan 1970" ).toLocaleString( false, { weekday: "short" } ) );
 
                 }
 
                 }
 
                 else
 
                 else
 
                 {
 
                 {
                     Calendar.prototype._arrMonths = Calendar.prototype._arrMonths_en_us;
+
                     CalendarWidget.prototype._arrMonths = CalendarWidget.prototype._arrMonths_en_us;
                     Calendar.prototype._arrWeekDays = Calendar.prototype._arrWeekDays_en_us;
+
                     CalendarWidget.prototype._arrWeekDays = CalendarWidget.prototype._arrWeekDays_en_us;
 
                 }
 
                 }
 
             }
 
             }
Line 110: Line 110:
 
         }
 
         }
 
          
 
          
         Calendar.prototype._arrMonths = null;
+
         CalendarWidget.prototype._arrMonths = null;
         Calendar.prototype._arrWeekDays = null;
+
         CalendarWidget.prototype._arrWeekDays = null;
         Calendar.prototype._arrMonths_en_us = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];
+
         CalendarWidget.prototype._arrMonths_en_us = [ "January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December" ];
         Calendar.prototype._arrWeekDays_en_us = [ "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun" ];
+
         CalendarWidget.prototype._arrWeekDays_en_us = [ "Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun" ];
 
          
 
          
         Calendar.prototype._tblCalendar = null;
+
         CalendarWidget.prototype._tblCalendar = null;
         Calendar.prototype._today = null;
+
         CalendarWidget.prototype._today = null;
         Calendar.prototype._date = null;
+
         CalendarWidget.prototype._date = null;
         Calendar.prototype.hl = null;
+
         CalendarWidget.prototype.hl = null;
         Calendar.prototype.t = null;
+
         CalendarWidget.prototype.t = null;
  
         Calendar.prototype._update = function( _event )
+
         CalendarWidget.prototype._update = function( _event )
 
         {
 
         {
 
             var oldTable = document.getElementById( this._tblCalendar.id );
 
             var oldTable = document.getElementById( this._tblCalendar.id );
Line 129: Line 129:
 
         }
 
         }
  
         Calendar.prototype._gen = function( _dates )
+
         CalendarWidget.prototype._gen = function( _dates )
 
         {
 
         {
 
             var date = new Date( this._date.getFullYear(), this._date.getMonth(), 1 );
 
             var date = new Date( this._date.getFullYear(), this._date.getMonth(), 1 );
Line 188: Line 188:
 
         };
 
         };
  
         Calendar.prototype._determineColor = function( _td, _curDate, _dates )
+
         CalendarWidget.prototype._determineColor = function( _td, _curDate, _dates )
 
         {
 
         {
 
             var eventKinds = _td.title = _dates.filter( function( _date )
 
             var eventKinds = _td.title = _dates.filter( function( _date )
Line 215: Line 215:
 
         };
 
         };
  
         Calendar.prototype._determineTitle = function( _td, _curDate, _dates )
+
         CalendarWidget.prototype._determineTitle = function( _td, _curDate, _dates )
 
         {
 
         {
 
             var dates = _dates.filter( function( _date )
 
             var dates = _dates.filter( function( _date )
Line 238: Line 238:
 
         };
 
         };
 
          
 
          
         Calendar.prototype.place = function( _node )
+
         CalendarWidget.prototype.place = function( _node )
 
         {
 
         {
 
             this._gen();
 
             this._gen();
Line 244: Line 244:
 
         }
 
         }
  
         Calendar.prototype.toString = function( )
+
         CalendarWidget.prototype.toString = function( )
 
         {
 
         {
 
             this._gen();
 
             this._gen();
Line 251: Line 251:
 
     }
 
     }
  
     var calendar = new Calendar( "<!--{$date|escape:html}-->", "<!--{$w|escape:html}-->" );
+
     var calendar = new CalendarWidget( "<!--{$date|escape:html}-->", "<!--{$w|escape:html}-->" );
 
<!--{foreach from=$hl key=d item=col}-->
 
<!--{foreach from=$hl key=d item=col}-->
 
     calendar.hl[ new Date( "<!--{$d|escape:'html'}-->" ).getTime() ] = "hl-<!--{$col|escape:'html'}-->";
 
     calendar.hl[ new Date( "<!--{$d|escape:'html'}-->" ).getTime() ] = "hl-<!--{$col|escape:'html'}-->";

Revision as of 10:10, 27 September 2018

This widget allows you to display a calendar

Created by Xopr

Using this widget

To insert this widget, use the following code:

{{#widget:Calendar
|date=february 26 2011
|w=true
|hl.26 february 2011=blue
|hl.1 march 2011=red
|t.17 february 2011=First peek into ACKspace's new space
}}

This will give the following result:

Note:

  • all parameters are optional. If date is omitted, the current month will be displayed
  • you can highlight dates by using the hl parameter, followed by a dot and the date you want to highlight. Available colors are: red, green, blue, yellow, cyan and purple
  • you can also add titles per-day using the 't' parameter, followed by a dot and the date you want to highlight.
  • w (show week numbers) is optional

Copy to your site

To use this widget on your site, just install MediaWiki Widgets extension and copy full source code of this page to your wiki as Widget:Calendar article.