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,44 +46,93 @@ $(".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) {
-    bhAdapter(query, function(retArray) {
+function prefixedSource(prefix, query, cb, source) {
+    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);
+}
+
+function sourceSplit(query, cb, split, source) {
+    var tokens = query.split(split);
+    var currentSource = tokens[tokens.length - 1].trim();
+
+    tokens.splice(tokens.length - 1, 1); // remove last element
+    var prefix = "";
+    var newSplit;
+    if (split === "&") {
+        newSplit = " " + split + " ";
+    } else {
+        newSplit = split + " ";
+    }
+    for (var i = 0; i < tokens.length; i++) {
+        prefix += tokens[i].trim() + newSplit;
+    }
+    prefixedSource(prefix, currentSource, cb, source);
 }
 
 var authors = new Bloodhound({
     name: "authors",
+    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"
-    }
+        url: getPath() + "/get_authors_json?q=%QUERY",
+        wildcard: '%QUERY',
+    },
 });
 
+$(".form-group #bookAuthor").typeahead(
+    {
+        highlight: true,
+        minLength: 1,
+        hint: true
+    }, {
+        name: "authors",
+        display: 'name',
+        source: function source(query, cb, asyncResults) {
+            return sourceSplit(query, cb, "&", authors);
+        }
+    }
+);
+
+
 var series = new Bloodhound({
     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=",
-        replace: function replace(url, query) {
+        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,
+        hint: true
+    }, {
+        name: "series",
+        displayKey: "name",
+        source: series
+    }
+);
 
 var tags = new Bloodhound({
     name: "tags",
@@ -96,10 +145,25 @@ var tags = new Bloodhound({
         return tokens;
     },
     remote: {
-        url: getPath() + "/get_tags_json?q=%QUERY"
+        url: getPath() + "/get_tags_json?q=%QUERY",
+        wildcard: '%QUERY'
     }
 });
 
+$(".form-group #tags").typeahead(
+    {
+        highlight: true,
+        minLength: 0,
+        hint: true
+    }, {
+        name: "tags",
+        display: "name",
+        source: function source(query, cb, asyncResults) {
+            return sourceSplit(query, cb, ",", tags);
+        }
+    }
+);
+
 var languages = new Bloodhound({
     name: "languages",
     datumTokenizer: function datumTokenizer(datum) {
@@ -109,13 +173,27 @@ var languages = new Bloodhound({
         return [query];
     },
     remote: {
-        url: getPath() + "/get_languages_json?q=",
-        replace: function replace(url, query) {
+        url: getPath() + "/get_languages_json?q=%QUERY",
+        wildcard: '%QUERY'
+        /*replace: function replace(url, query) {
             return url + encodeURIComponent(query);
-        }
+        }*/
     }
 });
 
+$(".form-group #languages").typeahead(
+    {
+        highlight: true, minLength: 0,
+        hint: true
+    }, {
+        name: "languages",
+        display: "name",
+        source: function source(query, cb, asyncResults) {
+            return sourceSplit(query, cb, ",", languages);
+        }
+    }
+);
+
 var publishers = new Bloodhound({
     name: "publisher",
     datumTokenizer: function datumTokenizer(datum) {
@@ -123,105 +201,21 @@ var publishers = new Bloodhound({
     },
     queryTokenizer: Bloodhound.tokenizers.whitespace,
     remote: {
-        url: getPath() + "/get_publishers_json?q=%QUERY"
+        url: getPath() + "/get_publishers_json?q=%QUERY",
+        wildcard: '%QUERY'
     }
 });
 
-function sourceSplit(query, cb, split, source) {
-    var bhAdapter = source.ttAdapter();
-
-    var tokens = query.split(split);
-    var currentSource = tokens[tokens.length - 1].trim();
-
-    tokens.splice(tokens.length - 1, 1); // remove last element
-    var prefix = "";
-    var newSplit;
-    if (split === "&") {
-        newSplit = " " + split + " ";
-    } else {
-        newSplit = split + " ";
-    }
-    for (var i = 0; i < tokens.length; i++) {
-        prefix += tokens[i].trim() + newSplit;
+$(".form-group #publisher").typeahead(
+    {
+        highlight: true, minLength: 0,
+        hint: true
+    }, {
+        name: "publishers",
+        displayKey: "name",
+        source: publishers
     }
-    prefixedSource(prefix, currentSource, cb, bhAdapter);
-}
-
-var promiseAuthors = authors.initialize();
-promiseAuthors.done(function() {
-    $("#bookAuthor").typeahead(
-        {
-            highlight: true, minLength: 1,
-            hint: true
-        }, {
-            name: "authors",
-            displayKey: "name",
-            source: function source(query, cb) {
-                return sourceSplit(query, cb, "&", authors); //sourceSplit //("&")
-            }
-        }
-    );
-});
-
-var promiseSeries = series.initialize();
-promiseSeries.done(function() {
-    $("#series").typeahead(
-        {
-            highlight: true, minLength: 0,
-            hint: true
-        }, {
-            name: "series",
-            displayKey: "name",
-            source: series.ttAdapter()
-        }
-    );
-});
-
-var promiseTags = tags.initialize();
-promiseTags.done(function() {
-    $("#tags").typeahead(
-        {
-            highlight: true, minLength: 0,
-            hint: true
-        }, {
-            name: "tags",
-            displayKey: "name",
-            source: function source(query, cb) {
-                return sourceSplit(query, cb, ",", tags);
-            }
-        }
-    );
-});
-
-var promiseLanguages = languages.initialize();
-promiseLanguages.done(function() {
-    $("#languages").typeahead(
-        {
-            highlight: true, minLength: 0,
-            hint: true
-        }, {
-            name: "languages",
-            displayKey: "name",
-            source: function source(query, cb) {
-                return sourceSplit(query, cb, ",", languages); //(",")
-            }
-        }
-    );
-});
-
-var promisePublishers = publishers.initialize();
-promisePublishers.done(function() {
-    $("#publisher").typeahead(
-        {
-            highlight: true, minLength: 0,
-            hint: true
-        }, {
-            name: "publishers",
-            displayKey: "name",
-            source: publishers.ttAdapter()
-        }
-    );
-});
+);
 
 $("#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 class="form-group">
+    <div id="author_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>