├── images └── bg.jpg ├── font ├── fontawesome-selected.eot ├── fontawesome-selected.ttf ├── fontawesome-selected.woff ├── LICENSE.txt ├── fontawesome-selected.svg └── README.txt ├── bower.json ├── README.md ├── README.txt ├── js ├── update.js ├── dataTimeline.js ├── data.js ├── modernizr.custom.63321.js ├── jquery.calendario.min.js └── jquery.calendario.js ├── css ├── calendar.css ├── demo.css ├── timeline.css ├── custom_2.css ├── custom_4.css ├── custom_3.css └── custom_1.css ├── index.html ├── index3.html ├── index2.html └── index4.html /images/bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codrops/Calendario/HEAD/images/bg.jpg -------------------------------------------------------------------------------- /font/fontawesome-selected.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codrops/Calendario/HEAD/font/fontawesome-selected.eot -------------------------------------------------------------------------------- /font/fontawesome-selected.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codrops/Calendario/HEAD/font/fontawesome-selected.ttf -------------------------------------------------------------------------------- /font/fontawesome-selected.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/codrops/Calendario/HEAD/font/fontawesome-selected.woff -------------------------------------------------------------------------------- /bower.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "calendario", 3 | "version": "2.0.0", 4 | "homepage": "http://tympanus.net/codrops/2012/11/27/calendario-a-flexible-calendar-plugin/", 5 | } 6 | -------------------------------------------------------------------------------- /font/LICENSE.txt: -------------------------------------------------------------------------------- 1 | Font license info 2 | 3 | 4 | ## Font Awesome 5 | 6 | Copyright (C) 2012 by Dave Gandy 7 | 8 | Author: Dave Gandy 9 | License: CC BY 3.0 (http://creativecommons.org/licenses/by/3.0/) 10 | Homepage: http://fortawesome.github.com/Font-Awesome/ 11 | 12 | 13 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Calendario 2 | ========= 3 | 4 | A jQuery calendar plugin for creating flexible calendars. 5 | 6 | [article on Codrops](http://tympanus.net/codrops/?p=12416) 7 | 8 | [demo](http://tympanus.net/Development/Calendario) 9 | 10 | [github demo](http://deviprsd21.github.io/Calendario/) 11 | 12 | Licensed under the MIT License 13 | -------------------------------------------------------------------------------- /README.txt: -------------------------------------------------------------------------------- 1 | Created by Codrops 2 | 3 | Notable Changes 4 | =============== 5 | * Calendario gets more flexible : Boží Ďábel (https://github.com/deviprsd21) (https://github.com/codrops/Calendario/pull/11) 6 | * Multiple Events : Mattias Lyckne (https://github.com/olyckne) (https://github.com/codrops/Calendario/pull/22) 7 | * Flexibility In-built : Boží Ďábel (https://github.com/deviprsd21) (https://github.com/codrops/Calendario/pull/23) 8 | * Now with Time : Boží Ďábel (https://github.com/deviprsd21) (https://github.com/codrops/Calendario/pull/25) 9 | 10 | Please read about our license: http://tympanus.net/codrops/licensing/ 11 | -------------------------------------------------------------------------------- /js/update.js: -------------------------------------------------------------------------------- 1 | var calendario = { 2 | current: '3.2.0', 3 | previous: '3.1.0', 4 | download: 'https://raw.githubusercontent.com/codrops/Calendario/master/js/jquery.calendario.js', 5 | msg: 'CALENDARIO MSG' + 6 | '\n===============' + 7 | '\nNEW VERSION (3.2.0) AVAILABLE!' + 8 | '\nDOWNLOAD : https://raw.githubusercontent.com/codrops/Calendario/master/js/jquery.calendario.js' + 9 | '\nMINIFIED : https://raw.githubusercontent.com/codrops/Calendario/master/js/jquery.calendario.min.js' + 10 | '\n==================================================================================================' 11 | }; 12 | -------------------------------------------------------------------------------- /js/dataTimeline.js: -------------------------------------------------------------------------------- 1 | var timelineEvents = { 2 | 'TODAY': [ 3 | {content: 'John Applesed\'s Birthday', allDay: true}, 4 | {content: 'Arnold Mathew\'s Birthday', allDay: true}, 5 | {content: 'Captain X\'s Birthday', allDay: true}, 6 | {content: 'Sleep, sleep, sleep!', startTime: '00:00', endTime: '06:00'}, 7 | {content: 'Wake Up! Get Ready! 30 Mins Max :)', startTime: '06:00', endTime: '06:30'}, 8 | {content: 'I\'m getting late for work! GOD!! (Average time 17mins to reach)', startTime: '06:30', endTime: '06:47'}, 9 | {content: 'Make report on Li-Fi', startTime: '06:47', endTime: '12:00'}, 10 | {content: 'Lunch with friend\'s at KFC', startTime: '12:00', endTime: '13:00'}, 11 | {content: '10mins break :p', startTime: '13:00', endTime: '13:10'}, 12 | {content: 'Have no clue? O.o', startTime: '13:20', endTime: '17:41'}, 13 | {content: 'Quick nap, after returning home!', startTime: '18:00', endTime: '18:20'}, 14 | {content: 'Dinner with my Girl Friend', startTime: '19:00', endTime: '21:30'}, 15 | {content: 'Prepare for Sleep!', startTime: '22:00', endTime: '23:01'}, 16 | {content: 'Trying to sleep', startTime: '23:01', endTime: '00:00'} 17 | ] 18 | }; 19 | -------------------------------------------------------------------------------- /js/data.js: -------------------------------------------------------------------------------- 1 | var codropsEvents = { 2 | '11-21-2013' : 'Great American Smokeout', 3 | '11-13-2013' : 'Ashura [An example of an complete date event (11-13-2013)]', 4 | '11-11-2013' : 'Remembrance Day (Canada)', 5 | '11-04-2013' : 'Islamic New Year', 6 | '11-03-2013' : 'Daylight Saving Time Ends', 7 | '11-01-2013' : 'All Saints Day', 8 | '12-25-YYYY' : 'Christmas Day [Date : 12-25-YYYY]', 9 | '01-01-YYYY' : 'New Year\'s Eve (Event repeats every YEAR)', 10 | 'MM-02-2013' : 'Yeah, Monthly [MM-02-2013]', 11 | 'MM-07-YYYY' : '[MM-07-YYYY], Monthly and Yearly', 12 | '11-DD-2014' : {content : 'Ex: {\'11-DD-2014\' : {content : \'Something\', endDate : 20}}', endDate : 20}, 13 | '02-DD-2014' : {content : 'Ex: {\'02-DD-2014\' : {content : \'Something\', startDate : 10, endDate : 20}}', startDate : 10, endDate : 20}, 14 | '12-DD-YYYY' : '[12-DD-YYYY] Whole month and Year', 15 | 'TODAY' : 'Today, [Date : \'TODAY\']', 16 | '10-16-2014': ['event one', 'event two'], 17 | '10-DD-YYYY' : [ 18 | {content : 'Ex: {\'10-DD-2014\' : {content : \'Something\', startDate : 10, endDate : 20}}', startDate : 10, endDate : 20}, 19 | {content : 'Ex: {\'10-DD-2014\' : {content : \'Something\', endDate : 20}}', endDate: 20}, 20 | ] 21 | 22 | }; 23 | -------------------------------------------------------------------------------- /font/fontawesome-selected.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | Created by FontForge 20100429 at Mon Nov 26 18:17:04 2012 6 | By root 7 | Copyright (C) 2012 by original authors @ fontello.com 8 | 9 | 10 | 11 | 24 | 26 | 28 | 30 | 32 | 34 | 36 | 38 | 39 | 40 | -------------------------------------------------------------------------------- /font/README.txt: -------------------------------------------------------------------------------- 1 | This webfont is generated by http://fontello.com open source project. 2 | 3 | 4 | ================================================================================ 5 | Please, note, that you should obey original font licences, used to make this 6 | webfont pack. Details available in LICENSE.txt file. 7 | 8 | - Usually, it's enougth to publish content of LICENSE.txt file somewhere on your 9 | site in "About" section. 10 | 11 | - If your project is open-source, usually, it will be ok to make LICENSE.txt 12 | file publically available in your repository. 13 | 14 | - Fonts, used in Fontello, don't require to make clickable links on your site. 15 | But any kind of additional authors crediting is welcome. 16 | ================================================================================ 17 | 18 | 19 | Attention for server setup (IE users and others) 20 | ------------------------------------------------ 21 | 22 | You MUST setup server to reply with proper `mime-types` for font files. In other 23 | case, some browsers will fail to show fonts. 24 | 25 | Usually, `apache` already has necessary settings, but `nginx` and other 26 | webservers should be tuned. Here is list of mime types for our file extentions: 27 | 28 | - `application/vnd.ms-fontobject` - eot 29 | - `application/x-font-woff` - woff 30 | - `application/x-font-ttf` - ttf 31 | - `image/svg+xml` - svg 32 | 33 | 34 | Comments on archive content 35 | --------------------------- 36 | 37 | - /font/* - fonts in different formats 38 | 39 | - /css/* - different kinds of css, for all situations. Should be ok with 40 | twitter bootstrap. Also, you can skip style and assign icon classes 41 | directly to text elements 42 | 43 | - demo.html - demo file, to show your webfont content 44 | 45 | - LICENSE.txt - license info about source fonts, used to build your one. 46 | 47 | - config.json - keeps your settings. You can import it back to fontello anytime, 48 | to continue your work 49 | -------------------------------------------------------------------------------- /css/calendar.css: -------------------------------------------------------------------------------- 1 | @font-face { 2 | font-family: 'fontawesome-selected'; 3 | src: url("../font/fontawesome-selected.eot"); 4 | src: url("../font/fontawesome-selected.eot?#iefix") format('embedded-opentype'), url("../font/fontawesome-selected.woff") format('woff'), url("../font/fontawesome-selected.ttf") format('truetype'), url("../font/fontawesome-selected.svg#fontawesome-selected") format('svg'); 5 | font-weight: normal; 6 | font-style: normal; 7 | } 8 | 9 | .fc-calendar-container { 10 | position: relative; 11 | height: 400px; 12 | width: 400px; 13 | } 14 | 15 | .fc-calendar { 16 | width: 100%; 17 | height: 100%; 18 | } 19 | 20 | .fc-calendar .fc-head { 21 | height: 30px; 22 | line-height: 30px; 23 | background: #ccc; 24 | color: #fff; 25 | } 26 | 27 | .fc-calendar .fc-body { 28 | position: relative; 29 | width: 100%; 30 | height: 100%; 31 | height: -moz-calc(100% - 30px); 32 | height: -webkit-calc(100% - 30px); 33 | height: calc(100% - 30px); 34 | border: 1px solid #ddd; 35 | } 36 | 37 | .fc-calendar .fc-row { 38 | width: 100%; 39 | border-bottom: 1px solid #ddd; 40 | } 41 | 42 | .fc-four-rows .fc-row { 43 | height: 25%; 44 | } 45 | 46 | .fc-five-rows .fc-row { 47 | height: 20%; 48 | } 49 | 50 | .fc-six-rows .fc-row { 51 | height: 16.66%; 52 | height: -moz-calc(100%/6); 53 | height: -webkit-calc(100%/6); 54 | height: calc(100%/6); 55 | } 56 | 57 | .fc-calendar .fc-row > div, 58 | .fc-calendar .fc-head > div { 59 | float: left; 60 | height: 100%; 61 | width: 14.28%; /* 100% / 7 */ 62 | width: -moz-calc(100%/7); 63 | width: -webkit-calc(100%/7); 64 | /* width: calc(100%/7); */ 65 | position: relative; 66 | } 67 | 68 | /* IE 9 is rounding up the calc it seems */ 69 | .ie9 .fc-calendar .fc-row > div, 70 | .ie9 .fc-calendar .fc-head > div { 71 | width: 14.2%; 72 | } 73 | 74 | .fc-calendar .fc-row > div { 75 | border-right: 1px solid #ddd; 76 | padding: 4px; 77 | overflow: hidden; 78 | position: relative; 79 | } 80 | 81 | .fc-calendar .fc-head > div { 82 | text-align: center; 83 | } 84 | 85 | .fc-calendar .fc-row > div > span.fc-date { 86 | position: absolute; 87 | width: 30px; 88 | height: 20px; 89 | font-size: 20px; 90 | line-height: 20px; 91 | font-weight: 700; 92 | color: #ddd; 93 | text-shadow: 0 -1px 0 rgba(255,255,255,0.8); 94 | bottom: 5px; 95 | right: 5px; 96 | text-align: right; 97 | } 98 | 99 | .fc-calendar .fc-row > div time { 100 | display: none; 101 | } 102 | 103 | .fc-calendar .fc-row > div > span.fc-weekday { 104 | padding-left: 5px; 105 | display: none; 106 | } 107 | 108 | .fc-calendar .fc-row > div.fc-today { 109 | background: #fff4c3; 110 | } 111 | 112 | .fc-calendar .fc-row > div.fc-out { 113 | opacity: 0.6; 114 | } 115 | 116 | .fc-calendar .fc-row > div:last-child, 117 | .fc-calendar .fc-head > div:last-child { 118 | border-right: none; 119 | } 120 | 121 | .fc-calendar .fc-row:last-child { 122 | border-bottom: none; 123 | } 124 | -------------------------------------------------------------------------------- /css/demo.css: -------------------------------------------------------------------------------- 1 | /* General Demo Style */ 2 | @import url(http://fonts.googleapis.com/css?family=Lato:300,400,700); 3 | 4 | html { height: 100%; } 5 | 6 | *, 7 | *:after, 8 | *:before { 9 | -webkit-box-sizing: border-box; 10 | -moz-box-sizing: border-box; 11 | box-sizing: border-box; 12 | padding: 0; 13 | margin: 0; 14 | } 15 | 16 | /* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */ 17 | .clearfix:before, 18 | .clearfix:after { 19 | content: " "; /* 1 */ 20 | display: table; /* 2 */ 21 | } 22 | 23 | .clearfix:after { 24 | clear: both; 25 | } 26 | 27 | .clearfix { 28 | *zoom: 1; 29 | } 30 | 31 | body { 32 | font-family: 'Lato', Calibri, Arial, sans-serif; 33 | background: #f9f9f9 url(../images/bg.jpg); 34 | font-weight: 300; 35 | font-size: 15px; 36 | color: #333; 37 | height: 100%; 38 | } 39 | 40 | a { 41 | color: #555; 42 | text-decoration: none; 43 | } 44 | 45 | .container { 46 | width: 100%; 47 | height: 100%; 48 | position: relative; 49 | } 50 | 51 | .container > header, 52 | .main { 53 | padding: 0 30px 50px 30px; 54 | width: 100%; 55 | max-width: 600px; 56 | margin: 0 auto; 57 | } 58 | 59 | .container > header { 60 | padding: 30px; 61 | } 62 | 63 | .container > header h1 { 64 | font-size: 34px; 65 | line-height: 38px; 66 | margin: 0; 67 | font-weight: 700; 68 | color: #fff; 69 | float: left; 70 | text-shadow: 0 1px 1px rgba(0,0,0,0.3); 71 | } 72 | 73 | .container > header h1 span { 74 | font-size: 18px; 75 | font-weight: 300; 76 | display: block; 77 | } 78 | 79 | /* Header Style */ 80 | .codrops-top { 81 | line-height: 24px; 82 | font-size: 11px; 83 | background: #fff; 84 | background: rgba(255, 255, 255, 0.5); 85 | text-transform: uppercase; 86 | z-index: 9999; 87 | position: relative; 88 | box-shadow: 1px 0px 2px rgba(0,0,0,0.2); 89 | } 90 | 91 | .codrops-top a { 92 | padding: 0px 10px; 93 | letter-spacing: 1px; 94 | color: #333; 95 | display: inline-block; 96 | } 97 | 98 | .codrops-top a:hover { 99 | background: rgba(255,255,255,0.8); 100 | color: #000; 101 | } 102 | 103 | .codrops-top span.right { 104 | float: right; 105 | } 106 | 107 | .codrops-top span.right a { 108 | float: left; 109 | display: block; 110 | } 111 | 112 | /* Demo Buttons Style */ 113 | .codrops-demos { 114 | float: right; 115 | } 116 | 117 | .codrops-demos a { 118 | display: inline-block; 119 | margin: 10px; 120 | color: #fff; 121 | font-weight: 700; 122 | line-height: 30px; 123 | border-bottom: 4px solid transparent; 124 | } 125 | 126 | .codrops-demos a:hover { 127 | color: #000; 128 | border-color: #000; 129 | } 130 | 131 | .codrops-demos a.current-demo, 132 | .codrops-demos a.current-demo:hover { 133 | color: rgba(255,255,255,0.5); 134 | border-color: rgba(255,255,255,0.5); 135 | } -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Flexible Calendar 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 27 |
28 |
29 |

