We Keep Coding

Promise in MagicSuggest data function

I have tried asking this question directly on github but there does not seem to be much movement in this project anymore. It would be great if someone on SO has an idea. Is it possible to return a promise in the data function? I have tried the following and it does not seem to work. The issue is that I am trying to make an ajax call within the data-function, which expects a result/data array. Of course I cannot do this when making an asynchronous ajax call.
var ms = $('#mycombo').magicSuggest({minChars: 2, data : function(q) {
return someAPI.findSuggestions(q, currentLang).then(function(response) {
if(!_.isEmpty(response.data.suggestions)) {
_.each(response.data.suggestions, function(suggestion) {
if (suggestion.id && suggestion.label) {
data.push({ id: suggestion.id, name: suggestion.label });
}
});
}
});
return data;
}});
If there is an alternative way of solving this, I would be very grateful for your help.
Thanks in advance.
Michael

For those interested, I have managed to find a solution to the problem. As posted on github (https://github.com/nicolasbize/magicsuggest/issues/281) you need to use the keyup event instead of setting the data property during initialization. So it now looks something like this:
var ms = $('#mycombo').magicSuggest({minChars: 2});
$(ms).on('keyup', function(e, m, v) {
// ... get data via ajax and call "ms.setData(data)" in the response callback ...
// ... you can use m.getRawValue() to get the current word being typed ...
ms.setData(data);
}
This will cause an ajax call to be fired after every key press, so you may want to improve this by adding some kind of a delay or something.

I've also done it this way:
const suggester: any = divElem.magicSuggest({
...more properties here...
data: (query) => {
if (query) {
this.myService.mySearch(query).take(1).subscribe((list) => {
suggester.setData(list);
});
}
return [];
},
...more properties here...
});
Where mySearch(query) returns:
Observable<MyObject[]>

How to use getMapping function of Elasticsearch JS

I am trying to use this getMapping function seen here in the api. I am trying to get the mapping for an index in my database. So far I've tried this
var indexMap = client.indices.getMapping(['indexName'], function() {
console.log(indexMap);
});
and
var indexMap = client.indices.getMapping({index: 'indexName'}, function() {
console.log(indexMap);
});
both tries fail and log { abort: [Function: abortRequest] }

So I took a closer look at the ElasticSearch JS Quick Start docs to see how they were using the methods. I was confused by the API because I thought it was supposed to take an array client.indices.getMapping([params, [callback]]). But I now understand that it takes an object with params inside that object and then returns the response in a callback. The function does not return anything relevant as far as I can tell. Heres the code I used to get the mapping on 'myIndex' index. The mapping is stored in the response object.
Code:
client.indices.getMapping({index: 'patents'}, function(error, response) {
if (error) {
console.log(error);
} else {
console.log(response);
}
});

Knockout mapping data from server, lost subscriptions

I'm trying to represent multiple selects with its selected values from backend JSON to knockout view model.
And it's needed to retrieve this JSON when each select is changed, first time - all is ok, but if I apply mapping again (ko.mapping.fromJS(test_data, ViewModel)), all subscriptions are lost does anyone know how to avoid this situation?
jsfiddle (I don't know why selects don't have its values, without jsfiddle - all is ok):
http://jsfiddle.net/0bww2apv/2/
$(ViewModel.attributes()).each(function(index, attribute) {
attribute.attribute_value.subscribe(function(name) {
console.log('SUBSCRIBE', name);
var send_data = {};
$(ViewModel.attributes()).each(function (index, attribute) {
send_data[attribute.attribute_name.peek()] = attribute.attribute_value.peek();
if (attribute.attribute_value() === null) {
send_data = null;
return false;
}
});
if (send_data) {
console.log('REQUEST TO BACKEND: ', ko.toJSON(send_data));
ko.mapping.fromJS(test_data, ViewModel);
// subscriptions is lost here !
}
});
});

At last I've solved my own question with knockout.reactor plugin,
If we remove all auxiliary constructions, it will look like:
var ViewModel = ko.mapping.fromJS(test_data);
ko.applyBindings(ViewModel);
ko.watch(ViewModel, { depth: -1 }, function(parents, child, item) {
// here we need to filter watches and update only when needed, see jsfiddle
ko.mapping.fromJS(test_data2, {}, ViewModel);
});
This way we update selects and don't have troubles with subscription recursions.
full version (see console output for details): http://jsfiddle.net/r7Lo7502/

Storing in annotator.js using store plugin not working

I am using store plugin of annotator.js
The problem is I am not able to store the received data(enetered into the comment box of annotatorjs ) at the desired location as JSON.
The code for the plugin is as follows
$('#page-container').annotator().annotator('addPlugin', 'Store', {
urls: {
prefix: '/editor/uploaded',
update:'/annotations',
}
});
The output I get in console is
XHR finished loading: POST "http://localhost/editor/uploaded/annotations"
Uncaught TypeError: Cannot read property 'id' of null
Please let me know how the storage can be accomplished.
Thanks in advance !!

You are building the object passed as parameter wrong, as "prefix" is not a property inside "urls".
Regarding your example, the right way would be:
$('#page-container').annotator().annotator('addPlugin', 'Store', {
prefix: '/editor/uploaded',
urls: {
update:'/annotations'
}
});
Then you need to set up the API on the server side, as required by the plugin.
Personally, I ended up creating my own store plugin, so I could process annotations exactly as I needed. It's not very hard and it's really worth the effort.

public annotatorFunc(): void {
const pageUri = function () {
return {
beforeAnnotationCreated: function (ann) {
ann.uri = window.location.href;
}
};
};
const elem = document.querySelector('pdf-container');
const app = new annotator.App();
app.include(annotator.ui.main, {element: elem});
app.include(annotator.storage.http, {prefix: 'http://localhost:8080/api'});
app.include(pageUri);
app.start().then(function () {
app.annotations.load({uri: window.location.href});
});
}

using json data from localhost in js file using ruby

I'm creating a web app that uses MONGOHQ to store data, and that uses Sinatra to run the app. If I go to: localhost:4578/names.json, I get the names of all the names that I use for my data. However, I'm having trouble accessing this data using the getJSON method of jquery.
The file /names.json looks like this:
["Yasiel Puig","Nick Franklin","Mike Zunino","Jurickson Profar","Manny Machado"]
I tried doing something like this:
var series = []
$.get('names.json', function(n) {
n.forEach(function(s) {
series.push({
name: s
})
})
}, 'json')
But this does not really work. Do you have any other ideas for how I should access the json data? Could I save it to a var? I'm pretty sure the json data is not JSONP format, so maybe I should treat it as AJAX?

Your code seems to work, I tried it in this Fiddle. Therefore the problem is probably on server side.
var data = ["Yasiel Puig", "Nick Franklin", "Mike Zunino",
"Jurickson Profar", "Manny Machado"];
var series = [];
data.forEach( function( e ) {
series.push( {
name: e
});
}
);
series.forEach( function( e ) {
console.log( e.name );
});

there is a difference between calling $.get('names.json') and $.get('/names.json') I think you are not adding the starting slash(/) to the url
when you call $.get('names.json') it calls complete_current_url + '/names.json'
eg. if you are on /home page then the url that would be called is /home/names.json
and $.get('/names.json') will call current_domain + '/names.json'
from any page it will always call '/names.json'

Could I save it to a var?
Possibly. Though, it depends on which variable and where/when you need it.
$.get() is asynchronous. It only starts the request, sets the callback as a listener, and then exits.
var series = [];
$.get('names.json', function (n) {
n.forEach(function(s) {
series.push({
name: s
});
});
// inside the callback...
console.log(series); // filled: [ { name: "Yasiel Puig" }, ... ]
});
// after the request...
console.log(series); // still empty: []
So, you can use series, or more importantly n, within the callback. Outside, it won't be available yet.