Fix stored css bug in all typeahead functions (update typeahead -> bugfix typeahead)

cps/db.py

@@ -737,6 +737,7 @@ class CalibreDB():
         self.session.connection().connection.connection.create_function("lower", 1, lcase)
         entries = self.session.query(database).filter(tag_filter). \
             filter(func.lower(database.name).ilike("%" + query + "%")).all()
+        # json_dumps = json.dumps([dict(name=escape(r.name.replace(*replace))) for r in entries])
         json_dumps = json.dumps([dict(name=r.name.replace(*replace)) for r in entries])
         return json_dumps
 

cps/static/css/libs/typeahead.css

@@ -145,7 +145,7 @@ fieldset[disabled] .twitter-typeahead .tt-input {
   cursor: not-allowed;
   background-color: #eeeeee !important;
 }
-.tt-dropdown-menu {
+.tt-menu {
   position: absolute;
   top: 100%;
   left: 0;
@@ -166,7 +166,7 @@ fieldset[disabled] .twitter-typeahead .tt-input {
   *border-right-width: 2px;
   *border-bottom-width: 2px;
 }
-.tt-dropdown-menu .tt-suggestion {
+.tt-menu .tt-suggestion {
   display: block;
   padding: 3px 20px;
   clear: both;
@@ -175,15 +175,15 @@ fieldset[disabled] .twitter-typeahead .tt-input {
   color: #333333;
   white-space: nowrap;
 }
-.tt-dropdown-menu .tt-suggestion.tt-cursor {
+.tt-menu .tt-suggestion.tt-cursor {
   text-decoration: none;
   outline: 0;
   background-color: #f5f5f5;
   color: #262626;
 }
-.tt-dropdown-menu .tt-suggestion.tt-cursor a {
+.tt-menu .tt-suggestion.tt-cursor a {
   color: #262626;
 }
-.tt-dropdown-menu .tt-suggestion p {
+.tt-menu .tt-suggestion p {
   margin: 0;
 }

cps/static/js/edit_books.js

@@ -46,90 +46,20 @@ $(".datepicker_delete").click(function() {
 Takes a prefix, query typeahead callback, Bloodhound typeahead adapter
  and returns the completions it gets from the bloodhound engine prefixed.
  */
-function prefixedSource(prefix, query, cb, bhAdapter) {
+function prefixedSource(prefix, query, cb, source) {
-    bhAdapter(query, function(retArray) {
+    function async(retArray) {
+        retArray = retArray || [];
         var matches = [];
         for (var i = 0; i < retArray.length; i++) {
             var obj = {name : prefix + retArray[i].name};
             matches.push(obj);
         }
         cb(matches);
-    });
     }
-
+    source.search(query, cb, async);
-var authors = new Bloodhound({
-    name: "authors",
-    datumTokenizer: function datumTokenizer(datum) {
-        return [datum.name];
-    },
-    queryTokenizer: Bloodhound.tokenizers.whitespace,
-    remote: {
-        url: getPath() + "/get_authors_json?q=%QUERY"
 }
-});
-
-var series = new Bloodhound({
-    name: "series",
-    datumTokenizer: function datumTokenizer(datum) {
-        return [datum.name];
-    },
-    queryTokenizer: function queryTokenizer(query) {
-        return [query];
-    },
-    remote: {
-        url: getPath() + "/get_series_json?q=",
-        replace: function replace(url, query) {
-            return url + encodeURIComponent(query);
-        }
-    }
-});
-
-
-var tags = new Bloodhound({
-    name: "tags",
-    datumTokenizer: function datumTokenizer(datum) {
-        return [datum.name];
-    },
-    queryTokenizer: function queryTokenizer(query) {
-        var tokens = query.split(",");
-        tokens = [tokens[tokens.length - 1].trim()];
-        return tokens;
-    },
-    remote: {
-        url: getPath() + "/get_tags_json?q=%QUERY"
-    }
-});
-
-var languages = new Bloodhound({
-    name: "languages",
-    datumTokenizer: function datumTokenizer(datum) {
-        return [datum.name];
-    },
-    queryTokenizer: function queryTokenizer(query) {
-        return [query];
-    },
-    remote: {
-        url: getPath() + "/get_languages_json?q=",
-        replace: function replace(url, query) {
-            return url + encodeURIComponent(query);
-        }
-    }
-});
-
-var publishers = new Bloodhound({
-    name: "publisher",
-    datumTokenizer: function datumTokenizer(datum) {
-        return [datum.name];
-    },
-    queryTokenizer: Bloodhound.tokenizers.whitespace,
-    remote: {
-        url: getPath() + "/get_publishers_json?q=%QUERY"
-    }
-});
 
 function sourceSplit(query, cb, split, source) {
-    var bhAdapter = source.ttAdapter();
-
     var tokens = query.split(split);
     var currentSource = tokens[tokens.length - 1].trim();
 
@@ -144,84 +74,148 @@ function sourceSplit(query, cb, split, source) {
     for (var i = 0; i < tokens.length; i++) {
         prefix += tokens[i].trim() + newSplit;
     }
-    prefixedSource(prefix, currentSource, cb, bhAdapter);
+    prefixedSource(prefix, currentSource, cb, source);
 }
 
-var promiseAuthors = authors.initialize();
+var authors = new Bloodhound({
-promiseAuthors.done(function() {
+    name: "authors",
-    $("#bookAuthor").typeahead(
+    identify: function(obj) { return obj.name; },
+    datumTokenizer: function datumTokenizer(datum) {
+        return [datum.name];
+    },
+    queryTokenizer: Bloodhound.tokenizers.whitespace,
+    remote: {
+        url: getPath() + "/get_authors_json?q=%QUERY",
+        wildcard: '%QUERY',
+    },
+});
+
+$(".form-group #bookAuthor").typeahead(
     {
-            highlight: true, minLength: 1,
+        highlight: true,
+        minLength: 1,
         hint: true
     }, {
         name: "authors",
-            displayKey: "name",
+        display: 'name',
-            source: function source(query, cb) {
+        source: function source(query, cb, asyncResults) {
-                return sourceSplit(query, cb, "&", authors); //sourceSplit //("&")
+            return sourceSplit(query, cb, "&", authors);
         }
     }
 );
-});
 
-var promiseSeries = series.initialize();
+
-promiseSeries.done(function() {
+var series = new Bloodhound({
-    $("#series").typeahead(
+    name: "series",
+    datumTokenizer: function datumTokenizer(datum) {
+        return [datum.name];
+    },
+    // queryTokenizer: Bloodhound.tokenizers.whitespace,
+    queryTokenizer: function queryTokenizer(query) {
+        return [query];
+    },
+    remote: {
+        url: getPath() + "/get_series_json?q=%QUERY",
+        wildcard: '%QUERY',
+        /*replace: function replace(url, query) {
+            return url + encodeURIComponent(query);
+        }*/
+    }
+});
+$(".form-group #series").typeahead(
     {
-            highlight: true, minLength: 0,
+        highlight: true,
+        minLength: 0,
         hint: true
     }, {
         name: "series",
         displayKey: "name",
-            source: series.ttAdapter()
+        source: series
     }
 );
+
+var tags = new Bloodhound({
+    name: "tags",
+    datumTokenizer: function datumTokenizer(datum) {
+        return [datum.name];
+    },
+    queryTokenizer: function queryTokenizer(query) {
+        var tokens = query.split(",");
+        tokens = [tokens[tokens.length - 1].trim()];
+        return tokens;
+    },
+    remote: {
+        url: getPath() + "/get_tags_json?q=%QUERY",
+        wildcard: '%QUERY'
+    }
 });
 
-var promiseTags = tags.initialize();
+$(".form-group #tags").typeahead(
-promiseTags.done(function() {
-    $("#tags").typeahead(
     {
-            highlight: true, minLength: 0,
+        highlight: true,
+        minLength: 0,
         hint: true
     }, {
         name: "tags",
-            displayKey: "name",
+        display: "name",
-            source: function source(query, cb) {
+        source: function source(query, cb, asyncResults) {
             return sourceSplit(query, cb, ",", tags);
         }
     }
 );
+
+var languages = new Bloodhound({
+    name: "languages",
+    datumTokenizer: function datumTokenizer(datum) {
+        return [datum.name];
+    },
+    queryTokenizer: function queryTokenizer(query) {
+        return [query];
+    },
+    remote: {
+        url: getPath() + "/get_languages_json?q=%QUERY",
+        wildcard: '%QUERY'
+        /*replace: function replace(url, query) {
+            return url + encodeURIComponent(query);
+        }*/
+    }
 });
 
-var promiseLanguages = languages.initialize();
+$(".form-group #languages").typeahead(
-promiseLanguages.done(function() {
-    $("#languages").typeahead(
     {
         highlight: true, minLength: 0,
         hint: true
     }, {
         name: "languages",
-            displayKey: "name",
+        display: "name",
-            source: function source(query, cb) {
+        source: function source(query, cb, asyncResults) {
-                return sourceSplit(query, cb, ",", languages); //(",")
+            return sourceSplit(query, cb, ",", languages);
         }
     }
 );
+
+var publishers = new Bloodhound({
+    name: "publisher",
+    datumTokenizer: function datumTokenizer(datum) {
+        return [datum.name];
+    },
+    queryTokenizer: Bloodhound.tokenizers.whitespace,
+    remote: {
+        url: getPath() + "/get_publishers_json?q=%QUERY",
+        wildcard: '%QUERY'
+    }
 });
 
-var promisePublishers = publishers.initialize();
+$(".form-group #publisher").typeahead(
-promisePublishers.done(function() {
-    $("#publisher").typeahead(
     {
         highlight: true, minLength: 0,
         hint: true
     }, {
         name: "publishers",
         displayKey: "name",
-            source: publishers.ttAdapter()
+        source: publishers
     }
 );
-});
 
 $("#search").on("change input.typeahead:selected", function(event) {
     if (event.target.type === "search" && event.target.tagName === "INPUT") {

cps/templates/book_edit.html

@@ -58,11 +58,11 @@
     <div class="text-center">
         <button type="button" class="btn btn-default" id="xchange" ><span class="glyphicon glyphicon-arrow-up"></span><span class="glyphicon glyphicon-arrow-down"></span></button>
     </div>
-
+    <div id="author_div" class="form-group">
-    <div class="form-group">
       <label for="bookAuthor">{{_('Author')}}</label>
       <input type="text" class="form-control typeahead" name="author_name" id="bookAuthor" value="{{' & '.join(authors)}}" autocomplete="off">
     </div>
+
     <div class="form-group">
       <label for="description">{{_('Description')}}</label>
       <textarea class="form-control" name="description" id="description" rows="7">{% if book.comments %}{{book.comments[0].text}}{%endif%}</textarea>