<xf:title page="{$page}">{$forum.Node.title}</xf:title>
<xf:description>{$forum.Node.description|raw}</xf:description>
<xf:page option="uix_mainTabSets" value="forum" />
<xf:page option="uix_mainTabActive" value="forum_list" />

<xf:css src="structured_list.less" />

<xf:if is="!$forum.isSearchEngineIndexable()">
	<xf:head option="metaNoindex"><meta name="robots" content="noindex" /></xf:head>
</xf:if>

<xf:macro template="metadata_macros" name="canonical_url"
	arg-canonicalUrl="{{ link('canonical:forums', $forum, $canonicalFilters + {'page': $page}) }}" />

<xf:head option="rss_forum"><link rel="alternate" type="application/rss+xml" title="{{ phrase('rss_feed_for_x', {'title': $forum.title})|for_attr }}" href="{{ link('forums/index.rss', $forum) }}" /></xf:head>

<xf:macro template="forum_macros" name="forum_page_options" arg-forum="{$forum}" />
<xf:breadcrumb source="$forum.getBreadcrumbs(false)" />

<xf:pageaction if="$forum.canCreateThread() OR $forum.canCreateThreadPreReg()">
	<xf:button href="{{ link('forums/post-thread', $forum) }}" class="button--cta" icon="write">
		{{ phrase('post_thread') }}
	</xf:button>
</xf:pageaction>

<xf:if is="$pendingApproval">
	<div class="blockMessage blockMessage--important">{{ phrase('content_submitted_displayed_pending_approval') }}</div>
</xf:if>

<xf:extension name="above_node_list"></xf:extension>

<xf:if is="$nodeTree">
	
	<xf:set var="$unreadNode" value="0" />
	<xf:foreach loop="$nodeTree" value="$node" key="$id">
		<xf:if is="{$nodeExtras.{$id}.hasNew}">
			<xf:set var="$unreadNode" value="1" />
		</xf:if>
	</xf:foreach>

	<xf:ad position="forum_view_above_node_list" arg-forum="{$forum}" />

	<div class="block uix_nodeList block--category {{ is_toggled('thuixsf-'.$forum.node_id) ? 'category--collapsed' : '' }}">
		<xf:if is="property('uix_categoryStripOutsideWrapper') && property('uix_collapseibleSubForums')">
			<h2 class="block-header js-nodeMain{{ property('uix_stickyCategoryStrips') ? ' uix_stickyCategoryStrips' : '' }}">
				<xf:if is="property('uix_categoryStripIcons')">
					<div class="uix_categoryStrip__icon">
						<xf:fa icon="fa-folder" />
					</div>
				</xf:if>
				<div class="uix_categoryStrip-content">
					<xf:set var="$uix_categoryDescriptionDisplay" value="{{ property('uix_categoryDescriptionDisplay') }}" />
					<a href="{{ link('categories', $node) }}" class="uix_categoryTitle" data-xf-init="{{ $uix_categoryDescriptionDisplay == 'tooltip' ? 'element-tooltip' : '' }}" data-shortcut="node-description">Sub Forum</a>
					<xf:if is="$unreadNode"><span class="uix_newIndicator">Unread</span></xf:if>
				</div>
				<xf:if is="{{ property('uix_categoryCollapse') && $xf.visitor->hasPermission('th_uix', 'collapseCategories') }}">
					<a class="u-ripple categoryCollapse--trigger"
					   data-xf-click="toggle"
					   data-target="< :up :next"
					   data-hide="true"
					   data-xf-init="toggle-storage"
					   data-storage-type="cookie"
					   data-storage-key="thuixsf-{$forum.node_id}">
						<xf:fa icon="fa-chevron-up" /></a>
				</xf:if>
			</h2>
		</xf:if>
		<div class="block-container">
			<xf:if is="!property('uix_categoryStripOutsideWrapper') && property('uix_collapseibleSubForums')">
				<h2 class="block-header js-nodeMain{{ property('uix_stickyCategoryStrips') ? ' uix_stickyCategoryStrips' : '' }}">
					<xf:if is="property('uix_categoryStripIcons')">
						<div class="uix_categoryStrip__icon">
							<xf:fa icon="fa-folder" />
						</div>
					</xf:if>
					<div class="uix_categoryStrip-content">
						<xf:set var="$uix_categoryDescriptionDisplay" value="{{ property('uix_categoryDescriptionDisplay') }}" />
						<a href="{{ link('categories', $node) }}" class="uix_categoryTitle" data-xf-init="{{ $uix_categoryDescriptionDisplay == 'tooltip' ? 'element-tooltip' : '' }}" data-shortcut="node-description">Sub Forum</a>
						<xf:if is="$unreadNode"><span class="uix_newIndicator">Unread</span></xf:if>
					</div>
					<xf:if is="{{ property('uix_categoryCollapse') && $xf.visitor->hasPermission('th_uix', 'collapseCategories') }}">
						<a class="u-ripple categoryCollapse--trigger"
						   data-xf-click="toggle"
						   data-target="< :up :next"
						   data-hide="true"
						   data-xf-init="toggle-storage"
						   data-storage-type="cookie"
						   data-storage-key="thuixsf-{$forum.node_id}">
							<xf:fa icon="fa-chevron-up" /></a>
					</xf:if>
				</h2>
			</xf:if>
			<div class="uix_block-body--outer">
				<div class="block-body">
					<xf:macro template="forum_list" name="node_list"
							  arg-children="{$nodeTree}"
							  arg-extras="{$nodeExtras}"
							  arg-depth="2" />
				</div>
			</div>
		</div>
	</div>
	<xf:ad position="forum_view_below_node_list" arg-forum="{$forum}" />
