function init_components_tagcloud(input){
if(!input.data("data-component")) {
var html = '
';
var tags = input.data('tags');
for(var key in tags){
var tag = tags[key];
html += '- '+tag.label+'
';
}
html += '
';
var picker = $(html);
input.before(picker);
input.data("data-component",picker);
picker.find('.badge-tag').click(function(){
if(input.attr("readonly") == "readonly") return;
var selected = input.val().split(',');
//Supprimer les valeurs vides
selected = selected.filter(function(e){return e});
var element = $(this);
if(!element.hasClass('active')){
$(this).addClass('active').css({
background : element.attr('data-color'),
color : '#ffffff',
border : '1px solid '+ element.attr('data-color')
});
selected.push(element.attr('data-slug'));
} else {
$(this).removeClass('active').css({
background : '',
color : '',
border : ''
});
var index = selected.indexOf(element.attr('data-slug'));
if(index > -1 ) selected.splice(index, 1);
}
input.val(selected.join(','));
input.trigger('change').trigger('click');
});
if(input.parent().hasClass("input-group")){
input.parent().after(input.detach());
input.before('');
}
input.addClass('hidden');
}else{
picker = input.data("data-component");
}
//Si le champ input est ré-rempli, on met a jour les tags
if(input.val()!=''){
var selected = input.val().split(',');
for(var key in selected){
var tag = selected[key];
var tagElement = picker.find('.badge-tag[data-slug="'+tag+'"]');
tagElement.addClass('active').css({
background : tagElement.attr('data-color'),
color : '#ffffff',
border : '1px solid '+ tagElement.attr('data-color')
});
}
}
}