component.js 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. function init_components_tagcloud(input){
  2. if(!input.data("data-component")) {
  3. var html = '<ul class="data-type-tagcloud" data-source="'+input.attr('id')+'">';
  4. var tags = input.data('tags');
  5. for(var key in tags){
  6. var tag = tags[key];
  7. html += '<li><span class="badge badge-tag" data-slug="'+key+'" data-color="'+tag.color+'"><i class="'+tag.icon+'"></i> '+tag.label+'</span></li>';
  8. }
  9. html += '</ul>';
  10. var picker = $(html);
  11. input.before(picker);
  12. input.data("data-component",picker);
  13. picker.find('.badge-tag').click(function(){
  14. if(input.attr("readonly") == "readonly") return;
  15. var selected = input.val().split(',');
  16. //Supprimer les valeurs vides
  17. selected = selected.filter(function(e){return e});
  18. var element = $(this);
  19. if(!element.hasClass('active')){
  20. $(this).addClass('active').css({
  21. background : element.attr('data-color'),
  22. color : '#ffffff',
  23. border : '1px solid '+ element.attr('data-color')
  24. });
  25. selected.push(element.attr('data-slug'));
  26. } else {
  27. $(this).removeClass('active').css({
  28. background : '',
  29. color : '',
  30. border : ''
  31. });
  32. var index = selected.indexOf(element.attr('data-slug'));
  33. if(index > -1 ) selected.splice(index, 1);
  34. }
  35. input.val(selected.join(','));
  36. input.trigger('change').trigger('click');
  37. });
  38. if(input.parent().hasClass("input-group")){
  39. input.parent().after(input.detach());
  40. input.before('<div id="business-anchor" class="dropdown-anchor"></div>');
  41. }
  42. input.addClass('hidden');
  43. }else{
  44. picker = input.data("data-component");
  45. }
  46. //Si le champ input est ré-rempli, on met a jour les tags
  47. if(input.val()!=''){
  48. var selected = input.val().split(',');
  49. for(var key in selected){
  50. var tag = selected[key];
  51. var tagElement = picker.find('.badge-tag[data-slug="'+tag+'"]');
  52. tagElement.addClass('active').css({
  53. background : tagElement.attr('data-color'),
  54. color : '#ffffff',
  55. border : '1px solid '+ tagElement.attr('data-color')
  56. });
  57. }
  58. }
  59. }