wejsv2old-plugin-cdp-profile
Version:
We.js plugin wejsv2old-plugin-cdp-profile
163 lines (136 loc) • 5.02 kB
JavaScript
App.inject( 'component:we-term-select2', 'store', 'store:main' );
App.WeTermSelect2Component = Ember.Component.extend({
tagName: 'input',
attributeStyling: ['style'],
style: 'display:hidden',
classNames: ['form-control'],
inputSize: 'input-md',
placeholder: 'Selecione uma opção',
minimumInputLength: 0,
maximumSelectionSize: 10,
formatSearching: function() { return 'Buscando ...'; },
formatLoadMore: function() {
return 'Carregando mais resultados ...' ;
},
formatNoMatches: function () {
return 'Nenhum termo encontrado';
},
formatInputTooLong: function(term, maxLength){
return 'O termo '+term+ ' é muito grande, o máximo de palavras é: ' + maxLength;
},
formatSelectionTooBig: function(maxSize){
return 'Você só pode selecionar ' + maxSize + ' termos';
},
formatInputTooShort: function (input, min) {
var n = min - input.length;
return 'Por favor digite ' + n + ' ou mais letras';
},
formatAjaxError: function (){
return 'Falha ao buscar dados';
},
url: '/term',
// Expose component to delegate's controller
init: function() {
var self = this;
self._super.apply(self, arguments);
if (self.get('delegate')) {
self.get('delegate').set(self.get('alias') || 'WeTermSelect2', self);
}
if (!self.get('vocabulary')) return console.warn('No vocabulary was passed, the view won`t know which one to load');
},
didInsertElement: function() {
var self = this;
var store = this.get('store');
var options = {};
self._select = self.$();
options.multiple = true;
options.placeholder = self.get('placeholder');
// options.placeholder = self.get('placeholder').replace('%s', self.get('weSearchField'));
options.tokenSeparators = [','];
options.minimumInputLength = self.get('minimumInputLength');
options.formatSearching = self.get('formatSearching');
options.formatLoadMore = self.get('formatLoadMore');
options.formatNoMatches = self.get('formatNoMatches');
options.formatInputTooLong = self.get('formatInputTooLong');
options.formatSelectionTooBig = self.get('formatSelectionTooBig');
options.formatInputTooShort = self.get('formatInputTooShort');
options.maximumSelectionSize = self.get('maximumSelectionSize');
options.formatAjaxError = self.get('formatAjaxError');
options.escapeMarkup = function (m) { return m; }
options.formatResult = function(item) {
return self.formatTermResult(item);
};
options.formatSelection = function(item) {
if ( item.text ) {
return item.text;
} else {
return item.get('text');
}
};
options.ajax = {
url: self.get('url'),
dataType: 'json',
quietMillis: 250,
data: function (term, page) {
var limit = 50;
var skip = ( page - 1 ) * limit;
var query = {
where: JSON.stringify({
vocabulary: self.get('vocabulary'),
text: {
contains: term
}
}),
limit: limit,
skip: skip,
sort: 'text DESC'
};
return query;
},
results: function (data, page) { // parse the results into the format expected by Select2.
// since we are using custom formatting functions we do not need to alter remote JSON data
var more = data.term.length > 0;
return {
results: data.term,
more: more
};
}
}
Ember.assert("select2 has to exist", Ember.$.fn.select2);
// Ember.assert("select2 needs a content array", self.get('content'));
// Ember.assert("select2 needs a selected array", self.get('selected'));
self._select.select2(options);
Ember.assert("select2 needs an alias name", self.get('alias'));
self._select.on('change', function(e) {
if(!self.get('value')) self.set('value', []);
var value = self.get('value');
if (e.added) {
value.pushObject( store.push('term', e.added) );
} else if(e.removed) {
value.removeObject( store.getById('term', e.removed.id));
}
});
// set selected values
if (this.get('value')) {
var value = this.get('value');
if (value && value.then) {
value.then(function(v){
self._select.select2('data', v.content);
})
} else {
self._select.select2('data', this.get('value').toArray());
}
} else {
this.set('value', []);
}
self._select.on('select2-selecting', function(e){
self.sendAction('getSelection', e);
});
},
willDestroyElement: function (){
this._select.select2('destroy');
},
formatTermResult: function(term) {
return term.text;
},
});