├── README.md ├── css ├── eventCalendar.css ├── eventCalendar_theme.css ├── eventCalendar_theme_responsive.css └── paragridma.css ├── events.database.sql ├── img ├── PluginPage.png ├── eventsCalendarIcon.png ├── eventsCalendarIcon_250.png ├── favicon.ico ├── jaime.png └── paradigmaLogo.png ├── includes ├── config.php ├── database.php ├── footer.php └── header.php ├── index.html ├── js ├── jquery.eventCalendar.js ├── jquery.eventCalendar.min.js └── moment.js ├── json ├── event.humanDate.json.php ├── events.json ├── events.json.php ├── keithjson.json └── locale.es.json ├── newEvent.php ├── test.html └── todo.txt /README.md: -------------------------------------------------------------------------------- 1 | jQuery Event Calendar: 2 | ================= 3 | 4 | jQuery plugin to show events in a calendar in a very comfortable way 5 | 6 | Main features: 7 | * Fluid Calendar: calendar will be shown with the width of its parent. Size is recalculated on window resize. So you can use it in your responsive designs 8 | * Change Style as you like: You can edit the .css file to restyle 9 | * Light: Less than 8kb of Javascript(minified) 10 | * jQuery rules!: It uses all the power of jQuery, but you can also use it with frameworks like Zepto.js 11 | * Highly customizable: You can change almost everything. Look at the following examples 12 | 13 | More Info: 14 | ---------------- 15 | http://www.vissit.com/projects/eventCalendar/ 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | -------------------------------------------------------------------------------- /css/eventCalendar.css: -------------------------------------------------------------------------------- 1 | /*= CORE CSS */ 2 | 3 | .eventCalendar-hidden { 4 | display: none; 5 | } 6 | 7 | .eventCalendar-wrap { 8 | position: relative; 9 | overflow: hidden; 10 | } 11 | 12 | .eventCalendar-arrow { 13 | position: absolute; 14 | z-index: 5; 15 | top: 3px; 16 | } 17 | 18 | .eventCalendar-prev { 19 | left: 3px; 20 | } 21 | 22 | .eventCalendar-next { 23 | right: 3px; 24 | } 25 | 26 | .eventCalendar-monthTitle { 27 | display: block; 28 | text-align: center; 29 | } 30 | 31 | .eventCalendar-monthWrap { 32 | position: absolute; 33 | top: 0; 34 | left: 0; 35 | z-index: 2; 36 | } 37 | 38 | .eventCalendar-currentMonth { 39 | z-index: 1; 40 | } 41 | 42 | .eventCalendar-daysList { 43 | display: table; 44 | width: 100%; 45 | } 46 | 47 | .eventCalendar-showAsWeek { 48 | display: block; 49 | } 50 | 51 | .eventCalendar-daysList li { 52 | display: table-cell; 53 | } 54 | 55 | .eventCalendar-dayWithEvents { 56 | background: rgba(0, 0, 0, 0.15); 57 | } 58 | 59 | .eventCalendar-current { 60 | background: rgba(0, 0, 0, 0.35); 61 | } 62 | 63 | .eventCalendar-showAsWeek li { 64 | display: block; 65 | float: left; 66 | width: 14.28%; 67 | height: 20px; 68 | } 69 | 70 | .eventCalendar-daysList a { 71 | padding: 0; 72 | display: block; 73 | text-align: center; 74 | font-size: 8px; 75 | min-width: 7px; 76 | } 77 | 78 | .eventCalendar-loading { 79 | display: block; 80 | min-width: 100px; 81 | height: 40px; 82 | line-height: 40px; 83 | } 84 | 85 | .eventCalendar-list { 86 | position: relative; 87 | z-index: 1; 88 | } 89 | 90 | .eventCalendar-oldEventList { 91 | z-index: 2; 92 | } 93 | 94 | .eventCalendar-subtitle { 95 | padding-left: 5px; 96 | font-weight: bold; 97 | font-size: 120%; 98 | } 99 | /* end of core CSS */ -------------------------------------------------------------------------------- /css/eventCalendar_theme.css: -------------------------------------------------------------------------------- 1 | /* Theme CSS */ 2 | html { 3 | background-color:#eee; 4 | } 5 | body { 6 | font-family: Arial, "Lucida Grande", sans-serif; 7 | font-size: 13px; 8 | line-height: 18px; 9 | color: #555; 10 | background-color:#fff; 11 | } 12 | .eventCalendar-wrap { 13 | border:solid 1px #d3d3d3; 14 | box-shadow:0 0 15px #999; 15 | border-radius:5px; 16 | margin-bottom:20px; 17 | background-color:#fff; 18 | color:#807E7E; 19 | } 20 | .eventCalendar-wrap .arrow { 21 | text-decoration:none; 22 | color:#fff; 23 | padding:0 5px; 24 | line-height:28px; 25 | top:9px; 26 | padding:8px 10px; 27 | } 28 | .eventCalendar-wrap .arrow.prev { 29 | 30 | } 31 | .eventCalendar-wrap .arrow:hover { opacity:0.7;} 32 | .eventCalendar-wrap .arrow span { 33 | height: 0; 34 | width: 0; 35 | font-size: 0; 36 | line-height: 0; 37 | border-top: 6px solid transparent; 38 | border-bottom: 6px solid transparent; 39 | border-left: 6px solid #fff; 40 | float:left; 41 | text-indent:-5000px; 42 | } 43 | .eventCalendar-wrap .arrow.prev span { 44 | border-left-width:0; 45 | border-right: 6px solid #fff; 46 | } 47 | .eventCalendar-slider { height:80px;} 48 | 49 | .eventCalendar-monthWrap { 50 | border-radius:5px; 51 | top:10px; 52 | left:0px; 53 | } 54 | .eventCalendar-currentTitle { 55 | line-height:25px; 56 | background-color:#138DA5; 57 | outline:1px solid #138DA5; 58 | border:1px solid #E3E3E3; 59 | border-width:1px 0; 60 | } 61 | .eventCalendar-currentTitle .monthTitle { 62 | font-size:110%; 63 | text-decoration:none; 64 | font-weight:bold; 65 | color:#fff; 66 | } 67 | 68 | .eventCalendar-daysList { 69 | zoom: 1; 70 | padding:0; 71 | width:100%; 72 | 73 | } 74 | .eventCalendar-daysList.showAsWeek { 75 | margin:10px 5px; 76 | width:auto; 77 | 78 | border:solid 1px #BCBCBC; 79 | border-bottom-width:0; 80 | border-radius:0; 81 | background-color:#CCCCCC; 82 | background-image: linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 83 | background-image: -o-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 84 | background-image: -moz-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 85 | background-image: -webkit-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 86 | background-image: -ms-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 87 | 88 | background-image: -webkit-gradient( 89 | linear, 90 | left top, 91 | left bottom, 92 | color-stop(0.42, #EEEEEE), 93 | color-stop(0.71, #CCCCCC) 94 | ); 95 | 96 | } 97 | .eventCalendar-daysList.showDayNames.showAsWeek { 98 | 99 | border-radius:5px 5px 0 0; 100 | } 101 | .eventCalendar-daysList:before, .eventCalendar-daysList:after { content:""; display:table; } 102 | .eventCalendar-daysList:after { clear: both; } 103 | .eventCalendar-day-header { 104 | text-transform:lowercase; 105 | text-align:center; 106 | font-size:10px; 107 | border-bottom:solid 1px #BCBCBC; 108 | } 109 | .eventCalendar-daysList.showAsWeek li { 110 | height:auto; 111 | } 112 | .eventCalendar-daysList.showAsWeek li.empty { 113 | background-color: #ccc; 114 | min-height:27px; 115 | } 116 | .eventCalendar-day a { 117 | text-decoration:none; 118 | font-size:10px; 119 | color:#424242; 120 | } 121 | .eventCalendar-day { 122 | border-left:solid 1px #BCBCBC; 123 | } 124 | .eventCalendar-day a { 125 | border:solid 1px #BCBCBC; 126 | border-width:0 1px 1px 0; 127 | } 128 | .showAsWeek .eventCalendar-day { border-left-width:0;} 129 | .showAsWeek .eventCalendar-day a { 130 | border:solid 1px red; 131 | border-color:#fff #BCBCBC #BCBCBC #eee; 132 | line-height:27px; 133 | font-size:11px; 134 | 135 | } 136 | .eventCalendar-day a:hover { 137 | background-color:#E4E4E4; 138 | box-shadow:inset 5px 5px 10px #C1C1C1; 139 | text-shadow: 2px 2px 2px #C1C1C1; 140 | } 141 | .eventCalendar-daysList li.dayWithEvents a { 142 | background:#89B814; 143 | box-shadow:inset 5px 5px 10px #698B10; 144 | text-shadow: 2px 2px 2px #698B10; 145 | color:#fff; 146 | } 147 | li.eventCalendar-day.dayWithEvents a:hover { 148 | background-color:#C2D374; 149 | box-shadow:inset 5px 5px 10px #89B814; 150 | text-shadow: 2px 2px 2px #89B814; 151 | } 152 | .eventCalendar-daysList li.today a { 153 | color:#fff; 154 | background:#449FB2; 155 | box-shadow:inset 5px 5px 10px #216B7A; 156 | text-shadow: 2px 2px 2px #216B7A; 157 | } 158 | li.eventCalendar-day.today a:hover { 159 | background-color:#79BDCC; 160 | box-shadow:inset 5px 5px 10px #449FB2; 161 | text-shadow: 2px 2px 2px #449FB2; 162 | } 163 | .eventCalendar-daysList li.current a { 164 | color:#fff; 165 | background:#449FB2; 166 | box-shadow:inset 5px 5px 10px #216B7A; 167 | text-shadow: 2px 2px 2px #216B7A; 168 | } 169 | li.eventCalendar-day.current a:hover { 170 | background-color:#79BDCC; 171 | box-shadow:inset 5px 5px 10px #449FB2; 172 | text-shadow: 2px 2px 2px #449FB2; 173 | } 174 | .eventCalendar-loading { 175 | border-radius:4px; 176 | margin:5px auto; 177 | padding:0 10px; 178 | background-color:#ccc; 179 | color:#fff; 180 | text-align:center; 181 | font-weight:bold; 182 | box-shadow:0 0 10px #ccc; 183 | text-shadow:0 0 3px #aaa; 184 | position:absolute; 185 | z-index:4; 186 | top:25px; 187 | left:5px; 188 | } 189 | .eventCalendar-loading.error { 190 | background-color:red; 191 | } 192 | .eventCalendar-list-wrap { 193 | min-height:100px; 194 | position:relative; 195 | } 196 | .eventCalendar-list-content.scrollable { 197 | 198 | height:100px; 199 | overflow-y:auto; 200 | margin:0 5px 5px 0; 201 | } 202 | .eventCalendar-list { 203 | margin:0; padding:0; list-style-type:none; 204 | } 205 | .eventCalendar-list li { 206 | padding:0 5px 15px; 207 | margin:0; 208 | clear:both; 209 | } 210 | .eventCalendar-list li time { 211 | font-size:10px; 212 | line-height:13px; 213 | } 214 | .eventCalendar-list li time em { 215 | float:left; 216 | font-style:normal; 217 | } 218 | .eventCalendar-list li time small { 219 | font-size:10px; 220 | float:left; 221 | background-color:#807E7E; 222 | color:#fff; 223 | padding:0 5px 0 4px; 224 | margin:0 0 0 3px; 225 | } 226 | .eventCalendar-list li .eventTitle { 227 | display:block; 228 | clear:both; 229 | color:#0E8EAB; 230 | font-weight:bold; 231 | text-decoration:none; 232 | } 233 | .eventCalendar-list li .eventTitle:hover { text-decoration:underline;} 234 | .eventCalendar-list li .eventDesc { 235 | clear: both; 236 | margin:0 0 5px 0; 237 | font-size:80%; 238 | line-height:1.2em; 239 | 240 | } 241 | .eventCalendar-list .eventCalendar-noEvents { 242 | font-size:120%; 243 | border-radius:4px; 244 | margin:5px; 245 | padding:5px; 246 | 247 | background-color:#ccc; 248 | color:#fff; 249 | text-align:center; 250 | font-weight:bold; 251 | box-shadow:0 0 10px #ccc; 252 | text-shadow:0 0 3px #aaa; 253 | } 254 | 255 | .bt { 256 | font-size:12px; 257 | display:block; 258 | clear:both; 259 | text-align: center; 260 | margin-top:10px; 261 | padding: 9px 34px 11px; 262 | text-decoration: none; 263 | font-weight: bold; 264 | line-height: 1; 265 | 266 | color: #ffffff; 267 | background-color: #698B10; 268 | background-repeat: repeat-x; 269 | 270 | background-image: -khtml-gradient(linear, left top, left bottom, from(#89B814), to(#698B10)); 271 | background-image: -moz-linear-gradient(top, #89B814, #698B10); 272 | background-image: -ms-linear-gradient(top, #89B814, #698B10); 273 | background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #89B814), color-stop(100%, #698B10)); 274 | background-image: -webkit-linear-gradient(top, #89B814, #698B10); 275 | background-image: -o-linear-gradient(top, #89B814, #698B10); 276 | background-image: linear-gradient(top, #89B814, #698B10); 277 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#89B814', endColorstr='#698B10', GradientType=0); 278 | 279 | text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); 280 | 281 | border: 1px solid #698B10; 282 | border-color: #698B10 #698B10 #465F05; 283 | 284 | border-radius: 4px; 285 | 286 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 287 | 288 | -webkit-transition: 0.1s linear all; 289 | -moz-transition: 0.1s linear all; 290 | -ms-transition: 0.1s linear all; 291 | -o-transition: 0.1s linear all; 292 | transition: 0.1s linear all; 293 | } 294 | .bt:hover { 295 | background-position: 0 -15px; 296 | text-decoration: none; 297 | } 298 | /* end of theme css */ 299 | 300 | 301 | /*= ONLY FOR DEMO PAGE */ 302 | body { 303 | width:978px; 304 | box-shadow:0 0 10px #777; 305 | padding: 20px 40px; 306 | margin:0 auto; 307 | } 308 | a { color: #0E8EAB} 309 | /* 310 | .eventCalendar-wrap { 311 | width:265px; 312 | } 313 | */ 314 | #DemoList { list-style-type:none; padding:0;} 315 | #DemoList > li { margin-right:40px; } 316 | #DemoList > li > h2 { margin:20px 0 3px 0;} 317 | .demoDesc { width:200px; margin:0 0 10px 0;} 318 | .fl { float:left;} 319 | .cb { clear:both;} 320 | 321 | .thin .eventCalendar-wrap { width:195px;} 322 | .thin pre { width:185px;} 323 | .thin .demoDesc { width:195px;} 324 | 325 | .wide .eventCalendar-wrap { width:650px; } 326 | .wide pre { width:640px;} 327 | .wide .demoDesc { width:650px;} 328 | 329 | #paradigmaBox { 330 | float:left; 331 | } 332 | #vissitBox { 333 | float:right; 334 | } 335 | .poweredBy img { 336 | float:left; 337 | margin-right:3px; 338 | } 339 | 340 | .poweredBy .data { 341 | float:left; 342 | } 343 | .poweredBy .name { 344 | font-weight:bold; 345 | color:#555; 346 | text-decoration:none; 347 | display:block; 348 | margin-top:28px; 349 | } 350 | .poweredBy .twitter { 351 | text-decoration:none; 352 | display:block; 353 | float:left; 354 | } 355 | .features { 356 | padding-left:20px; 357 | float:left; 358 | } 359 | #appLogo { 360 | margin-right:30px; 361 | } 362 | pre { 363 | clear:both; 364 | width:255px; 365 | background-color:#FFFFCC; 366 | padding:5px; 367 | border:solid 1px #FED17E; 368 | overflow:auto; 369 | } 370 | #license { 371 | width:300px; 372 | float:right; 373 | font-size:10px; 374 | line-height:12px; 375 | text-align:center; 376 | } 377 | 378 | body#responsiveDemo { 379 | width:auto; 380 | } 381 | /* end of demo page */ -------------------------------------------------------------------------------- /css/eventCalendar_theme_responsive.css: -------------------------------------------------------------------------------- 1 | /* Theme CSS */ 2 | html { 3 | background-color:#eee; 4 | } 5 | body { 6 | font-family: Arial, "Lucida Grande", sans-serif; 7 | font-size: 13px; 8 | line-height: 18px; 9 | color: #555; 10 | background-color:#fff; 11 | } 12 | .eventCalendar-wrap { 13 | border:solid 1px #d3d3d3; 14 | box-shadow:0 0 15px #999; 15 | border-radius:5px; 16 | margin-bottom:20px; 17 | background-color:#fff; 18 | color:#807E7E; 19 | } 20 | .eventCalendar-wrap .eventCalendar-arrow { 21 | text-decoration:none; 22 | color:#fff; 23 | padding:0 5px; 24 | line-height:28px; 25 | top:9px; 26 | padding:8px 10px; 27 | } 28 | .eventCalendar-wrap .eventCalendar-arrow.prev { 29 | 30 | } 31 | .eventCalendar-wrap .eventCalendar-arrow:hover { opacity:0.7;} 32 | .eventCalendar-wrap .eventCalendar-arrow span { 33 | height: 0; 34 | width: 0; 35 | font-size: 0; 36 | line-height: 0; 37 | border-top: 6px solid transparent; 38 | border-bottom: 6px solid transparent; 39 | border-left: 6px solid #fff; 40 | float:left; 41 | text-indent:-5000px; 42 | } 43 | .eventCalendar-wrap .eventCalendar-arrow.eventCalendar-prev span { 44 | border-left-width:0; 45 | border-right: 6px solid #fff; 46 | } 47 | .eventCalendar-slider { height:80px;} 48 | 49 | .eventCalendar-monthWrap { 50 | border-radius:5px; 51 | top:10px; 52 | left:0px; 53 | } 54 | .eventCalendar-currentTitle { 55 | line-height:25px; 56 | background-color:#138DA5; 57 | outline:1px solid #138DA5; 58 | border:1px solid #E3E3E3; 59 | border-width:1px 0; 60 | } 61 | .eventCalendar-currentTitle .eventCalendar-monthTitle { 62 | font-size:110%; 63 | text-decoration:none; 64 | font-weight:bold; 65 | color:#fff; 66 | } 67 | 68 | .eventCalendar-daysList { 69 | zoom: 1; 70 | padding:0; 71 | width:100%; 72 | 73 | } 74 | .eventCalendar-daysList.eventCalendar-showAsWeek { 75 | margin:10px 5px; 76 | width:auto; 77 | 78 | border:solid 1px #BCBCBC; 79 | border-bottom-width:0; 80 | border-radius:0; 81 | background-color:#CCCCCC; 82 | background-image: linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 83 | background-image: -o-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 84 | background-image: -moz-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 85 | background-image: -webkit-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 86 | background-image: -ms-linear-gradient(top, #EEEEEE 42%, #CCCCCC 71%); 87 | 88 | background-image: -webkit-gradient( 89 | linear, 90 | left top, 91 | left bottom, 92 | color-stop(0.42, #EEEEEE), 93 | color-stop(0.71, #CCCCCC) 94 | ); 95 | 96 | } 97 | .eventCalendar-daysList.showDayNames.eventCalendar-showAsWeek { 98 | 99 | border-radius:5px 5px 0 0; 100 | } 101 | .eventCalendar-daysList:before, .eventCalendar-daysList:after { content:""; display:table; } 102 | .eventCalendar-daysList:after { clear: both; } 103 | .eventCalendar-day-header { 104 | text-transform:lowercase; 105 | text-align:center; 106 | font-size:10px; 107 | border-bottom:solid 1px #BCBCBC; 108 | } 109 | .eventCalendar-daysList.eventCalendar-showAsWeek li { 110 | height:auto; margin:0; 111 | } 112 | .eventCalendar-daysList.eventCalendar-showAsWeek li.eventCalendar-empty { 113 | background-color: #ccc; 114 | min-height:27px; 115 | border-top: solid 1px #ccc; 116 | } 117 | .eventCalendar-day a { 118 | text-decoration:none; 119 | font-size:10px; 120 | color:#424242; 121 | } 122 | .eventCalendar-day { 123 | border-left:solid 1px #BCBCBC; 124 | } 125 | .eventCalendar-day a { 126 | border:solid 1px #BCBCBC; 127 | border-width:0 1px 1px 0; 128 | } 129 | .eventCalendar-showAsWeek .eventCalendar-day { border-left-width:0;} 130 | .eventCalendar-showAsWeek .eventCalendar-day a { 131 | border:solid 1px red; 132 | border-color:#fff #BCBCBC #BCBCBC #eee; 133 | line-height:27px; 134 | font-size:11px; 135 | 136 | } 137 | .eventCalendar-day a:hover { 138 | background-color:#E4E4E4; 139 | /* box-shadow:inset 5px 5px 10px #C1C1C1; 140 | text-shadow: 2px 2px 2px #C1C1C1;*/ 141 | } 142 | .eventCalendar-daysList li.today a { 143 | color:#fff; 144 | background:#aaa; 145 | /* box-shadow:inset 5px 5px 10px #777; 146 | text-shadow: 2px 2px 2px #777;*/ 147 | } 148 | li.eventCalendar-day.today a:hover { 149 | background-color:#ccc; 150 | /*box-shadow:inset 5px 5px 10px #999;*/ 151 | } 152 | 153 | .eventCalendar-daysList li.eventCalendar-dayWithEvents a { 154 | background:#89B814; 155 | /*box-shadow:inset 5px 5px 10px #698B10; 156 | text-shadow: 2px 2px 2px #698B10;*/ 157 | color:#fff; 158 | } 159 | li.eventCalendar-day.eventCalendar-dayWithEvents a:hover { 160 | background-color:#C2D374; 161 | /*box-shadow:inset 5px 5px 10px #89B814; 162 | text-shadow: 2px 2px 2px #89B814;*/ 163 | } 164 | 165 | 166 | .eventCalendar-daysList li.current a { 167 | color:#fff; 168 | background:#449FB2; 169 | box-shadow:inset 5px 5px 10px #216B7A; 170 | text-shadow: 2px 2px 2px #216B7A; 171 | } 172 | li.eventCalendar-day.current a:hover { 173 | background-color:#79BDCC; 174 | box-shadow:inset 5px 5px 10px #449FB2; 175 | text-shadow: 2px 2px 2px #449FB2; 176 | } 177 | .eventCalendar-loading { 178 | border-radius:4px; 179 | margin:5px auto; 180 | padding:0 10px; 181 | background-color:#ccc; 182 | color:#fff; 183 | text-align:center; 184 | font-weight:bold; 185 | box-shadow:0 0 10px #ccc; 186 | text-shadow:0 0 3px #aaa; 187 | position:absolute; 188 | z-index:4; 189 | top:25px; 190 | left:5px; 191 | } 192 | .eventCalendar-loading.error { 193 | background-color:red; 194 | } 195 | 196 | .eventCalendar-subtitle { padding-top:10px;} 197 | .eventCalendar-list-wrap { 198 | min-height:100px; 199 | position:relative; 200 | } 201 | .eventCalendar-list-content.scrollable { 202 | 203 | height:100px; 204 | overflow-y:auto; 205 | margin:0 5px 5px 0; 206 | } 207 | .eventCalendar-list { 208 | margin:0; padding:0; list-style-type:none; 209 | } 210 | .eventCalendar-list li { 211 | padding:0 5px 15px; 212 | margin:0; 213 | clear:both; 214 | } 215 | .eventCalendar-list li time { 216 | font-size:10px; 217 | line-height:13px; 218 | } 219 | .eventCalendar-list li time em { 220 | float:left; 221 | font-style:normal; 222 | } 223 | .eventCalendar-list li time small { 224 | font-size:10px; 225 | float:left; 226 | background-color:#807E7E; 227 | color:#fff; 228 | padding:0 5px 0 4px; 229 | margin:0 0 0 3px; 230 | } 231 | .eventCalendar-list li .eventCalendar-eventTitle { 232 | display:block; 233 | clear:both; 234 | 235 | font-weight:bold; 236 | text-decoration:none; 237 | } 238 | .eventCalendar-list li a.eventCalendar-eventTitle { 239 | color:#0E8EAB; 240 | } 241 | .eventCalendar-list li a.eventCalendar-eventTitle:hover { text-decoration:underline;} 242 | .eventCalendar-list li .eventDesc { 243 | clear: both; 244 | margin:0 0 5px 0; 245 | font-size:80%; 246 | line-height:1.2em; 247 | 248 | } 249 | .eventCalendar-list .eventCalendar-noEvents { 250 | font-size:120%; 251 | border-radius:4px; 252 | margin:5px; 253 | padding:5px; 254 | 255 | background-color:#ccc; 256 | color:#fff; 257 | text-align:center; 258 | font-weight:bold; 259 | box-shadow:0 0 10px #ccc; 260 | text-shadow:0 0 3px #aaa; 261 | } 262 | 263 | .bt { 264 | font-size:12px; 265 | display:block; 266 | clear:both; 267 | text-align: center; 268 | margin-top:10px; 269 | padding: 9px 34px 11px; 270 | text-decoration: none; 271 | font-weight: bold; 272 | line-height: 1; 273 | 274 | color: #ffffff; 275 | background-color: #698B10; 276 | background-repeat: repeat-x; 277 | 278 | background-image: -khtml-gradient(linear, left top, left bottom, from(#89B814), to(#698B10)); 279 | background-image: -moz-linear-gradient(top, #89B814, #698B10); 280 | background-image: -ms-linear-gradient(top, #89B814, #698B10); 281 | background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #89B814), color-stop(100%, #698B10)); 282 | background-image: -webkit-linear-gradient(top, #89B814, #698B10); 283 | background-image: -o-linear-gradient(top, #89B814, #698B10); 284 | background-image: linear-gradient(top, #89B814, #698B10); 285 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#89B814', endColorstr='#698B10', GradientType=0); 286 | 287 | text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); 288 | 289 | border: 1px solid #698B10; 290 | border-color: #698B10 #698B10 #465F05; 291 | 292 | border-radius: 4px; 293 | 294 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05); 295 | 296 | -webkit-transition: 0.1s linear all; 297 | -moz-transition: 0.1s linear all; 298 | -ms-transition: 0.1s linear all; 299 | -o-transition: 0.1s linear all; 300 | transition: 0.1s linear all; 301 | } 302 | .bt:hover { 303 | background-position: 0 -15px; 304 | text-decoration: none; 305 | } 306 | /* end of theme css */ 307 | 308 | 309 | /*= ONLY FOR DEMO PAGE */ 310 | body { 311 | /* 312 | width:978px; 313 | box-shadow:0 0 10px #777; 314 | padding: 20px 40px; 315 | margin:0 auto; 316 | */ 317 | } 318 | a { color: #0E8EAB} 319 | /* 320 | .eventCalendar-wrap { 321 | width:265px; 322 | } 323 | */ 324 | .features li { margin-bottom:3px;} 325 | #thanksPanel li { margin-bottom:0;} 326 | #introPanel { padding-top:20px;} 327 | 328 | .poweredBy img { 329 | float:left; 330 | margin-right:3px; 331 | } 332 | .poweredBy .data { 333 | float:left; 334 | } 335 | .poweredBy .name { 336 | font-weight:bold; 337 | color:#555; 338 | text-decoration:none; 339 | display:block; 340 | margin-top:28px; 341 | } 342 | .poweredBy .twitter { 343 | text-decoration:none; 344 | display:block; 345 | float:left; 346 | } 347 | .features { 348 | padding-left:20px; 349 | float:left; 350 | } 351 | #appLogo { 352 | margin-right:30px; 353 | } 354 | pre { 355 | clear:both; 356 | background-color:#FFFFCC; 357 | padding:5px; 358 | border:solid 1px #FED17E; 359 | overflow:auto; 360 | } 361 | #license { 362 | width:300px; 363 | float:right; 364 | font-size:10px; 365 | line-height:12px; 366 | text-align:center; 367 | } 368 | 369 | 370 | /* end of demo page */ -------------------------------------------------------------------------------- /css/paragridma.css: -------------------------------------------------------------------------------- 1 | /* -------------------------------------------------- 2 | Table of Contents 3 | ----------------------------------------------------- 4 | :: Reset & Standards 5 | :: Links 6 | :: Lists 7 | :: Tables 8 | :: Misc 9 | */ 10 | 11 | 12 | /*= Reset & Standards */ 13 | 14 | /* 15 | Eric Meyer's CSS Reset 16 | http://meyerweb.com/eric/tools/css/reset/ 17 | v2.0 | 20110126 18 | License: none (public domain) 19 | */ 20 | 21 | html, body, div, span, applet, object, iframe, 22 | h1, h2, h3, h4, h5, h6, p, blockquote, pre, 23 | a, abbr, acronym, address, big, cite, code, 24 | del, dfn, em, img, ins, kbd, q, s, samp, 25 | small, strike, strong, sub, sup, tt, var, 26 | b, u, i, center, 27 | dl, dt, dd, ol, ul, li, 28 | fieldset, form, label, legend, 29 | table, caption, tbody, tfoot, thead, tr, th, td, 30 | article, aside, canvas, details, embed, 31 | figure, figcaption, footer, header, hgroup, 32 | menu, nav, output, ruby, section, summary, 33 | time, mark, audio, video { 34 | margin: 0; 35 | padding: 0; 36 | border: 0; 37 | font: inherit; 38 | vertical-align: baseline; 39 | } 40 | html { 41 | font-size: 62.5%; 42 | } 43 | /* HTML5 display-role reset for older browsers */ 44 | article, aside, details, figcaption, figure, 45 | footer, header, hgroup, menu, nav, section { 46 | display: block; 47 | } 48 | body { 49 | line-height: 1; 50 | } 51 | ol, ul { 52 | list-style: none; 53 | } 54 | blockquote, q { 55 | quotes: none; 56 | } 57 | blockquote:before, blockquote:after, 58 | q:before, q:after { 59 | content: ''; 60 | content: none; 61 | } 62 | table { 63 | border-collapse: collapse; 64 | border-spacing: 0; 65 | } 66 | 67 | body { background: #fff; position: relative; -webkit-font-smoothing: antialiased; } 68 | 69 | body, input, select, textarea, button { 70 | font-family: "Helvetica Neue", "HelveticaNeue", Helvetica, Arial, "Lucida Grande", sans-serif; 71 | font-size: 13px; 72 | line-height: 18px; 73 | color: #555; 74 | } 75 | 76 | /* end of reset */ 77 | 78 | /*= Links */ 79 | 80 | a { color: #2a85e8; text-decoration: none; outline: 0; line-height: inherit; } 81 | a:hover { color: #11639d; } 82 | p a, p a:visited { line-height: inherit; } 83 | 84 | /* end of links */ 85 | 86 | img, object { max-width: 100%; } /* http://unstoppablerobotninja.com/entry/fluid-images/ */ 87 | 88 | /*= List */ 89 | 90 | ul, ol { margin-bottom: 18px; } 91 | ul { list-style: none outside; } 92 | ol { list-style: decimal; } 93 | ol, ul.square, ul.circle, ul.disc { margin-left: 30px; } 94 | ul.square { list-style: square outside; } 95 | ul.circle { list-style: circle outside; } 96 | ul.disc { list-style: disc outside; } 97 | ul ul, ol ol { margin: 4px 0 5px 30px; } 98 | li { margin-bottom: 12px; } 99 | ul.horizontal li { float:left; } 100 | ul.nm { margin:0;} 101 | 102 | /*= Tables */ 103 | table { background: #fff; width: 100%; margin: 0 0 18px; border: 1px solid #ddd; } 104 | 105 | table thead { background: #f5f5f5; } 106 | table thead tr th, 107 | table tbody tr td { text-align: left; } 108 | table thead tr th { padding: 8px 10px 9px; font-weight: bold; } 109 | table thead tr th:first-child { border-left: none; } 110 | table thead tr th:last-child { border-right: none; } 111 | 112 | table thead tr { } 113 | table tbody { } 114 | table tbody tr { } 115 | table tbody tr.even, 116 | table tbody tr.alt, 117 | table tbody tr:nth-child(even) { background: #f9f9f9; } 118 | table tbody tr td { padding: 9px 10px; vertical-align: top; border: none; } 119 | 120 | 121 | /*= Typography */ 122 | 123 | .h1, .h2, .h3, .h4, .h5, .h6 { font-weight: bold; line-height: 1.25; } 124 | .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a { font-weight: inherit; } 125 | .h1 { font-size: 46px; font-size: 4.6rem; margin-bottom: 12px;} 126 | .h2 { font-size: 35px; font-size: 3.5rem; margin-bottom: 9px; } 127 | .h3 { font-size: 28px; font-size: 2.8rem; margin-bottom: 9px; } 128 | .h4 { font-size: 21px; font-size: 2.1rem; margin-bottom: 3px; } 129 | .h5 { font-size: 18px; font-size: 1.8rem; font-weight: normal; margin-bottom: 3px; } 130 | .h6 { font-size: 15px; font-size: 1.5rem; font-weight: normal; } 131 | 132 | .subheader { color: #777; font-weight: 300; margin-bottom: 24px; } 133 | 134 | p { line-height: 17px; margin: 0 0 18px; } 135 | p img { margin: 0; } 136 | p.lead { font-size: 18px; font-size: 1.8rem; line-height: 24px; } 137 | 138 | /* Mobile */ 139 | 140 | @media handheld, only screen and (max-width: 767px) { 141 | body, p { font-size: 15px; font-size: 1.5rem; line-height: 1.4; } 142 | } 143 | 144 | em { font-style: italic; line-height: inherit; } 145 | strong { font-weight: bold; line-height: inherit; } 146 | small { font-size: 60%; line-height: inherit; } 147 | 148 | h1 small, h2 small, h3 small, h4 small, h5 small { color: #777; } 149 | 150 | code,pre { background:#FCF8C4; font-family:Monaco,Andale Mono,Courier New,monospace; padding: 0 3px;} 151 | pre { overflow:auto;} 152 | 153 | pre { border:solid 1px #ccc; margin-bottom:18px; } 154 | 155 | /* Blockquotes */ 156 | blockquote, blockquote p { line-height: 20px; } 157 | blockquote { margin: 0 0 18px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; } 158 | blockquote cite { display: block; font-size: 12px; font-size: 1.2rem; } 159 | blockquote cite:before { content: "\2014 \0020"; } 160 | blockquote cite a, blockquote cite a:visited { } 161 | 162 | hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 12px 0 18px; height: 0; } 163 | 164 | abbr, acronym { text-transform: uppercase; font-size: 90%; border-bottom: 1px solid #ddd; cursor: help; } 165 | abbr { text-transform: none; } 166 | 167 | /** 168 | * Print styles. 169 | * 170 | * Inlined to avoid required HTTP connection: www.phpied.com/delay-loading-your-print-css/ 171 | * Credit to Paul Irish and HTML5 Boilerplate (html5boilerplate.com) 172 | */ 173 | @media print { 174 | * { background: transparent !important; text-shadow: none !important; filter:none !important; 175 | -ms-filter: none !important; } /* Black prints faster: sanbeiji.com/archives/953 */ 176 | p a, p a:visited { text-decoration: underline; } 177 | p a[href]:after { content: " (" attr(href) ")"; } 178 | abbr[title]:after { content: " (" attr(title) ")"; } 179 | .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } /* Don't show links for images, or javascript/internal links */ 180 | pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } 181 | thead { display: table-header-group; } /* css-discuss.incutio.com/wiki/Printing_Tables */ 182 | tr, img { page-break-inside: avoid; } 183 | @page { margin: 0.5cm; } 184 | p, h2, h3 { orphans: 3; widows: 3; } 185 | h2, h3{ page-break-after: avoid; } 186 | } 187 | /* Arfully Masterminded by ZURB */ 188 | 189 | /*= Grid */ 190 | .container, .fixContainer { 191 | padding: 0px 20px; 192 | } 193 | 194 | 195 | .row { width: 100%; margin: 0 auto; } 196 | /* To fix the grid into a certain size, set max-width to width */ 197 | .row .row { min-width: 0px; } 198 | 199 | .g1, .g2, .g3, .g4, .g5, .g6, .g7, .g8, .g9, .g10, .g11, .g12 { margin-left: 4.4%; float: left; min-height: 1px; position: relative; } 200 | 201 | .g1:first-child, .g2:first-child, .g3:first-child, 202 | .g4:first-child, .g5:first-child, .g6:first-child, 203 | .g7:first-child, .g8:first-child, .g9:first-child, 204 | .g10:first-child, .g11:first-child, .g12:first-child 205 | { margin-left: 0px; } 206 | 207 | .row .g1 { width: 4.3%; } 208 | .row .g2 { width: 13%; } 209 | .row .g3 { width: 21.68%; } 210 | .row .g4 { width: 30.4%; } 211 | .row .g5 { width: 39.1%; } 212 | .row .g6 { width: 47.8%; } 213 | .row .g7 { width: 56.5%; } 214 | .row .g8 { width: 65.2%; } 215 | .row .g9 { width: 73.9%; } 216 | .row .g10 { width: 82.6%; } 217 | .row .g11 { width: 91.3%; } 218 | .row .g12 { width: 100%; } 219 | 220 | .row .g1.centered { margin-left: 47.9%; } 221 | .row .g2.centered { margin-left: 43.5%; } 222 | .row .g3.centered { margin-left: 39.2%; } 223 | .row .g4.centered { margin-left: 34.8%; } 224 | .row .g5.centered { margin-left: 30.5%; } 225 | .row .g6.centered { margin-left: 26.1%; } 226 | .row .g7.centered { margin-left: 21.8%; } 227 | .row .g8.centered { margin-left: 17.4%; } 228 | .row .g9.centered { margin-left: 13.1%; } 229 | .row .g10.centered { margin-left: 8.7%; } 230 | .row .g11.centered { margin-left: 4.3%; } 231 | 232 | img, object, embed { max-width: 100%; } 233 | img { -ms-interpolation-mode: bicubic; } 234 | 235 | /* Nicolas Gallagher's micro clearfix */ 236 | .row:before, .row:after, .clearfix:before, .clearfix:after { content:""; display:table; } 237 | .row:after, .clearfix:after { clear: both; } 238 | .row, .clearfix { zoom: 1; } 239 | 240 | /* Fixed panels */ 241 | .pf:after, .pf_r:after { clear: both; } 242 | .pf > .pf_fix { float: left; } 243 | .pf_r > .pf_fix { float: right; } 244 | 245 | .pf_g55 > .pf_fix { width:55px; } .pf_g55 > .pf_fluid { margin-left:55px; } 246 | .pf_g100 > .pf_fix { width:100px; } .pf_g100 > .pf_fluid { margin-left:100px; } .pf_r.pf_g100 > .pf_fluid { margin-right:100px; margin-left:0; } 247 | .pf_g200 > .pf_fix { width:200px; } .pf_g200 > .pf_fluid { margin-left:200px; } .pf_r.pf_g200 > .pf_fluid { margin-right:200px; margin-left:0; } 248 | .pf_g250 > .pf_fix { width:250px; } .pf_g250 > .pf_fluid { margin-left:250px; } .pf_r.pf_g250 > .pf_fluid { margin-right:250px; margin-left:0; } 249 | .pf_g300 > .pf_fix { width:300px; } .pf_g300 > .pf_fluid { margin-left:300px; } .pf_r.pf_g300 > .pf_fluid { margin-right:300px; margin-left:0; } 250 | 251 | 252 | 253 | @media only screen and (max-width: 767px) { 254 | .break-on-mobile.pf .pf_fix, .break-on-mobile.pf_r .pf_fix { float:none;} 255 | .break-on-mobile.pf .pf_fluid, .break-on-mobile.pf_r .pf_fluid { clear:both; margin-left:0 !important; margin-right:0 !important; } 256 | } 257 | 258 | /*= Block Messages */ 259 | .msg { 260 | border:solid 1px #ccc; 261 | margin-bottom:18px; 262 | background-color:#FDF5D9; 263 | padding:5px; 264 | } 265 | .pf.msg { min-height:55px; } 266 | .msg_error { background-color:#FDDFDE; } 267 | .msg_info { background-color:#DDF4FB; } 268 | .msg_success { background-color:#D1EED1; } 269 | 270 | .msg .close { 271 | float:right; 272 | } 273 | .msg_title { font-weight:bold;} 274 | .msg_content { margin-bottom:0;} 275 | 276 | .msg_big .pf_fix { 277 | height: 50px; 278 | width:55px; 279 | background: url('../images/icons/msg_warning.png') no-repeat 2px 2px; 280 | } 281 | .msg_big .pf_fluid { 282 | margin-left:60px; 283 | } 284 | 285 | .msg_error .pf_fix { background-image: url('../images/icons/msg_error.png'); } 286 | .msg_info .pf_fix { background-image: url('../images/icons/msg_info.png'); } 287 | .msg_success .pf_fix { background-image: url('../images/icons/msg_success.png'); } 288 | 289 | /* end of block messages */ 290 | 291 | 292 | /*= Block grids */ 293 | /* -------------------------------------------------- 294 | They always display as columns, even on mobile devices 295 | -------------------------------------------------- */ 296 | 297 | .bg2, .bg3, .bg4, .bg5 { display: block; overflow: hidden; } 298 | .bg2>*, .bg3>*, .bg4>*, .bg5>* { display: block; height: auto; float: left; background-color:rgba(0,0,0,0.1); margin-bottom:20px; } 299 | 300 | .bg2 { margin-left: -4% } 301 | .bg2>* { margin-left: 4%; width: 46%; } 302 | 303 | .bg3 { margin-left: -2% } 304 | .bg3>*{ margin-left: 2%; width: 31.3%; } 305 | 306 | .bg4 { margin-left: -2% } 307 | .bg4>* { margin-left: 2%; width: 23%; } 308 | 309 | .bg5 { margin-left: -1.5% } 310 | .bg5>* { margin-left: 1.5%; width: 18.5%; } 311 | 312 | @media only screen and (max-width: 767px) { 313 | .bg2.mobile>*, .bg3.mobile>*, .bg4.mobile>*, .bg5.mobile>* { width:98.5%; } 314 | 315 | } 316 | 317 | 318 | /*= DIALOGS */ 319 | .ui-widget-overlay { 320 | background-color:#fff; 321 | -moz-opacity:.70; filter:alpha(opacity=70); opacity:.70; 322 | left: 0; 323 | position: absolute; 324 | top: 0; 325 | width:100%; height:100%; 326 | } 327 | .ui-dialog { 328 | background-color:#ccc; 329 | padding:20px; 330 | } 331 | .dialogWrap { 332 | background-color:#fff; 333 | border:solid 1px #333; 334 | } 335 | .ui-dialog-titlebar { 336 | height:30px; 337 | position:relative; 338 | } 339 | .ui-dialog-titlebar-close { 340 | position:absolute; 341 | top:5px; 342 | right:5px; 343 | } 344 | .dialogContent { 345 | padding:10px; 346 | } 347 | .dialogFooter { 348 | padding:10px; 349 | background:#eee; 350 | } 351 | 352 | 353 | /* end of dialog */ 354 | 355 | /* -------------------------------------------------- 356 | Table of Contents 357 | ----------------------------------------------------- 358 | :: Buttons 359 | :: Alerts 360 | :: Notices/Alerts 361 | :: Tabs 362 | :: Pagination 363 | :: Lists 364 | :: Panels 365 | */ 366 | 367 | 368 | 369 | 370 | /* -------------------------------------------------- 371 | Buttons 372 | -------------------------------------------------- */ 373 | 374 | .bt, .bt.disabled:hover { 375 | background: #00a6fc; 376 | display: inline-block; 377 | text-align: center; 378 | padding: 9px 34px 11px; 379 | margin-bottom:9px; 380 | color: #fff; 381 | text-decoration: none; 382 | font-weight: bold; 383 | line-height: 1; 384 | position: relative; 385 | cursor: pointer; 386 | } 387 | 388 | .bt.full-width { 389 | width: 100%; 390 | padding-left: 0 !important; 391 | padding-right: 0 !important; 392 | text-align: center; 393 | } 394 | 395 | .bt.left-align { 396 | text-align: left; 397 | text-indent: 12px; 398 | } 399 | 400 | .bt:active { } 401 | .bt:hover { color:#fff; } 402 | 403 | .bt.disabled { opacity: 0.5; filter:alpha(opacity=50); cursor: not-allowed; } 404 | .bt.disabled:hover { cursor:default;} 405 | 406 | /* Sizes ---------- */ 407 | .bt_small.bt { font-size: 11px; padding: 8px 20px 10px; } 408 | .bt_large.bt { font-size: 18px; padding: 11px 48px 13px; } 409 | 410 | .bt_sub, .bt_sub.disabled:hover { 411 | background-color:#eee; 412 | color:#333; 413 | } 414 | .bt_sub:hover { color:#333;} 415 | 416 | .bt_success, .bt_success.disabled:hover { background-color:#57A957; } 417 | .bt_success:hover { color:#fff;} 418 | 419 | .bt_danger, .bt_danger.disabled:hover { background-color:#C43C35; } 420 | .bt_danger:hover { color:#fff;} 421 | 422 | 423 | 424 | /* -------------------------------------------------- 425 | Tabs 426 | -------------------------------------------------- */ 427 | dl.tabs { display: block; margin: 0 0 20px 0; padding: 0; height: 30px; border-bottom: solid 1px #ddd; } 428 | dl.tabs dt { display: block; width: auto; height: 30px; padding: 0px 9px 0 20px; line-height: 30px; float: left; color: #999; font-size: 11px; text-transform: uppercase; cursor: default; } 429 | dl.tabs dt:first-child { padding: 0 9px 0 0px; } 430 | dl.tabs dd { display: block; width: auto; height: 30px; padding: 0; float: left; } 431 | dl.tabs dd a { display: block; width: auto; height: 29px; padding: 0px 9px; line-height: 30px; border: solid 1px #ddd; margin: 0 -1px 0 0; color: #555; background: #eee; } 432 | dl.tabs dd a.active { background: #fff; border-width: 1px 1px 0px 1px; height: 30px; } 433 | 434 | .nice.tabs { border-bottom: solid 1px #eee; margin: 0 0 30px 0; height:43px; } 435 | .nice.tabs dd a { padding: 7px 18px 9px; font-size: 15px; font-size: 1.5rem; color: #555555; background: none; border: none; } 436 | .nice.tabs dd a.active { font-weight: bold; color: #333; background: #fff; border-left: 1px solid #eee; border-right: 1px solid #eee; border-top: 3px solid #00a6fc; margin: 0 10px; position: relative; top: -5px; } 437 | .nice.tabs dd:first-child a.active { margin-left: 0; } 438 | 439 | ul.tabs-content { margin: 0; display: block; } 440 | ul.tabs-content > li { display:none; } 441 | ul.tabs-content > li.active { display: block; } 442 | 443 | dl.contained, dl.nice.contained { margin-bottom: 0px; } 444 | dl.contained.tabs dd a { padding: 0px 14px; } 445 | dl.nice.contained.tabs dd a { padding: 7px 18px 9px; } 446 | 447 | ul.contained.tabs-content { padding: 0; } 448 | ul.contained.tabs-content li { padding: 20px; border: solid 0px #ddd; border-width: 0px 1px 1px 1px; } 449 | ul.nice.contained.tabs-content li { border-color: #eee; } 450 | 451 | /* -------------------------------------------------- 452 | Pagination 453 | -------------------------------------------------- */ 454 | ul.pagination { display: block; height: 24px; margin-left: -5px; } 455 | ul.pagination li { float: left; display: block; height: 24px; color: #999; font-size: 15px; margin-left: 5px; } 456 | ul.pagination li a { display: block; padding: 6px 7px 4px; color: #555; } 457 | ul.pagination li.current a, ul.pagination li:hover a { border-bottom: solid 2px #00a6fc; color: #141414; } 458 | ul.pagination li.unavailable a { cursor: default; color: #999; } 459 | ul.pagination li.unavailable:hover a { border-bottom: none; } 460 | 461 | /* -------------------------------------------------- 462 | Lists 463 | -------------------------------------------------- */ 464 | ul.nice, ol.nice { list-style: none; margin: 0; } 465 | ul.nice li, ol.nice li { padding-left: 30px; position: relative } 466 | ul.nice li span.bullet, ol.nice li span.number { position: absolute; left: 8px; top: 2px; color: #ccc; width:12px; height:12px; background-color:pink;} 467 | 468 | dl dt { font-weight: bold; } 469 | dd { margin-left: 1.5em; } 470 | 471 | /* -------------------------------------------------- 472 | Panels 473 | -------------------------------------------------- */ 474 | div.panel { 475 | padding: 20px 20px 2px 20px; 476 | border:solid 1px #ccc; 477 | margin: 0 0 20px 0; 478 | } 479 | 480 | /* ----------------------------------------- 481 | Standard Forms 482 | ----------------------------------------- */ 483 | 484 | .fg label { display: block; cursor: pointer; } 485 | .fg { margin-bottom:9px;} 486 | 487 | input.text, textarea { 488 | border:solid 1px #ccc; 489 | padding:0.41%; 490 | } 491 | select { 492 | padding:0.41%; 493 | } 494 | 495 | input.text, textarea, select { display: block; } 496 | 497 | /* Text input and textarea font and padding */ 498 | input.text, textarea { font-size: 13px; padding: 3px 3px 2px; outline: none !important; background: #fff; } 499 | input.text.oversize, textarea.oversize { font-size: 18px !important; padding: 4px 5px !important; } 500 | input.text:focus, textarea:focus { background: #f9f9f9; } 501 | 502 | input[type=file] { 503 | background-color: #ffffff; 504 | padding: initial; 505 | border: initial; 506 | line-height: initial; 507 | -webkit-box-shadow: none; 508 | -moz-box-shadow: none; 509 | box-shadow: none; 510 | 511 | height: 20px; 512 | line-height: 20px; 513 | } 514 | 515 | input.text:focus, textarea:focus { 516 | outline: 0; 517 | border-color: #73B8EF; 518 | 519 | -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); 520 | -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); 521 | box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6); 522 | } 523 | input[type=file]:focus, input.checkbox:focus, select:focus { 524 | -webkit-box-shadow: none; 525 | -moz-box-shadow: none; 526 | box-shadow: none; 527 | outline: 1px dotted #666; 528 | } 529 | input[disabled], input.text.disabled, select[disabled], select.text.disabled, textarea[disabled], textarea.text.disabled { 530 | cursor: not-allowed; 531 | 532 | background-color: #F5F5F5; 533 | border-color: #DDDDDD; 534 | cursor: not-allowed; 535 | } 536 | .fg_error input:focus, .fg_error textarea:focus { 537 | border-color: #b9554d; 538 | -webkit-box-shadow: 0 0 6px rgba(171, 41, 32, 0.5); 539 | -moz-box-shadow: 0 0 6px rgba(171, 41, 32, 0.5); 540 | box-shadow: 0 0 6px rgba(171, 41, 32, 0.5); 541 | } 542 | 543 | /* Inlined Label Style */ 544 | input.placeholder, textarea.placeholder 545 | { color: #d5d3d3; } 546 | input::-webkit-input-placeholder 547 | { color: #d5d3d3; } 548 | input:-moz-placeholder 549 | { color: #d5d3d3; } 550 | 551 | /* Text input and textarea sizes */ 552 | input.text, textarea { width: 51.5%; } 553 | input.small, textarea.small { width: 25%; } 554 | input.large, textarea.large { width: 96%; } 555 | 556 | select { width: 52.8%; } 557 | select.small { width: 26.5%; } 558 | select.large { width: 97.2%; } 559 | 560 | /* Fieldsets */ 561 | form fieldset { padding: 9px 9px 2px 9px; border: solid 1px #ddd; margin: 18px 0; } 562 | 563 | /* Inlined Radio & Checkbox */ 564 | .fg input.radio, .fg input.checkbox { display: inline; width:auto; margin-bottom:0; cursor: pointer; } 565 | 566 | .fg small { display: block; font-size: 11px; } 567 | 568 | /* Errors */ 569 | div.fg_error input, div.fg_error textarea { border-color: red; background-color: #FFD9D9; } 570 | div.fg_error select { background-color: #FFD9D9; } 571 | div.fg_error label { color: #9D261D; } 572 | div.fg_error.radioGroup .options , div.fg_error.checkboxGroup .options { border:solid 1px #c87872; } 573 | div.fg_error.radioGroup .option label, div.fg_error.checkboxGroup .option label { color:#000; } 574 | div.fg_error small { color: #9D261D; } 575 | 576 | .small + small.error { width: 140px; } 577 | .medium + small.error { width: 260px; } 578 | .large + small.error { width: 440px; } 579 | 580 | .radioGroup .option, .checkboxGroup, .checkboxGroup .option { clear:both; min-height:20px; } 581 | .radioGroup .options input.radio { clear:both; float:left; margin-top:2px; } 582 | .radioGroup .options label { padding-left:5px; float:left; } 583 | 584 | .checkboxGroup input.checkbox { float:left; margin-top:2px; } 585 | .checkboxGroup label { padding-right:5px; float:left; } 586 | .checkboxGroup input.checkbox + label { padding-left:5px; padding-right:0; } 587 | 588 | /* Inline/Horizontal forms */ 589 | .fh .fg { float:left; padding-right:5px; } 590 | .fh label { float:left; padding-right:5px; padding-top:4px; } 591 | .fh input.text, .fh select, .fh textarea { float:left; width:100px;} 592 | .fh select { margin-top:4px;} /* to render select in ff/windows */ 593 | .fh .options { float:left;} 594 | .fh .option { float:left; clear:none; margin-right:20px;} 595 | .fh .option input.checkbox, .fh .option input.radio { margin-top:6px; } 596 | 597 | @media only screen and (max-width: 767px) { 598 | div.form-field input, div.form-field input.small, div.form-field input.medium, div.form-field input.large, div.form-field input.oversize, input.text, input.text.oversize, textarea, select { display: block; width: 96%; padding: 6px 2% 4px; font-size: 18px; } 599 | 600 | select, select.large, select.small { width:100%; padding-left:0.41%;} 601 | 602 | /* Buttons */ 603 | .bt { display: block; } 604 | button.bt { width: 100%; padding-left: 0px; padding-right: 0px; } 605 | } 606 | 607 | /* -------------------------------------------------- 608 | :: Grid 609 | -------------------------------------------------- */ 610 | .row { max-width: 980px; min-width: 727px; } 611 | .fixContainer { width: 980px;} 612 | 613 | 614 | /* Tablet screens */ 615 | @media only screen and (device-width: 768px), (device-width: 800px) { 616 | /* Currently unused */ 617 | } 618 | 619 | 620 | /* Mobile */ 621 | @media only screen and (max-width: 767px) { 622 | body { -webkit-text-size-adjust: none; } 623 | 624 | .container .row, body, .container { width: 100%; min-width: 0; margin-left: 0px; margin-right: 0px; padding-left: 0px; padding-right: 0px; } 625 | .container .row .row .g1, .container .row .row .g2, .container .row .row .g3, 626 | .container .row .row .g4, .container .row .row .g5, .container .row .row .g6, 627 | .container .row .row .g7, .container .row .row .g8, .container .row .row .g9, 628 | .container .row .row .g10, .container .row .row .g11, .container .row .row .g12 629 | { padding: 0; } 630 | 631 | .container .g1, .container .g2, .container .g3, 632 | .container .g4, .container .g5, .container .g6, 633 | .container .g7, .container .g8, .container .g9, 634 | .container .g10, .container .g11, .container .g12 635 | { width: auto !important; float: none; margin-left: 0px; margin-right: 0px; padding-left: 20px; padding-right: 20px; } 636 | 637 | .container .g1:last-child, .container .g2:last-child, .container .g3:last-child, 638 | .container .g4:last-child, .container .g5:last-child, .container .g6:last-child, 639 | .container .g7:last-child, .container .g8:last-child, .container .g9:last-child, 640 | .container .g10:last-child, .container .g11:last-child, .container .g12:last-child 641 | { margin-right: 0px; } 642 | 643 | 644 | } 645 | 646 | 647 | /* -------------------------------------------------- 648 | :: Mobile Visibility Affordances 649 | ---------------------------------------------------*/ 650 | 651 | 652 | .show-on-phones { display: none !important; } 653 | .show-on-tablets { display: none !important; } 654 | .show-on-desktops { display: block; } 655 | 656 | .hide-on-phones { display: block !important; } 657 | .hide-on-tablets { display: block !important; } 658 | .hide-on-desktops { display: none; } 659 | 660 | 661 | @media only screen and (device-width: 768px), only screen and (device-width: 1280px), only screen and (device-width: 800px) { 662 | .hide-on-phones { display: block !important; } 663 | .hide-on-tablets { display: none !important; } 664 | .hide-on-desktops { display: block !important; } 665 | 666 | .show-on-phones { display: none !important; } 667 | .show-on-tablets { display: block !important; } 668 | .show-on-desktops { display: none !important; } 669 | } 670 | 671 | @media only screen and (max-width: 767px) { 672 | .hide-on-phones { display: none !important; } 673 | .hide-on-tablets { display: block !important; } 674 | .hide-on-desktops { display: block !important; } 675 | 676 | .show-on-phones { display: block !important; } 677 | .show-on-tablets { display: none !important; } 678 | .show-on-desktops { display: none !important; } 679 | } 680 | 681 | 682 | 683 | 684 | 685 | /* -------------------------------------------------- 686 | :: UI 687 | ---------------------------------------------------*/ 688 | 689 | 690 | /*= Tabs */ 691 | 692 | @media only screen and (max-width: 767px) { 693 | 694 | dl.tabs.mobile { width: auto; margin: 20px -20px 40px; height: auto; } 695 | dl.tabs.mobile dt, dl.tabs.mobile dd { float: none; height: auto; } 696 | 697 | dl.tabs.mobile dd a { display: block; width: auto; height: auto; padding: 18px 20px; line-height: 1; border: solid 0px #ccc; border-width: 1px 0px 0px; margin: 0; color: #555; background: #eee; font-size: 15px; font-size: 1.5rem; } 698 | dl.tabs.mobile dd a.active { height: auto; margin: 0; border-width: 1px 0px 0px; } 699 | 700 | 701 | dl.contained.mobile, dl.nice.contained.mobile { margin-bottom: 0px; } 702 | dl.contained.tabs.mobile dd a { padding: 18px 20px; } 703 | } 704 | 705 | /*= BreadCrumbs */ 706 | #breadcrumb div , #breadcrumb span{ float:left; margin-right:5px;} 707 | 708 | /*= Pagination */ 709 | .pagination li { 710 | float:left; 711 | border:solid 1px #ccc; 712 | margin-right:3px; 713 | } 714 | .pagination .active { 715 | background-color:#ccc; 716 | } 717 | .pagination .active a { color:#333; cursor:default;} 718 | 719 | .pagination .disabled a { color:#ccc; cursor:default;} 720 | .pagination a { 721 | display:block; 722 | padding:0 15px; 723 | line-height:35px; 724 | } 725 | .pagination .next { margin-right:0;} 726 | 727 | /*= Tooltips */ 728 | .tooltip { display:none; z-index:99;} 729 | .tooltip_content { 730 | background:#000; 731 | color:#fff; 732 | margin-bottom:5px; 733 | padding:3px 5px; 734 | border-radius:3px; 735 | } 736 | .tooltip .arrow { 737 | border-left: 5px solid transparent; 738 | border-right: 5px solid transparent; 739 | border-top: 5px solid #000000; 740 | bottom: 0; 741 | left: 50%; 742 | margin-left: -5px; 743 | height: 0; 744 | width: 0; 745 | position: absolute; 746 | 747 | } 748 | .tooltip.bottom .tooltip_content { 749 | margin-bottom:0; 750 | margin-top:5px; 751 | } 752 | .tooltip.bottom .arrow { 753 | top:0; bottom:auto; 754 | border-top-width:0; 755 | border-bottom: 5px solid #000000; 756 | } 757 | .tooltip .close { 758 | float:right; 759 | } 760 | 761 | 762 | /*= Misc */ 763 | 764 | .fl { float: left; } 765 | .fr { float: right; } 766 | .hidden { display: none; } 767 | .nm { margin:0; } 768 | .cb { clear:both;} 769 | .db { display:block;} 770 | .oh { overflow:hidden; } 771 | .i { font-style: italic; } 772 | .u { text-decoration: underline; } 773 | .ac { text-align:center; } 774 | 775 | 776 | 777 | 778 | -------------------------------------------------------------------------------- /events.database.sql: -------------------------------------------------------------------------------- 1 | -- phpMyAdmin SQL Dump 2 | -- version 4.0.4 3 | -- http://www.phpmyadmin.net 4 | -- 5 | -- Host: localhost 6 | -- Generation Time: Nov 19, 2013 at 06:51 AM 7 | -- Server version: 5.6.12-log 8 | -- PHP Version: 5.4.12 9 | 10 | SET SQL_MODE = "NO_AUTO_VALUE_ON_ZERO"; 11 | SET time_zone = "+00:00"; 12 | 13 | 14 | /*!40101 SET @OLD_CHARACTER_SET_CLIENT=@@CHARACTER_SET_CLIENT */; 15 | /*!40101 SET @OLD_CHARACTER_SET_RESULTS=@@CHARACTER_SET_RESULTS */; 16 | /*!40101 SET @OLD_COLLATION_CONNECTION=@@COLLATION_CONNECTION */; 17 | /*!40101 SET NAMES utf8 */; 18 | 19 | -- 20 | -- Database: `eventcalendar` 21 | -- 22 | 23 | -- -------------------------------------------------------- 24 | 25 | -- 26 | -- Table structure for table `events` 27 | -- 28 | 29 | DROP TABLE IF EXISTS `events`; 30 | CREATE TABLE IF NOT EXISTS `events` ( 31 | `id` int(11) NOT NULL AUTO_INCREMENT, 32 | `date_from` datetime NOT NULL, 33 | `date_to` datetime NOT NULL, 34 | `type` int(3) NOT NULL, 35 | `title` varchar(165) NOT NULL, 36 | `description` longtext NOT NULL, 37 | `link` varchar(300) NOT NULL, 38 | `color` varchar(7) NOT NULL, 39 | PRIMARY KEY (`id`), 40 | UNIQUE KEY `id` (`id`) 41 | ) ENGINE=InnoDB DEFAULT CHARSET=utf8 AUTO_INCREMENT=1 ; 42 | 43 | /*!40101 SET CHARACTER_SET_CLIENT=@OLD_CHARACTER_SET_CLIENT */; 44 | /*!40101 SET CHARACTER_SET_RESULTS=@OLD_CHARACTER_SET_RESULTS */; 45 | /*!40101 SET COLLATION_CONNECTION=@OLD_COLLATION_CONNECTION */; 46 | -------------------------------------------------------------------------------- /img/PluginPage.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jaime8111/jQueryEventCalendar/0c08b14dcbe4f340291f61fea9474079525adc4f/img/PluginPage.png -------------------------------------------------------------------------------- /img/eventsCalendarIcon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jaime8111/jQueryEventCalendar/0c08b14dcbe4f340291f61fea9474079525adc4f/img/eventsCalendarIcon.png -------------------------------------------------------------------------------- /img/eventsCalendarIcon_250.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jaime8111/jQueryEventCalendar/0c08b14dcbe4f340291f61fea9474079525adc4f/img/eventsCalendarIcon_250.png -------------------------------------------------------------------------------- /img/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jaime8111/jQueryEventCalendar/0c08b14dcbe4f340291f61fea9474079525adc4f/img/favicon.ico -------------------------------------------------------------------------------- /img/jaime.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jaime8111/jQueryEventCalendar/0c08b14dcbe4f340291f61fea9474079525adc4f/img/jaime.png -------------------------------------------------------------------------------- /img/paradigmaLogo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/jaime8111/jQueryEventCalendar/0c08b14dcbe4f340291f61fea9474079525adc4f/img/paradigmaLogo.png -------------------------------------------------------------------------------- /includes/config.php: -------------------------------------------------------------------------------- 1 | ERROR: Imposible establecer conexión con el servidor. config.php"; 25 | exit; 26 | } 27 | 28 | mysql_select_db($DbAccess["dataBase"],$con);*/ 29 | ?> -------------------------------------------------------------------------------- /includes/database.php: -------------------------------------------------------------------------------- 1 | query($Query); // query the database 6 | $db->singleRecord(); // retrieve a single record 7 | 8 | 9 | echo $db->Record['post_title']; // output a field value from the recordset 10 | echo "
"; 11 | // do a query to retrieve multiple records 12 | $Query = "SELECT * FROM wp_posts WHERE post_status = 'publish'"; 13 | $db->query($Query); // query the database 14 | while ($db->nextRecord()) 15 | { 16 | echo $db->Record['post_title']."
"; // output a field value from the recordset 17 | } 18 | */ 19 | class Database 20 | { 21 | var $Host = "localhost";// Hostname of our MySQL server. 22 | var $Database = "vissit"; // Logical database name on that server. 23 | var $User = "root"; // User and Password for login. 24 | var $Password = ""; 25 | 26 | var $Link_ID = 0; // Result of mysql_connect(). 27 | var $Query_ID = 0; // Result of most recent mysql_query(). 28 | var $Record = array(); // current mysql_fetch_array()-result. 29 | var $Row; // current row number. 30 | var $LoginError = ""; 31 | 32 | var $Errno = 0; // error state of query... 33 | var $Error = ""; 34 | 35 | 36 | public function __construct($host){ 37 | $this->Host = $host["host"]; 38 | $this->Database = $host["dataBase"]; 39 | $this->User = $host["user"]; 40 | $this->Password = $host["pass"]; 41 | } 42 | //------------------------------------------- 43 | // Connects to the database 44 | //------------------------------------------- 45 | function connect() 46 | { 47 | if( 0 == $this->Link_ID ) 48 | $this->Link_ID=mysql_connect( $this->Host, $this->User, $this->Password ); 49 | if( !$this->Link_ID ) 50 | $this->halt( "Link-ID == false, connect failed" ); 51 | if( !mysql_query( sprintf( "use %s", $this->Database ), $this->Link_ID ) ) 52 | $this->halt( "cannot use database ".$this->Database ); 53 | } // end function connect 54 | 55 | //------------------------------------------- 56 | // Queries the database 57 | //------------------------------------------- 58 | function query( $Query_String ) 59 | { 60 | //echo "
$Query_String
"; 61 | $this->connect(); 62 | $this->Query_ID = mysql_query( $Query_String,$this->Link_ID ); 63 | $this->Row = 0; 64 | $this->Errno = mysql_errno(); 65 | $this->Error = mysql_error(); 66 | if( !$this->Query_ID ) 67 | $this->halt( "Invalid SQL: ".$Query_String ); 68 | return $this->Query_ID; 69 | } // end function query 70 | 71 | //------------------------------------------- 72 | // If error, halts the program 73 | //------------------------------------------- 74 | function halt( $msg ) 75 | { 76 | printf( "Database error: %s
n", $msg ); 77 | printf( "MySQL Error: %s (%s)
n", $this->Errno, $this->Error ); 78 | die( "Session halted." ); 79 | } // end function halt 80 | 81 | //------------------------------------------- 82 | // Retrieves the next record in a recordset 83 | //------------------------------------------- 84 | function nextRecord() 85 | { 86 | @ $this->Record = mysql_fetch_array( $this->Query_ID ); 87 | $this->Row += 1; 88 | $this->Errno = mysql_errno(); 89 | $this->Error = mysql_error(); 90 | $stat = is_array( $this->Record ); 91 | if( !$stat ) 92 | { 93 | @ mysql_free_result( $this->Query_ID ); 94 | $this->Query_ID = 0; 95 | } 96 | return $stat; 97 | } // end function nextRecord 98 | 99 | //------------------------------------------- 100 | // Retrieves a single record 101 | //------------------------------------------- 102 | function singleRecord() 103 | { 104 | $this->Record = mysql_fetch_array( $this->Query_ID ); 105 | $stat = is_array( $this->Record ); 106 | return $stat; 107 | } // end function singleRecord 108 | 109 | //------------------------------------------- 110 | // Returns the number of rows in a recordset 111 | //------------------------------------------- 112 | function numRows() 113 | { 114 | return mysql_num_rows( $this->Query_ID ); 115 | } // end function numRows 116 | 117 | } // end class Database 118 | ?> -------------------------------------------------------------------------------- /includes/footer.php: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /includes/header.php: -------------------------------------------------------------------------------- 1 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | jQuery Event Calendar Demo Page 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | jQuery Event Calendar Demo Page 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 |
28 |
29 | 30 |
31 |
32 | 33 | 34 | 35 |

