├── README.md ├── screenshot.png ├── images └── colorbox │ ├── loading.gif │ └── controls.png ├── style.css ├── js ├── custom-scripts.js └── jquery.colorbox.js ├── functions.php └── parts └── headers.php /README.md: -------------------------------------------------------------------------------- 1 | # beasley.wsu.edu 2 | Beasley Coliseum 3 | -------------------------------------------------------------------------------- /screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/washingtonstateuniversity/beasley.wsu.edu/master/screenshot.png -------------------------------------------------------------------------------- /images/colorbox/loading.gif: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/washingtonstateuniversity/beasley.wsu.edu/master/images/colorbox/loading.gif -------------------------------------------------------------------------------- /images/colorbox/controls.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/washingtonstateuniversity/beasley.wsu.edu/master/images/colorbox/controls.png -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | /* 2 | Theme Name: Beasley Coliseum 3 | Theme URI: https://beasley.wsu.edu/ 4 | Author: WSU University Communications 5 | Author URI: https://web.wsu.edu/ 6 | Description: Child theme of WSU Spine for use by the Beasley Coliseum. 7 | Version: 1.0.1 8 | License: GNU General Public License v2 or later 9 | License URI: https://www.gnu.org/licenses/gpl-2.0.html 10 | Tags: light 11 | Template: spine 12 | */ 13 | -------------------------------------------------------------------------------- /js/custom-scripts.js: -------------------------------------------------------------------------------- 1 | // custom scripts for Beasley Coliseum 2 | 3 | // colorbox overrides 4 | (function($){ 5 | $(document).ready(function(){ 6 | 7 | //Examples of how to assign the Colorbox event to elements 8 | $(".link").colorbox({rel:'link', transition:"fade"}); 9 | $(".youtube").colorbox({iframe:true, innerWidth:640, innerHeight:390}); 10 | $(".vimeo").colorbox({iframe:true, innerWidth:500, innerHeight:409}); 11 | $(".iframe").colorbox({iframe:true, width:"80%", height:"80%"}); 12 | }); // end of colorbox 13 | 14 | // tabbed navigation 15 | $(".tabs").tabs(); 16 | 17 | })(jQuery); 18 | -------------------------------------------------------------------------------- /functions.php: -------------------------------------------------------------------------------- 1 | 23 |
24 |
25 | 26 | ' ); ?> 27 | ' ); ?> 28 | 29 |
30 | 31 |
32 |

