{{? it.page_layout }}

	{{# def.page_layout:it.page_layout }}

	{{?? it.quick_search }}
		{{# def.quick_search :it.quick_search }}

	{{?? it.quick_search_results }}
		{{# def.quick_search_results :it.quick_search_results }}

	{{?? it.search_history_item }}
		{{# def.search_history_item :it.search_history_item }}

	{{?? it.search_preview_topic }}
		{{# def.search_preview_topic :it.search_preview_topic }}

	{{?? it.search_results_body }}
		{{# def.search_results_body :it.search_results_body }}
	
	{{?? it.search_results_none }}
		{{# def.search_results_none }}
	
	{{?? it.search_results_textbooks }}
		{{# def.search_results_textbooks :it.search_results_textbooks }}

	{{?? it.search_results_topics }}
		{{# def.search_results_topics :it.search_results_topics }}

{{?}}

/* SUB-TEMPLATES */

	{{## def.page_layout :self: 

		<div id="search" class="search">

			{{= self.breadcrumb_bar }}
			
			{{# def.search_form :self.search_form }}
			
			<div class="container pad-height-md">
				<div class="row">
					<!-- MAIN DISPLAY -->
					<div class="col-xs-12 col-md-7">
						{{# def.search_history :self.search_history }}
						{{# def.search_results :self.search_results }}
					</div>
					<!-- SIDEBAR -->
					<div class="hidden-xs hidden-sm col-md-5">
						{{# def.search_preview :self.search_preview }}
					</div>
				</div>
			</div>
			
			{{# def.textbook_wall :self.textbook_wall }}
			
		</div>

		#}}

	{{## def.quick_search :self:

		<form id="quick-search" class="quick-search">
			<div class="input-group">
				<input type="text" class="form-control" placeholder="{{= self.placeholder }}">
				<span class="input-group-btn">
					<button class="btn btn-success" type="submit" formmethod="post">
						<span class="fa fa-search"></span>
					</button>
				</span>
			</div>
			<div class="quick-search__results"></div>
		</form>

		#}}

	{{## def.quick_search_results :self: 
		
		{{? self.textbooks }}
			{{# def.quick_search_textbooks_list :self.textbooks }}
		{{?}}

		{{? self.topics }}
			{{# def.quick_search_topics_list :self.topics }}
		{{?}}

		{{? self.no_results }}
			{{# def.quick_search_no_results :self.no_results }}
		{{?}}

		<footer class="quick-search__results-footer space-top-sm">
			<a class="btn btn-block btn-brand h6 pad-height-xs" href="{{= self.search_url }}">
				{{= self.search_label }}
			</a>
		</footer>

		#}}
	
	{{## def.quick_search_no_results :self: 

		<div class="quick_search__no-results pad-width-sm">
			<p class="h6 text-lite">
				{{= self.msg }}
			</p>
		</div>

		#}}

	{{## def.quick_search_textbooks_list :self: 
		
		<h6 class="quick-search__heading">
			{{= self.heading }}
		</h6>
		<div class="quick-search__table space-top-xxs space-bottom-xs">
			{{~ self.items :item }}
				<a class="quick-search__table-row" href="{{= item.textbook_url }}">
					<div class="quick-search__table-cell">
						{{= item.textbook_name }}
					</div>
				</a>
			{{~}}
		</div>

		#}}
	
	{{## def.quick_search_topics_list :self: 
		
		<h6 class="quick-search__heading">
			{{= self.heading }}
		</h6>
		<div class="quick-search__table space-top-xxs">
			{{~ self.items :item }}
				<a class="quick-search__table-row" href="{{= item.topic_url }}">
					<div class="quick-search__table-cell quick-search__table-cell--primary">
						{{= item.topic_name }}
					</div>
					<div class="quick-search__table-cell quick-search__table-cell--secondary text-muted">
						{{= item.textbook_name }}
					</div>
				</li>
			{{~}}
		</div>

		#}}

	{{## def.search_form :self: 

		<div class="banded">
			<div class="container pad-height-md">
				<div class="row">
					<div class="col-xs-12 col-sm-8 col-md-7">
						<h1 class="h4 space-bottom-xs">
							{{= self.heading }}
						</h1>
						<form id="search-form" class="search-form">
							<input id="search-form-input" class="form-control" type="text" 
								name="term" placeholder="{{= self.placeholder }}" value="{{= self.value }}" 
								autocomplete {{= self.value ? '' : 'autofocus' }}>
							<div class="search-form-controls">
								<span id="search-form-spinner" class="fa fa-spin fa-spinner text-muted hidden"></span>
								<span id="search-form-clear" class="fa fa-fw fa-times-circle space-left-xs text-error 
									{{= self.value ? '' : 'hidden' }}" role="button"></span>
								<button class="hidden" type="submit" formmethod="post"></button>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>

		#}}

	{{## def.search_history :self: 

		<div id="search-history" class="search-history hidden">
			<h2 class="h4">
				{{= self.heading }}
			</h2>
			<ul id="search-history-terms" class="search-history__terms">
				{{~ self.terms :term }}
					{{# def.search_history_item :term }}
				{{~}}
			</ul>
		</div>

		#}}

	{{## def.search_history_item :search_term: 

		<li class="search-history__term">
			{{= search_term }}
		</li>

		#}}

	{{## def.search_preview :self: 

		<div id="search-preview" class="search-preview">
			{{= self.flowplayer ? self.flowplayer : '' }}
			<div id="search-preview-topic" class="search-preview__topic space-top-sm hidden"></div>
		</div>

		#}}
	
	{{## def.search_preview_topic :self: 

		<header class="search-preview__topic-header">
			<h3 class="h6 text-truncated">
				{{= self.topic_name }}
			</h3>
		</header>

		<div class="search-preview__topic-body">
			
			{{? self.topic_description }}
				<!-- Description -->
				<div class="space-bottom-sm">
					{{= self.topic_description }}
				</div>
			{{?}}
			
			{{? self.topic_notes }}
				<!-- Notes -->
				<div class="space-bottom-sm">
					{{= self.topic_notes }}
				</div>
			{{?}}

			<!-- Lessons -->
			<h6 class="h6 space-bottom-xs">
				{{= self.topic_lessons_heading }}
			</h6>
			<ul>
				{{~ self.topic_examples :example }}
					<li class="search-preview__topic-lesson space-top-xs">
							
						{{? example.has_video }}
							<div class="search-preview__topic-lesson-icon">
								{{? example.is_playable }}
									<span class="fa fa-play-circle" 
										data-video-key="{{= example.video_key }}" 
										data-topic-id="{{= example.topic_id }}" 
										data-example-id="{{= example.example_id }}" 
										data-subexample-id="{{= example.subexample_id }}"></span>
									{{??}} <span class="fa fa-lock"></span>
								{{?}}
							</div>
						{{?}}	

						{{? example.order_num }}
							<div class="search-preview__topic-lesson-num">
								{{= example.order_num + '.' }}
							</div>
						{{?}}
					
						{{= example.detail }}

						{{? example.subexamples && example.subexamples.length }}
							<ul>
								{{~ example.subexamples :subexample }}
									<li class="search-preview__topic-lesson space-top-xs">
										
										{{? subexample.has_video }}
											<div class="search-preview__topic-lesson-icon">
												{{? subexample.is_playable }}
													<span class="fa fa-play-circle" 
														data-video-key="{{= subexample.video_key }}"  
														data-topic-id="{{= example.topic_id }}" 
														data-example-id="{{= example.example_id }}" 
														data-subexample-id="{{= subexample.subexample_id }}"></span>
													{{??}} <span class="fa fa-lock"></span>
												{{?}}
											</div>
										{{?}}	

										{{? subexample.order_num }}
											<div class="search-preview__topic-lesson-num">
												{{= subexample.order_num + ')' }}
											</div>
										{{?}}

										{{= subexample.detail }}
									</li>
								{{~}}
							</ul>
						{{?}}
					</li>
				{{~}}	
			</ul>
		</div>

		<footer class="search-preview__topic-footer">
			<a class="btn btn-block btn-brand pad-height-xs h6 text-loud" 
				href="{{= self.topic_url }}">
				{{= self.footer_label }}
			</a>
		</footer>

		#}}

	{{## def.search_results :self:

		<div id="search-results" class="search-results hidden"></div>

		#}}

	{{## def.search_results_body :self: 

		{{? self.textbooks }}
			{{# def.search_results_textbooks :self.textbooks }}
		{{?}}

		{{? self.topics }}
			{{# def.search_results_topics :self.topics }}
		{{?}}

		{{? self.no_results }}
			{{# def.search_results_no_results :self.no_results }}
		{{?}}

		#}}

	{{## def.search_results_no_results :self: 

		<div class="search-results__none">
			<p>{{= self.msg }}</p>
		</div>

		#}}

	{{## def.search_results_textbooks :self: 

		<div>
			<h2 class="h4">
				{{= self.heading }}
			</h2>
			<ul class="search-results__textbooks space-top-xs">
				{{~ self.items :item }}
					<li class="search-results__textbook">
						<a class="search-results__textbook-art" 
							href="{{= item.textbook_url }}" 
							style="{{= item.textbook_css }}">
						</a>
					</li>
				{{~}}
			</ul>
		</div>

		#}}

	{{## def.search_results_topics :self: 

		<div class="{{= self.add_spacer ? 'space-top-sm' : '' }}">
			<h2 class="h4">
				{{= self.heading }}
			</h2>
			<ul class="search-results__topics">
				{{~ self.items :item }}
					<li class="search-results__topic">
						<a class="" href="{{= item.topic_url }}" data-topic-id="{{= item.topic_id }}">
							<div class="text-muted text-small">
								{{= item.textbook_name }}
							</div>
							{{= item.topic_name }}
						</a>
					</li>
				{{~}}
			</ul>
		</div>

		#}}

	{{## def.textbook_wall :self: 

		{{? self }}
			<div class="container pad-height-md">
				<div class="row">
					<div class="col-xs-12">
						<h2 class="h4 space-bottom-sm text-center">
							{{= self.heading }}
						</h2>
					</div>
				</div>
				<div class="row">
					<div class="col-xs-12">
						{{= self.wall }}
					</div>
				</div>
			</div>
		{{?}}

		#}}