modifying results displayed for Search API Live results module

Question

I really like the SEARCH API and have been playing with Search api live results. I have two questions about this though:

Is there a way to bold the the part of the live search result that matches what i've typed so far? Ex: if i've written "cat" and there's a node with the title "caterpillar" the live search results will show "caterpillar" I know that Search api autocomplete does something, but I was wondering how to do so with this module. I did check out this tutorial but I want to modify the content that appears below the search box, not in the search page.

My second question is: Is there a way to have the results (again, not the ones on the search page, but the ones generated below the search box) organized in subsections, by contentype.Ex: I type cat and there are results of content type a, content type b, content type c.

Contenttype a
cat a1
cat a2
Contenttype b
cat b1
Contenttype c
cat c1
cat c2

Would I be able to do this with a view or would I have to write code to do this?

----------------UPDATE------------------
I think I found the function that generates the html for the live results. I’ve attached an image of it.
In this function, I can see how a live-result-search-item div is created but I haven’t quite fully figured out how they generate the href inside it. I feel like it's done in another jquery function which I've also attached an image of.
I posted an answer. I still haven't figured out how to group items by content type though.

Answer 1

for(key in matches){
   var endOfUrl = matches[key].search('>')+1;
   var url = matches[key].substring(0,endOfUrl);
   var rest = matches[key].substring(endOfUrl);
   var regex = new RegExp( '(' + searchString + ')', 'gi' );
   bolded= rest.replace( regex, "<b>$1</b>" );
   matches[key]= url+bolded;
}

right before the line

db.cache[searchString] = matches;

This bolds all occurrences of the word in the Title and makes sure the bolding goes into the cache for when it's pulled up again.

Another update: I was able to get my results grouped by content type by installing and enabling Search API grouping and modifying my index's filter (admin/config/search/search_api/index/node_index/workflow) so that under "enabled processors" i checked grouping.

Once I did that, I also modified my search page so that my view mode was Live Result Search. This gave me access to the node content type in the js file I was modifying so that I could then parse the html string for the node-type and add an element to the live results list that was the content type label. Comment if my JS file interests you.