From b004333eadb9a4db57592bb501b28edced708943 Mon Sep 17 00:00:00 2001
From: Marcel Korpel <marcel.lists@gmail.com>
Date: Sun, 23 Dec 2012 21:23:45 +0000
Subject: Implemented typeahead suggest

Use Twitter Bootstrap JavaScript framework for typeahead support.

Add a new "suggest" JSON method, which returns the first 20
packages that match the beginning characters of a query.

canyonknight: Link format change, commit message
Signed-off-by: Lukas Fleischer <archlinux@cryptocrack.de>
---
 web/html/home.php | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

(limited to 'web/html/home.php')

diff --git a/web/html/home.php b/web/html/home.php
index 4e489ba..0b51d55 100644
--- a/web/html/home.php
+++ b/web/html/home.php
@@ -95,7 +95,7 @@ $dbh = db_connect();
 			<fieldset>
 				<label for="pkgsearch-field"><?= __('Package Search') ?>:</label>
 				<input type="hidden" name="O" value="0" />
-				<input type="text" name="K" size="30" value="<?php if (isset($_REQUEST["K"])) { print stripslashes(trim(htmlspecialchars($_REQUEST["K"], ENT_QUOTES))); } ?>" maxlength="35" />
+				<input id="pkgsearch-field" type="text" name="K" size="30" value="<?php if (isset($_REQUEST["K"])) { print stripslashes(trim(htmlspecialchars($_REQUEST["K"], ENT_QUOTES))); } ?>" maxlength="35" />
 			</fieldset>
 		</form>
 	</div>
@@ -107,5 +107,22 @@ $dbh = db_connect();
 	</div>
 
 </div>
+<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
+<script type="text/javascript" src="/js/bootstrap-typeahead.js"></script>
+<script type="text/javascript">
+$(document).ready(function() {
+    $('#pkgsearch-field').typeahead({
+        source: function(query, callback) {
+            $.getJSON('<?= get_uri('/rpc'); ?>', {type: "suggest", arg: query}, function(data) {
+                callback(data);
+            });
+        },
+        matcher: function(item) { return true; },
+        sorter: function(items) { return items; },
+        menu: '<ul class="pkgsearch-typeahead"></ul>',
+        items: 20
+    }).attr('autocomplete', 'off');
+});
+</script>
 <?php
 html_footer(AUR_VERSION);
-- 
cgit v1.2.3-70-g09d2