36 | jQuery Event Calendar Demo Page 37 |

38 | 39 |

40 | jQuery plugin to show events in a calendar in a very confortable way 41 |

42 |

43 | Main features: 44 |

45 |
    46 |
  • Fluid Calendar: calendar will be shown with the width of its parent. Size is recalculated on window resize. So you can use it in your responsive designs
    • 47 |
  • Change Style as you like: You can edit the .css file to restyle
    • 48 |
  • Light: Less than 8kb of Javascript(minified)
    • 49 |
  • jQuery rules!: It uses all the power of jQuery, but you can also use it with frameworks like Zepto.js
    • 50 |
  • Highly customizable: You can change almost everything. Look at the following examples
    • 51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |

Localization

60 |

We have total control about the language of the plugin

61 |
62 |
63 |
64 |
65 |

With all the text in the properties

66 |
67 | 112 | 
$(id).eventCalendar({
113 |   eventsjson: 'file.json',
114 |   locales: {
115 |     locale: "es",
116 | 	monthNames: [ "Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio",
117 | 		"Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre" ],
118 | 	dayNames: [ 'Domingo','Lunes','Martes','Miércoles',
119 | 		'Jueves','Viernes','Sabado' ],
120 | 	dayNamesShort: [ 'Dom','Lun','Mar','Mie', 'Jue','Vie','Sab' ],
121 | 	txt_noEvents: "No hay eventos para este periodo",
122 | 	txt_SpecificEvents_prev: "",
123 | 	txt_SpecificEvents_after: "eventos:",
124 | 	txt_next: "siguiente",
125 | 	txt_prev: "anterior",
126 | 	txt_NextEvents: "Próximos eventos:",
127 | 	txt_GoToEventUrl: "Ir al evento",
128 | 	moment: {
129 |         "months" : [ "Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio",
130 |                 "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre" ],
131 |         "monthsShort" : [ "Ene", "Feb", "Mar", "Abr", "May", "Jun",
132 |                 "Julio", "Ago", "Sep", "Oct", "Nov", "Dic" ],
133 |         "weekdays" : [ "Domingo","Lunes","Martes","Miércoles",
134 |                 "Jueves","Viernes","Sabado" ],
135 |         "weekdaysShort" : [ "Dom","Lun","Mar","Mie",
136 |                 "Jue","Vie","Sab" ],
137 |         "weekdaysMin" : [ "Do","Lu","Ma","Mi","Ju","Vi","Sa" ],
138 |         "longDateFormat" : {
139 |             "LT" : "H:mm",
140 |             "LTS" : "LT:ss",
141 |             "L" : "DD/MM/YYYY",
142 |             "LL" : "D [de] MMMM [de] YYYY",
143 |             "LLL" : "D [de] MMMM [de] YYYY LT",
144 |             "LLLL" : "dddd, D [de] MMMM [de] YYYY LT"
145 |         },
146 |         "week" : {
147 |             "dow" : 1,
148 |             "doy" : 4
149 |         }
150 |     }
151 |   }
152 | });
153 |
154 |
155 |

