LailaTheElf/obsidian_fr-calendar
Archived
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

add dayView and buttons

Browse Source
This commit is contained in:
Laila van Reenen 2024-05-17 14:12:55 +02:00
parent 518eda83b6
commit 7a49409991
Signed by: LailaTheElf
GPG Key ID: 1F4E6EE3E6DDF769
2 changed files with 69 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
fr-calendar.css
View File

@ -6,6 +6,10 @@
.workspace-leaf-content[data-type="fr-calendar"] .view-content {
max-width: 100vw;
overflow-x: auto;
--frcal--min-width: 1000px;
}
.workspace-leaf-content[data-type="fr-calendar"] .view-content.frcal__dayView {
--frcal--min-width: 400px;
}
.frcal__time {
@ -16,7 +20,7 @@
.frcal__month {
width: 100%;
display: flex;
min-width: 1000px;
min-width: var(--frcal--min-width, 1000px);
z-index: 10;
}
@ -37,7 +41,7 @@
.frcal__days {
display: flex;
flex-wrap: nowrap;
min-width: 1000px;
min-width: var(--frcal--min-width, 1000px);
}
.frcal__day {
flex: 10;
@ -250,4 +254,8 @@
bottom: 2px;
background-color: var(--frcal--event-background, var(--color-accent));
-webkit-mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 14 14' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.5' y='6.5' width='13' height='1'/%3E%3C/svg%3E");
}
}
.frcal__button {
margin: 5px;
}

63
main.js
View File

@ -274,6 +274,7 @@ class CalendarView extends ItemView
this.plugin = plugin;
this.week = stringifySingleDate(moment()).match(DateFormat.week)[0];
this.zoom = 30/60; // in px/min
this.dayViewIndex = -1;
}
getViewType()
@ -319,8 +320,8 @@ class CalendarView extends ItemView
this.dayHeads = [null, null, null, null, null, null, null];
for (let i = 0; i < 7; i++)
{
let dayEl = this.headEl.createEl("div", { cls: "frcal__day frcal__day_head_item" });
this.dayHeads[i] = dayEl.createEl("span");
this.dayHeads[i] = this.headEl.createEl("div", { cls: "frcal__day frcal__day_head_item" });
this.dayHeads[i].createEl("span");
}
// all day events
@ -352,6 +353,37 @@ class CalendarView extends ItemView
this.timed[i] = this.timedEl.createEl("div", { cls: "frcal__day frcal__timed_item" });
}
let btn;
btn = container.createEl('button', { cls: "frcal__button"});
btn.innerText = 'week-';
btn.addEventListener('click', () => {
this.gotoPreviusWeek();
})
btn = container.createEl('button', { cls: "frcal__button"})
btn.innerText = 'week+';
btn.addEventListener('click', () => {
this.gotoNextWeek();
})
btn = container.createEl('button', { cls: "frcal__button"});
btn.innerText = 'day-';
btn.addEventListener('click', () => {
this.dayViewIndex--;
if (this.dayViewIndex < -1)
this.dayViewIndex = 6;
this.dayView();
})
btn = container.createEl('button', { cls: "frcal__button"})
btn.innerText = 'day+';
btn.addEventListener('click', () => {
this.dayViewIndex++;
if (this.dayViewIndex >= 7)
this.dayViewIndex = -1;
this.dayView();
})
this.addEvents();
this.updateWeek();
}
@ -526,14 +558,14 @@ class CalendarView extends ItemView
for (let day = 0; day < 7; day++)
{
let date = parseSingleDate(this.week + " " + DateFormat.days[(day + 1) % 7] + " 12:00pm");
this.dayHeads[day].innerHTML = DateFormat.daysLong[day] + "<br/>" + date.date().toString();
this.dayHeads[day].children[0].innerHTML = DateFormat.daysLong[day] + "<br/>" + date.date().toString();
if (date.diff(today, "minutes") == 0)
{
this.dayHeads[day].style.color = "var(--color-accent)";
this.dayHeads[day].children[0].style.color = "var(--color-accent)";
}
else
{
this.dayHeads[day].style.color = "";
this.dayHeads[day].children[0].style.color = "";
}
}
@ -798,6 +830,27 @@ class CalendarView extends ItemView
menu.showAtPosition(location);
}
dayView()
{
let containers = [this.dayHeads, this.allday, this.timed];
if (this.dayViewIndex == -1)
{
this.containerEl.children[1].removeClass('frcal__dayView');
}
else
{
this.containerEl.children[1].addClass('frcal__dayView');
}
for (let i in containers)
{
for (let ii=0; ii<7; ii++)
{
containers[i][ii].style.display = ((this.dayViewIndex == -1) || (ii == this.dayViewIndex)) ? "" : "none";
}
}
}
}