Calendario 30 | Demo 1 | Demo 2 | Demo 3 31 | | Demo 4 32 |

33 |

34 | 35 | 36 | 41 |

42 |
43 |
44 |
45 |
46 | 47 | 48 | 49 | 97 | 98 | 99 | -------------------------------------------------------------------------------- /css/timeline.css: -------------------------------------------------------------------------------- 1 | @import url(http://fonts.googleapis.com/css?family=Lato:300,400,700); 2 | 3 | *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } 4 | body, html { font-size: 100%; padding: 0; margin: 0;} 5 | 6 | /* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */ 7 | .clearfix:before, .clearfix:after { content: " "; display: table; } 8 | .clearfix:after { clear: both; } 9 | 10 | body { 11 | font-family: 'Lato', Calibri, Arial, sans-serif; 12 | color: #47a3da; 13 | } 14 | 15 | a { 16 | color: #f0f0f0; 17 | text-decoration: none; 18 | } 19 | 20 | a:hover { 21 | color: #000; 22 | } 23 | 24 | .main { 25 | width: 95%; 26 | max-width: 69em; 27 | margin: 0 auto; 28 | padding: 0 1.875em 3.125em; 29 | } 30 | 31 | .container > header nav a:hover:before { 32 | color: #fff; 33 | } 34 | 35 | .cbp_tmtimeline { 36 | margin: 30px 0 0 0; 37 | padding: 0; 38 | list-style: none; 39 | position: relative; 40 | } 41 | 42 | .cbp_tmtimeline > li { 43 | height: 200px; 44 | max-height: 200px; 45 | position: relative; 46 | border-bottom: 1px solid #afdcf8; 47 | } 48 | 49 | .cbp_tmtimeline > li.all-day { 50 | min-height: 70px; 51 | height: auto; 52 | max-height: auto; 53 | position: static; 54 | } 55 | 56 | .cbp_tmtimeline > li:first-child { 57 | border-top: 1px solid #afdcf8; 58 | } 59 | 60 | /* The line */ 61 | .cbp_tmtimeline:before { 62 | content: ''; 63 | position: absolute; 64 | top: 0; 65 | bottom: 0; 66 | width: 10px; 67 | background: #afdcf8; 68 | left: 20%; 69 | margin-left: -10px; 70 | } 71 | 72 | /* The date/time */ 73 | .cbp_tmtimeline > li .cbp_tmtime { 74 | display: block; 75 | width: 25%; 76 | padding-right: 100px; 77 | position: absolute; 78 | } 79 | 80 | .cbp_tmtimeline > li .cbp_tmtime span { 81 | display: block; 82 | text-align: right; 83 | } 84 | 85 | .cbp_tmtimeline > li .cbp_tmtime span:first-child { 86 | font-size: 0.9em; 87 | color: #bdd0db; 88 | } 89 | 90 | .cbp_tmtimeline > li .cbp_tmtime span:last-child { 91 | font-size: 2.9em; 92 | color: #3594cb; 93 | } 94 | 95 | .cbp_tmtimeline > li .cbp_tmtime span > h6 { 96 | font-size: 0.4em; 97 | margin: 0; 98 | } 99 | 100 | .cbp_tmtimeline > li:nth-child(odd) .cbp_tmtime span:last-child { 101 | color: #6cbfee; 102 | } 103 | 104 | /* Right content */ 105 | .cbp_tmtimeline > li .cbp_tmlabel { 106 | margin: 0 0 2px 21%; 107 | background: #3594cb; 108 | color: #fff; 109 | padding: 1px 5px 1px 10px; 110 | font-size: 0.9em; 111 | font-weight: 300; 112 | line-height: 1.4; 113 | position: absolute; 114 | border-radius: 5px; 115 | width: 79%; 116 | z-index: 10; 117 | overflow: auto; 118 | } 119 | 120 | .cbp_tmtimeline > li .cbp_tmlabel:last-child { 121 | margin-bottom: 5px; 122 | } 123 | 124 | .cbp_tmtimeline > li .cbp_tmlabel a { 125 | text-decoration: underline; 126 | } 127 | 128 | .cbp_tmtimeline > li.all-day .cbp_tmlabel{ 129 | position: relative; 130 | font-weight: bold; 131 | width: auto; 132 | } 133 | 134 | /* Example Media Queries */ 135 | @media screen and (max-width: 65.375em) { 136 | 137 | .cbp_tmtimeline > li .cbp_tmtime span:last-child { 138 | font-size: 1.5em; 139 | } 140 | } 141 | 142 | @media screen and (max-width: 47.2em) { 143 | .cbp_tmtimeline:before { 144 | display: none; 145 | } 146 | 147 | .cbp_tmtimeline > li .cbp_tmtime { 148 | width: 100%; 149 | position: relative; 150 | padding: 0 0 20px 0; 151 | } 152 | 153 | .cbp_tmtimeline > li .cbp_tmtime span { 154 | text-align: left; 155 | } 156 | 157 | .cbp_tmtimeline > li .cbp_tmlabel { 158 | margin: 0 0 30px 0; 159 | padding: 1em; 160 | font-weight: 400; 161 | font-size: 95%; 162 | } 163 | 164 | .cbp_tmtimeline > li .cbp_tmlabel:after { 165 | right: auto; 166 | left: 20px; 167 | border-right-color: transparent; 168 | border-bottom-color: #3594cb; 169 | top: -20px; 170 | } 171 | 172 | .cbp_tmtimeline > li .cbp_tmicon { 173 | position: relative; 174 | float: right; 175 | left: auto; 176 | margin: -55px 5px 0 0px; 177 | } 178 | } 179 | 180 | -------------------------------------------------------------------------------- /css/custom_2.css: -------------------------------------------------------------------------------- 1 | /* Custom calendar elements */ 2 | 3 | .custom-calendar-wrap { 4 | margin: 10px auto; 5 | position: relative; 6 | overflow: hidden; 7 | } 8 | 9 | .custom-inner { 10 | background: #fff; 11 | box-shadow: 0 1px 3px rgba(0,0,0,0.2); 12 | } 13 | 14 | .custom-inner:before, 15 | .custom-inner:after { 16 | content: ''; 17 | width: 99%; 18 | height: 50%; 19 | position: absolute; 20 | background: #f6f6f6; 21 | bottom: -4px; 22 | left: 0.5%; 23 | z-index: -1; 24 | box-shadow: 0 1px 3px rgba(0,0,0,0.2); 25 | } 26 | 27 | .custom-inner:after { 28 | content: ''; 29 | width: 98%; 30 | bottom: -7px; 31 | left: 1%; 32 | z-index: -2; 33 | } 34 | 35 | .custom-header { 36 | background: #fff; 37 | padding: 5px 10px 10px 20px; 38 | height: 70px; 39 | position: relative; 40 | border-top: 5px solid #ef4f69; 41 | border-bottom: 1px solid #ddd; 42 | } 43 | 44 | .custom-header h2, 45 | .custom-header h3 { 46 | text-align: center; 47 | text-transform: uppercase; 48 | } 49 | 50 | .custom-header h2 { 51 | color: #495468; 52 | font-weight: 300; 53 | font-size: 18px; 54 | margin-top: 10px; 55 | } 56 | 57 | .custom-header h3 { 58 | font-size: 10px; 59 | font-weight: 700; 60 | color: #b7bbc2; 61 | } 62 | 63 | .custom-header nav span { 64 | position: absolute; 65 | top: 17px; 66 | width: 30px; 67 | height: 30px; 68 | color: transparent; 69 | cursor: pointer; 70 | margin: 0 1px; 71 | font-size: 20px; 72 | line-height: 30px; 73 | -webkit-touch-callout: none; 74 | -webkit-user-select: none; 75 | -khtml-user-select: none; 76 | -moz-user-select: none; 77 | -ms-user-select: none; 78 | user-select: none; 79 | } 80 | 81 | .custom-header nav span:first-child { 82 | left: 5px; 83 | } 84 | 85 | .custom-header nav span:last-child { 86 | right: 5px; 87 | } 88 | 89 | .custom-header nav span:before { 90 | font-family: 'fontawesome-selected'; 91 | color: #ef4f69; 92 | position: absolute; 93 | text-align: center; 94 | width: 100%; 95 | } 96 | 97 | .custom-header nav span.custom-prev:before { 98 | content: '\25c2'; 99 | } 100 | 101 | .custom-header nav span.custom-next:before { 102 | content: '\25b8'; 103 | } 104 | 105 | .custom-header nav span:hover:before { 106 | color: #495468; 107 | } 108 | 109 | .custom-content-reveal { 110 | background: #f6f6f6; 111 | background: rgba(246, 246, 246, 0.9); 112 | width: 100%; 113 | height: 100%; 114 | position: absolute; 115 | z-index: 100; 116 | top: 100%; 117 | left: 0px; 118 | text-align: center; 119 | -webkit-transition: all 0.6s ease-in-out; 120 | -moz-transition: all 0.6s ease-in-out; 121 | -o-transition: all 0.6s ease-in-out; 122 | -ms-transition: all 0.6s ease-in-out; 123 | transition: all 0.6s ease-in-out; 124 | } 125 | 126 | .custom-content-reveal span.custom-content-close { 127 | position: absolute; 128 | top: 15px; 129 | right: 10px; 130 | width: 20px; 131 | height: 20px; 132 | text-align: center; 133 | background: #ef4f69; 134 | box-shadow: 0 1px 1px rgba(0,0,0,0.1); 135 | cursor: pointer; 136 | line-height: 13px; 137 | padding: 0; 138 | } 139 | 140 | .custom-content-reveal span.custom-content-close:after { 141 | content: 'x'; 142 | font-size: 18px; 143 | color: #fff; 144 | } 145 | 146 | .custom-content-reveal a, 147 | .custom-content-reveal span { 148 | font-size: 22px; 149 | padding: 10px 30px; 150 | display: block; 151 | } 152 | 153 | .custom-content-reveal h4 { 154 | text-transform: uppercase; 155 | font-size: 13px; 156 | font-weight: 300; 157 | letter-spacing: 3px; 158 | color: #777; 159 | padding: 20px; 160 | background: #fff; 161 | border-bottom: 1px solid #ddd; 162 | border-top: 5px solid #ef4f69; 163 | box-shadow: 0 1px rgba(255,255,255,0.9); 164 | margin-bottom: 30px; 165 | } 166 | 167 | .custom-content-reveal span { 168 | color: #888; 169 | } 170 | 171 | .custom-content-reveal a { 172 | color: #ef4f69; 173 | } 174 | 175 | .custom-content-reveal time{ 176 | display: none; 177 | } 178 | 179 | .custom-content-reveal a:hover { 180 | color: #333; 181 | } 182 | 183 | /* Modifications */ 184 | 185 | .fc-calendar-container { 186 | height: 400px; 187 | width: auto; 188 | padding: 30px; 189 | background: #f6f6f6; 190 | box-shadow: inset 0 1px rgba(255,255,255,0.8); 191 | } 192 | 193 | .fc-calendar .fc-head { 194 | background: transparent; 195 | color: #ef4f69; 196 | font-weight: bold; 197 | text-transform: uppercase; 198 | font-size: 12px; 199 | } 200 | 201 | .fc-calendar .fc-row > div { 202 | background: #fff; 203 | cursor: pointer; 204 | } 205 | 206 | .fc-calendar .fc-row > div:empty { 207 | background: transparent; 208 | cursor: default; 209 | } 210 | 211 | .fc-calendar .fc-row > div > span.fc-date { 212 | top: 50%; 213 | left: 50%; 214 | text-align: center; 215 | margin: -10px 0 0 -15px; 216 | color: #686a6e; 217 | font-weight: 400; 218 | pointer-events: none; 219 | } 220 | 221 | .fc-calendar .fc-row > div > span.fc-emptydate { 222 | color: #ccc; 223 | } 224 | 225 | .fc-calendar .fc-row > div.fc-today { 226 | background: #ef4f69; 227 | box-shadow: inset 0 -1px 1px rgba(0,0,0,0.1); 228 | } 229 | 230 | .fc-calendar .fc-row > div.fc-today > span.fc-date { 231 | color: #fff; 232 | text-shadow: 0 1px 1px rgba(0,0,0,0.1); 233 | } 234 | 235 | .fc-calendar .fc-row > div.fc-content:after { 236 | content: '\00B7'; 237 | text-align: center; 238 | width: 20px; 239 | margin-left: -10px; 240 | position: absolute; 241 | color: #DDD; 242 | font-size: 70px; 243 | line-height: 20px; 244 | left: 50%; 245 | bottom: 3px; 246 | } 247 | 248 | .fc-calendar .fc-row > div.fc-today.fc-content:after { 249 | color: #b02c42; 250 | } 251 | 252 | .fc-calendar .fc-row > div.fc-content:hover:after{ 253 | color: #ef4f69; 254 | } 255 | 256 | .fc-calendar .fc-row > div.fc-today.fc-content:hover:after{ 257 | color: #fff; 258 | } 259 | 260 | .fc-calendar .fc-row > div > div a, 261 | .fc-calendar .fc-row > div > div span { 262 | display: none; 263 | font-size: 22px; 264 | } 265 | 266 | @media screen and (max-width: 400px) { 267 | .fc-calendar-container { 268 | height: 300px; 269 | } 270 | .fc-calendar .fc-row > div > span.fc-date { 271 | font-size: 15px; 272 | } 273 | } 274 | -------------------------------------------------------------------------------- /index3.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Flexible Calendar 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 27 |
28 |

Calendario It just got more flexible

29 | 35 |
36 |
37 |
38 |
39 |
40 | 44 |

45 |

46 |
47 |
48 |
49 |
50 |
51 |
52 | 53 | 54 | 55 | 56 | 116 | 117 | 118 | -------------------------------------------------------------------------------- /index2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Flexible Calendar 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 27 |
28 |

Calendario It just got more flexible

29 | 35 |
36 |
37 |
38 |
39 |
40 | 44 |

45 |

46 |
47 |
48 |
49 |
50 |
51 |
52 | 53 | 54 | 55 | 129 | 130 | 131 | -------------------------------------------------------------------------------- /css/custom_4.css: -------------------------------------------------------------------------------- 1 | /* Header Style */ 2 | .codrops-top { 3 | line-height: 24px; 4 | font-size: 11px; 5 | background: #fff; 6 | background: rgba(255, 255, 255, 0.5); 7 | text-transform: uppercase; 8 | z-index: 9999; 9 | position: relative; 10 | box-shadow: 1px 0px 2px rgba(0,0,0,0.2); 11 | } 12 | 13 | .codrops-top a { 14 | padding: 0px 10px; 15 | letter-spacing: 1px; 16 | color: #333; 17 | display: inline-block; 18 | } 19 | 20 | .codrops-top a:hover { 21 | background: rgba(255,255,255,0.8); 22 | color: #000; 23 | } 24 | 25 | .codrops-top span.right { 26 | float: right; 27 | } 28 | 29 | .codrops-top span.right a { 30 | float: left; 31 | display: block; 32 | } 33 | 34 | /* Demo Buttons Style */ 35 | .codrops-demos { 36 | float: right; 37 | } 38 | 39 | .codrops-demos a { 40 | display: inline-block; 41 | margin: 10px; 42 | color: inherit; 43 | font-weight: 700; 44 | line-height: 30px; 45 | border-bottom: 4px solid transparent; 46 | } 47 | 48 | .codrops-demos a:hover { 49 | color: #000; 50 | border-color: #000; 51 | } 52 | 53 | .codrops-demos a.current-demo, 54 | .codrops-demos a.current-demo:hover { 55 | color: rgba(108,191,238,0.5); 56 | border-color: rgba(108,191,238,0.5); 57 | } 58 | 59 | .container header { 60 | padding: 30px 30px 0 30px; 61 | } 62 | 63 | .container header h1 { 64 | font-size: 34px; 65 | line-height: 38px; 66 | margin: 0; 67 | font-weight: 700; 68 | float: left; 69 | } 70 | 71 | .container header h1 span { 72 | font-size: 18px; 73 | font-weight: 300; 74 | display: block; 75 | } 76 | 77 | /* Custom calendar elements */ 78 | 79 | .custom-calendar-wrap { 80 | margin: 10px auto; 81 | margin-top: 0; 82 | position: relative; 83 | overflow: hidden; 84 | -moz-box-shadow: 0 4px 5px 4px #ccc; 85 | -webkit-box-shadow: 0 4px 5px 4px #ccc; 86 | box-shadow: 0 4px 5px 4px #ccc; 87 | } 88 | 89 | .custom-inner { 90 | background: #fff; 91 | box-shadow: 0 1px 3px rgba(0,0,0,0.2); 92 | } 93 | 94 | .custom-inner:before, 95 | .custom-inner:after { 96 | content: ''; 97 | width: 99%; 98 | height: 50%; 99 | position: absolute; 100 | background: #f6f6f6; 101 | bottom: -4px; 102 | left: 0.5%; 103 | z-index: -1; 104 | box-shadow: 0 1px 3px rgba(0,0,0,0.2); 105 | } 106 | 107 | .custom-inner:after { 108 | content: ''; 109 | width: 98%; 110 | bottom: -7px; 111 | left: 1%; 112 | z-index: -2; 113 | } 114 | 115 | .custom-header { 116 | background: #fff; 117 | padding: 5px 10px 10px 20px; 118 | height: 70px; 119 | position: relative; 120 | border-top: 5px solid #3594cb; 121 | border-bottom: 1px solid #ddd; 122 | } 123 | 124 | .custom-header h2, 125 | .custom-header h3 { 126 | text-align: center; 127 | text-transform: uppercase; 128 | margin: 0; 129 | } 130 | 131 | .custom-header h2 { 132 | color: #495468; 133 | font-weight: 300; 134 | font-size: 18px; 135 | margin-top: 10px; 136 | } 137 | 138 | .custom-header h3 { 139 | font-size: 10px; 140 | font-weight: 700; 141 | color: #b7bbc2; 142 | } 143 | 144 | .custom-header nav span { 145 | position: absolute; 146 | top: 17px; 147 | width: 30px; 148 | height: 30px; 149 | color: transparent; 150 | cursor: pointer; 151 | margin: 0 1px; 152 | font-size: 20px; 153 | line-height: 30px; 154 | -webkit-touch-callout: none; 155 | -webkit-user-select: none; 156 | -khtml-user-select: none; 157 | -moz-user-select: none; 158 | -ms-user-select: none; 159 | user-select: none; 160 | } 161 | 162 | .custom-header nav span:first-child { 163 | left: 5px; 164 | } 165 | 166 | .custom-header nav span:last-child { 167 | right: 5px; 168 | } 169 | 170 | .custom-header nav span:before { 171 | font-family: 'fontawesome-selected'; 172 | color: #3594cb; 173 | position: absolute; 174 | text-align: center; 175 | width: 100%; 176 | } 177 | 178 | .custom-header nav span.custom-prev:before { 179 | content: '\25c2'; 180 | } 181 | 182 | .custom-header nav span.custom-next:before { 183 | content: '\25b8'; 184 | } 185 | 186 | .custom-header nav span:hover:before { 187 | color: #6cbfee; 188 | } 189 | 190 | .custom-content-reveal { 191 | background: #f6f6f6; 192 | background: rgba(246, 246, 246, 0.9); 193 | width: 100%; 194 | height: 100%; 195 | position: absolute; 196 | z-index: 100; 197 | top: 100%; 198 | left: 0px; 199 | text-align: center; 200 | -webkit-transition: all 0.6s ease-in-out; 201 | -moz-transition: all 0.6s ease-in-out; 202 | -o-transition: all 0.6s ease-in-out; 203 | -ms-transition: all 0.6s ease-in-out; 204 | transition: all 0.6s ease-in-out; 205 | } 206 | 207 | .custom-content-reveal span.custom-content-close { 208 | position: absolute; 209 | top: 15px; 210 | right: 10px; 211 | width: 20px; 212 | height: 20px; 213 | text-align: center; 214 | background: #ef4f69; 215 | box-shadow: 0 1px 1px rgba(0,0,0,0.1); 216 | cursor: pointer; 217 | line-height: 13px; 218 | padding: 0; 219 | } 220 | 221 | .custom-content-reveal span.custom-content-close:after { 222 | content: 'x'; 223 | font-size: 18px; 224 | color: #fff; 225 | } 226 | 227 | .custom-content-reveal a, 228 | .custom-content-reveal span { 229 | font-size: 22px; 230 | padding: 10px 30px; 231 | display: block; 232 | } 233 | 234 | .custom-content-reveal h4 { 235 | text-transform: uppercase; 236 | font-size: 13px; 237 | font-weight: 300; 238 | letter-spacing: 3px; 239 | color: #777; 240 | padding: 20px; 241 | background: #fff; 242 | border-bottom: 1px solid #ddd; 243 | border-top: 5px solid #ef4f69; 244 | box-shadow: 0 1px rgba(255,255,255,0.9); 245 | margin-bottom: 30px; 246 | } 247 | 248 | .custom-content-reveal span { 249 | color: #888; 250 | } 251 | 252 | .custom-content-reveal a { 253 | color: #ef4f69; 254 | } 255 | 256 | .custom-content-reveal time{ 257 | display: none; 258 | } 259 | 260 | .custom-content-reveal a:hover { 261 | color: #333; 262 | } 263 | 264 | /* Modifications */ 265 | 266 | .fc-calendar-container { 267 | height: 400px; 268 | width: auto; 269 | padding: 30px; 270 | background: #f6f6f6; 271 | box-shadow: inset 0 1px rgba(255,255,255,0.8); 272 | } 273 | 274 | .fc-calendar .fc-head { 275 | background: transparent; 276 | color: #3594cb; 277 | font-weight: bold; 278 | text-transform: uppercase; 279 | font-size: 12px; 280 | } 281 | 282 | .fc-calendar .fc-row > div { 283 | background: #fff; 284 | cursor: pointer; 285 | } 286 | 287 | .fc-calendar .fc-row > div:empty { 288 | background: transparent; 289 | cursor: default; 290 | } 291 | 292 | .fc-calendar .fc-row > div > span.fc-date { 293 | top: 50%; 294 | left: 50%; 295 | text-align: center; 296 | margin: -10px 0 0 -15px; 297 | color: #686a6e; 298 | font-weight: 400; 299 | pointer-events: none; 300 | } 301 | 302 | .fc-calendar .fc-row > div > span.fc-emptydate { 303 | color: #ccc; 304 | } 305 | 306 | .fc-calendar .fc-row > div.fc-today { 307 | background: #6cbfee; 308 | box-shadow: inset 0 -1px 1px rgba(0,0,0,0.1); 309 | } 310 | 311 | .fc-calendar .fc-row > div.fc-today > span.fc-date { 312 | color: #fff; 313 | text-shadow: 0 1px 1px rgba(0,0,0,0.1); 314 | } 315 | 316 | .fc-calendar .fc-row > div.fc-content:after { 317 | content: '\00B7'; 318 | text-align: center; 319 | width: 20px; 320 | margin-left: -10px; 321 | position: absolute; 322 | color: #DDD; 323 | font-size: 70px; 324 | line-height: 20px; 325 | left: 50%; 326 | bottom: 3px; 327 | } 328 | 329 | .fc-calendar .fc-row > div.fc-today.fc-content:after { 330 | color: #3594cb; 331 | } 332 | 333 | .fc-calendar .fc-row > div.fc-content:hover:after{ 334 | color: #ef4f69; 335 | } 336 | 337 | .fc-calendar .fc-row > div.fc-today.fc-content:hover:after{ 338 | color: #fff; 339 | } 340 | 341 | .fc-calendar .fc-row > div > div a, 342 | .fc-calendar .fc-row > div > div span { 343 | display: none; 344 | font-size: 22px; 345 | } 346 | 347 | @media screen and (max-width: 400px) { 348 | .fc-calendar-container { 349 | height: 300px; 350 | } 351 | .fc-calendar .fc-row > div > span.fc-date { 352 | font-size: 15px; 353 | } 354 | } 355 | -------------------------------------------------------------------------------- /js/modernizr.custom.63321.js: -------------------------------------------------------------------------------- 1 | /* Modernizr 2.6.2 (Custom Build) | MIT & BSD 2 | * Build: http://modernizr.com/download/#-csstransitions-touch-shiv-cssclasses-prefixed-teststyles-testprop-testallprops-prefixes-domprefixes-load 3 | */ 4 | ;window.Modernizr=function(a,b,c){function z(a){j.cssText=a}function A(a,b){return z(m.join(a+";")+(b||""))}function B(a,b){return typeof a===b}function C(a,b){return!!~(""+a).indexOf(b)}function D(a,b){for(var d in a){var e=a[d];if(!C(e,"-")&&j[e]!==c)return b=="pfx"?e:!0}return!1}function E(a,b,d){for(var e in a){var f=b[a[e]];if(f!==c)return d===!1?a[e]:B(f,"function")?f.bind(d||b):f}return!1}function F(a,b,c){var d=a.charAt(0).toUpperCase()+a.slice(1),e=(a+" "+o.join(d+" ")+d).split(" ");return B(b,"string")||B(b,"undefined")?D(e,b):(e=(a+" "+p.join(d+" ")+d).split(" "),E(e,b,c))}var d="2.6.2",e={},f=!0,g=b.documentElement,h="modernizr",i=b.createElement(h),j=i.style,k,l={}.toString,m=" -webkit- -moz- -o- -ms- ".split(" "),n="Webkit Moz O ms",o=n.split(" "),p=n.toLowerCase().split(" "),q={},r={},s={},t=[],u=t.slice,v,w=function(a,c,d,e){var f,i,j,k,l=b.createElement("div"),m=b.body,n=m||b.createElement("body");if(parseInt(d,10))while(d--)j=b.createElement("div"),j.id=e?e[d]:h+(d+1),l.appendChild(j);return f=["­",'"].join(""),l.id=h,(m?l:n).innerHTML+=f,n.appendChild(l),m||(n.style.background="",n.style.overflow="hidden",k=g.style.overflow,g.style.overflow="hidden",g.appendChild(n)),i=c(l,a),m?l.parentNode.removeChild(l):(n.parentNode.removeChild(n),g.style.overflow=k),!!i},x={}.hasOwnProperty,y;!B(x,"undefined")&&!B(x.call,"undefined")?y=function(a,b){return x.call(a,b)}:y=function(a,b){return b in a&&B(a.constructor.prototype[b],"undefined")},Function.prototype.bind||(Function.prototype.bind=function(b){var c=this;if(typeof c!="function")throw new TypeError;var d=u.call(arguments,1),e=function(){if(this instanceof e){var a=function(){};a.prototype=c.prototype;var f=new a,g=c.apply(f,d.concat(u.call(arguments)));return Object(g)===g?g:f}return c.apply(b,d.concat(u.call(arguments)))};return e}),q.touch=function(){var c;return"ontouchstart"in a||a.DocumentTouch&&b instanceof DocumentTouch?c=!0:w(["@media (",m.join("touch-enabled),("),h,")","{#modernizr{top:9px;position:absolute}}"].join(""),function(a){c=a.offsetTop===9}),c},q.csstransitions=function(){return F("transition")};for(var G in q)y(q,G)&&(v=G.toLowerCase(),e[v]=q[G](),t.push((e[v]?"":"no-")+v));return e.addTest=function(a,b){if(typeof a=="object")for(var d in a)y(a,d)&&e.addTest(d,a[d]);else{a=a.toLowerCase();if(e[a]!==c)return e;b=typeof b=="function"?b():b,typeof f!="undefined"&&f&&(g.className+=" "+(b?"":"no-")+a),e[a]=b}return e},z(""),i=k=null,function(a,b){function k(a,b){var c=a.createElement("p"),d=a.getElementsByTagName("head")[0]||a.documentElement;return c.innerHTML="x",d.insertBefore(c.lastChild,d.firstChild)}function l(){var a=r.elements;return typeof a=="string"?a.split(" "):a}function m(a){var b=i[a[g]];return b||(b={},h++,a[g]=h,i[h]=b),b}function n(a,c,f){c||(c=b);if(j)return c.createElement(a);f||(f=m(c));var g;return f.cache[a]?g=f.cache[a].cloneNode():e.test(a)?g=(f.cache[a]=f.createElem(a)).cloneNode():g=f.createElem(a),g.canHaveChildren&&!d.test(a)?f.frag.appendChild(g):g}function o(a,c){a||(a=b);if(j)return a.createDocumentFragment();c=c||m(a);var d=c.frag.cloneNode(),e=0,f=l(),g=f.length;for(;e",f="hidden"in a,j=a.childNodes.length==1||function(){b.createElement("a");var a=b.createDocumentFragment();return typeof a.cloneNode=="undefined"||typeof a.createDocumentFragment=="undefined"||typeof a.createElement=="undefined"}()}catch(c){f=!0,j=!0}})();var r={elements:c.elements||"abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",shivCSS:c.shivCSS!==!1,supportsUnknownElements:j,shivMethods:c.shivMethods!==!1,type:"default",shivDocument:q,createElement:n,createDocumentFragment:o};a.html5=r,q(b)}(this,b),e._version=d,e._prefixes=m,e._domPrefixes=p,e._cssomPrefixes=o,e.testProp=function(a){return D([a])},e.testAllProps=F,e.testStyles=w,e.prefixed=function(a,b,c){return b?F(a,b,c):F(a,"pfx")},g.className=g.className.replace(/(^|\s)no-js(\s|$)/,"$1$2")+(f?" js "+t.join(" "):""),e}(this,this.document),function(a,b,c){function d(a){return"[object Function]"==o.call(a)}function e(a){return"string"==typeof a}function f(){}function g(a){return!a||"loaded"==a||"complete"==a||"uninitialized"==a}function h(){var a=p.shift();q=1,a?a.t?m(function(){("c"==a.t?B.injectCss:B.injectJs)(a.s,0,a.a,a.x,a.e,1)},0):(a(),h()):q=0}function i(a,c,d,e,f,i,j){function k(b){if(!o&&g(l.readyState)&&(u.r=o=1,!q&&h(),l.onload=l.onreadystatechange=null,b)){"img"!=a&&m(function(){t.removeChild(l)},50);for(var d in y[c])y[c].hasOwnProperty(d)&&y[c][d].onload()}}var j=j||B.errorTimeout,l=b.createElement(a),o=0,r=0,u={t:d,s:c,e:f,a:i,x:j};1===y[c]&&(r=1,y[c]=[]),"object"==a?l.data=c:(l.src=c,l.type=a),l.width=l.height="0",l.onerror=l.onload=l.onreadystatechange=function(){k.call(this,r)},p.splice(e,0,u),"img"!=a&&(r||2===y[c]?(t.insertBefore(l,s?null:n),m(k,j)):y[c].push(l))}function j(a,b,c,d,f){return q=0,b=b||"j",e(a)?i("c"==b?v:u,a,b,this.i++,c,d,f):(p.splice(this.i++,0,a),1==p.length&&h()),this}function k(){var a=B;return a.loader={load:j,i:0},a}var l=b.documentElement,m=a.setTimeout,n=b.getElementsByTagName("script")[0],o={}.toString,p=[],q=0,r="MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNode,l=a.opera&&"[object Opera]"==o.call(a.opera),l=!!b.attachEvent&&!l,u=r?"object":l?"script":"img",v=l?"script":u,w=Array.isArray||function(a){return"[object Array]"==o.call(a)},x=[],y={},z={timeout:function(a,b){return b.length&&(a.timeout=b[0]),a}},A,B;B=function(a){function b(a){var a=a.split("!"),b=x.length,c=a.pop(),d=a.length,c={url:c,origUrl:c,prefixes:a},e,f,g;for(f=0;f div { 139 | background: #fff; 140 | cursor: pointer; 141 | } 142 | 143 | .fc-calendar .fc-row > div:empty { 144 | background: transparent; 145 | } 146 | 147 | .fc-calendar .fc-row > div > span.fc-date { 148 | top: 50%; 149 | left: 50%; 150 | text-align: center; 151 | margin: -10px 0 0 -15px; 152 | color: #686a6e; 153 | font-weight: 400; 154 | pointer-events: none; 155 | } 156 | 157 | .fc-calendar .fc-row > div > span.fc-emptydate { 158 | color: #ccc; 159 | } 160 | 161 | .fc-calendar .fc-row > div.fc-content { 162 | background: #efff70; 163 | box-shadow-bottom: inset 0 -1px 1px rgba(0,0,0,0.1); 164 | } 165 | 166 | .fc-calendar .fc-row > div.fc-content:hover { 167 | background: #efff99; 168 | } 169 | 170 | .fc-calendar .fc-row > div.fc-content > span.fc-date { 171 | color: #999; 172 | text-shadow: 0 1px 1px rgba(0,0,0,0.1); 173 | } 174 | 175 | .fc-calendar .fc-row > div.fc-today { 176 | background: #ef4f69; 177 | box-shadow: inset 0 -1px 1px rgba(0,0,0,0.1); 178 | } 179 | 180 | .fc-calendar .fc-row > div.fc-today > span.fc-date { 181 | color: #fff; 182 | text-shadow: 0 1px 1px rgba(0,0,0,0.1); 183 | } 184 | 185 | .fc-calendar .fc-row > div.fc-today.fc-content:after { 186 | content: '\00B7'; 187 | text-align: center; 188 | width: 20px; 189 | margin-left: -10px; 190 | position: absolute; 191 | color: #DDD; 192 | font-size: 70px; 193 | line-height: 20px; 194 | left: 50%; 195 | bottom: 3px; 196 | } 197 | 198 | .fc-calendar .fc-row > div.fc-today.fc-content:after { 199 | color: #b02c42; 200 | } 201 | 202 | .fc-calendar .fc-row > div.fc-today:hover{ 203 | background: #ef4f69; 204 | } 205 | 206 | .fc-calendar .fc-row > div.fc-today.fc-content:hover:after{ 207 | color: #fff; 208 | } 209 | 210 | .fc-calendar .fc-row > div > div a, 211 | .fc-calendar .fc-row > div > div span { 212 | display: none; 213 | font-size: 22px; 214 | } 215 | 216 | .popover { 217 | position: absolute; 218 | top: 0; 219 | left: 0; 220 | z-index: 1010; 221 | display: none; 222 | max-width: 276px; 223 | padding: 1px; 224 | text-align: left; 225 | white-space: normal; 226 | background-color: #ffffff; 227 | border: 1px solid #cccccc; 228 | border: 1px solid rgba(0, 0, 0, 0.2); 229 | border-radius: 6px; 230 | -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 231 | box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 232 | background-clip: padding-box; 233 | } 234 | 235 | .popover.top { 236 | margin-top: -10px; 237 | } 238 | 239 | .popover.right { 240 | margin-left: 10px; 241 | } 242 | 243 | .popover.bottom { 244 | margin-top: 10px; 245 | } 246 | 247 | .popover.left { 248 | margin-left: -10px; 249 | } 250 | 251 | .popover-title { 252 | padding: 8px 14px; 253 | margin: 0; 254 | font-size: 14px; 255 | font-weight: normal; 256 | line-height: 18px; 257 | background-color: #f7f7f7; 258 | border-bottom: 1px solid #ebebeb; 259 | border-radius: 5px 5px 0 0; 260 | } 261 | 262 | .popover-content { 263 | padding: 9px 14px; 264 | } 265 | 266 | .popover-content a, 267 | .popover-content span { 268 | display: block; 269 | } 270 | 271 | .popover-content time { 272 | display: none; 273 | } 274 | 275 | .popover .arrow, 276 | .popover .arrow:after { 277 | position: absolute; 278 | display: block; 279 | width: 0; 280 | height: 0; 281 | border-color: transparent; 282 | border-style: solid; 283 | } 284 | 285 | .popover .arrow { 286 | border-width: 11px; 287 | } 288 | 289 | .popover .arrow:after { 290 | border-width: 10px; 291 | content: ""; 292 | } 293 | 294 | .popover.top .arrow { 295 | bottom: -11px; 296 | left: 50%; 297 | margin-left: -11px; 298 | border-top-color: #999999; 299 | border-top-color: rgba(0, 0, 0, 0.25); 300 | border-bottom-width: 0; 301 | } 302 | 303 | .popover.top .arrow:after { 304 | bottom: 1px; 305 | margin-left: -10px; 306 | border-top-color: #ffffff; 307 | border-bottom-width: 0; 308 | content: " "; 309 | } 310 | 311 | .popover.right .arrow { 312 | top: 50%; 313 | left: -11px; 314 | margin-top: -11px; 315 | border-right-color: #999999; 316 | border-right-color: rgba(0, 0, 0, 0.25); 317 | border-left-width: 0; 318 | } 319 | 320 | .popover.right .arrow:after { 321 | bottom: -10px; 322 | left: 1px; 323 | border-right-color: #ffffff; 324 | border-left-width: 0; 325 | content: " "; 326 | } 327 | 328 | .popover.bottom .arrow { 329 | top: -11px; 330 | left: 50%; 331 | margin-left: -11px; 332 | border-bottom-color: #999999; 333 | border-bottom-color: rgba(0, 0, 0, 0.25); 334 | border-top-width: 0; 335 | } 336 | 337 | .popover.bottom .arrow:after { 338 | top: 1px; 339 | margin-left: -10px; 340 | border-bottom-color: #ffffff; 341 | border-top-width: 0; 342 | content: " "; 343 | } 344 | 345 | .popover.left .arrow { 346 | top: 50%; 347 | right: -11px; 348 | margin-top: -11px; 349 | border-left-color: #999999; 350 | border-left-color: rgba(0, 0, 0, 0.25); 351 | border-right-width: 0; 352 | } 353 | 354 | .popover.left .arrow:after { 355 | right: 1px; 356 | bottom: -10px; 357 | border-left-color: #ffffff; 358 | border-right-width: 0; 359 | content: " "; 360 | } 361 | 362 | .fade { 363 | opacity: 0; 364 | -webkit-transition: opacity 0.15s linear; 365 | transition: opacity 0.15s linear; 366 | } 367 | 368 | .fade.in { 369 | opacity: 1; 370 | } 371 | 372 | @media screen and (max-width: 400px) { 373 | .fc-calendar-container { 374 | height: 300px; 375 | } 376 | .fc-calendar .fc-row > div > span.fc-date { 377 | font-size: 15px; 378 | } 379 | } 380 | -------------------------------------------------------------------------------- /css/custom_1.css: -------------------------------------------------------------------------------- 1 | body { 2 | background: #cebe29; 3 | background: -moz-linear-gradient(-45deg, #cebe29 0%, #9b1f50 33%, #2989d8 71%, #89b4ff 91%); 4 | background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#cebe29), color-stop(33%,#9b1f50), color-stop(71%,#2989d8), color-stop(91%,#89b4ff)); 5 | background: -webkit-linear-gradient(-45deg, #cebe29 0%,#9b1f50 33%,#2989d8 71%,#89b4ff 91%); 6 | background: -o-linear-gradient(-45deg, #cebe29 0%,#9b1f50 33%,#2989d8 71%,#89b4ff 91%); 7 | background: -ms-linear-gradient(-45deg, #cebe29 0%,#9b1f50 33%,#2989d8 71%,#89b4ff 91%); 8 | background: linear-gradient(135deg, #cebe29 0%,#9b1f50 33%,#2989d8 71%,#89b4ff 91%); 9 | filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cebe29', endColorstr='#89b4ff',GradientType=1 ); 10 | -webkit-background-size: 100% 100%; 11 | -moz-background-size: 100% 100%; 12 | background-size: 100% 100%; 13 | } 14 | 15 | .custom-calendar-full { 16 | position: absolute; 17 | top: 24px; 18 | bottom: 0px; 19 | left: 0px; 20 | width: 100%; 21 | height: auto; 22 | } 23 | 24 | .fc-calendar-container { 25 | height: auto; 26 | bottom: 0px; 27 | width: 100%; 28 | top: 50px; 29 | position: absolute; 30 | } 31 | 32 | .custom-header { 33 | padding: 20px 20px 10px 30px; 34 | height: 50px; 35 | position: relative; 36 | } 37 | 38 | .custom-header h2, 39 | .custom-header h3 { 40 | float: left; 41 | font-weight: 300; 42 | text-transform: uppercase; 43 | letter-spacing: 4px; 44 | text-shadow: 1px 1px 0 rgba(0,0,0,0.1); 45 | } 46 | 47 | .custom-header h2 { 48 | color: #fff; 49 | width: 60%; 50 | } 51 | 52 | .custom-header h2 a, 53 | .custom-header h2 span { 54 | color: rgba(255,255,255,0.3); 55 | font-size: 18px; 56 | letter-spacing: 3px; 57 | white-space: nowrap; 58 | } 59 | 60 | .custom-header h2 a { 61 | color: rgba(255,255,255,0.5); 62 | } 63 | 64 | .no-touch .custom-header h2 a:hover { 65 | color: rgba(255,255,255,0.9); 66 | } 67 | 68 | .custom-header h3 { 69 | width: 40%; 70 | color: #ddd; 71 | color: rgba(255,255,255,0.6); 72 | font-weight: 300; 73 | line-height: 30px; 74 | text-align: right; 75 | padding-right: 125px; 76 | } 77 | 78 | .custom-header nav { 79 | position: absolute; 80 | right: 20px; 81 | top: 20px; 82 | -webkit-touch-callout: none; 83 | -webkit-user-select: none; 84 | -khtml-user-select: none; 85 | -moz-user-select: none; 86 | -ms-user-select: none; 87 | user-select: none; 88 | } 89 | 90 | .custom-header nav span { 91 | float: left; 92 | width: 30px; 93 | height: 30px; 94 | position: relative; 95 | color: transparent; 96 | cursor: pointer; 97 | background: rgba(255,255,255,0.3); 98 | margin: 0 1px; 99 | font-size: 20px; 100 | border-radius: 0 3px 3px 0; 101 | box-shadow: inset 0 1px rgba(255,255,255,0.2); 102 | } 103 | 104 | .custom-header nav span:first-child { 105 | border-radius: 3px 0 0 3px; 106 | } 107 | 108 | .custom-header nav span:hover { 109 | background: rgba(255,255,255,0.5); 110 | } 111 | 112 | .custom-header span:before { 113 | font-family: 'fontawesome-selected'; 114 | color: #fff; 115 | display: inline-block; 116 | text-align: center; 117 | width: 100%; 118 | text-indent: 4px; 119 | } 120 | 121 | .custom-header nav span.custom-prev:before { 122 | content: '\25c2'; 123 | } 124 | 125 | .custom-header nav span.custom-next:before { 126 | content: '\25b8'; 127 | } 128 | 129 | .custom-header nav span:last-child { 130 | margin-left: 20px; 131 | border-radius: 3px; 132 | } 133 | 134 | .custom-header nav span.custom-current:before { 135 | content: '\27a6'; 136 | } 137 | 138 | 139 | .fc-calendar { 140 | background: rgba(255,255,255,0.1); 141 | width: auto; 142 | top: 10px; 143 | bottom: 20px; 144 | left: 20px; 145 | right: 20px; 146 | height: auto; 147 | border-radius: 20px; 148 | position: absolute; 149 | } 150 | 151 | .fc-calendar .fc-head { 152 | background: rgba(255,255,255,0.2); 153 | color: rgba(255,255,255,0.9); 154 | box-shadow: inset 0 1px 0 rgba(255,255,255,0.2); 155 | border-radius: 20px 20px 0 0; 156 | height: 40px; 157 | line-height: 40px; 158 | padding: 0 20px; 159 | } 160 | 161 | .fc-calendar .fc-head > div { 162 | font-weight: 300; 163 | text-transform: uppercase; 164 | font-size: 14px; 165 | letter-spacing: 3px; 166 | text-shadow: 0 1px 1px rgba(0,0,0,0.4); 167 | } 168 | 169 | .fc-calendar .fc-row > div > span.fc-date { 170 | color: rgba(255,255,255,0.9); 171 | text-shadow: none; 172 | font-size: 26px; 173 | font-weight: 300; 174 | bottom: auto; 175 | right: auto; 176 | top: 10px; 177 | left: 10px; 178 | text-align: left; 179 | text-shadow: 0 1px 1px rgba(0,0,0,0.3); 180 | } 181 | 182 | .fc-calendar .fc-row > div > span.fc-emptydate { 183 | color: rgba(255,255,255,0.4); 184 | } 185 | 186 | .fc-calendar .fc-body { 187 | border: none; 188 | padding: 20px; 189 | } 190 | 191 | .fc-calendar .fc-row { 192 | box-shadow: inset 0 -1px 0 rgba(255,255,255,0.2); 193 | border: none; 194 | } 195 | 196 | .fc-calendar .fc-row:last-child { 197 | box-shadow: none; 198 | } 199 | 200 | .fc-calendar .fc-row:first-child > div:first-child { 201 | border-radius: 10px 0 0 0; 202 | } 203 | 204 | .fc-calendar .fc-row:first-child > div:last-child { 205 | border-radius: 0 10px 0 0; 206 | } 207 | 208 | .fc-calendar .fc-row:last-child > div:first-child { 209 | border-radius: 0 0 0 10px; 210 | } 211 | 212 | .fc-calendar .fc-row:last-child > div:last-child { 213 | border-radius: 0 0 10px 0; 214 | } 215 | 216 | .fc-calendar .fc-row > div { 217 | box-shadow: -1px 0 0 rgba(255, 255, 255, 0.2); 218 | border: none; 219 | padding: 10px; 220 | cursor: pointer; 221 | } 222 | 223 | .fc-calendar .fc-row > div:first-child{ 224 | box-shadow: none; 225 | } 226 | 227 | .fc-calendar .fc-row > div.fc-today { 228 | background: transparent; 229 | box-shadow: inset 0 0 100px rgba(255,255,255,0.1); 230 | } 231 | 232 | .fc-calendar .fc-row > div.fc-today:after { 233 | content: ''; 234 | display: block; 235 | position: absolute; 236 | top: 0; 237 | left: 0; 238 | width: 100%; 239 | height: 100%; 240 | opacity: 0.2; 241 | background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0.15)), to(rgba(0, 0, 0, 0.25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, .15)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0))); 242 | background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0)); 243 | background: -o-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), -o-llinear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0)); 244 | background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), -ms-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0)); 245 | background: linear-gradient(top, rgba(255, 255, 255, 0.15), rgba(0, 0, 0, 0.25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0)); 246 | } 247 | 248 | .fc-calendar .fc-row > div > div { 249 | margin-top: 35px; 250 | } 251 | 252 | .fc-calendar .fc-row > div > div a, 253 | .fc-calendar .fc-row > div > div span { 254 | color: rgba(255,255,255,0.7); 255 | font-size: 12px; 256 | text-transform: uppercase; 257 | display: inline-block; 258 | padding: 3px 5px; 259 | border-radius: 3px; 260 | white-space: nowrap; 261 | overflow: hidden; 262 | text-overflow: ellipsis; 263 | max-width: 100%; 264 | margin-bottom: 1px; 265 | background: rgba(255,255,255,0.1); 266 | } 267 | 268 | .no-touch .fc-calendar .fc-row > div > div a:hover { 269 | background: rgba(255,255,255,0.3); 270 | } 271 | 272 | @media screen and (max-width: 880px) , screen and (max-height: 450px) { 273 | html, body, .container { 274 | height: auto; 275 | } 276 | 277 | .custom-header, 278 | .custom-header nav, 279 | .custom-calendar-full, 280 | .fc-calendar-container, 281 | .fc-calendar, 282 | .fc-calendar .fc-head, 283 | .fc-calendar .fc-row > div > span.fc-date { 284 | position: relative; 285 | top: auto; 286 | left: auto; 287 | bottom: auto; 288 | right: auto; 289 | height: auto; 290 | width: auto; 291 | } 292 | 293 | .fc-calendar { 294 | margin: 0 20px 20px; 295 | } 296 | 297 | .custom-header h2, 298 | .custom-header h3 { 299 | float: none; 300 | width: auto; 301 | text-align: left; 302 | padding-right: 100px; 303 | } 304 | 305 | .fc-calendar .fc-row, 306 | .ie9 .fc-calendar .fc-row > div, 307 | .fc-calendar .fc-row > div { 308 | height: auto; 309 | width: 100%; 310 | border: none; 311 | } 312 | 313 | .fc-calendar .fc-row > div { 314 | float: none; 315 | min-height: 50px; 316 | box-shadow: inset 0 -1px rgba(255,255,255,0.2) !important; 317 | border-radius: 0px !important; 318 | } 319 | 320 | .fc-calendar .fc-row > div:empty{ 321 | min-height: 0; 322 | height: 0; 323 | box-shadow: none !important; 324 | padding: 0; 325 | } 326 | 327 | .fc-calendar .fc-row { 328 | box-shadow: none; 329 | } 330 | 331 | .fc-calendar .fc-head { 332 | display: none; 333 | } 334 | 335 | .fc-calendar .fc-row > div > div { 336 | margin-top: 0px; 337 | padding-left: 10px; 338 | max-width: 70%; 339 | display: inline-block; 340 | } 341 | 342 | .fc-calendar .fc-row > div.fc-today { 343 | background: rgba(255, 255, 255, 0.2); 344 | } 345 | 346 | .fc-calendar .fc-row > div.fc-today:after { 347 | display: none; 348 | } 349 | 350 | .fc-calendar .fc-row > div > span.fc-date { 351 | width: 30px; 352 | display: inline-block; 353 | text-align: right; 354 | } 355 | 356 | .fc-calendar .fc-row > div > span.fc-weekday { 357 | display: inline-block; 358 | width: 40px; 359 | color: #fff; 360 | color: rgba(255,255,255,0.7); 361 | font-size: 10px; 362 | text-transform: uppercase; 363 | } 364 | } 365 | -------------------------------------------------------------------------------- /js/jquery.calendario.min.js: -------------------------------------------------------------------------------- 1 | (function(e,t,n){"use strict";e.Calendario=function(t,n){this.$el=e(n);this._init(t)};e.Calendario.defaults={weeks:["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],weekabbrs:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],months:["January","February","March","April","May","June","July","August","September","October","November","December"],monthabbrs:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"],displayWeekAbbr:false,displayMonthAbbr:false,startIn:1,events:"click",fillEmpty:true,feedParser:"./feed/",zone:"00:00",checkUpdate:true};e.Calendario.prototype={_init:function(t){this.VERSION="3.2.0";this.UNIQUE="%{unique}%";this.options=e.extend(true,{},e.Calendario.defaults,t);this.today=new Date;this.month=isNaN(this.options.month)||this.options.month===null?this.today.getMonth():this.options.month-1;this.year=isNaN(this.options.year)||this.options.year===null?this.today.getFullYear():this.options.year;this.caldata=this._processCaldata(this.options.caldata);if(parseFloat(e().jquery)>=1.9&&this.options.events.indexOf("hover")!=-1)this.logError("'hover' psuedo-name is not supported"+" in jQuery 1.9+. Use 'mouseenter' 'mouseleave' events instead.");this.options.events=this.options.events.split(",");this.options.zone=this.options.zone.charAt(0)!="+"&&this.options.zone.charAt(0)!="-"?"+"+this.options.zone:this.options.zone;this._generateTemplate(true);this._initEvents()},_processCaldataObj:function(t,r){if(typeof t!=="object")t={content:t,startTime:"00:00",endTime:"23:59",allDay:true};if(!t.content)this.logError("Content is missing in date "+r);if(t.startTime&&!t.endTime)t.endTime=parseInt(t.startTime.split(":")[0])+1+":"+t.startTime.split(":")[1];if(!t.startTime&&!t.endTime)t=e.extend({},t,{startTime:"00:00",endTime:"23:59",allDay:true});if(t.startTime&&t.endTime&&t.allDay===n)t.allDay=false;if(/^\d{2}-DD-\d{4}/.test(r)||/^\d{2}-DD-YYYY/.test(r)){var i=/^(\d{2})-DD-(\d{4})/.exec(r)||/^(\d{2})-DD-YYYY/.exec(r),s;if(i.length==3)s=new Date(i[2],i[1],0);else if(i.length==2)s=new Date(this.year,i[1],0);if(!t.startDate)t.startDate=1;if(!t.endDate&&s.getDate()!=1)t.endDate=s.getDate();if(!t.endDate&&s.getDate()==1&&i.length==3)t.endDate=s.getDate()}return t},_processCaldata:function(t){var n=this;t=t||{};e.each(t,function(r,i){if(/^\d{2}-\d{2}-\d{4}/.test(r)||/^\d{2}-\d{2}-YYYY/.test(r)||/^\d{2}-DD-YYYY/.test(r)||/^MM-\d{2}-YYYY/.test(r)||/^\d{2}-DD-YYYY/.test(r)||/^MM-\d{2}-\d{4}/.test(r)||/^\d{2}-DD-\d{4}/.test(r)||r=="TODAY"){}else n.logError(r+" is an Invalid Date. Date should not contain spaces, should be separated by '-' and should be in the "+"format 'MM-DD-YYYY'. That ain't that difficult!");if(Array.isArray(i)){e.each(i,function(e,t){i[e]=n._processCaldataObj(t,r)});t[r]=i}else{t[r]=n._processCaldataObj(i,r)}});return t},_propDate:function(t,n){var r=t.index(),i={allDay:[],content:[],endTime:[],startTime:[]},s={day:t.children("span.fc-date").text(),month:this.month+1,monthname:this.options.displayMonthAbbr?this.options.monthabbrs[this.month]:this.options.months[this.month],year:this.year,weekday:r+this.options.startIn,weekdayname:this.options.weeks[r==6?0:r+this.options.startIn]};t.children("div.fc-calendar-events").children("div.fc-calendar-event").each(function(t,n){var r=e("
"+e(n).html()+"
");i.startTime[t]=new Date(r.find("time.fc-starttime").attr("datetime"));i.endTime[t]=new Date(r.find("time.fc-endtime").attr("datetime"));i.allDay[t]=r.find("time.fc-allday").attr("datetime")==="true"?true:false;r.find("time").remove();i.content[t]=r.html()});if(s.day)this.options[n](t,i,s)},_initEvents:function(){var t=this,r=[],i=[];for(var s=0;s div",function(n){if(n.type=="mouseenter"||n.type=="mouseleave")n.type=e.inArray(n.type,r)==-1?"hover":n.type;t._propDate(e(this),i[e.inArray(n.type,r)])})}this.$el.on("shown.calendar.calendario",function(e,n){if(n&&n.options.checkUpdate)t._checkUpdate()});this.$el.delay(new Date(this.today.getFullYear(),this.today.getMonth(),this.today.getDate()+1,0,0,0)-(new Date).getTime()).queue(function(){t.today=new Date;if(t.today.getMonth()==t.month||t.today.getMonth()+1==t.month)t._generateTemplate(true);t.$el.trigger(e.Event("newday.calendar.calendario"))})},_checkUpdate:function(){var t=this;e.getScript("https://raw.githubusercontent.com/codrops/Calendario/master/js/update.js").done(function(e,n){if(calendario.current!=t.version()&&parseFloat(calendario.current)>=parseFloat(t.version()))console.info(calendario.msg)}).fail(function(e,t,n){console.error(n)})},_generateTemplate:function(t,n){var r=this._getHead(),i=this._getBody(),s;switch(this.rowTotal){case 4:s="fc-four-rows";break;case 5:s="fc-five-rows";break;case 6:s="fc-six-rows";break}this.$cal=e('
').append(r,i);this.$el.find("div.fc-calendar").remove().end().append(this.$cal);this.$el.find(".fc-emptydate").parent().css({background:"transparent",cursor:"default"});if(!t)this.$el.trigger(e.Event("shown.calendario"));if(n)n.call()},_getHead:function(){var e='
';for(var t=0;t<=6;t++){var n=t+this.options.startIn,r=n>6?n-6-1:n;e+="
"+(this.options.displayWeekAbbr?this.options.weekabbrs[r]:this.options.weeks[r])+"
"}return e+"
"},_parseDataToDay:function(e,t,n){var r="";if(!n){if(Array.isArray(e))r=this._convertDayArray(e,t);else r=this._wrapDay(e,t,true)}else{if(!Array.isArray(e))e=[e];for(var i=0;i=e[i].startDate&&t<=e[i].endDate)r+=this._wrapDay(e[i],t,true);else if(this.month==1&&t>=e[i].startDate){if(e[i].endDate&&t<=e[i].endDate)r+=this._wrapDay(e[i],t,true);else if(!e[i].endDate)r+=this._wrapDay(e[i],t,true)}}}return r},_toDateTime:function(e,t,n){var r=parseInt(this.options.zone.split(":")[0]),i=parseInt(this.options.zone.charAt(0)+this.options.zone.split(":")[1]),s=parseInt(e.split(":")[0])-r,o=parseInt(e.split(":")[1])-i,u=new Date(Date.UTC(this.year,this.month,t,s,o,0,0));if(n){var a=parseInt(n.split(":")[0])-r,f=parseInt(n.split(":")[1])-i;if(u.getTime()-(new Date(Date.UTC(this.year,this.month,t,a,f,0,0))).getTime()<0)u=new Date(Date.UTC(this.year,this.month,t+1,s,o,0,0))}return u.toISOString()},_timeHtml:function(e,t){var n=e.content;n+='';n+='";n+='";return n},_wrapDay:function(e,t,n){if(t){if(n)return'
'+this._timeHtml(e,t)+"
";else return this._timeHtml(e,t)}else return'
'+e+"
"},_convertDayArray:function(e,t){var n=[];for(var r=0;r
'))},_getBody:function(){var e=new Date(this.year,this.month+1,0),t=e.getDate(),n=new Date(this.year,e.getMonth(),1),r=(new Date(this.year,this.month,0)).getDate();this.startingDay=n.getDay();var i='
',s=1;for(var o=0;o<7;o++){for(var u=0;u<=6;u++){var a=this.startingDay-this.options.startIn,f=a<0?6+a+1:a,l="",c=this.month===this.today.getMonth()&&this.year===this.today.getFullYear()&&s===this.today.getDate(),h=this.year0)){if(s>t){l=''+(s-t)+'';++s}else if(s==1){l=''+(r-f+1)+'';++r}l+=this.options.weekabbrs[u+this.options.startIn>6?u+this.options.startIn-6-1:u+this.options.startIn]+""}if(s<=t&&(o>0||u>=f)){l=''+s+''+this.options.weekabbrs[u+this.options.startIn>6?u+this.options.startIn-6-1:u+this.options.startIn]+"";var d=(this.month+1<10?"0"+(this.month+1):this.month+1)+"-"+(s<10?"0"+s:s)+"-"+this.year,v=this.caldata[d],m=(this.month+1<10?"0"+(this.month+1):this.month+1)+"-"+(s<10?"0"+s:s)+"-YYYY",g=this.caldata[m],y="MM-"+(s<10?"0"+s:s)+"-"+this.year,b=this.caldata[y],w="MM"+"-"+(s<10?"0"+s:s)+"-YYYY",E=this.caldata[w],S=(this.month+1<10?"0"+(this.month+1):this.month+1)+"-DD-"+this.year,x=this.caldata[S],T=(this.month+1<10?"0"+(this.month+1):this.month+1)+"-DD-YYYY",N=this.caldata[T];if(c&&this.caldata.TODAY)p+=this._parseDataToDay(this.caldata.TODAY,s);if(v)p+=this._parseDataToDay(v,s);if(b)p+=this._parseDataToDay(b,s);if(x)p+=this._parseDataToDay(x,s,true);if(N)p+=this._parseDataToDay(N,s,true);if(E)p+=this._parseDataToDay(E,s);if(g)p+=this._parseDataToDay(g,s);if(p!=="")l+='
'+p+"
";++s}else{c=false}var C=c?"fc-today ":"";if(h)C+="fc-past ";else C+="fc-future ";if(p!=="")C+="fc-content";i+=(C!==""?'
':"
")+l+"
"}if(s>t){this.rowTotal=o+1;break}else{i+='
'}}return i+"
"},_move:function(e,t,n){if(t==="previous"){if(e==="month"){this.year=this.month>0?this.year:--this.year;this.month=this.month>0?--this.month:11}else if(e==="year")this.year=--this.year}else if(t==="next"){if(e==="month"){this.year=this.month<11?this.year:++this.year;this.month=this.month<11?++this.month:0}else if(e==="year")this.year=++this.year}this._generateTemplate(false,n)},option:function(e,t){if(t)this.options[e]=t;else return this.options[e]},getYear:function(){return this.year},getMonth:function(){return this.month+1},getMonthName:function(){return this.options.displayMonthAbbr?this.options.monthabbrs[this.month]:this.options.months[this.month]},getCell:function(e){var t=Math.floor((e+this.startingDay-this.options.startIn-1)/7),n=e+this.startingDay-this.options.startIn-t*7-1;return this.$cal.find("div.fc-body").children("div.fc-row").eq(t).children("div").eq(n)},setData:function(t,n){t=this._processCaldata(t);if(n)this.caldata=t;else e.extend(this.caldata,t);this._generateTemplate(false)},gotoNow:function(e){this.month=this.today.getMonth();this.year=this.today.getFullYear();this._generateTemplate(false,e)},gotoMonth:function(e,t,n){this.month=e-1;this.year=t;this._generateTemplate(false,n)},gotoPreviousMonth:function(e){this._move("month","previous",e)},gotoPreviousYear:function(e){this._move("year","previous",e)},gotoNextMonth:function(e){this._move("month","next",e)},gotoNextYear:function(e){this._move("year","next",e)},feed:function(t){var n=this;e.post(n.options.feedParser,{dates:this.caldata}).always(function(e){if(t)t.call(this,JSON.parse(e).hevent)})},version:function(){return this.VERSION}};var r=function(e){throw new Error(e)};e.fn.calendario=function(t){var n=e.data(this,"calendario");if(typeof t==="string"){var i=Array.prototype.slice.call(arguments,1);this.each(function(){if(!n){r("Cannot call methods on calendario prior to initialization; Attempted to call method '"+t+"'");return}if(!e.isFunction(n[t])||t.charAt(0)==="_"){r("No such method '"+t+"' for calendario instance.")}n[t].apply(n,i)})}else{this.each(function(){if(n)n._init();else n=e.data(this,"calendario",new e.Calendario(t,this))})}n.$el.trigger(e.Event("shown.calendar.calendario"),[n]);return n}})(jQuery,window) 2 | -------------------------------------------------------------------------------- /index4.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Flexible Calendar 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 27 |
28 |
29 |
30 |
31 | 35 |

36 |

37 |
38 |
39 |
40 |
41 |
42 |

Calendario It just got more flexible

43 | 49 |
50 |
    51 |
  • 52 | 53 |
  • 54 |
  • 55 | 56 |
  • 57 |
  • 58 | 59 |
  • 60 |
  • 61 | 62 |
  • 63 |
  • 64 | 65 |
  • 66 |
  • 67 | 68 |
  • 69 |
  • 70 | 71 |
  • 72 |
  • 73 | 74 |
  • 75 |
  • 76 | 77 |
  • 78 |
  • 79 | 80 |
  • 81 |
  • 82 | 83 |
  • 84 |
  • 85 | 86 |
  • 87 |
  • 88 | 89 |
  • 90 |
  • 91 | 92 |
  • 93 |
  • 94 | 95 |
  • 96 |
  • 97 | 98 |
  • 99 |
  • 100 | 101 |
  • 102 |
  • 103 | 104 |
  • 105 |
  • 106 | 107 |
  • 108 |
  • 109 | 110 |
  • 111 |
  • 112 | 113 |
  • 114 |
  • 115 | 116 |
  • 117 |
  • 118 | 119 |
  • 120 |
  • 121 | 122 |
  • 123 |
  • 124 | 125 |
  • 126 |
127 |
128 |
129 | 130 | 131 | 132 | 244 | 245 | 246 | -------------------------------------------------------------------------------- /js/jquery.calendario.js: -------------------------------------------------------------------------------- 1 | /** 2 | * jquery.calendario.js v3.2.0 3 | * http://www.codrops.com 4 | * 5 | * Licensed under the MIT license. 6 | * http://www.opensource.org/licenses/mit-license.php 7 | * 8 | * Copyright 2014, Codrops 9 | * http://www.codrops.com 10 | * 11 | * || Notable Changes || 12 | * Calendario gets more flexible : Boží Ďábel (https://github.com/deviprsd21) (https://github.com/codrops/Calendario/pull/11) 13 | * Multiple Events : Mattias Lyckne (https://github.com/olyckne) (https://github.com/codrops/Calendario/pull/22) 14 | * Flexibility In-built : Boží Ďábel (https://github.com/deviprsd21) (https://github.com/codrops/Calendario/pull/23) 15 | * Now with Time : Boží Ďábel (https://github.com/deviprsd21) (https://github.com/codrops/Calendario/pull/25) 16 | */ 17 | ;(function($, window, undefined){ 18 | 'use strict'; 19 | 20 | $.Calendario = function(options, element){ 21 | this.$el = $(element); 22 | this._init(options); 23 | }; 24 | 25 | // the options 26 | $.Calendario.defaults = { 27 | /* 28 | you can also pass: 29 | month : initialize calendar with this month (1-12). Default is today. 30 | year : initialize calendar with this year. Default is today. 31 | caldata : initial data/content for the calendar. 32 | caldata format: 33 | { 34 | 'MM-DD-YYYY' : 'HTML Content', 35 | 'MM-DD-YYYY' : 'HTML Content', 36 | ... 37 | } 38 | */ 39 | weeks : ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], 40 | weekabbrs : ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], 41 | months : ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], 42 | monthabbrs : ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], 43 | displayWeekAbbr : false, // choose between values in options.weeks or options.weekabbrs 44 | displayMonthAbbr : false, // choose between values in options.months or options.monthabbrs 45 | startIn : 1, // left most day in the calendar (0 - Sunday, 1 - Monday, ... , 6 - Saturday) 46 | events: 'click', 47 | fillEmpty: true, 48 | feedParser: './feed/', 49 | zone: '00:00', // Ex: IST zone time is '+05:30' by default it is GMT, Sign is important. 50 | checkUpdate: true //Check if any new version of Calendario is released (Details will be in the browser console) 51 | }; 52 | 53 | $.Calendario.prototype = { 54 | _init : function(options){ 55 | // options 56 | this.VERSION = '3.2.0'; 57 | this.UNIQUE = '%{unique}%'; //UNIQUE helps us differentiate your js from others and help us keep a track of run time. 58 | this.options = $.extend(true, {}, $.Calendario.defaults, options); 59 | this.today = new Date(); 60 | this.month = (isNaN(this.options.month) || this.options.month === null) ? this.today.getMonth() : this.options.month - 1; 61 | this.year = (isNaN(this.options.year) || this.options.year === null) ? this.today.getFullYear() : this.options.year; 62 | this.caldata = this._processCaldata(this.options.caldata); 63 | // if hover is passed as an event then throw error if jQuery is 1.9 or above 1.9, because, hover psuedo name isn't supported 64 | if(parseFloat($().jquery) >= 1.9 && this.options.events.indexOf('hover') != -1) 65 | this.logError('\'hover\' psuedo-name is not supported' + ' in jQuery 1.9+. Use \'mouseenter\' \'mouseleave\' events instead.'); 66 | 67 | this.options.events = this.options.events.split(','); 68 | this.options.zone = this.options.zone.charAt(0) != '+' && this.options.zone.charAt(0) != '-' ? '+' + this.options.zone : this.options.zone; 69 | this._generateTemplate(true); 70 | this._initEvents(); 71 | }, 72 | 73 | _processCaldataObj: function(val, key){ 74 | if(typeof val !== 'object') val = {content: val, startTime: '00:00', endTime: '23:59', allDay: true}; 75 | if(!val.content) this.logError('Content is missing in date ' + key); 76 | if(val.startTime && !val.endTime) val.endTime = parseInt(val.startTime.split(':')[0]) + 1 + ':' + val.startTime.split(':')[1]; 77 | if(!val.startTime && !val.endTime) val = $.extend({}, val, {startTime: '00:00', endTime: '23:59', allDay: true}); 78 | if(val.startTime && val.endTime && val.allDay === undefined) val.allDay = false; 79 | if(/^\d{2}-DD-\d{4}/.test(key) || /^\d{2}-DD-YYYY/.test(key)) { 80 | var det = /^(\d{2})-DD-(\d{4})/.exec(key) || /^(\d{2})-DD-YYYY/.exec(key), chkDate; 81 | if(det.length == 3) chkDate = new Date(det[2], det[1], 0); 82 | else if(det.length == 2) chkDate = new Date(this.year, det[1], 0) 83 | if(!val.startDate) val.startDate = 1; 84 | if(!val.endDate && chkDate.getDate() != 1) val.endDate = chkDate.getDate(); 85 | if(!val.endDate && chkDate.getDate() == 1 && det.length == 3) val.endDate = chkDate.getDate(); 86 | } 87 | return val; 88 | }, 89 | 90 | _processCaldata: function(caldata){ 91 | var self = this; 92 | caldata = caldata || {}; 93 | $.each(caldata, function(key, val){ 94 | if(/^\d{2}-\d{2}-\d{4}/.test(key) || /^\d{2}-\d{2}-YYYY/.test(key) || /^\d{2}-DD-YYYY/.test(key) || /^MM-\d{2}-YYYY/.test(key) || 95 | /^\d{2}-DD-YYYY/.test(key) || /^MM-\d{2}-\d{4}/.test(key) || /^\d{2}-DD-\d{4}/.test(key) || key == 'TODAY') {} else 96 | self.logError(key + ' is an Invalid Date. Date should not contain spaces, should be separated by \'-\' and should be in the ' + 97 | 'format \'MM-DD-YYYY\'. That ain\'t that difficult!'); 98 | if(Array.isArray(val)) { 99 | $.each(val, function(i, c){ 100 | val[i] = self._processCaldataObj(c, key); 101 | }); 102 | caldata[key] = val; 103 | } else { 104 | caldata[key] = self._processCaldataObj(val, key); 105 | } 106 | }); 107 | return caldata; 108 | }, 109 | 110 | _propDate: function($cell, event){ 111 | var idx = $cell.index(), 112 | data = {allDay : [], content: [], endTime: [], startTime: []}, 113 | dateProp = { 114 | day : $cell.children('span.fc-date').text(), 115 | month : this.month + 1, 116 | monthname : this.options.displayMonthAbbr ? this.options.monthabbrs[this.month] : this.options.months[this.month], 117 | year : this.year, 118 | weekday : idx + this.options.startIn, 119 | weekdayname : this.options.weeks[(idx==6?0:idx + this.options.startIn)] 120 | }; 121 | 122 | $cell.children( 'div.fc-calendar-events').children('div.fc-calendar-event').each(function(i, e){ 123 | var $html = $('
' + $(e).html() + '
'); 124 | data.startTime[i] = new Date($html.find('time.fc-starttime').attr('datetime')); 125 | data.endTime[i] = new Date($html.find('time.fc-endtime').attr('datetime')); 126 | data.allDay[i] = $html.find('time.fc-allday').attr('datetime') === 'true' ? true : false; 127 | $html.find('time').remove(); 128 | data.content[i] = $html.html(); 129 | }); 130 | 131 | if(dateProp.day) this.options[event]($cell, data, dateProp); 132 | }, 133 | 134 | _initEvents : function() { 135 | var self = this, event = [], calendarioEventNameFormat = []; 136 | for(var i = 0; i < self.options.events.length; i++) { 137 | event[i] = self.options.events[i].toLowerCase().trim(); 138 | calendarioEventNameFormat[i] = 'onDay' + event[i].charAt(0).toUpperCase() + event[i].slice(1); 139 | 140 | if(this.options[calendarioEventNameFormat[i]] === undefined) 141 | this.options[calendarioEventNameFormat[i]] = function($el, $content, dateProperties) {return false;}; 142 | 143 | this.$el.on(event[i] + '.calendario', 'div.fc-row > div', function(e) { 144 | if(e.type == 'mouseenter' || e.type == 'mouseleave') e.type = $.inArray(e.type, event) == -1 ? 'hover' : e.type; 145 | self._propDate($(this), calendarioEventNameFormat[$.inArray(e.type, event)]); 146 | }); 147 | } 148 | this.$el.on('shown.calendar.calendario', function(e, instance){ 149 | // If check update set to true, then contact calendario's update servers for details. We didn't want to slow down your code. So we 150 | // check after the calendar is rendered. 151 | if(instance && instance.options.checkUpdate) self._checkUpdate(); 152 | }); 153 | // newday trigger. This trigger is exactly triggered at 00:00 hours the next day with an uncertainty of 6ms. 154 | this.$el.delay(new Date(this.today.getFullYear(), this.today.getMonth(), this.today.getDate() + 1, 0, 0, 0) - new Date().getTime()) 155 | .queue(function(){ 156 | self.today = new Date(); 157 | if(self.today.getMonth() == self.month || self.today.getMonth() + 1 == self.month) self._generateTemplate(true); 158 | self.$el.trigger($.Event('newday.calendar.calendario')); 159 | }); 160 | }, 161 | 162 | _checkUpdate : function() { 163 | var self = this; 164 | $.getScript("https://raw.githubusercontent.com/codrops/Calendario/master/js/update.js") 165 | .done(function(script, textStatus){ 166 | if(calendario.current != self.version() && parseFloat(calendario.current) >= parseFloat(self.version())) 167 | console.info(calendario.msg); 168 | }) 169 | .fail(function(jqxhr, settings, exception){ 170 | console.error(exception); 171 | }); 172 | }, 173 | 174 | // Calendar logic based on http://jszen.blogspot.pt/2007/03/how-to-build-simple-calendar-with.html 175 | _generateTemplate : function(firstRun, callback) { 176 | var head = this._getHead(), 177 | body = this._getBody(), 178 | rowClass; 179 | 180 | switch(this.rowTotal) { 181 | case 4 : rowClass = 'fc-four-rows'; break; 182 | case 5 : rowClass = 'fc-five-rows'; break; 183 | case 6 : rowClass = 'fc-six-rows'; break; 184 | } 185 | 186 | this.$cal = $('
').append(head, body); 187 | this.$el.find('div.fc-calendar').remove().end().append(this.$cal); 188 | this.$el.find('.fc-emptydate').parent().css({'background':'transparent', 'cursor':'default'}); 189 | 190 | if(!firstRun) this.$el.trigger($.Event('shown.calendario')); 191 | if(callback) callback.call(); 192 | }, 193 | 194 | _getHead : function() { 195 | var html = '
'; 196 | for(var i = 0; i <= 6; i++){ 197 | var pos = i + this.options.startIn, 198 | j = pos > 6 ? pos - 6 - 1 : pos; 199 | html += '
' + (this.options.displayWeekAbbr ? this.options.weekabbrs[j] : this.options.weeks[j]) + '
'; 200 | } 201 | return html + '
'; 202 | }, 203 | 204 | _parseDataToDay : function (data, day, other) { 205 | var content = ''; 206 | if(!other){ 207 | if(Array.isArray(data)) content = this._convertDayArray(data, day); 208 | else content = this._wrapDay(data, day, true); 209 | }else{ 210 | if (!Array.isArray(data)) data = [data]; 211 | for(var i = 0; i < data.length; i++){ 212 | if(this.month != 1 && (day >= data[i].startDate) && (day <= data[i].endDate)) content += this._wrapDay(data[i], day, true); 213 | else if(this.month == 1 && (day >= data[i].startDate)){ 214 | if(data[i].endDate && (day <= data[i].endDate)) content += this._wrapDay(data[i], day, true); 215 | else if(!data[i].endDate) content += this._wrapDay(data[i], day, true); 216 | } 217 | } 218 | } 219 | return content; 220 | }, 221 | 222 | _toDateTime : function(time, day, start) { 223 | var zoneH = parseInt(this.options.zone.split(':')[0]), 224 | zoneM = parseInt(this.options.zone.charAt(0) + this.options.zone.split(':')[1]), 225 | hour = parseInt(time.split(':')[0]) - zoneH, 226 | minutes = parseInt(time.split(':')[1]) - zoneM, 227 | d = new Date(Date.UTC(this.year, this.month, day, hour, minutes, 0, 0)); 228 | if(start) { 229 | var hStart = parseInt(start.split(':')[0]) - zoneH, 230 | mStart = parseInt(start.split(':')[1]) - zoneM; 231 | if(d.getTime() - new Date(Date.UTC(this.year, this.month, day, hStart, mStart, 0, 0)).getTime() < 0) 232 | d = new Date(Date.UTC(this.year, this.month, day + 1, hour, minutes, 0, 0)); 233 | } 234 | return d.toISOString(); 235 | }, 236 | 237 | _timeHtml : function(day, date){ 238 | var content = day.content; 239 | content += ''; 240 | content += ''; 241 | content += ''; 242 | return content; 243 | }, 244 | 245 | _wrapDay: function (day, date, wrap) { 246 | if(date){ 247 | if(wrap) return '
' + this._timeHtml(day, date) + '
'; 248 | else return this._timeHtml(day, date); 249 | } else return '
' + day + '
'; 250 | }, 251 | 252 | _convertDayArray: function (day, date) { 253 | var wrap_days = [] 254 | for(var i = 0; i < day.length; i++){ 255 | wrap_days[i] = this._wrapDay(day[i], date, false); 256 | } 257 | return this._wrapDay(wrap_days.join('
')); 258 | }, 259 | 260 | _getBody : function() { 261 | var d = new Date(this.year, this.month + 1, 0), 262 | monthLength = d.getDate(), // number of days in the month 263 | firstDay = new Date(this.year, d.getMonth(), 1), 264 | pMonthLength = new Date(this.year, this.month, 0).getDate(); 265 | 266 | // day of the week 267 | this.startingDay = firstDay.getDay(); 268 | 269 | var html = '
', 270 | day = 1; // fill in the days 271 | 272 | for (var i = 0; i < 7; i++){ // this loop is for weeks (rows) 273 | for (var j = 0; j <= 6; j++) { // this loop is for weekdays (cells) 274 | var pos = this.startingDay - this.options.startIn, 275 | p = pos < 0 ? 6 + pos + 1 : pos, 276 | inner = '', 277 | today = this.month === this.today.getMonth() && this.year === this.today.getFullYear() && day === this.today.getDate(), 278 | past = this.year < this.today.getFullYear() || this.month < this.today.getMonth() && this.year === this.today.getFullYear() || 279 | this.month === this.today.getMonth() && this.year === this.today.getFullYear() && day < this.today.getDate(), 280 | content = ''; 281 | 282 | if(this.options.fillEmpty && (j < p || i > 0)){ 283 | if(day > monthLength) { 284 | inner = '' + (day - monthLength) + ''; 285 | ++day; 286 | } else if (day == 1) { 287 | inner = '' + (pMonthLength - p + 1) + ''; 288 | ++pMonthLength; 289 | } 290 | inner += this.options.weekabbrs[j + this.options.startIn > 6 ? j + this.options.startIn - 6 - 1 : j + this.options.startIn] + ''; 291 | } 292 | if (day <= monthLength && (i > 0 || j >= p)){ 293 | inner = '' + day + '' + this.options.weekabbrs[j + 294 | this.options.startIn > 6 ? j + this.options.startIn - 6 - 1 : j + this.options.startIn ] + ''; 295 | 296 | var strdate = (this.month + 1 < 10 ? '0' + (this.month + 1) : this.month + 1) + '-' + (day < 10 ? '0' + day : day) + '-' + this.year, 297 | dayData = this.caldata[strdate], 298 | strdateyear = (this.month + 1 < 10 ? '0' + (this.month + 1) : this.month + 1) + '-' + (day < 10 ? '0' + day : day) + '-YYYY', 299 | dayDataYear = this.caldata[strdateyear], 300 | strdatemonth = 'MM-' + (day < 10 ? '0' + day : day) + '-' + this.year, 301 | dayDataMonth = this.caldata[strdatemonth], 302 | strdatemonthyear = 'MM' + '-' + (day < 10 ? '0' + day : day) + '-YYYY', 303 | dayDataMonthYear = this.caldata[strdatemonthyear], 304 | strdatemonthlyyear = (this.month + 1 < 10 ? '0' + (this.month + 1) : this.month + 1) + '-DD-' + this.year, 305 | dayDataMonthlyYear = this.caldata[strdatemonthlyyear], 306 | strdatemonthly = (this.month + 1 < 10 ? '0' + (this.month + 1) : this.month + 1) + '-DD-YYYY', 307 | dayDataMonthly = this.caldata[strdatemonthly]; 308 | 309 | if(today && this.caldata.TODAY) content += this._parseDataToDay(this.caldata.TODAY, day); 310 | if(dayData) content += this._parseDataToDay(dayData, day); 311 | if(dayDataMonth) content += this._parseDataToDay(dayDataMonth, day); 312 | if(dayDataMonthlyYear) content += this._parseDataToDay(dayDataMonthlyYear, day, true); 313 | if(dayDataMonthly) content += this._parseDataToDay(dayDataMonthly, day, true); 314 | if(dayDataMonthYear) content += this._parseDataToDay( dayDataMonthYear, day ); 315 | if(dayDataYear) content += this._parseDataToDay( dayDataYear, day ); 316 | if(content !== '') inner += '
' + content + '
'; 317 | ++day; 318 | } else { 319 | today = false; 320 | } 321 | 322 | var cellClasses = today ? 'fc-today ' : ''; 323 | 324 | if(past) cellClasses += 'fc-past '; 325 | else cellClasses += 'fc-future '; 326 | 327 | if(content !== '') cellClasses += 'fc-content'; 328 | 329 | html += (cellClasses !== '' ? '
' : '
') + inner + '
'; 330 | } 331 | 332 | if(day > monthLength){ // stop making rows if we've run out of days 333 | this.rowTotal = i + 1; 334 | break; 335 | } else { 336 | html += '
'; 337 | } 338 | } 339 | return html + '
'; 340 | }, 341 | 342 | _move : function(period, dir, callback){ 343 | if(dir === 'previous'){ 344 | if(period === 'month'){ 345 | this.year = this.month > 0 ? this.year : --this.year; 346 | this.month = this.month > 0 ? --this.month : 11; 347 | } else if(period === 'year') this.year = --this.year; 348 | } 349 | else if(dir === 'next'){ 350 | if(period === 'month'){ 351 | this.year = this.month < 11 ? this.year : ++this.year; 352 | this.month = this.month < 11 ? ++this.month : 0; 353 | } else if(period === 'year') this.year = ++this.year; 354 | } 355 | this._generateTemplate(false, callback); 356 | }, 357 | 358 | /************************* 359 | ***** PUBLIC METHODS ***** 360 | **************************/ 361 | option : function(option, value) { 362 | if(value) this.options[option] = value; 363 | else return this.options[option]; 364 | }, 365 | getYear : function(){ 366 | return this.year; 367 | }, 368 | getMonth : function(){ 369 | return this.month + 1; 370 | }, 371 | getMonthName : function(){ 372 | return this.options.displayMonthAbbr ? this.options.monthabbrs[this.month] : this.options.months[this.month]; 373 | }, 374 | // gets the cell's content div associated to a day of the current displayed month 375 | // day : 1 - [28||29||30||31] 376 | getCell : function(day){ 377 | var row = Math.floor((day + this.startingDay - this.options.startIn - 1) / 7), 378 | pos = day + this.startingDay - this.options.startIn - (row * 7) - 1; 379 | return this.$cal.find('div.fc-body').children('div.fc-row').eq(row).children('div').eq(pos); 380 | }, 381 | setData : function(caldata, clear) { 382 | caldata = this._processCaldata(caldata); 383 | if(clear) this.caldata = caldata; 384 | else $.extend(this.caldata, caldata); 385 | this._generateTemplate(false); 386 | }, 387 | // goes to today's month/year 388 | gotoNow : function(callback) { 389 | this.month = this.today.getMonth(); 390 | this.year = this.today.getFullYear(); 391 | this._generateTemplate(false, callback); 392 | }, 393 | // goes to month/year 394 | gotoMonth : function(month, year, callback){ 395 | this.month = month - 1; 396 | this.year = year; 397 | this._generateTemplate(false, callback); 398 | }, 399 | gotoPreviousMonth : function(callback){ 400 | this._move('month', 'previous', callback); 401 | }, 402 | gotoPreviousYear : function(callback){ 403 | this._move('year', 'previous', callback); 404 | }, 405 | gotoNextMonth : function(callback){ 406 | this._move('month', 'next', callback); 407 | }, 408 | gotoNextYear : function(callback){ 409 | this._move('year', 'next', callback); 410 | }, 411 | feed : function(callback){ 412 | var self = this; 413 | $.post(self.options.feedParser, {dates: this.caldata}) 414 | .always(function(data){ 415 | if(callback) callback.call(this, JSON.parse(data).hevent); 416 | }); 417 | }, 418 | version : function() { 419 | return this.VERSION; 420 | } 421 | }; 422 | 423 | var logError = function(message){ 424 | throw new Error(message); 425 | }; 426 | 427 | $.fn.calendario = function(options) { 428 | var instance = $.data(this, 'calendario'); 429 | if(typeof options === 'string'){ 430 | var args = Array.prototype.slice.call(arguments, 1); 431 | this.each(function(){ 432 | if(!instance){ 433 | logError("Cannot call methods on calendario prior to initialization; Attempted to call method '" + options + "'"); 434 | return; 435 | } 436 | if (!$.isFunction(instance[options]) || options.charAt(0) === "_"){ 437 | logError("No such method '" + options + "' for calendario instance."); 438 | } 439 | instance[options].apply(instance, args); 440 | }); 441 | } else { 442 | this.each(function(){ 443 | if (instance) instance._init(); 444 | else instance = $.data(this, 'calendario', new $.Calendario(options, this)); 445 | }); 446 | } 447 | instance.$el.trigger($.Event('shown.calendar.calendario'), [instance]); 448 | return instance; 449 | }; 450 | })(jQuery, window); 451 | --------------------------------------------------------------------------------