obsidian-plugin/bfloydd_streams
1
0
Fork 0
mirror of https://github.com/bfloydd/streams.git synced 2026-07-22 05:49:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

less aggresive selector

Browse source
This commit is contained in:
Ben Floyd 2025-09-28 20:32:25 -06:00
parent 3b2af1a87e
commit b792cb905c
2 changed files with 36 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
src/slices/calendar-navigation/CalendarComponent.ts
View file

@ -40,6 +40,7 @@ export class CalendarComponent extends Component {
private plugin: PluginInterface | null;
private dateStateManager: DateStateManager;
private unsubscribeDateChanged: (() => void) | null = null;
private documentClickHandler: ((e: Event) => void) | null = null;
private getDisplayStreamName(): string {
if (this.plugin?.settings?.activeStreamId) {
@ -253,6 +254,7 @@ export class CalendarComponent extends Component {
});
this.streamsDropdown = changeStreamSection.createDiv('streams-calendar-streams-dropdown streams-dropdown');
this.streamsDropdown.style.display = 'none'; // Start hidden
this.populateStreamsDropdown();
const topNav = expandedView.createDiv('streams-calendar-top-nav');
@ -314,15 +316,19 @@ export class CalendarComponent extends Component {
}
});
document.addEventListener('click', (e) => {
// Store the click handler reference for cleanup
this.documentClickHandler = (e: Event) => {
if (this.expanded && !this.component.contains(e.target as Node)) {
this.toggleExpanded(collapsedView, expandedView);
}
if (this.streamsDropdown && !this.streamsDropdown.hasClass('streams-dropdown--visible') && !this.component.contains(e.target as Node)) {
this.toggleStreamsDropdown();
// Only close dropdown if it's visible and click is outside the component
if (this.streamsDropdown && this.streamsDropdown.style.display !== 'none' && !this.component.contains(e.target as Node)) {
this.hideStreamsDropdown();
}
});
};
document.addEventListener('click', this.documentClickHandler);
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape' && this.expanded) {
@ -553,13 +559,18 @@ export class CalendarComponent extends Component {
}
public destroy() {
// Clean up date change listener
if (this.unsubscribeDateChanged) {
this.unsubscribeDateChanged();
this.unsubscribeDateChanged = null;
}
// Clean up document click handler
if (this.documentClickHandler) {
document.removeEventListener('click', this.documentClickHandler);
this.documentClickHandler = null;
}
if (this.component && this.component.parentElement) {
this.component.remove();
}
@ -577,15 +588,29 @@ export class CalendarComponent extends Component {
private toggleStreamsDropdown() {
if (this.streamsDropdown) {
const isVisible = this.streamsDropdown.hasClass('streams-dropdown--visible');
const isVisible = this.streamsDropdown.style.display !== 'none';
if (isVisible) {
this.streamsDropdown.removeClass('streams-dropdown--visible');
this.hideStreamsDropdown();
} else {
this.streamsDropdown.addClass('streams-dropdown--visible');
this.showStreamsDropdown();
}
}
}
private showStreamsDropdown() {
if (this.streamsDropdown) {
this.streamsDropdown.style.display = 'block';
this.streamsDropdown.addClass('streams-dropdown--visible');
}
}
private hideStreamsDropdown() {
if (this.streamsDropdown) {
this.streamsDropdown.style.display = 'none';
this.streamsDropdown.removeClass('streams-dropdown--visible');
}
}
private populateStreamsDropdown() {
if (!this.streamsDropdown) return;
@ -638,9 +663,7 @@ export class CalendarComponent extends Component {
this.updateGridContent(this.grid);
}
if (this.streamsDropdown) {
this.streamsDropdown.removeClass('streams-dropdown--visible');
}
this.hideStreamsDropdown();
if (this.plugin && this.plugin.setActiveStream) {
this.plugin.setActiveStream(stream.id, true);

3
styles.css
View file

@ -382,6 +382,7 @@
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
z-index: 10000;
overflow: visible;
display: none; /* Start hidden by default */
}
.streams-calendar-stream-item {
@ -837,7 +838,7 @@
}
.streams-calendar-component .streams-dropdown--visible {
display: block;
display: block !important;
}
/* Calendar Component Visibility States */