</xf:if>

<xf:if is="$canInlineMod">
	<xf:js src="xf/inline_mod.js" min="1" />
</xf:if>

<xf:extension name="above_thread_list"></xf:extension>
<xf:ad position="forum_view_above_thread_list" arg-forum="{$forum}" />

<xf:extension name="thread_list_block_classes" value="" />
<div class="block {{ extension_value('thread_list_block_classes') }}" data-xf-init="{{ $canInlineMod ? 'inline-mod' : '' }}" data-type="thread" data-href="{{ link('inline-mod') }}">

	<div class="block-outer"><xf:trim>
		<xf:pagenav page="{$page}" perpage="{$perPage}" total="{$total}"
			link="forums" data="{$forum}" params="{$filters}"
			wrapperclass="block-outer-main" />
		<xf:if contentcheck="true">
			<div class="block-outer-opposite">
				<div class="buttonGroup">
				<xf:contentcheck>
					<xf:if is="$canInlineMod">
						<xf:macro template="inline_mod_macros" name="button" />
					</xf:if>
					<xf:if is="$xf.visitor.user_id">
						<xf:button href="{{ link('forums/mark-read', $forum, {'date': $xf.time}) }}"
							class="button--link" overlay="true">
							{{ phrase('mark_read') }}
						</xf:button>
					</xf:if>
					<xf:if is="$forum.canWatch()">
						<xf:button href="{{ link('forums/watch', $forum) }}" class="button--link"
							data-xf-click="switch-overlay"
							data-sk-watch="{{ phrase('watch') }}"
							data-sk-unwatch="{{ phrase('unwatch') }}">
							<xf:if is="{$forum.Watch.{$xf.visitor.user_id}}">{{ phrase('unwatch') }}<xf:else />{{ phrase('watch') }}</xf:if>
						</xf:button>
					</xf:if>
				</xf:contentcheck>
				</div>
			</div>
		</xf:if>
	</xf:trim></div>

	<div class="block-container uix_discussionList">

		<xf:extension name="thread_list_header">
			<div class="block-filterBar">
				<div class="filterBar">
					<xf:if contentcheck="true">
						<ul class="filterBar-filters">
						<xf:contentcheck>
							<xf:extension name="filters">
								<xf:macro name="filters"
									arg-forum="{$forum}"
									arg-filters="{$filters}"
									arg-starterFilter="{$starterFilter}"
									arg-threadTypeFilter="{$threadTypeFilter}" />
							</xf:extension>
						</xf:contentcheck>
						</ul>
					</xf:if>

					<a class="filterBar-menuTrigger" data-xf-click="menu" role="button" tabindex="0" aria-expanded="false" aria-haspopup="true">{{ phrase('filters') }}</a>
					<div class="menu menu--wide" data-menu="menu" aria-hidden="true"
						data-href="{{ link('forums/filters', $forum, $filters) }}"
						data-load-target=".js-filterMenuBody">
						<div class="menu-content">
							<h4 class="menu-header">{{ phrase('show_only:') }}</h4>
							<div class="js-filterMenuBody">
								<div class="menu-row">{{ phrase('loading...') }}</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</xf:extension>

		<xf:set var="$qtPos">{{ ($sortInfo.order == 'last_post_date' && $sortInfo.direction == 'asc') ? 'bottom' : 'top' }}</xf:set>

		<div class="block-body">
			<xf:extension name="thread_list">
				<div class="structItemContainer">
					<xf:macro name="{{ $templateOverrides.quick_thread_macro ?: 'thread_list_macros::quick_thread' }}"
						arg-forum="{$forum}"
						arg-page="{$page}"
						arg-order="{$sortInfo.order}"
						arg-direction="{$sortInfo.direction}"
						arg-prefixes="{$quickThreadPrefixes}"
						args="{$templateOverrides.quick_thread_macro_args}" />

					<xf:if is="$stickyThreads is not empty OR $threads is not empty">
						<xf:if is="$stickyThreads is not empty">
							<xf:if is="{{ property('uix_separateThreads') }} && $stickyThreads is not empty AND $threads is not empty">
								<h3 class="block-minorHeader uix_threadListSeparator">
									{{ phrase('th_sticky_threads') }}
									<xf:if is="{{ property('uix_collapsibleStickyThreads') }}">
										<span class="uix_threadCollapseTrigger {{ !is_toggled('thuixfst-'.$forum.node_id) ? 'is-active' : '' }}"
											  data-xf-click="toggle"
											  data-storage-type="cookie"
											  data-target="< :up :next"
											  data-xf-init="toggle-storage"
											  data-storage-key="thuixfst-{$forum.node_id}">
											<xf:fa icon="fa-chevron-down" />
										</span>
									</xf:if>
								</h3>
							</xf:if>
							<div class="uix_stickyContainerOuter  {{ !is_toggled('thuixfst-'.$forum.node_id) ? 'is-active' : '' }}">
								<div class="uix_stickyContainerInner">
									<div class="structItemContainer-group structItemContainer-group--sticky">
										<xf:foreach loop="$stickyThreads" value="$thread">
											<xf:macro name="{{ $templateOverrides.thread_list_macro ?: 'thread_list_macros::item' }}"
													  arg-thread="{$thread}"
													  arg-forum="{$forum}"
													  args="{$templateOverrides.thread_list_macro_args}" />
										</xf:foreach>
									</div>
								</div>
							</div>

							<xf:ad position="forum_view_below_stickies" arg-forum="{$forum}" />
						</xf:if>

						<xf:if is="{{ property('uix_separateThreads') }} && $stickyThreads is not empty AND $threads is not empty">
							<h3 class="block-minorHeader uix_threadListSeparator">{{ phrase('th_normal_threads') }}</h3>
						</xf:if>

						<div class="structItemContainer-group js-threadList">
							<xf:if is="$threads is not empty">
								<xf:foreach loop="$threads" value="$thread">
									<xf:macro name="{{ $templateOverrides.thread_list_macro ?: 'thread_list_macros::item' }}"
										arg-thread="{$thread}"
										arg-forum="{$forum}"
										args="{$templateOverrides.thread_list_macro_args}"  />
								</xf:foreach>
								<xf:if is="$showDateLimitDisabler">
									<xf:macro name="date_limit_disabler" arg-forum="{$forum}" arg-page="{$page}" arg-filters="{$filters}" />
								</xf:if>
							</xf:if>
						</div>
					<xf:elseif is="$filters" />
						<div class="structItemContainer-group js-threadList">
							<div class="structItem js-emptyThreadList">
								<div class="structItem-cell">{{ phrase('there_no_threads_matching_your_filters') }}</div>
							</div>
							<xf:if is="$showDateLimitDisabler">
								<xf:macro name="date_limit_disabler" arg-forum="{$forum}" arg-page="{$page}" arg-filters="{$filters}" />
							</xf:if>
						</div>
					<xf:else />
						<div class="structItemContainer-group js-threadList">
							<xf:if is="$showDateLimitDisabler">
								<div class="structItem js-emptyThreadList">
									<div class="structItem-cell">{{ phrase('there_no_threads_to_display') }}</div>
								</div>
								<xf:macro name="date_limit_disabler" arg-forum="{$forum}" arg-page="{$page}" arg-filters="{$filters}" />
							<xf:else />
								<div class="structItem js-emptyThreadList">
									<div class="structItem-cell">{{ phrase('there_no_threads_in_this_forum') }}</div>
								</div>
							</xf:if>
						</div>
					</xf:if>
				</div>
			</xf:extension>
		</div>
	</div>

	<div class="block-outer block-outer--after">
		<xf:pagenav
			page="{$page}" perpage="{$perPage}" total="{$total}"
			link="forums" data="{$forum}" params="{$filters}"
			wrapperclass="block-outer-main" />
		<xf:showignored wrapperclass="block-outer-opposite" />
		<xf:if is="!$forum.canCreateThread() AND !$forum.canCreateThreadPreReg()">
			<div class="block-outer-opposite">
				<xf:if is="$xf.visitor.user_id">
					<span class="button button--wrap is-disabled">
						{{ phrase('no_permission_to_post') }}
						<!-- this is not interactive so shouldn't be a button element -->
					</span>
				<xf:else />
					<xf:button href="{{ link('login') }}" class="button--link button--wrap" overlay="true">
						{{ phrase('log_in_or_register_to_post') }}
					</xf:button>
				</xf:if>
			</div>
		</xf:if>
	</div>