With all the text in an external file

156 |
157 | 165 | 
$(id).eventCalendar({
166 |   eventsjson: 'file.json',
167 |   locales: 'json/locale.es.json'
168 | });
169 |
170 |
171 |
172 |
173 |
174 |
175 |

Human Date Format

176 |

Most of you don't like timestamp date format, so now you can use another formats

177 |
178 | 186 | 
$(id).eventCalendar({
187 |   eventsjson: 'file.json',
188 |   jsonDateFormat: 'human'
189 | });
190 |
191 |
192 |

Custom Date Format to display

193 |

Now you can change the format date to be displayed on events. I use moment.js to do it.

194 |
195 | 203 | 
$(id).eventCalendar({
204 |   eventsjson: 'file.json',
205 |   dateFormat: 'dddd MM-D-YYYY'
206 | });
207 |
208 |
209 |
210 |
211 |

Default Demo

212 |

Example of jQuery Events Calendar with default parameters

213 |
214 | 
$(id).eventCalendar({
215 |   // link to events json
216 |   eventsjson: 'file.json'
217 | });
218 | 219 | 226 |
227 |
228 |

No cache

229 |

The plugin only calls once to the json file, so it has to contain all events. After that call, the plugin will filter the results

230 |
231 | 239 | 
$(id).eventCalendar({
240 |   eventsjson: 'file.json',
241 |   cacheJson: false
242 | });
243 |
244 |
245 |