33 |
34 |
35 | 36 | 37 | -------------------------------------------------------------------------------- /js/jquery.colorbox.js: -------------------------------------------------------------------------------- 1 | /*! 2 | Colorbox 1.6.1 3 | license: MIT 4 | http://www.jacklmoore.com/colorbox 5 | */ 6 | (function ($, document, window) { 7 | var 8 | // Default settings object. 9 | // See http://jacklmoore.com/colorbox for details. 10 | defaults = { 11 | // data sources 12 | html: false, 13 | photo: false, 14 | iframe: false, 15 | inline: false, 16 | 17 | // behavior and appearance 18 | transition: "elastic", 19 | speed: 300, 20 | fadeOut: 300, 21 | width: false, 22 | initialWidth: "600", 23 | innerWidth: false, 24 | maxWidth: false, 25 | height: false, 26 | initialHeight: "450", 27 | innerHeight: false, 28 | maxHeight: false, 29 | scalePhotos: true, 30 | scrolling: true, 31 | opacity: 0.9, 32 | preloading: true, 33 | className: false, 34 | overlayClose: true, 35 | escKey: true, 36 | arrowKey: true, 37 | top: false, 38 | bottom: false, 39 | left: false, 40 | right: false, 41 | fixed: false, 42 | data: undefined, 43 | closeButton: true, 44 | fastIframe: true, 45 | open: false, 46 | reposition: true, 47 | loop: true, 48 | slideshow: false, 49 | slideshowAuto: true, 50 | slideshowSpeed: 2500, 51 | slideshowStart: "start slideshow", 52 | slideshowStop: "stop slideshow", 53 | photoRegex: /\.(gif|png|jp(e|g|eg)|bmp|ico|webp|jxr|svg)((#|\?).*)?$/i, 54 | 55 | // alternate image paths for high-res displays 56 | retinaImage: false, 57 | retinaUrl: false, 58 | retinaSuffix: '@2x.$1', 59 | 60 | // internationalization 61 | current: "image {current} of {total}", 62 | previous: "previous", 63 | next: "next", 64 | close: "close", 65 | xhrError: "This content failed to load.", 66 | imgError: "This image failed to load.", 67 | 68 | // accessbility 69 | returnFocus: true, 70 | trapFocus: true, 71 | 72 | // callbacks 73 | onOpen: false, 74 | onLoad: false, 75 | onComplete: false, 76 | onCleanup: false, 77 | onClosed: false, 78 | 79 | rel: function() { 80 | return this.rel; 81 | }, 82 | href: function() { 83 | // using this.href would give the absolute url, when the href may have been inteded as a selector (e.g. '#container') 84 | return $(this).attr('href'); 85 | }, 86 | title: function() { 87 | return this.title; 88 | }, 89 | createImg: function() { 90 | var img = new Image(); 91 | var attrs = $(this).data('cbox-img-attrs'); 92 | 93 | if (typeof attrs === 'object') { 94 | $.each(attrs, function(key, val){ 95 | img[key] = val; 96 | }); 97 | } 98 | 99 | return img; 100 | }, 101 | createIframe: function() { 102 | var iframe = document.createElement('iframe'); 103 | var attrs = $(this).data('cbox-iframe-attrs'); 104 | 105 | if (typeof attrs === 'object') { 106 | $.each(attrs, function(key, val){ 107 | iframe[key] = val; 108 | }); 109 | } 110 | 111 | if ('frameBorder' in iframe) { 112 | iframe.frameBorder = 0; 113 | } 114 | if ('allowTransparency' in iframe) { 115 | iframe.allowTransparency = "true"; 116 | } 117 | iframe.name = (new Date()).getTime(); // give the iframe a unique name to prevent caching 118 | iframe.allowFullScreen = true; 119 | 120 | return iframe; 121 | } 122 | }, 123 | 124 | // Abstracting the HTML and event identifiers for easy rebranding 125 | colorbox = 'colorbox', 126 | prefix = 'cbox', 127 | boxElement = prefix + 'Element', 128 | 129 | // Events 130 | event_open = prefix + '_open', 131 | event_load = prefix + '_load', 132 | event_complete = prefix + '_complete', 133 | event_cleanup = prefix + '_cleanup', 134 | event_closed = prefix + '_closed', 135 | event_purge = prefix + '_purge', 136 | 137 | // Cached jQuery Object Variables 138 | $overlay, 139 | $box, 140 | $wrap, 141 | $content, 142 | $topBorder, 143 | $leftBorder, 144 | $rightBorder, 145 | $bottomBorder, 146 | $related, 147 | $window, 148 | $loaded, 149 | $loadingBay, 150 | $loadingOverlay, 151 | $title, 152 | $current, 153 | $slideshow, 154 | $next, 155 | $prev, 156 | $close, 157 | $groupControls, 158 | $events = $(''), // $({}) would be prefered, but there is an issue with jQuery 1.4.2 159 | 160 | // Variables for cached values or use across multiple functions 161 | settings, 162 | interfaceHeight, 163 | interfaceWidth, 164 | loadedHeight, 165 | loadedWidth, 166 | index, 167 | photo, 168 | open, 169 | active, 170 | closing, 171 | loadingTimer, 172 | publicMethod, 173 | div = "div", 174 | requests = 0, 175 | previousCSS = {}, 176 | init; 177 | 178 | // **************** 179 | // HELPER FUNCTIONS 180 | // **************** 181 | 182 | // Convenience function for creating new jQuery objects 183 | function $tag(tag, id, css) { 184 | var element = document.createElement(tag); 185 | 186 | if (id) { 187 | element.id = prefix + id; 188 | } 189 | 190 | if (css) { 191 | element.style.cssText = css; 192 | } 193 | 194 | return $(element); 195 | } 196 | 197 | // Get the window height using innerHeight when available to avoid an issue with iOS 198 | // http://bugs.jquery.com/ticket/6724 199 | function winheight() { 200 | return window.innerHeight ? window.innerHeight : $(window).height(); 201 | } 202 | 203 | function Settings(element, options) { 204 | if (options !== Object(options)) { 205 | options = {}; 206 | } 207 | 208 | this.cache = {}; 209 | this.el = element; 210 | 211 | this.value = function(key) { 212 | var dataAttr; 213 | 214 | if (this.cache[key] === undefined) { 215 | dataAttr = $(this.el).attr('data-cbox-'+key); 216 | 217 | if (dataAttr !== undefined) { 218 | this.cache[key] = dataAttr; 219 | } else if (options[key] !== undefined) { 220 | this.cache[key] = options[key]; 221 | } else if (defaults[key] !== undefined) { 222 | this.cache[key] = defaults[key]; 223 | } 224 | } 225 | 226 | return this.cache[key]; 227 | }; 228 | 229 | this.get = function(key) { 230 | var value = this.value(key); 231 | return $.isFunction(value) ? value.call(this.el, this) : value; 232 | }; 233 | } 234 | 235 | // Determine the next and previous members in a group. 236 | function getIndex(increment) { 237 | var 238 | max = $related.length, 239 | newIndex = (index + increment) % max; 240 | 241 | return (newIndex < 0) ? max + newIndex : newIndex; 242 | } 243 | 244 | // Convert '%' and 'px' values to integers 245 | function setSize(size, dimension) { 246 | return Math.round((/%/.test(size) ? ((dimension === 'x' ? $window.width() : winheight()) / 100) : 1) * parseInt(size, 10)); 247 | } 248 | 249 | // Checks an href to see if it is a photo. 250 | // There is a force photo option (photo: true) for hrefs that cannot be matched by the regex. 251 | function isImage(settings, url) { 252 | return settings.get('photo') || settings.get('photoRegex').test(url); 253 | } 254 | 255 | function retinaUrl(settings, url) { 256 | return settings.get('retinaUrl') && window.devicePixelRatio > 1 ? url.replace(settings.get('photoRegex'), settings.get('retinaSuffix')) : url; 257 | } 258 | 259 | function trapFocus(e) { 260 | if ('contains' in $box[0] && !$box[0].contains(e.target) && e.target !== $overlay[0]) { 261 | e.stopPropagation(); 262 | $box.focus(); 263 | } 264 | } 265 | 266 | function setClass(str) { 267 | if (setClass.str !== str) { 268 | $box.add($overlay).removeClass(setClass.str).addClass(str); 269 | setClass.str = str; 270 | } 271 | } 272 | 273 | function getRelated(rel) { 274 | index = 0; 275 | 276 | if (rel && rel !== false && rel !== 'nofollow') { 277 | $related = $('.' + boxElement).filter(function () { 278 | var options = $.data(this, colorbox); 279 | var settings = new Settings(this, options); 280 | return (settings.get('rel') === rel); 281 | }); 282 | index = $related.index(settings.el); 283 | 284 | // Check direct calls to Colorbox. 285 | if (index === -1) { 286 | $related = $related.add(settings.el); 287 | index = $related.length - 1; 288 | } 289 | } else { 290 | $related = $(settings.el); 291 | } 292 | } 293 | 294 | function trigger(event) { 295 | // for external use 296 | $(document).trigger(event); 297 | // for internal use 298 | $events.triggerHandler(event); 299 | } 300 | 301 | var slideshow = (function(){ 302 | var active, 303 | className = prefix + "Slideshow_", 304 | click = "click." + prefix, 305 | timeOut; 306 | 307 | function clear () { 308 | clearTimeout(timeOut); 309 | } 310 | 311 | function set() { 312 | if (settings.get('loop') || $related[index + 1]) { 313 | clear(); 314 | timeOut = setTimeout(publicMethod.next, settings.get('slideshowSpeed')); 315 | } 316 | } 317 | 318 | function start() { 319 | $slideshow 320 | .html(settings.get('slideshowStop')) 321 | .unbind(click) 322 | .one(click, stop); 323 | 324 | $events 325 | .bind(event_complete, set) 326 | .bind(event_load, clear); 327 | 328 | $box.removeClass(className + "off").addClass(className + "on"); 329 | } 330 | 331 | function stop() { 332 | clear(); 333 | 334 | $events 335 | .unbind(event_complete, set) 336 | .unbind(event_load, clear); 337 | 338 | $slideshow 339 | .html(settings.get('slideshowStart')) 340 | .unbind(click) 341 | .one(click, function () { 342 | publicMethod.next(); 343 | start(); 344 | }); 345 | 346 | $box.removeClass(className + "on").addClass(className + "off"); 347 | } 348 | 349 | function reset() { 350 | active = false; 351 | $slideshow.hide(); 352 | clear(); 353 | $events 354 | .unbind(event_complete, set) 355 | .unbind(event_load, clear); 356 | $box.removeClass(className + "off " + className + "on"); 357 | } 358 | 359 | return function(){ 360 | if (active) { 361 | if (!settings.get('slideshow')) { 362 | $events.unbind(event_cleanup, reset); 363 | reset(); 364 | } 365 | } else { 366 | if (settings.get('slideshow') && $related[1]) { 367 | active = true; 368 | $events.one(event_cleanup, reset); 369 | if (settings.get('slideshowAuto')) { 370 | start(); 371 | } else { 372 | stop(); 373 | } 374 | $slideshow.show(); 375 | } 376 | } 377 | }; 378 | 379 | }()); 380 | 381 | 382 | function launch(element) { 383 | var options; 384 | 385 | if (!closing) { 386 | 387 | options = $(element).data(colorbox); 388 | 389 | settings = new Settings(element, options); 390 | 391 | getRelated(settings.get('rel')); 392 | 393 | if (!open) { 394 | open = active = true; // Prevents the page-change action from queuing up if the visitor holds down the left or right keys. 395 | 396 | setClass(settings.get('className')); 397 | 398 | // Show colorbox so the sizes can be calculated in older versions of jQuery 399 | $box.css({visibility:'hidden', display:'block', opacity:''}); 400 | 401 | $loaded = $tag(div, 'LoadedContent', 'width:0; height:0; overflow:hidden; visibility:hidden'); 402 | $content.css({width:'', height:''}).append($loaded); 403 | 404 | // Cache values needed for size calculations 405 | interfaceHeight = $topBorder.height() + $bottomBorder.height() + $content.outerHeight(true) - $content.height(); 406 | interfaceWidth = $leftBorder.width() + $rightBorder.width() + $content.outerWidth(true) - $content.width(); 407 | loadedHeight = $loaded.outerHeight(true); 408 | loadedWidth = $loaded.outerWidth(true); 409 | 410 | // Opens inital empty Colorbox prior to content being loaded. 411 | var initialWidth = setSize(settings.get('initialWidth'), 'x'); 412 | var initialHeight = setSize(settings.get('initialHeight'), 'y'); 413 | var maxWidth = settings.get('maxWidth'); 414 | var maxHeight = settings.get('maxHeight'); 415 | 416 | settings.w = (maxWidth !== false ? Math.min(initialWidth, setSize(maxWidth, 'x')) : initialWidth) - loadedWidth - interfaceWidth; 417 | settings.h = (maxHeight !== false ? Math.min(initialHeight, setSize(maxHeight, 'y')) : initialHeight) - loadedHeight - interfaceHeight; 418 | 419 | $loaded.css({width:'', height:settings.h}); 420 | publicMethod.position(); 421 | 422 | trigger(event_open); 423 | settings.get('onOpen'); 424 | 425 | $groupControls.add($title).hide(); 426 | 427 | $box.focus(); 428 | 429 | if (settings.get('trapFocus')) { 430 | // Confine focus to the modal 431 | // Uses event capturing that is not supported in IE8- 432 | if (document.addEventListener) { 433 | 434 | document.addEventListener('focus', trapFocus, true); 435 | 436 | $events.one(event_closed, function () { 437 | document.removeEventListener('focus', trapFocus, true); 438 | }); 439 | } 440 | } 441 | 442 | // Return focus on closing 443 | if (settings.get('returnFocus')) { 444 | $events.one(event_closed, function () { 445 | $(settings.el).focus(); 446 | }); 447 | } 448 | } 449 | 450 | var opacity = parseFloat(settings.get('opacity')); 451 | $overlay.css({ 452 | opacity: opacity === opacity ? opacity : '', 453 | cursor: settings.get('overlayClose') ? 'pointer' : '', 454 | visibility: 'visible' 455 | }).show(); 456 | 457 | if (settings.get('closeButton')) { 458 | $close.html(settings.get('close')).appendTo($content); 459 | } else { 460 | $close.appendTo('
'); // replace with .detach() when dropping jQuery < 1.4 461 | } 462 | 463 | load(); 464 | } 465 | } 466 | 467 | // Colorbox's markup needs to be added to the DOM prior to being called 468 | // so that the browser will go ahead and load the CSS background images. 469 | function appendHTML() { 470 | if (!$box) { 471 | init = false; 472 | $window = $(window); 473 | $box = $tag(div).attr({ 474 | id: colorbox, 475 | 'class': $.support.opacity === false ? prefix + 'IE' : '', // class for optional IE8 & lower targeted CSS. 476 | role: 'dialog', 477 | tabindex: '-1' 478 | }).hide(); 479 | $overlay = $tag(div, "Overlay").hide(); 480 | $loadingOverlay = $([$tag(div, "LoadingOverlay")[0],$tag(div, "LoadingGraphic")[0]]); 481 | $wrap = $tag(div, "Wrapper"); 482 | $content = $tag(div, "Content").append( 483 | $title = $tag(div, "Title"), 484 | $current = $tag(div, "Current"), 485 | $prev = $('