</div>

<xf:ad position="forum_view_below_thread_list" arg-forum="{$forum}" />
<xf:extension name="below_thread_list"></xf:extension>

<xf:widgetpos id="forum_view_sidebar" context-forum="{$forum}" position="sidebar" />

<xf:macro name="filters" arg-forum="!" arg-filters="!" arg-starterFilter="{{ null }}" arg-threadTypeFilter="{{ null }}">
	<xf:set var="$dateLimits" value="{{ {
		'-1': phrase('any_time'),
		'7': phrase('x_days', {'days': '7'}),
		'14': phrase('x_days', {'days': '14'}),
		'30': phrase('x_days', {'days': '30'}),
		'60': phrase('x_months', {'months': '2'}),
		'90': phrase('x_months', {'months': '3'}),
		'182': phrase('x_months', {'months': '6'}),
		'365': phrase('1_year')
	} }}" />

	<xf:extension name="start"></xf:extension>

	<xf:extension name="prefix_id">
		<xf:if is="$filters.prefix_id">
			<li><a href="{{ link('forums', $forum, $filters|replace('prefix_id', null)) }}"
				class="filterBar-filterToggle" data-xf-init="tooltip" title="{{ phrase('remove_this_filter')|for_attr }}">
				<span class="filterBar-filterToggle-label">{{ phrase('prefix:') }}</span>
				{{ prefix_title('thread', $filters.prefix_id) }}</a></li>
		</xf:if>
	</xf:extension>

	<xf:extension name="starter_id">
		<xf:if is="$filters.starter_id AND $starterFilter">
			<li><a href="{{ link('forums', $forum, $filters|replace('starter_id', null)) }}"
				class="filterBar-filterToggle" data-xf-init="tooltip" title="{{ phrase('remove_this_filter')|for_attr }}">
				<span class="filterBar-filterToggle-label">{{ phrase('started_by:') }}</span>
				{$starterFilter.username}</a></li>
		</xf:if>
	</xf:extension>

	<xf:extension name="thread_type">
		<xf:if is="$filters.thread_type && $threadTypeFilter">
			<li><a href="{{ link('forums', $forum, $filters|replace('thread_type', null)) }}"
				class="filterBar-filterToggle" data-xf-init="tooltip" title="{{ phrase('remove_this_filter')|for_attr }}">
				<span class="filterBar-filterToggle-label">{{ phrase('thread_type_filter:') }}</span>
				{{ $threadTypeFilter.getTypeTitle() }}</a></li>
		</xf:if>
	</xf:extension>

	<xf:extension name="last_days">
		<xf:if is="$filters.last_days AND {$dateLimits.{$filters.last_days}}">
			<li><a href="{{ link('forums', $forum, $filters|replace('last_days', null)) }}"
				class="filterBar-filterToggle" data-xf-init="tooltip" title="{{ phrase('remove_this_filter')|for_attr }}">
				<span class="filterBar-filterToggle-label">{{ phrase('last_updated:') }}</span>
				{$dateLimits.{$filters.last_days}}</a></li>
		</xf:if>
	</xf:extension>

	<xf:extension name="order">
		<xf:if is="$filters.order">
			<li><a href="{{ link('forums', $forum, $filters|replace({'order': null, 'direction': null})) }}"
				class="filterBar-filterToggle" data-xf-init="tooltip" title="{{ phrase('return_to_default_order')|for_attr }}">
				<span class="filterBar-filterToggle-label">{{ phrase('sort_by:') }}</span>
				{{ phrase_dynamic('forum_sort.' . $filters.order) }}
				<xf:fa icon="{{ $filters.direction == 'asc' ? 'fa-angle-up' : 'fa-angle-down' }}" />
				<span class="u-srOnly"><xf:if is="$filters.direction == 'asc'">{{ phrase('ascending') }}<xf:else />{{ phrase('descending') }}</xf:if></span>
			</a></li>
		</xf:if>
	</xf:extension>

	<xf:extension name="end"></xf:extension>
</xf:macro>

<xf:macro name="date_limit_disabler" arg-forum="!" arg-page="!" arg-filters="!">
	<div class="structItem structItem--note">
		<div class="structItem-cell">
			<a href="{{ link('forums', $forum, {'page': $page, 'no_date_limit': 1} + $filters) }}">
				{{ phrase('show_older_items') }}
			</a>
		</div>
	</div>
</xf:macro>