1/* = 2 jquery.eventCalendar.js 3 version: 0.54 4 date: 18-04-2013 5 author: 6 Jaime Fernandez (@vissit) 7 company: 8 Paradigma Tecnologico (@paradigmate) 9*/ 10 11;$.fn.eventCalendar = function(options){ 12 13 var eventsOpts = $.extend({}, $.fn.eventCalendar.defaults, options); 14 15 // define global vars for the function 16 var flags = { 17 wrap: "", 18 directionLeftMove: "300", 19 eventsJson: {} 20 } 21 22 // each eventCalendar will execute this function 23 this.each(function(){ 24 var lc = eventsOpts.listCalendarClass || '', 25 wc = eventsOpts.wrapClass || ''; 26 27 flags.wrap = $(this); 28 flags.wrap.addClass('eventCalendar-wrap ' + wc).append("<div class='eventsCalendar-list-wrapper " + lc + "' id='"+eventsOpts.mainId+"-eventsCalendar-list-wrap' aria-describedby='#"+eventsOpts.mainId+"-eventsCalendar-subtitle' aria-live='assertive' aria-atomic='true'><div class='h4 eventsCalendar-subtitle' id='"+eventsOpts.mainId+"-eventsCalendar-subtitle'></div><span class='eventsCalendar-loading'>cargando...</span><div class='eventsCalendar-list-content'><ul class='eventsCalendar-list'></ul></div></div>"); 29 30 if (eventsOpts.eventsScrollable) { 31 flags.wrap.find('.eventsCalendar-list-content').addClass('scrollable'); 32 } 33 34 setCalendarWidth(); 35 $(window).resize(function(){ 36 setCalendarWidth(); 37 }); 38 //flags.directionLeftMove = flags.wrap.width(); 39 40 // show current month 41 dateSlider("current"); 42 43 getEvents(eventsOpts.eventsLimit,false,false,false,false); 44 45 changeMonth(); 46 47 flags.wrap.on('click','.eventsCalendar-day a',function(e){ 48 //flags.wrap.find('.eventsCalendar-day a').live('click',function(e){ 49 e.preventDefault(); 50 var year = flags.wrap.attr('data-current-year'), 51 month = flags.wrap.attr('data-current-month'), 52 day = $(this).parent().attr('rel'); 53 54 getEvents(false, year, month,day, "day"); 55 }); 56 flags.wrap.on('click','.monthTitle', function(e){ 57 //flags.wrap.find('.monthTitle').live('click',function(e){ 58 e.preventDefault(); 59 var year = flags.wrap.attr('data-current-year'), 60 month = flags.wrap.attr('data-current-month'); 61 62 getEvents(eventsOpts.eventsLimit, year, month,false, "month"); 63 }) 64 65 66 67 }); 68 69 // show event description 70 flags.wrap.find('.eventsCalendar-list').on('click','.eventTitle',function(e){ 71 //flags.wrap.find('.eventsCalendar-list .eventTitle').live('click',function(e){ 72 if(!eventsOpts.showDescription) { 73 e.preventDefault(); 74 var desc = $(this).parent().find('.eventDesc'); 75 76 if (!desc.find('a').size()) { 77 var eventUrl = $(this).attr('href'); 78 var eventTarget = $(this).attr('target'); 79 80 // create a button to go to event url 81 desc.append('<div class="margin-top-10"><a href="' + eventUrl + '" target="'+eventTarget+'" class="btn btn-sm btn-specific-main">'+eventsOpts.txt_GoToEventUrl+'</a></div>') 82 } 83 84 if (desc.is(':visible')) { 85 desc.slideUp(); 86 } else { 87 if(eventsOpts.onlyOneDescription) { 88 flags.wrap.find('.eventDesc').slideUp(); 89 } 90 desc.slideDown(); 91 desc.removeClass('hidden'); 92 } 93 94 } 95 }); 96 97 function sortJson(a, b){ 98 return a.date.toLowerCase() > b.date.toLowerCase() ? 1 : -1; 99 }; 100 101 function dateSlider(show, year, month) { 102 var cc = eventsOpts.calendarClass || '', 103 $eventsCalendarSlider = $("<div class='eventsCalendar-slider " + cc + "'></div>"), 104 $eventsCalendarMonthWrap = $("<div class='eventsCalendar-monthWrap'></div>"), 105 $eventsCalendarTitle = $("<div class='eventsCalendar-currentTitle'><a href='#' aria-controls='#"+eventsOpts.mainId+"-eventsCalendar-list-wrap' class='monthTitle'></a></div>"), 106 $eventsCalendarArrows = $("<a href='#' aria-controls='#"+eventsOpts.mainId+"-eventsCalendar-list-wrap' class='arrow prev'><span>" + eventsOpts.txt_prev + "</span></a><a aria-controls='#"+eventsOpts.mainId+"-eventsCalendar-list-wrap' href='#' class='arrow next'><span>" + eventsOpts.txt_next + "</span></a>"); 107 $eventsCalendarDaysList = $("<ul class='eventsCalendar-daysList'></ul>"), 108 date = new Date(); 109 110 if (!flags.wrap.find('.eventsCalendar-slider').size()) { 111 flags.wrap.prepend($eventsCalendarSlider); 112 $eventsCalendarSlider.append($eventsCalendarMonthWrap); 113 } else { 114 flags.wrap.find('.eventsCalendar-slider').append($eventsCalendarMonthWrap); 115 } 116 117 flags.wrap.find('.eventsCalendar-monthWrap.currentMonth').removeClass('currentMonth').addClass('oldMonth'); 118 $eventsCalendarMonthWrap.addClass('currentMonth').append($eventsCalendarTitle, $eventsCalendarDaysList); 119 120 121 122 // if current show current month & day 123 if (show === "current") { 124 day = date.getDate(); 125 $eventsCalendarSlider.append($eventsCalendarArrows); 126 127 } else { 128 date = new Date(flags.wrap.attr('data-current-year'),flags.wrap.attr('data-current-month'),1,0,0,0); // current visible month 129 day = 0; // not show current day in days list 130 131 moveOfMonth = 1; 132 if (show === "prev") { 133 moveOfMonth = -1; 134 } 135 date.setMonth( date.getMonth() + moveOfMonth ); 136 137 var tmpDate = new Date(); 138 if (date.getMonth() === tmpDate.getMonth()) { 139 day = tmpDate.getDate(); 140 } 141 142 } 143 144 // get date portions 145 var year = date.getFullYear(), // year of the events 146 currentYear = (new Date).getFullYear(), // current year
147 month = date.getMonth(), // 0-11 148 monthToShow = month + 1; 149 150 if (show != "current") { 151 // month change 152 getEvents(eventsOpts.eventsLimit, year, month,false, show); 153 } 154 155 flags.wrap.attr('data-current-month',month) 156 .attr('data-current-year',year); 157 158 // add current date info 159 $eventsCalendarTitle.find('.monthTitle').html(eventsOpts.monthNames[month] + " " + year); 160 161 // print all month days 162 var daysOnTheMonth = 32 - new Date(year, month, 32).getDate(); 163 var daysList = []; 164 if (eventsOpts.showDayAsWeeks) { 165 $eventsCalendarDaysList.addClass('showAsWeek'); 166 167 // show day name in top of calendar 168 if (eventsOpts.showDayNameInCalendar) { 169 $eventsCalendarDaysList.addClass('showDayNames'); 170 171 var i = 0; 172 // if week start on monday 173 if (eventsOpts.startWeekOnMonday) { 174 i = 1; 175 } 176 177 for (; i < 7; i++) { 178 daysList.push('<li class="eventsCalendar-day-header">'+eventsOpts.dayNamesShort[i]+'</li>'); 179 180 if (i === 6 && eventsOpts.startWeekOnMonday) { 181 // print sunday header 182 daysList.push('<li class="eventsCalendar-day-header">'+eventsOpts.dayNamesShort[0]+'</li>'); 183 } 184 185 } 186 } 187 188 dt=new Date(year, month, 01); 189 var weekDay = dt.getDay(); // day of the week where month starts 190 191 if (eventsOpts.startWeekOnMonday) { 192 weekDay = dt.getDay() - 1; 193 } 194 if (weekDay < 0) { weekDay = 6; } // if -1 is because day starts on sunday(0) and week starts on monday 195 for (i = weekDay; i > 0; i--) { 196 daysList.push('<li class="eventsCalendar-day empty"></li>'); 197 } 198 } 199 for (dayCount = 1; dayCount <= daysOnTheMonth; dayCount++) { 200 var dayClass = ""; 201 202 if (day > 0 && dayCount === day && year === currentYear) { 203 dayClass = "today"; 204 } 205 var d1 = (dayCount % 7) + weekDay; 206 var dayName = ''; 207 if (d1 > 7) { 208 dayName = eventsOpts.dayNames[d1 - 7]; 209 } else if (d1 == 7) { 210 dayName = eventsOpts.dayNames[0]; 211 } else { 212 dayName = eventsOpts.dayNames[d1]; 213 } 214 daysList.push('<li id="dayList_' + dayCount + '" rel="'+dayCount+'" class="eventsCalendar-day '+dayClass+'"><a aria-controls="#'+eventsOpts.mainId+'-eventsCalendar-list-wrap" href="#"><span class="sr-only">'+ dayName +', '+ dayCount +' de '+ eventsOpts.monthNames[month] +'</span><span aria-hidden="true">' + dayCount + '</span></a></li>'); 215 216 } 217 $eventsCalendarDaysList.append(daysList.join('')); 218 219 $eventsCalendarSlider.css('height',$eventsCalendarMonthWrap.height()+'px'); 220 } 221 222 function num_abbrev_str(num) { 223 var len = num.length, last_char = num.charAt(len - 1), abbrev 224 if (txt_locale='es'){ 225 abbrev = '' 226 } else { 227 if (len === 2 && num.charAt(0) === '1') { 228 abbrev = 'th' 229 } else { 230 if (last_char === '1') { 231 abbrev = 'st' 232 } else if (last_char === '2') { 233 abbrev = 'nd' 234 } else if (last_char === '3') { 235 abbrev = 'rd' 236 } else { 237 abbrev = 'th' 238 } 239 } 240 } 241 return num + abbrev 242 } 243 244 function getEvents(limit, year, month, day, direction) { 245 var limit = limit || 0; 246 var year = year || ''; 247 var day = day || ''; 248 249 // to avoid problem with january (month = 0) 250 251 if (typeof month != 'undefined') { 252 var month = month; 253 } else { 254 var month = ''; 255 } 256 //Si el campo parametro Day viene vacÃo indica que estamos buscando eventos sin especificar dia, en este punto añadimos la clase "no-day-filter" 257 //al ul que engloba la lista de eventos, con esto conseguimos por estilos eliminar de la lista los eventos OnProgress 258 if (day===''){ 259 $(".eventsCalendar-list").addClass("no-day-filter"); 260 } 261 else{ 262 $(".eventsCalendar-list").removeClass("no-day-filter"); 263 } 264 //var month = month || ''; 265 flags.wrap.find('.eventsCalendar-loading').fadeIn(); 266 267 if (eventsOpts.jsonData) { 268 // user send a json in the plugin params 269 eventsOpts.cacheJson = true; 270 271 flags.eventsJson = eventsOpts.jsonData; 272 getEventsData(flags.eventsJson, limit, year, month, day, direction); 273 274 } else if (!eventsOpts.cacheJson || !direction) { 275 // first load: load json and save it to future filters 276 $.getJSON(eventsOpts.eventsjson + "?limit="+limit+"&year="+year+"&month="+month+"&day="+day, function(data) { 277 flags.eventsJson = data; // save data to future filters 278 getEventsData(flags.eventsJson, limit, year, month, day, direction); 279 }).error(function() { 280 showError("error getting json: "); 281 }); 282 } else { 283 // filter previus saved json 284 getEventsData(flags.eventsJson, limit, year, month, day, direction); 285 } 286 287 if (day > '') { 288 flags.wrap.find('.current').removeClass('current'); 289 flags.wrap.find('#dayList_'+day).addClass('current'); 290 } 291 } 292 293 function getEventsData(data, limit, year, month, day, direction){ 294 directionLeftMove = "-=" + flags.directionLeftMove; 295 eventContentHeight = "auto"; 296 297 subtitle = flags.wrap.find('.eventsCalendar-list-wrapper .eventsCalendar-subtitle') 298 if (!direction) { 299 // first load 300 subtitle.html(eventsOpts.txt_NextEvents); 301 eventContentHeight = "auto"; 302 directionLeftMove = "-=0"; 303 } else { 304 if (day != '') { 305 //subtitle.html(eventsOpts.txt_SpecificEvents_prev + eventsOpts.monthNames[month] + " " + num_abbrev_str(day) + " " + eventsOpts.txt_SpecificEvents_after); 306 if (txt_locale='es'){ 307 subtitle.html(eventsOpts.txt_SpecificEvents_days_prev + " " + num_abbrev_str(day) + " " + eventsOpts.txt_SpecificEvents_days_after + " " + eventsOpts.monthNames[month]); 308 }else { 309 subtitle.html(eventsOpts.txt_SpecificEvents_prev + eventsOpts.monthNames[month] + " " + num_abbrev_str(day) + " " + eventsOpts.txt_SpecificEvents_after); 310 } 311 } else { 312 subtitle.html(eventsOpts.txt_SpecificEvents_prev + eventsOpts.monthNames[month] + " " + eventsOpts.txt_SpecificEvents_after); 313 } 314 315 if (direction === 'prev') { 316 directionLeftMove = "+=" + flags.directionLeftMove; 317 } else if (direction === 'day' || direction === 'month') { 318 directionLeftMove = "+=0"; 319 eventContentHeight = 0; 320 } 321 } 322 323 flags.wrap.find('.eventsCalendar-list').animate({ 324 opacity: eventsOpts.moveOpacity, 325 left: directionLeftMove, 326 height: eventContentHeight 327 }, eventsOpts.moveSpeed, function() { 328 flags.wrap.find('.eventsCalendar-list').css({'left':0, 'height': 'auto'}).hide(); 329 //wrap.find('.eventsCalendar-list li').fadeIn(); 330 331 var events = []; 332 333 data = $(data).sort(sortJson); // sort event by dates 334 335 // each event 336 if (data.length) { 337 338 // show or hide event description 339 var eventDescClass = ''; 340 if(!eventsOpts.showDescription) { 341 eventDescClass = 'hidden'; 342 } 343 var eventLinkTarget = "_self"; 344 if(eventsOpts.openEventInNewWindow) { 345 eventLinkTarget = '_target'; 346 } 347 348 var i = 0; 349 $.each(data, function(key, event) { 350 if (eventsOpts.jsonDateFormat == 'human') { 351 var eventDateTime = event.date.split(" "), 352 eventDate = eventDateTime[0].split("-"), 353 eventTime = eventDateTime[1].split(":"), 354 eventYear = eventDate[0], 355 eventMonth = parseInt(eventDate[1]) - 1, 356 eventDay = parseInt(eventDate[2]), 357 //eventMonthToShow = eventMonth, 358 eventMonthToShow = parseInt(eventMonth) + 1, 359 eventHour = eventTime[0], 360 eventMinute = eventTime[1], 361 eventSeconds = eventTime[2], 362 eventDate = new Date(eventYear, eventMonth, eventDay, eventHour, eventMinute, eventSeconds); 363 } else { 364 var eventDate = new Date(parseInt(event.date)), 365 eventYear = eventDate.getFullYear(), 366 eventMonth = eventDate.getMonth(), 367 eventDay = eventDate.getDate(), 368 eventMonthToShow = eventMonth + 1, 369 eventHour = eventDate.getHours(), 370 eventMinute = eventDate.getMinutes(); 371 } 372 373 if (parseInt(eventMinute) <= 9) { 374 eventMinute = "0" + parseInt(eventMinute); 375 } 376 377 378 if (limit === 0 || limit > i) { 379 // if month or day exist then only show matched events 380
381 if ((month === false || month == eventMonth) 382 && (day == '' || day == eventDay) 383 && (year == '' || year == eventYear) // get only events of current year 384 ) { 385 // if initial load then load only future events 386 if (month === false && eventDate < new Date()) { 387 388 } else { 389 eventStringDate = eventDay + "/" + eventMonthToShow + "/" + eventYear; 390 391 // #7107 Añade otros campos 392 var subt = ""; 393 if (event.subtitle && event.subtitle.length > 0) { 394 subt = '<p class="eventSub">' + event.subtitle + '</p>'; 395 } 396 397 // Campos de fecha 398 var dateblock = ""; 399 var dateinfotext = ""; 400 if(event.type.indexOf('OnProgress')!=-1) { 401 //dateinfotext = '<span class="date-info date-info-on-progress">En progreso</span>' 402 dateblock = '<time datetime="' + eventDate + '"><em>' + event.dateStart + '</em><small>' + eventHour + ":" + eventMinute + '</small> <span class="fa fa-long-arrow-right"></span> <em>' + event.dateEnd + '</em></time><span class="date-info date-info-on-progress">'+eventsOpts.txt_DateInfoOnProgress+'</span>' 403 } 404 else if(event.type.indexOf('Initial')!=-1) { 405 //dateinfotext = '<span class="date-info date-info-initial">Comienza</span>' 406 dateblock = '<time datetime="'+eventDate+'"><em>' + event.dateStart + '</em><small>'+eventHour+":"+eventMinute+'</small></time><span class="date-info date-info-initial">'+eventsOpts.txt_DateInfoInitial+'</span>' 407 } 408 else if(event.type.indexOf('Fin')!=-1) { 409 //dateinfotext = '<span class="date-info date-info-fin">Finaliza</span>' 410 dateblock = '<time datetime="'+eventDate+'"><em>' + event.dateEnd + '</em><small>'+eventHour+":"+eventMinute+'</small></time><span class="date-info date-info-fin">'+eventsOpts.txt_DateInfoFin+'</span>' 411 } 412 else { 413 dateblock = '<time datetime="'+eventDate+'"><em>' + event.dateStart + '</em><small>'+eventHour+":"+eventMinute+'</small></time>' 414 dateinfotext = '' 415 } 416 if (event.url) { 417 var strlink = event.url; 418 if (strlink.substr(0,5)=='http:') 419 { 420 eventLinkTarget = '_blank'; 421 } 422 else 423 { 424 eventLinkTarget = '_self'; 425 } 426 var eventTitle = '<a href="'+event.url+'" target="' + eventLinkTarget + '" class="eventTitle">'+ event.title + '</a>'; 427 } else { 428 var eventTitle = '<span class="eventTitle">'+event.title+'</span>'; 429 } 430 events.push( 431 '<li id="' + key + '" class="'+event.type+'">' + 432 dateblock + 433 eventTitle + 434 subt + 435 '<p class="eventDesc ' + eventDescClass + '">' + event.description + '</p></li>'); 436 i++; 437 } 438 } 439 } 440 441 // add mark in the dayList to the days with events 442 if (eventYear == flags.wrap.attr('data-current-year') && eventMonth == flags.wrap.attr('data-current-month')) { 443 flags.wrap.find('.currentMonth .eventsCalendar-daysList #dayList_' + parseInt(eventDay)).addClass('dayWithEvents'+' ' + event.type); 444 } 445 446 }); 447 } 448 // there is no events on this period 449 if (!events.length) { 450 events.push('<li class="eventsCalendar-noEvents"><p>' + eventsOpts.txt_noEvents + '</p></li>'); 451 } 452 //RGS: 453 if (eventsOpts.eventscompletelist!= ''){ 454 events.push('<li class="eventsCalendar-noEvents eventsCalendar-completeList"><a href="'+ eventsOpts.eventscompletelist + "?calYear="+year+"&calMonth="+month+"&calDay="+day +'">' + eventsOpts.txt_BtnAllEvents + '</a></li>'); 455 } 456 flags.wrap.find('.eventsCalendar-loading').hide(); 457 458 flags.wrap.find('.eventsCalendar-list') 459 .html(events.join('')); 460 461 flags.wrap.find('.eventsCalendar-list').animate({ 462 opacity: 1, 463 height: "toggle" 464 }, eventsOpts.moveSpeed); 465 466 467 }); 468 setCalendarWidth(); 469 } 470 471 function changeMonth() { 472 flags.wrap.find('.arrow').click(function(e){ 473 e.preventDefault(); 474 475 if ($(this).hasClass('next')) { 476 dateSlider("next"); 477 var lastMonthMove = '-=' + flags.directionLeftMove; 478 479 } else { 480 dateSlider("prev"); 481 var lastMonthMove = '+=' + flags.directionLeftMove; 482 } 483 484 flags.wrap.find('.eventsCalendar-monthWrap.oldMonth').animate({ 485 opacity: eventsOpts.moveOpacity, 486 left: lastMonthMove 487 }, eventsOpts.moveSpeed, function() { 488 flags.wrap.find('.eventsCalendar-monthWrap.oldMonth').remove(); 489 }); 490 }); 491 } 492 493 function showError(msg) { 494 flags.wrap.find('.eventsCalendar-list-wrapper').html("<span class='eventsCalendar-loading error'>"+msg+" " +eventsOpts.eventsjson+"</span>"); 495 } 496 497 function setCalendarWidth(){ 498 // resize calendar width on window resize 499 flags.directionLeftMove = flags.wrap.width(); 500 flags.wrap.find('.eventsCalendar-monthWrap').width(flags.wrap.width() + 'px'); 501 // SAGA COMENTADO: evitamos que incluya un ancho fijo en px al bloque de lista de recursos 502 //flags.wrap.find('.eventsCalendar-list-wrap').width(flags.wrap.width() + 'px'); 503 504 } 505}; 506 507 508// define the parameters with the default values of the function 509$.fn.eventCalendar.defaults = { 510 eventsjson: 'js/events.json', 511 mainId: 'idcalendar', 512 mainTitle: 'Calendario de eventos', 513 eventscompletelist:'', 514 eventsLimit: 4, 515 monthNames: [ "January", "February", "March", "April", "May", "June",
516 "July", "August", "September", "October", "November", "December" ], 517 dayNames: [ 'Sunday','Monday','Tuesday','Wednesday', 518 'Thursday','Friday','Saturday' ], 519 dayNamesShort: [ 'Sun','Mon','Tue','Wed', 'Thu','Fri','Sat' ], 520 //RGS: Para tener en cuenta los idiomas 521 txt_locale:"en", 522 // Fin 523 txt_noEvents: "There are no events in this period", 524 txt_SpecificEvents_prev: "", 525 txt_SpecificEvents_after: "events:", 526 //RGS: Para tener en cuenta los idiomas 527 txt_SpecificEvents_days_prev: "", 528 txt_SpecificEvents_days_after: "events:", 529 //Fin 530 txt_next: "next", 531 txt_prev: "prev", 532 txt_NextEvents: "Next events:", 533 txt_GoToEventUrl: "See the event", 534 txt_BtnAllEvents: "See all events", 535 txt_DateInfoOnProgress: "On Progress", 536 txt_DateInfoInitial: "Beginning", 537 txt_DateInfoFin: "End", 538 showDayAsWeeks: true, 539 startWeekOnMonday: true, 540 showDayNameInCalendar: true, 541 showDescription: false, 542 onlyOneDescription: true, 543 openEventInNewWindow: false, 544 eventsScrollable: false, 545 jsonDateFormat: 'timestamp', // you can use also "human" 'YYYY-MM-DD HH:MM:SS' 546 moveSpeed: 500, // speed of month move when you clic on a new date 547 moveOpacity: 0.15, // month and events fadeOut to this opacity 548 jsonData: "", // to load and inline json (not ajax calls) 549 cacheJson: true // if true plugin get a json only first time and after plugin filter events 550 // if false plugin get a new json on each date change 551};
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.