mirror/DisCal-Discord-Bot
1
0
Fork 0
mirror of https://github.com/DreamExposure/DisCal-Discord-Bot.git synced 2026-02-11 22:18:27 -06:00
Code Issues Packages Projects Releases Wiki Activity

Add date selection in dashboard calendar.

Browse Source
This commit is contained in:
NovaFox161
2018-03-07 08:44:52 -06:00
parent 746f564c3b
commit db29efab2a
3 changed files with 74 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

86
src/main/resources/web/public/pages/dashboard/components/events.html
View File

@@ -88,10 +88,10 @@
<!--Event Settings-->
<div th:if="${settings} == events">
<h6>Event Settings</h6>
<br>
<!--TODO: Add support for more calendars-->
<!--No calendar-->
<div th:if="${selected.calendar.id} == primary" style="text-align: left">
<br>
<p>You do not have a calendar! Please make a calendar in order to use this page!</p>
</div>
<!--Has calendar-->
@@ -120,58 +120,58 @@
<th>Saturday</th>
</tr>
<tr>
<td id="r1c1"></td>
<td id="r1c2"></td>
<td id="r1c3"></td>
<td id="r1c4"></td>
<td id="r1c5"></td>
<td id="r1c6"></td>
<td id="r1c7"></td>
<td onclick="selectDate(this.id)" id="r1c1"></td>
<td onclick="selectDate(this.id)" id="r1c2"></td>
<td onclick="selectDate(this.id)" id="r1c3"></td>
<td onclick="selectDate(this.id)" id="r1c4"></td>
<td onclick="selectDate(this.id)" id="r1c5"></td>
<td onclick="selectDate(this.id)" id="r1c6"></td>
<td onclick="selectDate(this.id)" id="r1c7"></td>
</tr>
<tr>
<td id="r2c1"></td>
<td id="r2c2"></td>
<td id="r2c3"></td>
<td id="r2c4"></td>
<td id="r2c5"></td>
<td id="r2c6"></td>
<td id="r2c7"></td>
<td onclick="selectDate(this.id)" id="r2c1"></td>
<td onclick="selectDate(this.id)" id="r2c2"></td>
<td onclick="selectDate(this.id)" id="r2c3"></td>
<td onclick="selectDate(this.id)" id="r2c4"></td>
<td onclick="selectDate(this.id)" id="r2c5"></td>
<td onclick="selectDate(this.id)" id="r2c6"></td>
<td onclick="selectDate(this.id)" id="r2c7"></td>
</tr>
<tr>
<td id="r3c1"></td>
<td id="r3c2"></td>
<td id="r3c3"></td>
<td id="r3c4"></td>
<td id="r3c5"></td>
<td id="r3c6"></td>
<td id="r3c7"></td>
<td onclick="selectDate(this.id)" id="r3c1"></td>
<td onclick="selectDate(this.id)" id="r3c2"></td>
<td onclick="selectDate(this.id)" id="r3c3"></td>
<td onclick="selectDate(this.id)" id="r3c4"></td>
<td onclick="selectDate(this.id)" id="r3c5"></td>
<td onclick="selectDate(this.id)" id="r3c6"></td>
<td onclick="selectDate(this.id)" id="r3c7"></td>
</tr>
<tr>
<td id="r4c1"></td>
<td id="r4c2"></td>
<td id="r4c3"></td>
<td id="r4c4"></td>
<td id="r4c5"></td>
<td id="r4c6"></td>
<td id="r4c7"></td>
<td onclick="selectDate(this.id)" id="r4c1"></td>
<td onclick="selectDate(this.id)" id="r4c2"></td>
<td onclick="selectDate(this.id)" id="r4c3"></td>
<td onclick="selectDate(this.id)" id="r4c4"></td>
<td onclick="selectDate(this.id)" id="r4c5"></td>
<td onclick="selectDate(this.id)" id="r4c6"></td>
<td onclick="selectDate(this.id)" id="r4c7"></td>
</tr>
<tr>
<td id="r5c1"></td>
<td id="r5c2"></td>
<td id="r5c3"></td>
<td id="r5c4"></td>
<td id="r5c5"></td>
<td id="r5c6"></td>
<td id="r5c7"></td>
<td onclick="selectDate(this.id)" id="r5c1"></td>
<td onclick="selectDate(this.id)" id="r5c2"></td>
<td onclick="selectDate(this.id)" id="r5c3"></td>
<td onclick="selectDate(this.id)" id="r5c4"></td>
<td onclick="selectDate(this.id)" id="r5c5"></td>
<td onclick="selectDate(this.id)" id="r5c6"></td>
<td onclick="selectDate(this.id)" id="r5c7"></td>
</tr>
<tr>
<td id="r6c1"></td>
<td id="r6c2"></td>
<td id="r6c3"></td>
<td id="r6c4"></td>
<td id="r6c5"></td>
<td id="r6c6"></td>
<td id="r6c7"></td>
<td onclick="selectDate(this.id)" id="r6c1"></td>
<td onclick="selectDate(this.id)" id="r6c2"></td>
<td onclick="selectDate(this.id)" id="r6c3"></td>
<td onclick="selectDate(this.id)" id="r6c4"></td>
<td onclick="selectDate(this.id)" id="r6c5"></td>
<td onclick="selectDate(this.id)" id="r6c6"></td>
<td onclick="selectDate(this.id)" id="r6c7"></td>
</tr>
</tbody>
</table>

29
src/main/resources/web/public/scripts/dashboard/calendar.js
View File

@@ -67,7 +67,9 @@ function setMonth(parameters) {
var tcc = dateDisplays();
for (var ii = 0; ii < tcc.length; ii++) {
document.getElementById(tcc[ii]).innerHTML = "";
var e = document.getElementById(tcc[ii]);
e.innerHTML = "";
e.className = "";
}
var tc = dateDisplaysToChange(findFirstDayOfMonthPosition());
@@ -75,7 +77,18 @@ function setMonth(parameters) {
for (var i = 0; i < tc.length; i++) {
var d = i + 1;
if (d <= count) {
document.getElementById(tc[i]).innerHTML = d + "";
var el = document.getElementById(tc[i]);
el.innerHTML = d + "";
var thisDate = new Date(calendar.selectedDate.getFullYear(), calendar.selectedDate.getMonth(), d);
if (d === calendar.selectedDate.getDate()) {
el.className = "selected";
}
if (thisDate.getMonth() === calendar.todaysDate.getMonth()
&& thisDate.getFullYear() === calendar.todaysDate.getFullYear()
&& thisDate.getDate() === calendar.todaysDate.getDate()) {
el.className = "today";
}
}
}
}
@@ -94,6 +107,18 @@ function nextMonth() {
setMonth({date: calendar.selectedDate});
}
function selectDate(clickedId) {
var e = document.getElementById(clickedId);
var dateString = e.innerHTML;
if (dateString !== "") {
var dateNum = parseInt(dateString);
calendar.selectedDate.setDate(dateNum);
setMonth({date: calendar.selectedDate});
}
}
function init() {
setMonth({date: calendar.todaysDate});
}

4
src/main/resources/web/public/styles/calendar.css
View File

@@ -10,6 +10,10 @@ td.selected {
background-color: #e8810b;
}
td.today {
background-color: #efcb15;
}
th {
text-align: center;
background-color: white;