@*
	This file is part of Utatane.
	   
	Utatane is free software: you can redistribute it and/or modify it under
	the terms of the GNU Affero General Public License as published by the Free
	Software Foundation, either version 3 of the License, or (at your option)
	any later version.
	   
	Utatane is distributed in the hope that it will be useful, but WITHOUT ANY
	WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
	FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for
	more details.
	   
	You should have received a copy of the GNU Affero General Public License
	along with Utatane. If not, see <http://www.gnu.org/licenses/>.
*@

<header class="n-box">
	<Breadcrumbs Path="@Path" />
	<div id="toolbar">
		<button id="reload-table"
				class="clickable"
				type="button"
				aria-label="Reload table"
				_="
-- shortcut: only the active <th> will have aria-sort
on click send nhnd:run to <th[aria-sort]/>
"
		>
			<span class="[vertical-align:sub]">↻</span>
		</button>
		
		<GoBackButton Path="@Path"/>
		
		<abbr id="search-label" title="Search">🔎</abbr>
		<input id="search" class="border-black" type="search" aria-labelledby="search-label" _="@_scriptForIdSearch" />
		
		<abbr id="rx-label" title="Search with RegEx">.*</abbr>
		<input id="use-rx-for-search" type="checkbox" autocomplete="off" aria-labelledby="rx-label" _="@_scriptForIdUseRxForSearch" />
		
		<abbr id="case-label" title="Case sensitive search">Aa</abbr>
		<input id="use-case-for-search" type="checkbox" autocomplete="off" aria-labelledby="case-label" />
		
		<span id="file-counter" class="my-auto" _="@_scriptForIdFileCounter" />
	</div>
	<hr/>
	<ThankYouTestUser />
</header>

@code {

	[Parameter]
	public required String Path { get; set; }

	#region _hyperscript strings
	// these are just the big ones, smaller ones are littered throughout
	private readonly String _scriptForIdSearch = @"
on load
	set my value to ''
on input
	js(me)
		let jme = $(me);
		let rxSearch = null;
		try {
			rxSearch = new RegExp(jme.val(), $('#use-case-for-search').prop('checked') ? '' : 'i');
		} catch (e) {
			return null;
		}
		let rows = $('tbody > tr');
		rows.addClass('hidden');
		rows
			.filter((i, el) => rxSearch.test(
				$('.file-name', el).attr('data-order')
			))
			.removeClass('hidden');
	end
	send nhnd:update to #file-counter
on keydown[key==""Enter""]
	js(me, event)
		if (event.isComposing || event.keyCode === 228) {
			return
		} else {
			$('#filetable-body > tr:not(.hidden) > .file-name > a').first().dispatchEvent(newEvent('click'))
			$(me).val('')
		}
	end
on keydown from body
	js(me, event)
		let rx = new RegExp(""^(F|Soft)\d"");
		return (!(
			document.activeElement === me // dont repeat it!
			|| event.key == """" // (actually I forgot)
			|| event.ctrlKey || event.altKey || event.metaKey // dont react on modifier combos
			|| [""Shift"", ""Tab"", ""ArrowUp"", ""ArrowRight"", ""ArrowLeft"", ""ArrowDown"",
				""AltGraph"", ""CapsLock"", ""Fn"", ""FnLock"", ""Hyper"", ""NumLock"",
				""ScrollLock"", ""Super"", ""Symbol"", ""SymbolLock"", ""OS"", ""End"", ""Home"",
				""PageDown"", ""PageUp"", ""Backspace"", ""Clear"", ""Delete"", ""Redo"",
				""Undo"", ""Accept"", ""Again"", ""Attn"", ""Cancel"", ""ContextMenu"",
				""Escape"", ""Find"", ""Pause"", ""Play"", ""Props"", ""Select"", ""ZoomIn"",
				""ZoomOut"", ""Apps"", ""BrightnessDown"", ""BrightnessUp"", ""PrintScreen"",
				""MediaFastForward"", ""MediaPause"", ""MediaPlay"", ""MediaPlayPause"",
				""MediaRecord"", ""MediaRewind"", ""MediaStop"", ""MediaTrackNext"",
				""MediaTrackPrevious""
				].includes(event.key) // special keys to not react on
			|| rx.test(event.key) // more special keys but these can be regexed
		))
	end
	
	if it is true then
		focus() on me
		go to the top of the body smoothly
";

	private readonly String _scriptForIdUseRxForSearch = @"
on load or click -- on load for if this comes checked
	js
		$('#search')
			[ $('#use-rx-for-search').prop('checked') ? 'addClass' : 'removeClass' ]('font-mono')
		.dispatchEvent(newEvent('input'))
	end
";

	private readonly String _scriptForIdFileCounter = @"
on nhnd:update
	set files to $('.file:not(.hidden)').length
	set dirs to $('.directory:not(.hidden)').length
	set my innerHTML to `${dirs} __W ${files} __X`
"
		.Replace("__W", Utils.AbbrIconPlain("Directories", "📁"))
		.Replace("__X", Utils.AbbrIconPlain("Files", "📄"));

	#endregion _hyperscript strings

}