inline json

246 |

The json is written directly inside the plugin function via javaScript (no ajax call to get the events).

247 |
248 | 257 | 
var eventsInline = [{ json }];
258 | $(id).eventCalendar({
259 |   jsonData: eventsInline
260 | });
261 |
262 |
263 |
264 |
265 |
266 | 267 |
268 |

Limit Results

269 |

It is possible to limit the number of events to show. But if we click on a day, results will not be filtered

270 |
271 | 279 | 
$(id).eventCalendar({
280 |   eventsjson: 'file.json',
281 |   eventsLimit: 2
282 | });
283 |
284 |
285 |

Start week on Sunday

286 |

Also you can customize the day when the week starts

287 |
288 | 296 | 
$(id).eventCalendar({
297 |   eventsjson: 'file.json',
298 |   startWeekOnMonday: false
299 | });
300 |
301 |
302 |
303 |
304 |
305 |
306 |

Calendar display

307 |

You can show all the days in a single line to make calendar widget smaller

308 |
309 | 317 | 
$(id).eventCalendar({
318 |   eventsjson: 'file.json',
319 |   showDayAsWeeks: false
320 | });
321 |
322 |
323 |

Hide week days

324 |

Hide the day names in the calendar view

325 |
326 | 334 | 
$(id).eventCalendar({
335 |   eventsjson: 'file.json',
336 |   showDayNameInCalendar: false
337 | });
338 |
339 |
340 |
341 |
342 |
343 |
344 |

