DerexXD/UT-Registration-Plus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

save calendar as png

Browse Source
This commit is contained in:
Sriram Hariharan
2019-01-11 13:53:12 -06:00
parent 813b7151b3
commit 07f0ed43e3
4 changed files with 76 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
calendar.html
View File

@@ -11,10 +11,16 @@
<body>
<div style='display:flex'>
<div id='calendar' style="flex-grow: 1"></div>
<div>
<button id="export" class="matbut" style="font-size:medium; background:#4CAF50;margin: 10px;white-space: nowrap;text-align: center;">Export
Schedule</button>
<div class="card" id="header" style="text-align:center;margin:5px 0px 0px 15px;">
<h1 style="font-weight:500">Schedule</h1>
<div style="margin:5px;display: flex;flex-direction: column;">
<button id="clear" class="matbut" style="font-size:medium; background:#4CAF50;margin: 10px;white-space: nowrap;text-align: center;">Clear
All</button>
<button id="save" class="matbut" style="font-size:medium; background:#FF9800;margin: 10px;white-space: nowrap;text-align: center;">Save
as PNG</button>
<button id="export" class="matbut" style="font-size:medium; background:#FF0000;margin: 10px;white-space: nowrap;text-align: center;">Export
to ICS</button>
</div>
</div>
</div>
@@ -22,6 +28,6 @@
<script src='js/calendar.js'></script>
<script src='js/ics.min.js'></script>
<script src='js/html2canvas.min.js'></script>
<script src='js/ics.min.js'></script>
<script src='js/calendar.js'></script>

26
css/_materialFullCalendar.css
View File

@@ -74,9 +74,16 @@ Colors: Use the following - https://www.google.com/design/spec/style/color.html#
border-width: 1px !important;
padding: 2px 3px 2px 3px !important;
vertical-align: top !important;
border-left-width: 0;
}
.fc-row fc-widget-header {
border-color: transparent;
}
.fc td {
border-top-width: 0;
padding: 3px !important;
}
@@ -155,10 +162,12 @@ Colors: Use the following - https://www.google.com/design/spec/style/color.html#
transform: scale(0, 0);
opacity: 1;
}
20% {
transform: scale(25, 25);
opacity: 1;
}
100% {
opacity: 0;
transform: scale(40, 40);
@@ -279,6 +288,18 @@ body a:visited {
font-size: medium;
}
.fc td,
.fc th {
border-color: #E7E7E7;
}
.fc-time-grid .fc-slats td {
height: 1.5em;
border-bottom: initial;
border-color: #E7E7E7;
}
/* The Close Button */
.close {
@@ -310,4 +331,9 @@ body a:visited {
padding: 2px 16px;
display: block;
transition: width 300ms ease-in-out, height 300ms ease-in-out;
}
tbody {
border-width: 0px;
}

31
js/calendar.js
View File

@@ -108,6 +108,37 @@ $(function () {
window.open(currLink);
}, butdelay);
});
$("#save").click(() => {
html2canvas(document.querySelector("#calendar"), {
foreignObjectRendering: true
}).then(canvas => {
var a = document.createElement('a');
a.href = canvas.toDataURL("image/png");
a.download = 'mySchedule.png';
a.click();
});
});
$("#clear").click(() => {
/*Clear the list and the storage of courses*/
chrome.storage.sync.set({
savedCourses: []
});
chrome.tabs.query({}, function (tabs) {
for (var i = 0; i < tabs.length; i++) {
chrome.tabs.sendMessage(tabs[i].id, {
command: "updateCourseList"
});
}
});
updateCalendar();
chrome.browserAction.setBadgeBackgroundColor({
color: '#bf5700'
});
chrome.browserAction.setBadgeText({
text: ""
});
});
$("#remove").click(() => {
setTimeout(() => {
chrome.runtime.sendMessage({

6
js/html2canvas.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long