adjusting the way the data URIs are handled since most browsers are not able to download the link without “save as” command. this resolves #8

This commit is contained in:
Jason Salzman
2017-05-22 04:03:42 -07:00
parent 11dcf3aab0
commit 4c2460de17
6 changed files with 10927 additions and 3078 deletions
+9
View File
@@ -0,0 +1,9 @@
node_modules
.sass-cache
npm-debug.log
.idea
dist
lib
tmp
coverage
0.md
+4730 -3055
View File
File diff suppressed because it is too large Load Diff
+1 -1
View File
@@ -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.9",
"version": "0.0.11",
"license": "MIT",
"homepage": "https://github.com/jasonsalzman/react-add-to-calendar",
"repository": {
+28 -12
View File
@@ -39,19 +39,35 @@ export default class ReactAddToCalendar extends React.Component {
this.setState({optionsOpen: showOptions});
}
handleDropdownLinkClick(e) {
e.preventDefault();
let url = e.currentTarget.getAttribute('href');
handleDropdownLinkClick(e) {
e.preventDefault();
let url = e.currentTarget.getAttribute("href");
if (this.state.isCrappyIE) {
let blob = new Blob([url], {type: 'text/calendar'});
window.navigator.msSaveOrOpenBlob(blob, 'download.ics');
} else {
window.open(url, '_blank');
}
if (url.startsWith("data") || url.startsWith("BEGIN")) {
let filename = "download.ics";
let blob = new Blob([url], { type: "text/calendar;charset=utf-8" });
this.toggleCalendarDropdown();
}
if (this.state.isCrappyIE) {
window.navigator.msSaveOrOpenBlob(blob, filename);
} else {
/****************************************************************
// many browsers do not properly support downloading data URIs
// (even with "download" attribute in use) so this solution
// ensures the event will download cross-browser
****************************************************************/
let link = document.createElement("a");
link.href = window.URL.createObjectURL(blob);
link.setAttribute("download", filename);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
}
} else {
window.open(url, "_blank");
}
this.toggleCalendarDropdown();
}
renderDropdown() {
let self = this;
@@ -69,7 +85,7 @@ export default class ReactAddToCalendar extends React.Component {
return (
<li key={helpers.getRandomKey()}>
<a className={currentItem + '-link'} onClick={self.handleDropdownLinkClick}
href={helpers.buildUrl(self.props.event, currentItem, self.state.isCrappyIE)}
href={helpers.buildUrl(self.props.event, currentItem)}
target="_blank">
{icon}
{currentLabel}</a>
+3 -10
View File
@@ -25,14 +25,11 @@ export default class helpers {
return Math.floor(duration.asHours()) + moment.utc(difference).format(':mm');
}
buildUrl (event, type, isCrappyIE) {
buildUrl (event, type) {
let calendarUrl = '';
switch (type) {
case 'google':
// This is all I changed, there were 2 problems,
// first, the root URL of Google calendar changed, and second,
// somehow the order of the params creates a bad request so I fixed that too
calendarUrl = 'https://calendar.google.com/calendar/render';
calendarUrl += '?action=TEMPLATE';
calendarUrl += '&dates=' + this.formatTime(event.startTime);
@@ -64,7 +61,7 @@ export default class helpers {
calendarUrl += "&uid=" + this.getRandomKey();
calendarUrl += "&path=/calendar/view/Month";
break;
default:
calendarUrl = [
'BEGIN:VCALENDAR',
@@ -79,12 +76,8 @@ export default class helpers {
'END:VEVENT',
'END:VCALENDAR'
].join('\n');
if (!isCrappyIE) {
calendarUrl = encodeURI('data:text/calendar;charset=utf8,' + calendarUrl);
}
}
return calendarUrl;
}
}
}
+6156
View File
File diff suppressed because it is too large Load Diff