<!DOCTYPE html>
<html>
%= include 'partial/header'
  <body>

% my $search_route = url_for;
% unless (current_route 'tutorial') {
<div id="tutorial">
%   my $tut_page = url_for(session('tutorial') || 'tutorial');
  <a href="<%= $tut_page %>"
     target="_blank"><i title="Open in new tab"
                        class="fa fa-external-link-square"></i></a>
  <i onclick="closeTutorial()"
     title="close"
     class="fa fa-toggle-up"></i>
  <iframe src="about:blank"
          data-src="<%= $tut_page->query([embedded => 1]) %>"></iframe>
</div>
% }
% else {
%   $search_route = url_for('index');
% };

<div id="top">
  <a href="<%= url_for 'index' %>"><h1><span>KorAP- Korpusanalyseplattform der nächsten Generation</span></h1></a>

%= form_for $search_route => begin
%= select_field ql => [[Poliqarp => 'poliqarp'], ['Cosmas II' => 'cosmas2']], id => 'ql-field'
<br />
%= search_field 'q', id => 'q-field', autofocus => 'autofocus'
<button type="submit" name="action" value="ok"><i class="fa fa-search"></i></button>
%   if (stash('test_port')) {
<button type="submit" name="action" value="inspect"><i class="fa fa-code"></i></button>
%   };
% end

<div id="button-right">
% if (param('q')) {
<button type="button" onclick="$('#search > ol').toggleClass('left-aligned right-aligned'); $(this).children('i').toggleClass('fa-align-right fa-align-left')"><i class="fa fa-align-right"></i></button>
% }
% unless (current_route 'tutorial') {
<button type="button" onclick="openTutorial()"><i class="fa fa-graduation-cap"></i></button>
% };
</div>

</div>

%= content 'sidebar' => begin
<div id="sidebar" style="padding-top: 90px">
%= include 'collections'
  <i class="fa fa-bars"></i>
</div>
% end

<main>
%= content main => begin
  <p>This is the alternative KorAP Frontend.</p>
  <p>The primary goal is to serve as a testbed for the query serialization and for different flavours of user interfaces.</p>
  <p>Search capabilities are limited to the demo user.</p>
% end
</main>

%= content 'javascript'
%= include 'partial/javascript'
%= notifications 'Alertify'
  </body>
</html>