<div class="fsc-main-wrapper">
    {{#if uiElementStates.compactView}}
        <div class="fsc-header-add-left">
            {{#if compactViewDisplay.currentSeasonName }}
                <div class="fsc-season">
                    <div class="fsc-season-text" data-tooltip="{{compactViewDisplay.currentSeasonName}}">{{{compactViewDisplay.currentSeasonIcon}}}</div>
                </div>
            {{/if}}
            <div class="fsc-moons">
                {{#if (gt compactViewDisplay.selectedDayMoons.length 5)}}
                    <div class="fsc-moon-group-wrapper">
                        <div class="fsc-moon-phase {{compactViewDisplay.selectedDayMoons.0.phase.icon}}" data-tooltip="{{compactViewDisplay.selectedDayMoons.0.name}} - {{compactViewDisplay.selectedDayMoons.0.phase.name}}">{{{compactViewDisplay.selectedDayMoons.0.iconSVG}}}</div>
                        <span class="fsc-moon-phase fa fa-caret-down"></span>
                        <div class="fsc-moon-group">
                            {{#each compactViewDisplay.selectedDayMoons}}
                                <div class="fsc-moon-phase {{phase.icon}}" data-tooltip="{{name}} - {{phase.name}}">{{{iconSVG}}}</div>
                            {{/each}}
                        </div>
                    </div>
                {{else}}
                    {{#each compactViewDisplay.selectedDayMoons}}
                        <div class="fsc-moon-phase {{phase.icon}}" data-tooltip="{{name}} - {{phase.name}}">{{{iconSVG}}}</div>
                    {{/each}}
                {{/if}}
            </div>
        </div>
        <div class="fsc-header-add-right">
            <div class="fsc-note-buttons">
                <button class="fsc-control {{#if (gt calendar.selectedDay.noteCount 0)}} fsc-secondary{{else}} fsc-grey{{/if}} fsc-notes" data-tooltip="{{localize 'FSC.Configuration.General.Notes'}}"><span class="fa-solid fa-note-sticky"></span>&nbsp;{{calendar.selectedDay.noteCount}}</button>
                {{#if (gt calendar.selectedDay.noteReminderCount 0)}}
                    <button class="fsc-control fsc-tertiary fsc-reminder-notes" data-tooltip="{{localize 'FSC.Configuration.General.Notes'}}"><span class="fa fa-bell"></span>&nbsp;{{calendar.selectedDay.noteReminderCount}}</button>
                {{/if}}
                {{#if addNotes}}
                    <button class="fsc-control fsc-save fsc-add-note" data-tooltip="{{localize 'FSC.Notes.AddNew'}}"><span class="fa-solid fa-note-sticky"></span>&nbsp;<span class="fa fa-plus"></span></button>
                {{/if}}
            </div>
        </div>
        <div class="fsc-section">
            <div class="fsc-date">
                <div class="fsc-date-text">{{calendar.selectedDay.dateDisplay}}</div>
            </div>
        </div>
        {{#if showClock}}
        <div class="fsc-section">
            <div class="fsc-clock-display">
                {{sc-clock id=calendar.clockDisplayId calendarId=calendar.id theme='none'}}
                {{#if changeDateTime}}
                    {{#if showTimeControls}}
                        {{#if isPrimary}}
                            <div class="fsc-time-keeper-buttons">
                                <button class="fsc-control fsc-time-start {{#if (eq clockClass 'started')}} fsc-secondary{{else}} fsc-save{{/if}}" data-tooltip="{{localize 'FSC.Time.Start'}}"><span class="fa {{#if (eq clockClass 'started')}} fa-pause{{else}} fa-play{{/if}}"></span></button>
                                <button class="fsc-control fsc-time-stop {{#if (eq clockClass 'stopped')}} fsc-grey{{else}} fsc-delete{{/if}}" data-tooltip="{{localize 'FSC.Time.Stop'}}"><span class="fa fa-stop"></span></button>
                            </div>

                        {{else if uiElementStates.primaryCheckRunning}}
                            <div class="fsc-primary-loader"><span class="fas fa-spinner fa-spin"></span></div>
                        {{/if}}
                    {{/if}}
                {{/if}}
            </div>
        </div>
        {{/if}}
        {{#if changeDateTime}}
            <div class="fsc-section">
                {{sc-date-time-controls showDateControls=showDateControls showTimeControls=showTimeControls displayType=compactViewDisplay.dateTimeControlDisplay fullDisplay=dateTimeFullDisplay largeSteps=uiElementStates.cvLargerSteps reverseTime=uiElementStates.cvReverseTime }}
            </div>
        {{/if}}
        <div class="fsc-section">
            <div class="fsc-side-drawer fsc-note-list {{sideDrawerDirection}} {{#if uiElementStates.fsc-note-list}} fsc-open{{else}} fsc-closed{{/if}}">
                <h2>{{localize 'FSC.Notes.For'}} {{calendar.selectedDay.dateDisplay}}</h2>
                {{#if calendar.selectedDay.notes.length}}
                    <div class="fsc-note-list">
                        {{#each calendar.selectedDay.notes}}
                            <div class="fsc-note" data-index="{{entryId}}" draggable="{{#if ../reorderNotes}}true{{else}}false{{/if}}">
                                <div class="fsc-note-details-wrapper">
                                    <h3 class="fsc-note-title">{{title}}</h3>
                                    <div class="fsc-note-details">
                                        {{#if ../isGM}}
                                            <div class="fsc-note-category fsc-note-icon {{playerVisible.color}}" data-tooltip="{{playerVisible.players}}">
                                                <span class="fa {{playerVisible.icon}}"></span>
                                            </div>
                                        {{/if}}
                                        {{#if userReminderRegistered}}
                                            <div class="fsc-note-category fsc-note-icon fsc-reminder" data-tooltip="{{localize 'FSC.Notes.ReminderHelp'}}">
                                                <span class="fa fa-bell"></span>
                                            </div>
                                        {{/if}}
                                        {{#if (and canEdit (ne 'none' macro))}}
                                            <div class="fsc-note-category fsc-note-icon" data-tooltip="{{localize 'DOCUMENT.Macro'}}">
                                                <span class="fas fa-scroll"></span>
                                            </div>
                                        {{/if}}
                                        <div class="fsc-note-time fsc-note-category" data-tooltip="{{localize 'FSC.Notes.Time'}}">
                                            <span class="fa fa-clock"></span>  {{#if allDay}}{{localize 'FSC.AllDay'}}{{else}}{{displayDate}}{{/if}}
                                        </div>
                                        {{#if authorDisplay}}
                                            <div class="fsc-note-category" data-tooltip="{{localize 'FSC.Notes.Author'}}" style="background-color:{{authorDisplay.color}};color:{{authorDisplay.textColor}};">
                                                <span class="fa fa-pencil-alt"></span> {{authorDisplay.name}}
                                            </div>
                                        {{/if}}
                                        {{#each categories}}
                                            <div class="fsc-note-category" style="background-color:{{color}};color:{{textColor}};">
                                                {{name}}
                                            </div>
                                        {{/each}}
                                    </div>
                                </div>
                                {{#if ../reorderNotes}}
                                    <div class="fsc-sorting-dragger"><span class="fa fa-arrows-alt-v"></span></div>
                                {{/if}}
                            </div>
                        {{/each}}
                    </div>
                {{else}}
                    <em>{{localize 'FSC.Notes.Empty'}}</em>
                {{/if}}
            </div>
            <div class="fsc-context-menu {{sideDrawerDirection}} fsc-hide" data-id="">
                <div class="fsc-day-context-list">
                    <div class="fsc-context-list-action" data-action="remind"></div>
                    {{#if isGM}}
                        <div class="fsc-context-list-action" data-action="showPlayers"><span class="fa fa-eye"></span>{{localize 'JOURNAL.ActionShow'}}</div>
                    {{/if}}
                    <div class="fsc-context-list-break"></div>
                    <div class="fsc-context-list-action" data-action="edit"><span class="fa fa-pen-to-square"></span>{{localize 'FSC.Edit'}}</div>
                    <div class="fsc-context-list-action" data-action="delete"><span class="fa fa-trash"></span>{{localize 'FSC.Delete'}}</div>
                </div>
            </div>
        </div>

    {{else}}
        {{#unless (eq '' message)}}
            <div class="fsc-message fsc-warn">{{{message}}}</div>
        {{/unless}}
        <div class="fsc-section">
            <div class="fsc-calendar-display">
                {{sc-full-calendar id=calendar.calendarDisplayId calendarId=calendar.id theme='none' date=calendar.visibleDate}}
            </div>
            <div class="fsc-actions-list">
                {{#if (gt mainViewDisplay.calendarList.length 1)}}
                    <button class="fsc-control fsc-primary fsc-calendars" data-tooltip="{{localize 'FSC.Calendars'}}"><span class="fa fa-calendar"></span></button>
                {{/if}}
                <button class="fsc-control {{#if (gt calendar.selectedDay.noteCount 0)}} fsc-secondary{{else}} fsc-grey{{/if}} fsc-notes" data-tooltip="{{localize 'FSC.Configuration.General.Notes'}}"><span class="fa fa-sticky-note"></span>&nbsp;{{calendar.selectedDay.noteCount}}</button>
                {{#if (gt calendar.selectedDay.noteReminderCount 0)}}
                    <button class="fsc-control fsc-tertiary fsc-reminder-notes" data-tooltip="{{localize 'FSC.Configuration.General.Notes'}}"><span class="fa fa-bell"></span>&nbsp;{{calendar.selectedDay.noteReminderCount}}</button>
                {{/if}}
                {{#if addNotes}}
                    <button class="fsc-control fsc-save fsc-add-note" data-tooltip="{{localize 'FSC.Notes.AddNew'}}"><span class="fa fa-sticky-note"></span>&nbsp;<span class="fa fa-plus"></span></button>
                {{/if}}
                <button class="fsc-control fsc-grey fsc-search" data-tooltip="{{localize 'FSC.Search.Title'}}"><span class="fa fa-search "></span></button>
                {{{mainViewDisplay.addonButtons}}}
                <span class="fsc-spacer"></span>
                {{#if changeDateTime}}
                    {{#if showSetCurrentDate}}
                        <button class="fsc-control fsc-save fsc-btn-apply " data-tooltip="{{localize 'FSC.SetCurrentDate'}}"><span class="fa fa-calendar-check"></span></button>
                    {{/if}}
                {{/if}}
                <button class="fsc-control fsc-grey fsc-today" data-tooltip="{{localize 'FSC.Today'}}"><span class="fa fa-calendar-day"></span></button>
                <button class="fsc-control fsc-grey fsc-configure-button" data-tooltip="{{localize 'FSC.Configure'}}"><span class="fa fa-cog"></span></button>
            </div>
            {{#if (gt mainViewDisplay.calendarList.length 1)}}
                <div class="fsc-side-drawer fsc-calendar-list {{sideDrawerDirection}} {{#if uiElementStates.fsc-calendar-list}} fsc-open{{else}} fsc-closed{{/if}}">
                    <h2>{{localize 'FSC.Calendars'}}</h2>
                    {{#each mainViewDisplay.calendarList}}
                        <div class="fsc-calendar-display {{#if (eq id ../activeCalendarId)}} fsc-active{{/if}} {{#if (eq id ../calendar.id)}} fsc-visible{{/if}} {{#unless ../mainViewDisplay.showChangeCalendarControls}} fsc-clickable{{/unless}}" data-calid="{{id}}">
                            <div class="fsc-details">
                                <div class="fsc-calendar-name">{{name}}</div>
                                <div class="fsc-calendar-date">
                                    <div class="fa fa-calendar-day"></div>
                                    <div>{{date}}</div>
                                    <div>{{time}}</div>
                                    {{#if clockRunning}}
                                        <div class="fsc-animated-clock fsc-animate">{{sc-icon name='clock'}}</div>
                                    {{/if}}
                                </div>
                                {{#if ../mainViewDisplay.showChangeCalendarControls}}
                                    {{#unless (eq id ../activeCalendarId)}}
                                        <div class="fsc-calendar-actions">
                                            <button class="fsc-control fsc-save"><span class="fa fa-check"></span> {{localize 'FSC.MakeActive'}}</button>
                                        </div>
                                    {{/unless}}
                                {{/if}}
                            </div>
                        </div>
                    {{/each}}
                </div>
            {{/if}}
            <div class="fsc-side-drawer fsc-note-list {{sideDrawerDirection}} {{#if uiElementStates.fsc-note-list}} fsc-open{{else}} fsc-closed{{/if}}">
                <h2>{{localize 'FSC.Notes.For'}} {{calendar.selectedDay.dateDisplay}}</h2>
                {{#if calendar.selectedDay.notes.length}}
                    <div class="fsc-note-list">
                        {{#each calendar.selectedDay.notes}}
                            <div class="fsc-note" data-index="{{entryId}}" draggable="{{#if ../reorderNotes}}true{{else}}false{{/if}}">
                                <div class="fsc-note-details-wrapper">
                                    <h3 class="fsc-note-title">{{title}}</h3>
                                    <div class="fsc-note-details">
                                        {{#if ../isGM}}
                                            <div class="fsc-note-category fsc-note-icon {{playerVisible.color}}" data-tooltip="{{playerVisible.players}}">
                                                <span class="fa {{playerVisible.icon}}"></span>
                                            </div>
                                        {{/if}}
                                        {{#if userReminderRegistered}}
                                            <div class="fsc-note-category fsc-note-icon fsc-reminder" data-tooltip="{{localize 'FSC.Notes.ReminderHelp'}}">
                                                <span class="fa fa-bell"></span>
                                            </div>
                                        {{/if}}
                                        {{#if (and canEdit (ne 'none' macro))}}
                                            <div class="fsc-note-category fsc-note-icon" data-tooltip="{{localize 'DOCUMENT.Macro'}}">
                                                <span class="fas fa-scroll"></span>
                                            </div>
                                        {{/if}}
                                        <div class="fsc-note-time fsc-note-category" data-tooltip="{{localize 'FSC.Notes.Time'}}">
                                            <span class="fa fa-clock"></span>  {{#if allDay}}{{localize 'FSC.AllDay'}}{{else}}{{displayDate}}{{/if}}
                                        </div>
                                        {{#if authorDisplay}}
                                            <div class="fsc-note-category" data-tooltip="{{localize 'FSC.Notes.Author'}}" style="background-color:{{authorDisplay.color}};color:{{authorDisplay.textColor}};">
                                                <span class="fa fa-pencil-alt"></span> {{authorDisplay.name}}
                                            </div>
                                        {{/if}}
                                        {{#each categories}}
                                            <div class="fsc-note-category" style="background-color:{{color}};color:{{textColor}};">
                                                {{name}}
                                            </div>
                                        {{/each}}
                                    </div>
                                </div>
                                {{#if ../reorderNotes}}
                                    <div class="fsc-sorting-dragger"><span class="fa fa-arrows-alt-v"></span></div>
                                {{/if}}
                            </div>
                        {{/each}}
                    </div>
                {{else}}
                    <em>{{localize 'FSC.Notes.Empty'}}</em>
                {{/if}}
            </div>
            <div class="fsc-side-drawer fsc-note-search {{sideDrawerDirection}} {{#if uiElementStates.fsc-note-search}} fsc-open{{else}} fsc-closed{{/if}}">
                <h2>{{localize 'FSC.SearchNotes'}}</h2>
                <div class="fsc-search-box">
                    <input id="simpleCalendarSearchBox" type="text" value="{{mainViewDisplay.search.term}}" aria-label="{{localize 'FSC.SearchNotes'}}" />
                    {{#if mainViewDisplay.search.results.length}}
                        <button class="fsc-control fsc-clear" data-tooltip="{{localize 'FSC.Clear'}}"><span class="fa fa-times"></span></button>
                    {{/if}}
                    <button class="fsc-control"><span class="fa fa-search"></span></button>
                </div>
                <h3 class="fsc-search-options-header">{{localize 'FSC.Search.Options.Title'}} <span class="fa fa-caret-down"></span></h3>
                <div class="fsc-search-options {{#if uiElementStates.searchOptionsOpen}} fsc-open{{else}} fsc-closed{{/if}}">
                    <p><strong>Fields:</strong>Select which fields to search on a note.</p>
                    <div class="fsc-search-fields">
                        <label><input type="checkbox" data-field="date" {{checked mainViewDisplay.search.options.fields.date}}> {{localize 'FSC.Search.Options.Fields.Date'}}</label>
                        <label><input type="checkbox" data-field="title" {{checked mainViewDisplay.search.options.fields.title}}> {{localize 'FSC.Search.Options.Fields.Title'}}</label>
                        <label><input type="checkbox" data-field="details" {{checked mainViewDisplay.search.options.fields.details}}> {{localize 'FSC.Search.Options.Fields.Details'}}</label>
                        <label><input type="checkbox" data-field="author" {{checked mainViewDisplay.search.options.fields.author}}> {{localize 'Author'}}</label>
                        <label><input type="checkbox" data-field="categories" {{checked mainViewDisplay.search.options.fields.categories}}> {{localize 'FSC.Search.Options.Fields.Categories'}}</label>
                    </div>
                </div>
                <div class="fsc-note-list">
                    {{#if mainViewDisplay.search.results.length}}
                        {{#each mainViewDisplay.search.results}}
                            <div class="fsc-note" data-index="{{entryId}}">
                                <div class="fsc-note-details-wrapper">
                                    <h3 class="fsc-note-title">{{title}}</h3>
                                    <div class="fsc-note-details">
                                        {{#if ../isGM}}
                                            <div class="fsc-note-category fsc-note-icon {{playerVisible.color}}" data-tooltip="{{playerVisible.players}}">
                                                <span class="fa {{playerVisible.icon}}"></span>
                                            </div>
                                        {{/if}}
                                        {{#if reminder}}
                                            <div class="fsc-note-category fsc-note-icon fsc-reminder" data-tooltip="{{localize 'FSC.Notes.ReminderHelp'}}">
                                                <span class="fa fa-bell"></span>
                                            </div>
                                        {{/if}}
                                        {{#if (and canEdit (ne 'none' macro))}}
                                            <div class="fsc-note-category fsc-note-icon" data-tooltip="{{localize 'DOCUMENT.Macro'}}">
                                                <span class="fas fa-scroll"></span>
                                            </div>
                                        {{/if}}
                                        <div class="fsc-note-time fsc-note-category" data-tooltip="{{localize 'FSC.Notes.Time'}}">
                                            <span class="fa fa-clock"></span>  {{#if allDay}}{{localize 'FSC.AllDay'}}{{else}}{{displayDate}}{{/if}}
                                        </div>
                                        {{#if authorDisplay}}
                                            <div class="fsc-note-category" data-tooltip="{{localize 'FSC.Notes.Author'}}" style="background-color:{{authorDisplay.color}};color:{{authorDisplay.textColor}};">
                                                <span class="fa fa-pencil-alt"></span> {{authorDisplay.name}}
                                            </div>
                                        {{/if}}
                                        {{#each categories}}
                                            <div class="fsc-note-category" style="background-color:{{color}};color:{{textColor}};">
                                                {{name}}
                                            </div>
                                        {{/each}}
                                    </div>
                                </div>
                            </div>
                        {{/each}}
                    {{else}}
                        <em>{{localize 'FSC.SearchEmpty'}}</em>
                    {{/if}}
                </div>
            </div>
            {{{mainViewDisplay.addonButtonSidePanels}}}
            <div class="fsc-context-menu {{sideDrawerDirection}} fsc-hide" data-id="">
                <div class="fsc-day-context-list">
                    <div class="fsc-context-list-action" data-action="remind"></div>
                    {{#if isGM}}
                        <div class="fsc-context-list-action" data-action="showPlayers"><span class="fa fa-eye"></span>{{localize 'JOURNAL.ActionShow'}}</div>
                    {{/if}}
                    <div class="fsc-context-list-break"></div>
                    <div class="fsc-context-list-action" data-action="edit"><span class="fa fa-pen-to-square"></span>{{localize 'FSC.Edit'}}</div>
                    <div class="fsc-context-list-action" data-action="delete"><span class="fa fa-trash"></span>{{localize 'FSC.Delete'}}</div>
                </div>
            </div>
        </div>
        {{#if showClock}}
            <div class="fsc-section">
                <div class="fsc-clock-display">
                    {{sc-clock id=calendar.clockDisplayId calendarId=calendar.id theme='none'}}
                </div>
                <div class="fsc-actions-list">
                    {{#if changeDateTime}}
                        {{#if showTimeControls}}
                            {{#if isPrimary}}
                                <div class="fsc-time-keeper-buttons">
                                    <button class="fsc-control fsc-time-start {{#if (eq clockClass 'started')}} fsc-secondary{{else}} fsc-save{{/if}}" data-tooltip="{{localize 'FSC.Time.Start'}}"><span class="fa {{#if (eq clockClass 'started')}} fa-pause{{else}} fa-play{{/if}}"></span></button>
                                    <button class="fsc-control fsc-time-stop {{#if (eq clockClass 'stopped')}} fsc-grey{{else}} fsc-delete{{/if}}" data-tooltip="{{localize 'FSC.Time.Stop'}}"><span class="fa fa-stop"></span></button>
                                </div>

                            {{else if uiElementStates.primaryCheckRunning}}
                                <div class="fsc-primary-loader"><span class="fas fa-spinner fa-spin"></span></div>
                            {{/if}}
                        {{/if}}
                    {{/if}}
                </div>
            </div>
        {{/if}}
        {{#if changeDateTime}}
            <div class="fsc-section">
                {{sc-date-time-controls showDateControls=showDateControls showTimeControls=showTimeControls displayType='full' fullDisplay=dateTimeFullDisplay }}
            </div>
        {{/if}}
    {{/if}}
</div>



