Expand collapse all: check for addListener support (fixes IE9)

src/js/workers/expandcollapseall.js

@@ -11,24 +11,24 @@
 	var _pe = window.pe || {
 		fn : {}
 	};
-	
+
 	_pe.fn.expandcollapseall = {
 		type : 'plugin',
 		_open : false,			// Globally track the toggle state to support multiple controls on a page
 		_togglers : [],			// Reference to all toggle controls
 		_aria_controls : null,	// Space separated ID list of <details> elements for toggle control aria-controls attribute
-		_exec : function (elm) {		
+		_exec : function (elm) {
 			var opts,
 				overrides,
 				$window;
-				
+
 			// Default options
-			opts = { 
+			opts = {
 				togglers: {			// Define the toggle controls to create
 					toggle: false,	// Toggle open and close
 					open: false,	// Toggle open only
 					close: false	// Toggle close only
-				},	 
+				},
 				accentFirst: false,	// Add 'button-accent' class to first toggle control
 				printOpen: false,	// Toggle open before print
 				text: {				// Button text and titles
@@ -38,8 +38,8 @@
 					titleOpen: _pe.dic.get('%td-ttl-open'),
 					titleClose: _pe.dic.get('%td-ttl-close')
 				}
-			};				
-				
+			};
+
 			// Check for overrides from CSS classes
 			overrides = {
 				togglers: {
@@ -53,68 +53,68 @@
 
 			// Extend the defaults with settings passed through settings.js (wet_boew_expandcollapseall) and class-based overrides
 			$.extend(opts, (typeof wet_boew_expandcollapseall !== 'undefined' ? wet_boew_expandcollapseall : {}), overrides, _pe.data.getData(elm, 'wet-boew'));
-			
+
 			// Create the toggle controls and add them to the page
 			this._initTogglers(elm, opts);
-			
+
 			// Open details on print
 			if(opts.printOpen) {
 				$window = _pe.window;
-				
+
 				// Native event support
 				$window.on('beforeprint', $.proxy(function() {
 					this.setOpen(false);
-					this.toggle();	
-				}, this));		
-				
+					this.toggle();
+				}, this));
+
 				// Fallback for browsers that don't support print event
-				if (window.matchMedia) {	
-					window.matchMedia('print').addListener(function(query) {						
+				if (window.matchMedia && window.matchMedia.addListener) {
+					window.matchMedia('print').addListener(function(query) {
 						if (query.matches) {
 							$window.trigger('beforeprint');
 						}
 					});
 				}
-				
+
 				// Polyfill open using CSS
-				$('details').addClass('print-open');			
-			}			
-			return elm;					
+				$('details').addClass('print-open');
+			}
+			return elm;
 		}, // end of exec
-				
-		isOpen : function() {				
+
+		isOpen : function() {
 			return this._open === true;
 		},
-		
+
 		setOpen : function(open) {
 			this._open = open;
 		},
-		
+
 		toggle : function() {
 			var $details = $('details');
-			
+
 			// Set the state we're currently in and trigger the change
 			$details.prop('open', this.isOpen());
-			$details.find('summary').click();	
-			
+			$details.find('summary').click();
+
 			// Update our state and the title of the toggler controls
 			this.setOpen(!this.isOpen());
 			for(var i = 0, length = this._togglers.length; i < length; i++) {
 				this._setTitle(this._togglers[i]);
 			}
 		},
-			
+
 		_initTogglers : function(elm, opts) {
 			var li,
 				toggler,
-				types,				
-				ul = document.createElement('ul'); 
-			
-			// Make sure there is at least one toggle control 
+				types,
+				ul = document.createElement('ul');
+
+			// Make sure there is at least one toggle control
 			if(!opts.togglers || (!opts.togglers.toggle && !opts.togglers.open && !opts.togglers.close)){
 				opts.togglers.toggle = true;
 			}
-							
+
 			// Create the requested togglers and add to the page
 			types = _pe.array.keys(opts.togglers);
 			for(var i = 0, length = types.length; i < length; i++) {
@@ -127,13 +127,13 @@
 				}
 			}
 			ul.className = 'menu-horizontal';
-			elm.append(ul);	
-			
+			elm.append(ul);
+
 			if(opts.accentFirst === true) {
 				this._togglers[0].addClass('button-accent');
-			}			
+			}
 		},
-		
+
 		_createToggler : function(type, opts) {
 			var $toggler = $('<a>').attr({
 					'href': '#',
@@ -144,21 +144,21 @@
 					'data-title-close': opts.text.titleClose,
 					'data-title-open': opts.text.titleOpen
 				}).text(opts.text[type]);
-			
+
 			$toggler.on('click', $.proxy(function(e) {
 				this.setOpen(type === 'open' ? false : type === 'close' ? true : this.isOpen());
 				this.toggle();
 				e.preventDefault();
-				e.target.focus();		
-			}, this));			
-			
+				e.target.focus();
+			}, this));
+
 			this._setTitle($toggler);
 			return $toggler;
 		},
-		
+
 		_getAriaControls : function() {
 			var ids = '';
-			
+
 			// Init with a space separated list of <details> element IDs
 			if(this._aria_controls === null) {
 				$('details').each(function(idx) {
@@ -170,12 +170,12 @@
 				this._aria_controls = $.trim(ids);
 			}
 			return this._aria_controls;
-		},			
-		
+		},
+
 		_setTitle : function(toggler) {
 			var type = toggler.data('type');
 			toggler[0].title = type === 'close' || (type !== 'open' && this.isOpen()) ? toggler.data('title-close') : toggler.data('title-open');
-		}		
+		}
 	};
 	window.pe = _pe;
 	return _pe;