fixing issue with IE11

LICENSE

@@ -1,6 +1,6 @@
 The MIT License (MIT)
 
-Copyright (c) 2016 Jason Salzman
+Copyright (c) 2016-2017 Jason Salzman
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+SOFTWARE.

README.md

@@ -88,4 +88,4 @@ The examples are hosted within the docs folder and are ran in the simple add tha
 
 ## License
 
-Copyright (c) 2016 Jason Salzman. Licensed under MIT license, see [LICENSE](LICENSE) for the full license.
+Copyright (c) 2016-2017 Jason Salzman. Licensed under MIT license, see [LICENSE](LICENSE) for the full license.

package.json

@@ -2,7 +2,7 @@
   "author": "Jason Salzman",
   "name": "react-add-to-calendar",
   "description": "A simple and reusable add to calendar button component for React",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "license": "MIT",
   "homepage": "https://github.com/jasonsalzman/react-add-to-calendar",
   "repository": {

src/ReactAddToCalendar.js

@@ -1,24 +1,22 @@
-import React, {
+import React, {Component} from 'react';
-	Component,
-} from 'react';
 
 import helpersClass from './helpers';
 const helpers = new helpersClass();
 
 export default class ReactAddToCalendar extends React.Component {
-	constructor(props) {
+    constructor(props) {
-		super(props);
+        super(props);
 
-		this.state = {
+        this.state = {
-			optionsOpen: false,
+            optionsOpen: false,
             isCrappyIE: false
-		};
+        };
 
-		this.toggleCalendarDropdown = this.toggleCalendarDropdown.bind(this);
+        this.toggleCalendarDropdown = this.toggleCalendarDropdown.bind(this);
-		this.handleDropdownLinkClick = this.handleDropdownLinkClick.bind(this);
+        this.handleDropdownLinkClick = this.handleDropdownLinkClick.bind(this);
-	}
+    }
 
-	componentWillMount() {
+    componentWillMount() {
         let isCrappyIE = false;
         if (typeof window !== 'undefined' && window.navigator.msSaveOrOpenBlob && window.Blob) {
             isCrappyIE = true;
@@ -28,13 +26,13 @@ export default class ReactAddToCalendar extends React.Component {
     }
 
     toggleCalendarDropdown() {
-    	let showOptions = !this.state.optionsOpen;
+        let showOptions = !this.state.optionsOpen;
 
         if (showOptions) {
-			document.addEventListener('click', this.toggleCalendarDropdown, false);
+            document.addEventListener('click', this.toggleCalendarDropdown, false);
-		} else {
+        } else {
-			document.removeEventListener('click', this.toggleCalendarDropdown);
+            document.removeEventListener('click', this.toggleCalendarDropdown);
-		}
+        }
 
         this.setState({optionsOpen: showOptions});
     }
@@ -43,8 +41,7 @@ export default class ReactAddToCalendar extends React.Component {
         e.preventDefault();
         let url = e.currentTarget.getAttribute('href');
 
-        if (this.state.isCrappyIE && (e.currentTarget.getAttribute('class') === 'ical-link' ||
+        if (this.state.isCrappyIE) {
-            e.currentTarget.getAttribute('class') === 'outlook-calendar-link')) {
             let blob = new Blob([url], {type: 'text/calendar'});
             window.navigator.msSaveOrOpenBlob(blob, 'download.ics');
         } else {
@@ -63,15 +60,15 @@ export default class ReactAddToCalendar extends React.Component {
 
             let icon = null;
             if (self.props.displayItemIcons) {
-                let currentIcon = (currentItem === 'outlook') ? 'windows' : currentItem;
+                let currentIcon = (currentItem === 'outlook')
+                    ? 'windows'
+                    : currentItem;
                 icon = <i className={'fa fa-' + currentIcon}/>;
             }
 
             return (
                 <li key={helpers.getRandomKey()}>
-                    <a className={currentItem + '-link'} onClick={self.handleDropdownLinkClick}
+                    <a className={currentItem + '-link'} onClick={self.handleDropdownLinkClick} href={helpers.buildUrl(self.props.event, currentItem, self.state.isCrappyIE)} target="_blank">
-                        href={helpers.buildUrl(self.props.event, currentItem, self.state.isCrappyIE)}
-                        target="_blank">
                         {icon}
                         {currentLabel}</a>
                 </li>
@@ -97,20 +94,22 @@ export default class ReactAddToCalendar extends React.Component {
             let buttonIconClass = 'react-add-to-calendar__icon--' + iconPlacement + ' fa fa-';
 
             if (template[0] === 'caret') {
-                buttonIconClass += (this.state.optionsOpen) ? 'caret-up' : 'caret-down';
+                buttonIconClass += (this.state.optionsOpen)
+                    ? 'caret-up'
+                    : 'caret-down';
             } else {
                 buttonIconClass += template[0];
             }
 
             buttonIcon = <i className={buttonIconClass}/>;
-            buttonLabel = (iconPlacement === 'right') ?
+            buttonLabel = (iconPlacement === 'right')
-                (
+                ? (
                     <span>
                         {buttonLabel + ' '}
                         {buttonIcon}
                     </span>
-                ) :
+                )
-                (
+                : (
                     <span>
                         {buttonIcon}
                         {' ' + buttonLabel}
@@ -118,18 +117,19 @@ export default class ReactAddToCalendar extends React.Component {
                 );
         }
 
-        let buttonClass = (this.state.optionsOpen) ? this.props.buttonClassClosed + ' ' + this.props.buttonClassOpen : this.props.buttonClassClosed;
+        let buttonClass = (this.state.optionsOpen)
+            ? this.props.buttonClassClosed + ' ' + this.props.buttonClassOpen
+            : this.props.buttonClassClosed;
 
         return (
             <div className={this.props.buttonWrapperClass}>
-                <a className={buttonClass}
+                <a className={buttonClass} onClick={this.toggleCalendarDropdown}>{buttonLabel}</a>
-                    onClick={this.toggleCalendarDropdown}>{buttonLabel}</a>
             </div>
         );
     }
 
-	render() {
+    render() {
-		let options = null;
+        let options = null;
         if (this.state.optionsOpen) {
             options = this.renderDropdown();
         }
@@ -145,50 +145,51 @@ export default class ReactAddToCalendar extends React.Component {
                 {options}
             </div>
         );
-	}
+    }
 }
 
 ReactAddToCalendar.displayName = 'Add To Calendar';
 
 ReactAddToCalendar.propTypes = {
-	buttonClassClosed: React.PropTypes.string,
+    buttonClassClosed: React.PropTypes.string,
-	buttonClassOpen: React.PropTypes.string,
+    buttonClassOpen: React.PropTypes.string,
-	buttonLabel: React.PropTypes.string,
+    buttonLabel: React.PropTypes.string,
     buttonTemplate: React.PropTypes.object,
-	buttonWrapperClass: React.PropTypes.string,
+    buttonWrapperClass: React.PropTypes.string,
-	displayItemIcons: React.PropTypes.bool,
+    displayItemIcons: React.PropTypes.bool,
-	dropdownClass: React.PropTypes.string,
+    dropdownClass: React.PropTypes.string,
-	event: React.PropTypes.shape({
+    event: React.PropTypes.shape({title: React.PropTypes.string, description: React.PropTypes.string, location: React.PropTypes.string, startTime: React.PropTypes.string, endTime: React.PropTypes.string}).isRequired,
-		title: React.PropTypes.string,
-		description: React.PropTypes.string,
-		location: React.PropTypes.string,
-		startTime: React.PropTypes.string,
-		endTime: React.PropTypes.string
-	}).isRequired,
     listItems: React.PropTypes.arrayOf(React.PropTypes.object),
-	rootClass: React.PropTypes.string
+    rootClass: React.PropTypes.string
 };
 
 ReactAddToCalendar.defaultProps = {
-	buttonClassClosed: 'react-add-to-calendar__button',
+    buttonClassClosed: 'react-add-to-calendar__button',
-	buttonClassOpen: 'react-add-to-calendar__button--light',
+    buttonClassOpen: 'react-add-to-calendar__button--light',
-	buttonLabel: 'Add to My Calendar',
+    buttonLabel: 'Add to My Calendar',
-    buttonTemplate: { caret: 'right' },
+    buttonTemplate: {
-	buttonWrapperClass: 'react-add-to-calendar__wrapper',
+        caret: 'right'
-	displayItemIcons: true,
+    },
-	dropdownClass: 'react-add-to-calendar__dropdown',
+    buttonWrapperClass: 'react-add-to-calendar__wrapper',
-	event: {
+    displayItemIcons: true,
-		title: 'Sample Event',
+    dropdownClass: 'react-add-to-calendar__dropdown',
-		description: 'This is the sample event provided as an example only',
+    event: {
-		location: 'Portland, OR',
+        title: 'Sample Event',
-		startTime: '2016-09-16T20:15:00-04:00',
+        description: 'This is the sample event provided as an example only',
-		endTime: '2016-09-16T21:45:00-04:00'
+        location: 'Portland, OR',
-	},
+        startTime: '2016-09-16T20:15:00-04:00',
+        endTime: '2016-09-16T21:45:00-04:00'
+    },
     listItems: [
-        { apple: 'Apple Calendar' },
+        {
-        { google: 'Google' },
+            apple: 'Apple Calendar'
-        { outlook: 'Outlook' },
+        }, {
-        { yahoo: 'Yahoo' }
+            google: 'Google'
+        }, {
+            outlook: 'Outlook'
+        }, {
+            yahoo: 'Yahoo'
+        }
     ],
-	rootClass: 'react-add-to-calendar'
+    rootClass: 'react-add-to-calendar'
-};
+};