Show Events description

345 |

Events description is hide by default (you can show it clicking on the event title), but if you want they can be always visible.

346 |
347 | 355 | 
$(id).eventCalendar({
356 |   eventsjson: 'file.json',
357 |   showDescription: true
358 | });
359 |
360 |
361 |

Show all descriptions

362 |

By default, the plugin only shows the event that you select, but you can open all the descriptions in which you click on

363 |
364 | 372 | 
$(id).eventCalendar({
373 |   eventsjson: 'file.json',
374 |   onlyOneDescription: false
375 | });
376 |
377 |
378 |

Animation Speed

379 |

Also you can customize the speed and the opacity of the widget animation

380 |
381 | 390 | 
$(id).eventCalendar({
391 |   eventsjson: 'file.json',
392 |   moveSpeed: 2000,
393 |   moveOpacity: 1
394 | });
395 |
396 |
397 |
398 |
399 |
400 |
401 |

Events Scrollable

402 |

It is possible to add a Scroll panel for the events list to avoid panel resize on date changes

403 |
404 | 412 | 
$(id).eventCalendar({
413 |   eventsjson: 'file.json',
414 |   eventsScrollable: true
415 | });
416 |
417 |
418 |

Open links in new window

419 |

You can open event links in a new window

420 |
421 | 430 | 
$(id).eventCalendar({
431 |   eventsjson: 'file.json',
432 |   openEventInNewWindow: true,
433 |   showDescription: true // also it can be false
434 | });
435 |
436 | 437 | 438 | 439 | 440 |
441 |
442 |
443 |
444 |
445 | 446 |
447 | Paradigma Tecnológico 448 | 449 |
450 | 451 |
452 |
453 | 454 |
455 | Jaime Fernández 456 | 457 |
458 | 459 | 460 | 461 |
462 |
463 |
464 |
465 |
466 |
467 |
468 |

469 | Special thanks to: 470 |

