From e939f1bea3bc9148ec3182a2c1273a31e83f9bd9 Mon Sep 17 00:00:00 2001
From: Jared Hancock <jared@osticket.com>
Date: Thu, 30 Apr 2015 12:42:27 -0500
Subject: [PATCH] typeahead: Add scroll support
---
js/redactor-plugins.js | 4 +++-
scp/css/typeahead.css | 6 ++++++
scp/js/bootstrap-typeahead.js | 21 +++++++++++++++++++++
3 files changed, 30 insertions(+), 1 deletion(-)
diff --git a/js/redactor-plugins.js b/js/redactor-plugins.js
index 929a9feaf..182aa0ba6 100644
--- a/js/redactor-plugins.js
+++ b/js/redactor-plugins.js
@@ -1691,7 +1691,9 @@ RedactorPlugins.contexttypeahead = function() {
return (this.query.match(/\./g) || []).length == (item.match(/\./g) || []).length;
},
- onselect: this.contexttypeahead.select.bind(this)
+ onselect: this.contexttypeahead.select.bind(this),
+ scroll: true,
+ items: 100
});
}
diff --git a/scp/css/typeahead.css b/scp/css/typeahead.css
index 03f5091d9..2e4e4d6cc 100644
--- a/scp/css/typeahead.css
+++ b/scp/css/typeahead.css
@@ -32,6 +32,12 @@
right: 0;
left: auto;
}
+.dropdown-menu.scroll {
+ max-height: 180px;
+ height: auto;
+ overflow-y: auto;
+ padding: 0;
+}
.dropdown-menu .divider {
height: 1px;
margin: 8px 1px;
diff --git a/scp/js/bootstrap-typeahead.js b/scp/js/bootstrap-typeahead.js
index 2bdf1a222..6c8238ad1 100644
--- a/scp/js/bootstrap-typeahead.js
+++ b/scp/js/bootstrap-typeahead.js
@@ -28,6 +28,8 @@
this.sorter = this.options.sorter || this.sorter
this.highlighter = this.options.highlighter || this.highlighter
this.$menu = $(this.options.menu).appendTo('body')
+ if (this.options.scroll)
+ this.$menu.addClass('scroll');
this.source = this.options.source
this.onselect = this.options.onselect
this.strings = true
@@ -174,6 +176,16 @@
return this
}
+ , adjustScroll: function(next) {
+ var top = this.$menu.scrollTop(),
+ bottom = top + this.$menu.height(),
+ pos = next.position();
+ if (pos.top < 0)
+ this.$menu.scrollTop(top + pos.top - 10);
+ else if (next.height() + top + pos.top > bottom)
+ this.$menu.scrollTop(top + pos.top - this.$menu.height() + next.height() + 10);
+ }
+
, next: function (event) {
var active = this.$menu.find('.active').removeClass('active')
, next = active.next()
@@ -183,6 +195,10 @@
}
next.addClass('active')
+
+ if (this.options.scroll) {
+ this.adjustScroll(next);
+ }
}
, prev: function (event) {
@@ -194,6 +210,10 @@
}
prev.addClass('active')
+
+ if (this.options.scroll) {
+ this.adjustScroll(prev);
+ }
}
, listen: function () {
@@ -315,6 +335,7 @@
, property: 'value'
, render: 'info'
, minLength: 1
+ , scroll: false
}
$.fn.typeahead.Constructor = Typeahead
--
GitLab