From 3a946b7b9428eebd13b4b4b5207227e99c77a2f9 Mon Sep 17 00:00:00 2001
From: plutonik <plutonik@gmx.net>
Date: Tue, 28 Nov 2017 16:38:19 +0100
Subject: [PATCH] feat(search): Create "sort-by" template #290

* refactor former template _filter-querystring.html together with new
include _sort-by-button.html into a wrapping template _filter-row.html,
because both includes needed to be placed into the same row
* rename inludes in calling page templates
---
 pages/search/_filter-querystring.html | 34 +++++++++++++--------------
 pages/search/_filter-row.html         |  5 ++++
 pages/search/_sort-by-button.html     | 28 ++++++++++++++++++++++
 pages/search/search-landing.html      |  2 +-
 pages/search/search-result.html       |  2 +-
 5 files changed, 51 insertions(+), 20 deletions(-)
 create mode 100644 pages/search/_filter-row.html
 create mode 100644 pages/search/_sort-by-button.html

diff --git a/pages/search/_filter-querystring.html b/pages/search/_filter-querystring.html
index 762f6c54b..5968bc602 100644
--- a/pages/search/_filter-querystring.html
+++ b/pages/search/_filter-querystring.html
@@ -1,21 +1,19 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<div class="row">
-    <div class="hsg-width-one-whole">
-        <div class="hsg-search-inputs-horizontal">
-            <form class="filter-form" id="queryFilters" action="?">
-                <div class="hsg-search-input">
-                    <input id="exactPhrase" type="checkbox" name="match" value="exact_phrase" />
-                    <label for="exactPhrase" class="c-indicator">Exact Phrase</label>
-                </div>
-                <div class="hsg-search-input">
-                    <input id="caseSensitive" type="checkbox" name="match" value="case_sensitive" />
-                    <label for="caseSensitive" class="c-indicator">Case Sensitive</label>
-                </div>
-                <div class="hsg-search-input">
-                    <input id="punctuationSensitive" type="checkbox" name="match" value="punctuation_sensitive" />
-                    <label for="punctuationSensitive" class="c-indicator">Punctuation Sensitive</label>
-                </div>
-            </form>
-        </div>
+<div class="hsg-width-two-thirds">
+    <div class="hsg-search-inputs-horizontal">
+        <form class="filter-form" id="queryFilters" action="?">
+            <div class="hsg-search-input">
+                <input id="exactPhrase" type="checkbox" name="match" value="exact_phrase" />
+                <label for="exactPhrase" class="c-indicator">Exact Phrase</label>
+            </div>
+            <div class="hsg-search-input">
+                <input id="caseSensitive" type="checkbox" name="match" value="case_sensitive" />
+                <label for="caseSensitive" class="c-indicator">Case Sensitive</label>
+            </div>
+            <div class="hsg-search-input">
+                <input id="punctuationSensitive" type="checkbox" name="match" value="punctuation_sensitive" />
+                <label for="punctuationSensitive" class="c-indicator">Punctuation Sensitive</label>
+            </div>
+        </form>
     </div>
 </div>
diff --git a/pages/search/_filter-row.html b/pages/search/_filter-row.html
new file mode 100644
index 000000000..6f0481596
--- /dev/null
+++ b/pages/search/_filter-row.html
@@ -0,0 +1,5 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<div class="row">
+    <div data-template="templates:include" data-template-path="pages/search/_filter-querystring.html"/>
+    <div data-template="templates:include" data-template-path="pages/search/_sort-by-button.html"/>
+</div>
diff --git a/pages/search/_sort-by-button.html b/pages/search/_sort-by-button.html
new file mode 100644
index 000000000..5b7750d95
--- /dev/null
+++ b/pages/search/_sort-by-button.html
@@ -0,0 +1,28 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<div class="hsg-width-one-third">
+    <div class="pull-right">
+        <form class="sorting">
+            <div class="form-group">
+                <p class="form-control-static">Sort by:</p>
+            </div>
+            <div class="btn-group">
+                <button type="button" class="hsg-sort-button dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="">
+                    <span data-template="search:sort-by-value"/>
+                    <i class="glyphicon glyphicon-chevron-down"/>
+                </button>
+                <ul class="dropdown-menu dropdown-menu-right">
+                    <li>
+                        <a href="#" name="sort-by" id="relevance" data-template="search:sort-by">Relevance</a>
+                    </li>
+                    <li>
+                        <a href="#" name="sort-by" id="date_asc" data-template="search:sort-by">Dates (oldest first)</a>
+                    </li>
+                    <li>
+                        <a href="#" name="sort-by" id="date_desc" data-template="search:sort-by">Dates (most recent first)</a>
+                    </li>
+                </ul>
+            </div>
+            <input type="hidden" name="sorting" value="date_desc"/>
+        </form>
+    </div>
+</div>
diff --git a/pages/search/search-landing.html b/pages/search/search-landing.html
index 76d07f952..b1acd930e 100644
--- a/pages/search/search-landing.html
+++ b/pages/search/search-landing.html
@@ -17,7 +17,7 @@
 
     <div data-template="templates:include" data-template-path="pages/search/_search-bar.html"/>
 
-    <div data-template="templates:include" data-template-path="pages/search/_filter-querystring.html"/>
+    <div data-template="templates:include" data-template-path="pages/search/_filter-row.html"/>
 
     <div class="row" data-template="search:filters">
         <div class="hsg-width-one-whole" data-template="app:fix-links">
diff --git a/pages/search/search-result.html b/pages/search/search-result.html
index ba61d0b76..1b4fbaa59 100644
--- a/pages/search/search-result.html
+++ b/pages/search/search-result.html
@@ -17,7 +17,7 @@
 
     <div data-template="templates:include" data-template-path="pages/search/_search-bar.html"/>
 
-    <div data-template="templates:include" data-template-path="pages/search/_filter-querystring.html" class="hsg-search-results"/>
+    <div data-template="templates:include" data-template-path="pages/search/_filter-row.html" class="hsg-search-results"/>
 
     <div class="row hsg-search-results" data-template="search:filters">
         <!-- filter sidebar -->