471 | 488 | 489 |
490 |
491 | 494 |
495 |
496 |
497 | 498 | 499 | 500 | 501 | 505 | 508 | 509 | 510 | 511 | -------------------------------------------------------------------------------- /js/jquery.eventCalendar.js: -------------------------------------------------------------------------------- 1 | /* = 2 | jquery.eventCalendar.js 3 | version: 0.7 4 | date: 13-08-2015 5 | author: 6 | Jaime Fernandez (@vissit) 7 | company: 8 | Paradigma Tecnologico (@paradigmate) 9 | url: 10 | http://www.vissit.com/projects/eventCalendar/ 11 | */ 12 | ;(function( $ ) { 13 | $.fn.eventCalendar = function(options){ 14 | var calendar = this; 15 | 16 | if ( options.locales && typeof(options.locales) == 'string' ) { 17 | $.getJSON(options.locales, function(data) { 18 | options.locales = $.extend({}, $.fn.eventCalendar.defaults.locales, data); 19 | moment.locale(data.locale, options.locales.moment); 20 | moment.locale(data.locale); 21 | 22 | initEventCalendar(calendar, options); 23 | }).error(function() { 24 | showError("error getting locale json", $(this)); 25 | }); 26 | } else { 27 | if ( options.locales && options.locales.locale ) { 28 | options.locales = $.extend({}, $.fn.eventCalendar.defaults.locales, options.locales); 29 | moment.locale(options.locales.locale, options.locales.moment); 30 | moment.locale(options.locales.locale); 31 | } 32 | initEventCalendar(calendar, options); 33 | } 34 | 35 | 36 | }; 37 | 38 | 39 | // define the parameters with the default values of the function 40 | $.fn.eventCalendar.defaults = { 41 | eventsjson: 'js/events.json', 42 | eventsLimit: 4, 43 | locales: { 44 | locale: "en", 45 | txt_noEvents: "There are no events in this period", 46 | txt_SpecificEvents_prev: "", 47 | txt_SpecificEvents_after: "events:", 48 | txt_next: "next", 49 | txt_prev: "prev", 50 | txt_NextEvents: "Next events:", 51 | txt_GoToEventUrl: "See the event", 52 | txt_loading: "loading..." 53 | }, 54 | showDayAsWeeks: true, 55 | startWeekOnMonday: true, 56 | showDayNameInCalendar: true, 57 | showDescription: false, 58 | onlyOneDescription: true, 59 | openEventInNewWindow: false, 60 | eventsScrollable: false, 61 | dateFormat: "D/MM/YYYY", 62 | jsonDateFormat: 'timestamp', // you can use also "human" 'YYYY-MM-DD HH:MM:SS' 63 | moveSpeed: 500, // speed of month move when you clic on a new date 64 | moveOpacity: 0.15, // month and events fadeOut to this opacity 65 | jsonData: "", // to load and inline json (not ajax calls) 66 | cacheJson: true // if true plugin get a json only first time and after plugin filter events 67 | // if false plugin get a new json on each date change 68 | }; 69 | 70 | function initEventCalendar(that, options) { 71 | var eventsOpts = $.extend({}, $.fn.eventCalendar.defaults, options); 72 | 73 | // define global vars for the function 74 | var flags = { 75 | wrap: "", 76 | directionLeftMove: "300", 77 | eventsJson: {} 78 | }; 79 | 80 | // each eventCalendar will execute this function 81 | that.each(function(){ 82 | 83 | flags.wrap = $(this); 84 | flags.wrap.addClass('eventCalendar-wrap').append("

"+eventsOpts.locales.txt_loading+"
    "); 85 | 86 | if (eventsOpts.eventsScrollable) { 87 | flags.wrap.find('.eventCalendar-list-content').addClass('scrollable'); 88 | } 89 | 90 | setCalendarWidth(flags); 91 | $(window).resize(function(){ 92 | setCalendarWidth(flags); 93 | }); 94 | //flags.directionLeftMove = flags.wrap.width(); 95 | 96 | // show current month 97 | dateSlider("current", flags, eventsOpts); 98 | 99 | getEvents(flags, eventsOpts, eventsOpts.eventsLimit,false,false,false,false); 100 | 101 | changeMonth(flags, eventsOpts); 102 | 103 | flags.wrap.on('click','.eventCalendar-day a',function(e){ 104 | //flags.wrap.find('.eventCalendar-day a').live('click',function(e){ 105 | e.preventDefault(); 106 | var year = flags.wrap.attr('data-current-year'), 107 | month = flags.wrap.attr('data-current-month'), 108 | day = $(this).parent().attr('rel'); 109 | 110 | getEvents(flags, eventsOpts, false, year, month,day, "day"); 111 | }); 112 | flags.wrap.on('click','.eventCalendar-monthTitle', function(e){ 113 | //flags.wrap.find('.eventCalendar-monthTitle').live('click',function(e){ 114 | e.preventDefault(); 115 | var year = flags.wrap.attr('data-current-year'), 116 | month = flags.wrap.attr('data-current-month'); 117 | 118 | getEvents(flags, eventsOpts, eventsOpts.eventsLimit, year, month,false, "month"); 119 | }); 120 | }); 121 | 122 | // show event description 123 | flags.wrap.find('.eventCalendar-list').on('click','.eventCalendar-eventTitle',function(e){ 124 | //flags.wrap.find('.eventCalendar-list .eventCalendar-eventTitle').live('click',function(e){ 125 | if(!eventsOpts.showDescription) { 126 | e.preventDefault(); 127 | var desc = $(this).parent().find('.eventCalendar-eventDesc'); 128 | 129 | if (!desc.find('a').size()) { 130 | var eventUrl = $(this).attr('href'); 131 | var eventTarget = $(this).attr('target'); 132 | 133 | // create a button to go to event url 134 | desc.append(''+eventsOpts.locales.txt_GoToEventUrl+''); 135 | } 136 | 137 | if ( desc.is(':visible') ) { 138 | desc.slideUp(); 139 | } else { 140 | if(eventsOpts.onlyOneDescription) { 141 | flags.wrap.find('.eventCalendar-eventDesc').slideUp(); 142 | } 143 | desc.slideDown(); 144 | } 145 | 146 | } 147 | }); 148 | } 149 | 150 | function sortJson(a, b){ 151 | if ( typeof a.date === 'string' ) { 152 | return a.date.toLowerCase() > b.date.toLowerCase() ? 1 : -1; 153 | } 154 | return a.date > b.date ? 1 : -1; 155 | } 156 | 157 | function dateSlider(show, flags, eventsOpts) { 158 | var $eventsCalendarSlider = $("
    "), 159 | $eventsCalendarMonthWrap = $("
    "), 160 | $eventsCalendarTitle = $("
    "), 161 | $eventsCalendarArrows = $("" + eventsOpts.locales.txt_prev + "" + eventsOpts.locales.txt_next + ""); 162 | $eventsCalendarDaysList = $(""), 163 | date = new Date(); 164 | 165 | if ( !flags.wrap.find('.eventCalendar-slider').length ) { 166 | flags.wrap.prepend($eventsCalendarSlider); 167 | $eventsCalendarSlider.append($eventsCalendarMonthWrap); 168 | } else { 169 | flags.wrap.find('.eventCalendar-slider').append($eventsCalendarMonthWrap); 170 | } 171 | 172 | flags.wrap.find('.eventCalendar-monthWrap.eventCalendar-currentMonth').removeClass('eventCalendar-currentMonth').addClass('eventCalendar-oldMonth'); 173 | $eventsCalendarMonthWrap.addClass('eventCalendar-currentMonth').append($eventsCalendarTitle, $eventsCalendarDaysList); 174 | 175 | 176 | 177 | // if current show current month & day 178 | if (show === "current") { 179 | day = date.getDate(); 180 | $eventsCalendarSlider.append($eventsCalendarArrows); 181 | 182 | } else { 183 | date = new Date(flags.wrap.attr('data-current-year'),flags.wrap.attr('data-current-month'),1,0,0,0); // current visible month 184 | day = 0; // not show current day in days list 185 | 186 | moveOfMonth = 1; 187 | if (show === "prev") { 188 | moveOfMonth = -1; 189 | } 190 | date.setMonth( date.getMonth() + moveOfMonth ); 191 | 192 | var tmpDate = new Date(); 193 | if (date.getMonth() === tmpDate.getMonth()) { 194 | day = tmpDate.getDate(); 195 | } 196 | 197 | } 198 | 199 | // get date portions 200 | var year = date.getFullYear(), // year of the events 201 | currentYear = new Date().getFullYear(), // current year 202 | month = date.getMonth(), // 0-11 203 | monthToShow = month + 1; 204 | 205 | if (show != "current") { 206 | // month change 207 | getEvents(flags, eventsOpts, eventsOpts.eventsLimit, year, month,false, show); 208 | } 209 | 210 | flags.wrap.attr('data-current-month',month) 211 | .attr('data-current-year',year); 212 | 213 | // add current date info 214 | moment.locale(eventsOpts.locales.locale); 215 | 216 | var formatedDate = moment(year+" "+monthToShow, "YYYY MM").format("MMMM YYYY"); 217 | $eventsCalendarTitle.find('.eventCalendar-monthTitle').html(formatedDate); 218 | 219 | // print all month days 220 | var daysOnTheMonth = 32 - new Date(year, month, 32).getDate(); 221 | var daysList = [], 222 | i; 223 | if (eventsOpts.showDayAsWeeks) { 224 | $eventsCalendarDaysList.addClass('eventCalendar-showAsWeek'); 225 | 226 | // show day name in top of calendar 227 | if (eventsOpts.showDayNameInCalendar) { 228 | $eventsCalendarDaysList.addClass('eventCalendar-showDayNames'); 229 | 230 | i = 0; 231 | // if week start on monday 232 | if (eventsOpts.startWeekOnMonday) { 233 | i = 1; 234 | } 235 | 236 | for (; i < 7; i++) { 237 | daysList.push('
  • '+moment()._locale._weekdaysShort[i]+'
    • '); 238 | 239 | if (i === 6 && eventsOpts.startWeekOnMonday) { 240 | // print sunday header 241 | daysList.push('
  • '+moment()._locale._weekdaysShort[0]+'
    • '); 242 | } 243 | 244 | } 245 | } 246 | 247 | dt=new Date(year, month, 01); 248 | var weekDay = dt.getDay(); // day of the week where month starts 249 | 250 | if (eventsOpts.startWeekOnMonday) { 251 | weekDay = dt.getDay() - 1; 252 | } 253 | if (weekDay < 0) { weekDay = 6; } // if -1 is because day starts on sunday(0) and week starts on monday 254 | 255 | for (i = weekDay; i > 0; i--) { 256 | daysList.push('
  • '); 257 | } 258 | } 259 | for (dayCount = 1; dayCount <= daysOnTheMonth; dayCount++) { 260 | var dayClass = ""; 261 | 262 | if (day > 0 && dayCount === day && year === currentYear) { 263 | dayClass = "today"; 264 | } 265 | daysList.push('
  • ' + dayCount + '
    • '); 266 | } 267 | $eventsCalendarDaysList.append(daysList.join('')); 268 | 269 | $eventsCalendarSlider.css('height',$eventsCalendarMonthWrap.height()+'px'); 270 | } 271 | 272 | function getEvents(flags, eventsOpts, limit, year, month, day, direction) { 273 | limit = limit || 0; 274 | year = year || ''; 275 | day = day || ''; 276 | 277 | // to avoid problem with january (month = 0) 278 | 279 | if (typeof month != 'undefined') { 280 | month = month; 281 | } else { 282 | month = ''; 283 | } 284 | 285 | //var month = month || ''; 286 | flags.wrap.find('.eventCalendar-loading').fadeIn(); 287 | 288 | if (eventsOpts.jsonData) { 289 | // user send a json in the plugin params 290 | eventsOpts.cacheJson = true; 291 | 292 | flags.eventsJson = eventsOpts.jsonData; 293 | getEventsData(flags, eventsOpts, flags.eventsJson, limit, year, month, day, direction); 294 | 295 | } else if (!eventsOpts.cacheJson || !direction) { 296 | // first load: load json and save it to future filters 297 | $.getJSON(eventsOpts.eventsjson + "?limit="+limit+"&year="+year+"&month="+month+"&day="+day, function(data) { 298 | flags.eventsJson = data; // save data to future filters 299 | getEventsData(flags, eventsOpts, flags.eventsJson, limit, year, month, day, direction); 300 | }).error(function() { 301 | showError("error getting json: ", flags.wrap); 302 | }); 303 | } else { 304 | // filter previus saved json 305 | getEventsData(flags, eventsOpts, flags.eventsJson, limit, year, month, day, direction); 306 | } 307 | 308 | if (day > '') { 309 | flags.wrap.find('.eventCalendar-current').removeClass('eventCalendar-current'); 310 | flags.wrap.find('#dayList_'+day).addClass('eventCalendar-current'); 311 | } 312 | } 313 | 314 | function getEventsData(flags, eventsOpts, data, limit, year, month, day, direction){ 315 | directionLeftMove = "-=" + flags.directionLeftMove; 316 | eventContentHeight = "auto"; 317 | 318 | subtitle = flags.wrap.find('.eventCalendar-list-wrap .eventCalendar-subtitle'); 319 | 320 | if ( !direction ) { 321 | // first load 322 | subtitle.html(eventsOpts.locales.txt_NextEvents); 323 | eventContentHeight = "auto"; 324 | directionLeftMove = "-=0"; 325 | } else { 326 | var jsMonth = parseInt(month) + 1, 327 | formatedDate; 328 | moment.locale(eventsOpts.locales.locale); 329 | 330 | if (day !== '') { 331 | formatedDate = moment(year+" "+jsMonth+" "+day, "YYYY MM DD").format("LL"); 332 | subtitle.html(eventsOpts.locales.txt_SpecificEvents_prev + formatedDate + " " + eventsOpts.locales.txt_SpecificEvents_after); 333 | //eventStringDate = moment(eventDate).format(eventsOpts.dateFormat); 334 | } else { 335 | formatedDate = moment(year+" "+jsMonth, "YYYY MM").format("MMMM"); 336 | subtitle.html(eventsOpts.locales.txt_SpecificEvents_prev + formatedDate + " " + eventsOpts.locales.txt_SpecificEvents_after); 337 | } 338 | 339 | if (direction === 'eventCalendar-prev') { 340 | directionLeftMove = "+=" + flags.directionLeftMove; 341 | } else if (direction === 'day' || direction === 'month') { 342 | directionLeftMove = "+=0"; 343 | eventContentHeight = 0; 344 | } 345 | } 346 | 347 | flags.wrap.find('.eventCalendar-list').animate({ 348 | opacity: eventsOpts.moveOpacity, 349 | left: directionLeftMove, 350 | height: eventContentHeight 351 | }, eventsOpts.moveSpeed, function() { 352 | flags.wrap.find('.eventCalendar-list').css({'left':0, 'height': 'auto'}).hide(); 353 | //wrap.find('.eventCalendar-list li').fadeIn(); 354 | 355 | var events = []; 356 | 357 | data = $(data).sort(sortJson); // sort event by dates 358 | // each event 359 | if ( data.length ) { 360 | 361 | // show or hide event description 362 | var eventDescClass = ''; 363 | if(!eventsOpts.showDescription) { 364 | eventDescClass = 'eventCalendar-hidden'; 365 | } 366 | var eventLinkTarget = "_self"; 367 | if(eventsOpts.openEventInNewWindow) { 368 | eventLinkTarget = '_blank'; 369 | } 370 | 371 | var i = 0; 372 | $.each(data, function(key, event) { 373 | var eventDateTime, eventDate, eventTime, eventYear, eventMonth, eventDay, 374 | eventMonthToShow, eventHour, eventMinute, eventSeconds; 375 | if (eventsOpts.jsonDateFormat == 'human') { 376 | eventDateTime = event.date.split(" "); 377 | eventDate = eventDateTime[0].split("-"); 378 | eventTime = eventDateTime[1].split(":"); 379 | eventYear = eventDate[0]; 380 | eventMonth = parseInt(eventDate[1]) - 1; 381 | eventDay = parseInt(eventDate[2]); 382 | //eventMonthToShow = eventMonth; 383 | eventMonthToShow = parseInt(eventMonth) + 1; 384 | eventHour = eventTime[0]; 385 | eventMinute = eventTime[1]; 386 | eventSeconds = eventTime[2]; 387 | eventDate = new Date(eventYear, eventMonth, eventDay, eventHour, eventMinute, eventSeconds); 388 | } else { 389 | eventDate = new Date(parseInt(event.date)); 390 | eventYear = eventDate.getFullYear(); 391 | eventMonth = eventDate.getMonth(); 392 | eventDay = eventDate.getDate(); 393 | eventMonthToShow = eventMonth + 1; 394 | eventHour = eventDate.getHours(); 395 | eventMinute = eventDate.getMinutes(); 396 | 397 | } 398 | 399 | if (parseInt(eventMinute) <= 9) { 400 | eventMinute = "0" + parseInt(eventMinute); 401 | } 402 | 403 | 404 | if (limit === 0 || limit > i) { 405 | // if month or day exist then only show matched events 406 | 407 | if ((month === false || month == eventMonth) && (day === '' || day == eventDay) && (year === '' || year == eventYear) ) { 408 | // if initial load then load only future events 409 | if (month === false && eventDate < new Date()) { 410 | } else { 411 | moment.locale(eventsOpts.locales.locale); 412 | //eventStringDate = eventDay + "/" + eventMonthToShow + "/" + eventYear; 413 | eventStringDate = moment(eventDate).format(eventsOpts.dateFormat); 414 | var eventTitle; 415 | 416 | if (event.url) { 417 | eventTitle = '' + event.title + ''; 418 | } else { 419 | eventTitle = ''+event.title+''; 420 | } 421 | events.push('
  • '+eventTitle+'

    ' + event.description + '

    • '); 422 | i++; 423 | } 424 | } 425 | } 426 | 427 | // add mark in the dayList to the days with events 428 | if (eventYear == flags.wrap.attr('data-current-year') && eventMonth == flags.wrap.attr('data-current-month')) { 429 | flags.wrap.find('.eventCalendar-currentMonth .eventCalendar-daysList #dayList_' + parseInt(eventDay)).addClass('eventCalendar-dayWithEvents'); 430 | } 431 | 432 | }); 433 | } 434 | 435 | // there is no events on this period 436 | if (!events.length) { 437 | events.push('

  • ' + eventsOpts.locales.txt_noEvents + '

    • '); 438 | } 439 | flags.wrap.find('.eventCalendar-loading').hide(); 440 | 441 | flags.wrap.find('.eventCalendar-list') 442 | .html(events.join('')); 443 | 444 | flags.wrap.find('.eventCalendar-list').animate({ 445 | opacity: 1, 446 | height: "toggle" 447 | }, eventsOpts.moveSpeed); 448 | 449 | 450 | }); 451 | setCalendarWidth(flags); 452 | } 453 | 454 | function changeMonth(flags, eventsOpts) { 455 | flags.wrap.find('.eventCalendar-arrow').click(function(e){ 456 | e.preventDefault(); 457 | var lastMonthMove; 458 | 459 | if ($(this).hasClass('eventCalendar-next')) { 460 | dateSlider("next", flags, eventsOpts); 461 | lastMonthMove = '-=' + flags.directionLeftMove; 462 | 463 | } else { 464 | dateSlider("prev", flags, eventsOpts); 465 | lastMonthMove = '+=' + flags.directionLeftMove; 466 | } 467 | 468 | flags.wrap.find('.eventCalendar-monthWrap.eventCalendar-oldMonth').animate({ 469 | opacity: eventsOpts.moveOpacity, 470 | left: lastMonthMove 471 | }, eventsOpts.moveSpeed, function() { 472 | flags.wrap.find('.eventCalendar-monthWrap.eventCalendar-oldMonth').remove(); 473 | }); 474 | }); 475 | } 476 | 477 | function showError(msg, wrap) { 478 | wrap.find('.eventCalendar-list-wrap').html(""+msg+""); 479 | } 480 | 481 | function setCalendarWidth(flags){ 482 | // resize calendar width on window resize 483 | flags.directionLeftMove = flags.wrap.width(); 484 | flags.wrap.find('.eventCalendar-monthWrap').width(flags.wrap.width() + 'px'); 485 | 486 | flags.wrap.find('.eventCalendar-list-wrap').width(flags.wrap.width() + 'px'); 487 | 488 | } 489 | 490 | 491 | })( jQuery ); 492 | -------------------------------------------------------------------------------- /js/jquery.eventCalendar.min.js: -------------------------------------------------------------------------------- 1 | /* = 2 | jquery.eventCalendar.js 3 | version: 0.68 4 | date: 17-07-2015 5 | author: 6 | Jaime Fernandez (@vissit) 7 | company: 8 | Paradigma Tecnologico (@paradigmate) 9 | url: 10 | http://www.vissit.com/projects/eventCalendar/ 11 | */ 12 | 13 | ;!function(e){function t(t,a){var l=e.extend({},e.fn.eventCalendar.defaults,a),o={wrap:"",directionLeftMove:"300",eventsJson:{}};t.each(function(){o.wrap=e(this),o.wrap.addClass("eventCalendar-wrap").append("

    "+l.locales.txt_loading+"
      "),l.eventsScrollable&&o.wrap.find(".eventCalendar-list-content").addClass("scrollable"),d(o),e(window).resize(function(){d(o)}),n("current",o,l),r(o,l,l.eventsLimit,!1,!1,!1,!1),s(o,l),o.wrap.on("click",".eventCalendar-day a",function(t){t.preventDefault();var a=o.wrap.attr("data-current-year"),n=o.wrap.attr("data-current-month"),s=e(this).parent().attr("rel");r(o,l,!1,a,n,s,"day")}),o.wrap.on("click",".eventCalendar-monthTitle",function(e){e.preventDefault();var t=o.wrap.attr("data-current-year"),a=o.wrap.attr("data-current-month");r(o,l,l.eventsLimit,t,a,!1,"month")})}),o.wrap.find(".eventCalendar-list").on("click",".eventCalendar-eventTitle",function(t){if(!l.showDescription){t.preventDefault();var a=e(this).parent().find(".eventCalendar-eventDesc");if(!a.find("a").size()){var n=e(this).attr("href"),r=e(this).attr("target");a.append(''+l.locales.txt_GoToEventUrl+"")}a.is(":visible")?a.slideUp():(l.onlyOneDescription&&o.wrap.find(".eventCalendar-eventDesc").slideUp(),a.slideDown())}})}function a(e,t){return"string"==typeof e.date?e.date.toLowerCase()>t.date.toLowerCase()?1:-1:e.date>t.date?1:-1}function n(t,a,n){var l=e("
      "),s=e("
      "),o=e("
      "),d=e(""+n.locales.txt_prev+""+n.locales.txt_next+"");if($eventsCalendarDaysList=e(""),date=new Date,a.wrap.find(".eventCalendar-slider").length?a.wrap.find(".eventCalendar-slider").append(s):(a.wrap.prepend(l),l.append(s)),a.wrap.find(".eventCalendar-monthWrap.eventCalendar-currentMonth").removeClass("eventCalendar-currentMonth").addClass("eventCalendar-oldMonth"),s.addClass("eventCalendar-currentMonth").append(o,$eventsCalendarDaysList),"current"===t)day=date.getDate(),l.append(d);else{date=new Date(a.wrap.attr("data-current-year"),a.wrap.attr("data-current-month"),1,0,0,0),day=0,moveOfMonth=1,"prev"===t&&(moveOfMonth=-1),date.setMonth(date.getMonth()+moveOfMonth);var i=new Date;date.getMonth()===i.getMonth()&&(day=i.getDate())}var v=date.getFullYear(),c=(new Date).getFullYear(),p=date.getMonth(),f=p+1;"current"!=t&&r(a,n,n.eventsLimit,v,p,!1,t),a.wrap.attr("data-current-month",p).attr("data-current-year",v),moment.locale(n.locales.locale);var h=moment(v+" "+f,"YYYY MM").format("MMMM YYYY");o.find(".eventCalendar-monthTitle").html(h);var C,m=32-new Date(v,p,32).getDate(),u=[];if(n.showDayAsWeeks){if($eventsCalendarDaysList.addClass("eventCalendar-showAsWeek"),n.showDayNameInCalendar)for($eventsCalendarDaysList.addClass("eventCalendar-showDayNames"),C=0,n.startWeekOnMonday&&(C=1);7>C;C++)u.push('
    • '+moment()._locale._weekdaysShort[C]+"
      • "),6===C&&n.startWeekOnMonday&&u.push('
    • '+moment()._locale._weekdaysShort[0]+"
      • ");dt=new Date(v,p,1);var w=dt.getDay();for(n.startWeekOnMonday&&(w=dt.getDay()-1),0>w&&(w=6),C=w;C>0;C--)u.push('
    • ')}for(dayCount=1;m>=dayCount;dayCount++){var y="";day>0&&dayCount===day&&v===c&&(y="today"),u.push('
    • '+dayCount+"
      • ")}$eventsCalendarDaysList.append(u.join("")),l.css("height",s.height()+"px")}function r(t,a,n,r,s,d,i){n=n||0,r=r||"",d=d||"",s="undefined"!=typeof s?s:"",t.wrap.find(".eventCalendar-loading").fadeIn(),a.jsonData?(a.cacheJson=!0,t.eventsJson=a.jsonData,l(t,a,t.eventsJson,n,r,s,d,i)):a.cacheJson&&i?l(t,a,t.eventsJson,n,r,s,d,i):e.getJSON(a.eventsjson+"?limit="+n+"&year="+r+"&month="+s+"&day="+d,function(e){t.eventsJson=e,l(t,a,t.eventsJson,n,r,s,d,i)}).error(function(){o("error getting json: ",t.wrap)}),d>""&&(t.wrap.find(".eventCalendar-current").removeClass("eventCalendar-current"),t.wrap.find("#dayList_"+d).addClass("eventCalendar-current"))}function l(t,n,r,l,s,o,i,v){if(directionLeftMove="-="+t.directionLeftMove,eventContentHeight="auto",subtitle=t.wrap.find(".eventCalendar-list-wrap .eventCalendar-subtitle"),v){var c,p=parseInt(o)+1;moment.locale(n.locales.locale),""!==i?(c=moment(s+" "+p+" "+i,"YYYY MM DD").format("LL"),subtitle.html(n.locales.txt_SpecificEvents_prev+c+" "+n.locales.txt_SpecificEvents_after)):(c=moment(s+" "+p,"YYYY MM").format("MMMM"),subtitle.html(n.locales.txt_SpecificEvents_prev+c+" "+n.locales.txt_SpecificEvents_after)),"eventCalendar-prev"===v?directionLeftMove="+="+t.directionLeftMove:("day"===v||"month"===v)&&(directionLeftMove="+=0",eventContentHeight=0)}else subtitle.html(n.locales.txt_NextEvents),eventContentHeight="auto",directionLeftMove="-=0";t.wrap.find(".eventCalendar-list").animate({opacity:n.moveOpacity,left:directionLeftMove,height:eventContentHeight},n.moveSpeed,function(){t.wrap.find(".eventCalendar-list").css({left:0,height:"auto"}).hide();var d=[];if(r=e(r).sort(a),r.length){var v="";n.showDescription||(v="eventCalendar-hidden");var c="_self";n.openEventInNewWindow&&(c="_blank");var p=0;e.each(r,function(e,a){var r,f,h,C,m,u,w,y,g,D;if("human"==n.jsonDateFormat?(r=a.date.split(" "),f=r[0].split("-"),h=r[1].split(":"),C=f[0],m=parseInt(f[1])-1,u=parseInt(f[2]),w=parseInt(m)+1,y=h[0],g=h[1],D=h[2],f=new Date(C,m,u,y,g,D)):(f=new Date(parseInt(a.date)),C=f.getFullYear(),m=f.getMonth(),u=f.getDate(),w=m+1,y=f.getHours(),g=f.getMinutes()),parseInt(g)<=9&&(g="0"+parseInt(g)),(0===l||l>p)&&!(o!==!1&&o!=m||""!==i&&i!=u||""!==s&&s!=C))if(o===!1&&f'+a.title+"":''+a.title+"",d.push('
    • "+M+'

      '+a.description+"

      • "),p++}C==t.wrap.attr("data-current-year")&&m==t.wrap.attr("data-current-month")&&t.wrap.find(".eventCalendar-currentMonth .eventCalendar-daysList #dayList_"+parseInt(u)).addClass("eventCalendar-dayWithEvents")})}d.length||d.push('

    • '+n.locales.txt_noEvents+"

      • "),t.wrap.find(".eventCalendar-loading").hide(),t.wrap.find(".eventCalendar-list").html(d.join("")),t.wrap.find(".eventCalendar-list").animate({opacity:1,height:"toggle"},n.moveSpeed)}),d(t)}function s(t,a){t.wrap.find(".eventCalendar-arrow").click(function(r){r.preventDefault();var l;e(this).hasClass("eventCalendar-next")?(n("next",t,a),l="-="+t.directionLeftMove):(n("prev",t,a),l="+="+t.directionLeftMove),t.wrap.find(".eventCalendar-monthWrap.eventCalendar-oldMonth").animate({opacity:a.moveOpacity,left:l},a.moveSpeed,function(){t.wrap.find(".eventCalendar-monthWrap.eventCalendar-oldMonth").remove()})})}function o(e,t){t.find(".eventCalendar-list-wrap").html(""+e+"")}function d(e){e.directionLeftMove=e.wrap.width(),e.wrap.find(".eventCalendar-monthWrap").width(e.wrap.width()+"px"),e.wrap.find(".eventCalendar-list-wrap").width(e.wrap.width()+"px")}e.fn.eventCalendar=function(a){var n=this;a.locales&&"string"==typeof a.locales?e.getJSON(a.locales,function(r){a.locales=e.extend({},e.fn.eventCalendar.defaults.locales,r),moment.locale(r.locale,a.locales.moment),moment.locale(r.locale),t(n,a)}).error(function(){o("error getting locale json",e(this))}):(a.locales&&a.locales.locale&&(a.locales=e.extend({},e.fn.eventCalendar.defaults.locales,a.locales),moment.locale(a.locales.locale,a.locales.moment),moment.locale(a.locales.locale)),t(n,a))},e.fn.eventCalendar.defaults={eventsjson:"js/events.json",eventsLimit:4,locales:{locale:"en",txt_noEvents:"There are no events in this period",txt_SpecificEvents_prev:"",txt_SpecificEvents_after:"events:",txt_next:"next",txt_prev:"prev",txt_NextEvents:"Next events:",txt_GoToEventUrl:"See the event",txt_loading:"loading..."},showDayAsWeeks:!0,startWeekOnMonday:!0,showDayNameInCalendar:!0,showDescription:!1,onlyOneDescription:!0,openEventInNewWindow:!1,eventsScrollable:!1,dateFormat:"D/MM/YYYY",jsonDateFormat:"timestamp",moveSpeed:500,moveOpacity:.15,jsonData:"",cacheJson:!0}}(jQuery); 14 | -------------------------------------------------------------------------------- /json/event.humanDate.json.php: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /json/events.json: -------------------------------------------------------------------------------- 1 | [ 2 | { "date": "1337594400000", "type": "meeting", "title": "Project A meeting", "description": "Lorem Ipsum dolor set", "url": "http://www.event1.com/" }, 3 | { "date": "1337677200000", "type": "demo", "title": "Project B demo", "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.", "url": "http://www.event2.com/" }, 4 | { "date": "1337686200000", "type": "meeting", "title": "Test Project Brainstorming", "description": "Lorem Ipsum dolor set", "url": "http://www.event3.com/" }, 5 | { "date": "1337696100000", "type": "test", "title": "A very very long name for a f*cking project events", "description": "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam.", "url": "http://www.event5.com/" }, 6 | { "date": "1338890400000", "type": "meeting", "title": "Project B meeting", "description": "Lorem Ipsum dolor set", "url": "http://www.event5.com/" }, 7 | { "date": "1339927200000", "type": "demo", "title": "Project A demo", "description": "Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.", "url": "http://www.event6.com/" }, 8 | { "date": "1334656800000", "type": "meeting", "title": "Test Project C Brainstorming", "description": "Lorem Ipsum dolor set", "url": "http://www.event7.com/" } 9 | ] 10 | -------------------------------------------------------------------------------- /json/events.json.php: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /json/keithjson.json: -------------------------------------------------------------------------------- 1 | [{date:"1211353200000",type:"",title:"CoABoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=1"},{date:"1214463600000",type:"",title:"CABoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=4"},{date:"1214895600000",type:"",title:"CIBoardMeeting/AnnualDinner",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=7"},{date:"1214895600000",type:"",title:"CIBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=8"},{date:"1218092400000",type:"",title:"SierriaofAmerica-BoardMeeting-ConferenceCall",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=10"},{date:"1218092400000",type:"",title:"CTBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=9"},{date:"1218610800000",type:"",title:"SierriaFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=5"},{date:"1222671600000",type:"",title:"SierriaFoundationBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=16"},{date:"1222758000000",type:"",title:"CentestoneFoundation-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=17"},{date:"1222844400000",type:"",title:"SierriaofAlabama-BoardRetreat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=46"},{date:"1223362800000",type:"",title:"SierriaofAmerica-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=3"},{date:"1223449200000",type:"",title:"CRIBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=11"},{date:"1223622000000",type:"",title:"AdvantageBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=12"},{date:"1224486000000",type:"",title:"CRIOpenHouse-Bloomington,Florida",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=14"},{date:"1225177200000",type:"",title:"SierriaFoundation-ConferenceCall",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=18"},{date:"1225263600000",type:"",title:"SierriaFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=6"},{date:"1225350000000",type:"",title:"SierriaAlabama-BoardRetreat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=13"},{date:"1225958400000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=27"},{date:"1228204800000",type:"",title:"SierriaofAlabama-DevelopmentCommitteeMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=28"},{date:"1228204800000",type:"",title:"AmbassadorsCircleEvent-Nashville,TN",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=33"},{date:"1228291200000",type:"",title:"SierriaofFloridaBoardAnnualMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=15"},{date:"1228377600000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=20"},{date:"1229241600000",type:"",title:"GingerbreadWorld-Children'sWorkshop",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=29"},{date:"1229587200000",type:"",title:"GingerbreadWorld-Ginger'sNightOut",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=30"},{date:"1231228800000",type:"",title:"SierriaofAmerica-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=19"},{date:"1231920000000",type:"",title:"CRI-BoardMeeting-ConferenceCall",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=57"},{date:"1232006400000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=31"},{date:"1232524800000",type:"",title:"SierriaofFlorida/DunnCenter-JointMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=59"},{date:"1232611200000",type:"",title:"ConsumerandFamilyAdvocacyCouncil",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=32"},{date:"1233561600000",type:"",title:"AdvantageBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=60"},{date:"1233734400000",type:"",title:"SierriaFoundationBoardMeeting-ConferenceCall",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=58"},{date:"1233820800000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=35"},{date:"1235030400000",type:"",title:"SierriaofAlabama-CALLEDBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=65"},{date:"1236153600000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=66"},{date:"1236240000000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=36"},{date:"1238655600000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=38"},{date:"1239692400000",type:"",title:"SierriaofAlabama-DevelopmentCommitteeMeeting4/14/09-11:30a.m.",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=73"},{date:"1240210800000",type:"",title:"CRIBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=61"},{date:"1240470000000",type:"",title:"SierriaofFlorida-Call-In",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=71"},{date:"1240470000000",type:"",title:"ConsumerandFamilyAdvocacyCouncil",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=39"},{date:"1240988400000",type:"",title:"SierriaFoundationBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=72"},{date:"1241679600000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=40"},{date:"1242889200000",type:"",title:"ALLBOARDSCONFERENCE",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=64"},{date:"1244012400000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=67"},{date:"1244098800000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=41"},{date:"1247122800000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=42"},{date:"1248159600000",type:"",title:"SierriaofFlorida-CEO/BoardCall-In",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=24"},{date:"1248246000000",type:"",title:"CRIBoardMeeting-ConferenceCall",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=62"},{date:"1248246000000",type:"",title:"AdvantageBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=75"},{date:"1248332400000",type:"",title:"ConsumerandFamilyAdvocacyCouncil",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=44"},{date:"1248332400000",type:"",title:"SierriaofFlorida-Call-inupdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=79"},{date:"1249455600000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=68"},{date:"1249455600000",type:"",title:"SierriaofFlorida-CSIDunnjointboardmeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=80"},{date:"1249542000000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=43"},{date:"1251961200000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=45"},{date:"1253170800000",type:"",title:"SierriaofFlorida-BoardOrientation",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=25"},{date:"1253170800000",type:"",title:"SierriaofFlorida-DunnCenterBoardOrientation",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=81"},{date:"1254380400000",type:"",title:"SierriaofAlabamaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=76"},{date:"1254898800000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=69"},{date:"1254898800000",type:"",title:"SierriaofFlorida-CSIboardmeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=82"},{date:"1255503600000",type:"",title:"CRIBoardMeeting-ConferenceCall",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=63"},{date:"1256194800000",type:"",title:"ConsumerandFamilyAdvocacyCouncil",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=47"},{date:"1257235200000",type:"",title:"SierriaFoundation-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=78"},{date:"1257408000000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=48"},{date:"1258617600000",type:"",title:"SierriaofFlorida-Call-inupdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=83"},{date:"1258617600000",type:"",title:"SierriaofFlorida-CEO/BoardCall-In",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=26"},{date:"1259740800000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=70"},{date:"1259827200000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=49"},{date:"1260259200000",type:"",title:"SierriaofAmerica-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=77"},{date:"1262851200000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=50"},{date:"1264060800000",type:"",title:"SierriaofFlorida-Call-inupdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=85"},{date:"1264665600000",type:"",title:"CRIBoardMeeting-9C/10Eto10:30C/11:30E",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=91"},{date:"1265184000000",type:"",title:"SierriaofFlorida-CSIboardmeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=86"},{date:"1265270400000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=51"},{date:"1267689600000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=52"},{date:"1268294400000",type:"",title:"SierriaofFlorida-Call-inupdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=87"},{date:"1270105200000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=53"},{date:"1270623600000",type:"",title:"SierriaofFlorida-Boardmeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=88"},{date:"1271919600000",type:"",title:"SierriaResearchInstituteBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=92"},{date:"1273129200000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=54"},{date:"1274338800000",type:"",title:"SierriaofFlorida-Call-inupdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=89"},{date:"1275548400000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=55"},{date:"1276671600000",type:"",title:"SierriaofFlorida-AnnualBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=90"},{date:"1277967600000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=108"},{date:"1279177200000",type:"",title:"SierriaResearchInstitute-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=107"},{date:"1279177200000",type:"",title:"SierriaofFlorida-CallInUpdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=93"},{date:"1280905200000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=94"},{date:"1281596400000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=109"},{date:"1282806000000",type:"",title:"AllBoardsConference",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=96"},{date:"1283410800000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=110"},{date:"1284620400000",type:"",title:"SierriaofFlorida-CallInUpdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=97"},{date:"1285657200000",type:"",title:"SierriaofAmericaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=120"},{date:"1286348400000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=98"},{date:"1286434800000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=111"},{date:"1286866800000",type:"",title:"CRIBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=122"},{date:"1287385200000",type:"",title:"SierriaofFlorida-BoardOfficersMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=121"},{date:"1288854000000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=112"},{date:"1290067200000",type:"",title:"SierriaofFlorida-CallInUpdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=99"},{date:"1291190400000",type:"",title:"SierriaofAmericaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=124"},{date:"1291190400000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=100"},{date:"1291276800000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=113"},{date:"1294300800000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=114"},{date:"1294819200000",type:"",title:"CRIBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=123"},{date:"1296633600000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=102"},{date:"1296720000000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=115"},{date:"1298534400000",type:"",title:"SierriaFoundation-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=125"},{date:"1299052800000",type:"",title:"SierriaofFlorida-CallIn-WebexUpdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=103"},{date:"1299139200000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=116"},{date:"1302073200000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=104"},{date:"1302159600000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=117"},{date:"1303369200000",type:"",title:"CRIBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=126"},{date:"1304578800000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=118"},{date:"1305788400000",type:"",title:"SierriaofFlorida-CallInUpdate",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=105"},{date:"1306911600000",type:"",title:"SierriaofFlorida-AnnualBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=106"},{date:"1306998000000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=119"},{date:"1312354800000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=143"},{date:"1312441200000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=127"},{date:"1314082800000",type:"",title:"SierriaFoundationBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=138"},{date:"1314860400000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=133"},{date:"1316070000000",type:"",title:"BoardLeadershipSummit",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=150"},{date:"1317711600000",type:"",title:"SierriaofAmerica-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=139"},{date:"1317798000000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=145"},{date:"1317884400000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=128"},{date:"1319180400000",type:"",title:"NotAloneBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=151"},{date:"1320825600000",type:"",title:"CRIBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=144"},{date:"1322726400000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=129"},{date:"1323158400000",type:"",title:"SierriaofAmerica-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=140"},{date:"1323244800000",type:"",title:"SierriaofFloridaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=146"},{date:"1325750400000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=135"},{date:"1328083200000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=147"},{date:"1328688000000",type:"",title:"SierriaofAlabamaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=130"},{date:"1330588800000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=136"},{date:"1332226800000",type:"",title:"SierriaofAmerica-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=141"},{date:"1333522800000",type:"",title:"SierriaofAlabamaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=131"},{date:"1333522800000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=148"},{date:"1334818800000",type:"",title:"CRIBoardRetreat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=152"},{date:"1336028400000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=137"},{date:"1339052400000",type:"",title:"SierriaofAlabamaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=132"},{date:"1339138800000",type:"",title:"SierriaofFlorida-BoardMeeting(Retreat)",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=149"},{date:"1340694000000",type:"",title:"SierriaFoundationBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=153"},{date:"1340780400000",type:"",title:"SierriaofAmerica-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=142"},{date:"1342076400000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=158"},{date:"1342681200000",type:"",title:"CRIBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=177"},{date:"1343804400000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=171"},{date:"1344409200000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=159"},{date:"1346914800000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=160"},{date:"1349247600000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=161"},{date:"1349247600000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=172"},{date:"1351148400000",type:"",title:"SierriaofAmericaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=154"},{date:"1351753200000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=162"},{date:"1354694400000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=163"},{date:"1354694400000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=173"},{date:"1354780800000",type:"",title:"SierriaofAmericaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=155"},{date:"1357804800000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=164"},{date:"1360137600000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=165"},{date:"1360137600000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=174"},{date:"1362643200000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=166"},{date:"1363676400000",type:"",title:"SierriaofAmericaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=156"},{date:"1364972400000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=167"},{date:"1364972400000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=175"},{date:"1367478000000",type:"",title:"SierriaofAlabama-CEOChat",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=168"},{date:"1370415600000",type:"",title:"SierriaofAlabama-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=169"},{date:"1370415600000",type:"",title:"SierriaofFlorida-BoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=176"},{date:"1372143600000",type:"",title:"SierriaofAmericaBoardMeeting",description:"Thereisnodescription.",url:"events_details.php?page=body&ID=157"}] -------------------------------------------------------------------------------- /json/locale.es.json: -------------------------------------------------------------------------------- 1 | { 2 | "locale": "es", 3 | "txt_noEvents": "No hay eventos para este periodo", 4 | "txt_SpecificEvents_prev": "Eventos de ", 5 | "txt_SpecificEvents_after": ":", 6 | "txt_next": "siguiente", 7 | "txt_prev": "anterior", 8 | "txt_NextEvents": "Próximos eventos:", 9 | "txt_GoToEventUrl": "Ir al evento", 10 | "txt_NumAbbrevTh": "", 11 | "txt_NumAbbrevSt": "", 12 | "txt_NumAbbrevNd": "", 13 | "txt_NumAbbrevRd": "", 14 | "txt_loading": "cargando...", 15 | "moment": { 16 | "months" : [ "Enero", "Febrero", "Marzo", "Abril", "Mayo", "Junio", 17 | "Julio", "Agosto", "Septiembre", "Octubre", "Noviembre", "Diciembre" ], 18 | "weekdaysShort" : [ "Dom","Lun","Mar","Mie", 19 | "Jue","Vie","Sab" ], 20 | "longDateFormat" : { 21 | "LT" : "H:mm", 22 | "LTS" : "LT:ss", 23 | "L" : "DD/MM/YYYY", 24 | "LL" : "D [de] MMMM [de] YYYY", 25 | "LLL" : "D [de] MMMM [de] YYYY LT", 26 | "LLLL" : "dddd, D [de] MMMM [de] YYYY LT" 27 | }, 28 | "week" : { 29 | "dow" : 1, 30 | "doy" : 4 31 | } 32 | } 33 | } -------------------------------------------------------------------------------- /newEvent.php: -------------------------------------------------------------------------------- 1 | 4 | 5 | 6 |
      7 |
      8 |
      9 |

      New event

      10 |

      With this form you can create a new event.

      11 |
      12 |
      13 | 14 | 15 |
      16 |
      17 | 18 | 28 |
      29 | Create event 30 |
      31 | 32 |
      33 |
      34 |
      35 | 36 | -------------------------------------------------------------------------------- /test.html: -------------------------------------------------------------------------------- 1 | 4 | 5 | 6 |
      7 |
      8 |
      9 |

      Default Demo

      10 |

      Example of jQuery Events Calendar with default parameters

      11 |
      12 | 13 | 14 | 21 |
      22 |
      23 |
      24 | 25 | 28 | -------------------------------------------------------------------------------- /todo.txt: -------------------------------------------------------------------------------- 1 | new_event.php 2 | pagina independiente 3 | estilos bootstrap 4 | fields 5 | date_from 6 | date_to 7 | type 8 | create_type 9 | edit_type 10 | title 11 | description (que acepte HTML) 12 | link 13 | color 14 | 15 | edit_event.php?event_id 16 | 17 | event.ddbb.json 18 | get events from ddbb 19 | filters 20 | date_from 21 | date_to 22 | type 23 | 24 | calendar 25 | parameters 26 | editor: show or hide new/edit event links 27 | htmlEventsSelector: get events from HTML list 28 | dateFormatToShow: how to show dates on events 29 | 30 | 31 | TODOS: 32 | - option to work without a json. just html 33 | - Add/edit events to the jQuery Event Calendar 34 | - parameter: date format 35 | - parameter: disabled dates before & after 36 | 37 | 38 | - if month start on saturday or sunday, there is one more week, and the calendar hide the "Next events" text. 39 | - Events of several days 40 | - potential bug in jquery.eventcalendar.js file on line 95 41 | it must be toString() after the date. My firebug complained about it. 42 | 43 | - Timeago Plugin integration 44 | 45 | - check on >= IE7 46 | 47 | 48 | - add mode info fields to json 49 | - CSS independent (bootstrap) 50 | 51 | 52 | 53 | DOCUMENTATION 54 | ------------- 55 | 56 | DATABASE VERSION: 57 | In this version you can create and edit events 58 | 59 | First you need to create the tables structure in your SQL database. You can use events.database.sql to import it. 60 | 61 | Open the file /includes/config.php and edit the variables. --------------------------------------------------------------------------------