var $blocks;
var $pos = 0;

$(window).on('load',function(){
    
    
    $("#Scripts").find(".card-body" ).wrapInner( "<div class='blocks-script' data-pos='0'></div>" );    
    
    $select = $(".blocks-script").last().find("select");
    if ($select.data('select2'))
        {       
            $select.select2("destroy") 
                    .removeAttr('data-live-search')
                    .removeAttr('data-select2-id')
                    .removeAttr('aria-hidden')
                    .removeAttr('tabindex')
                    .trigger('change')
                    .find('option')
                    .removeAttr('data-select2-id');
        }
        
    
    $("#Scripts").find(".card-body" ).append( '<button type="button" class="btn btn-primary float-right" id="btn_add_script">Adicionar Script</button>' );   

    config_inputs_scripts($("#Scripts"));
    
});

$(document).on('click','#btn_add_script',function(){
    
    /*$('select').each(function(index,key){
       // console.log($(this).data('select2'))
       if ($(this).data('select2'))
        {       
            $(this).select2("destroy");
        }
    });*/
    
    /*$select = $(".blocks-script").last().find("select");
    if ($select.data('select2'))
        {       
            $select.select2("destroy")
                    .removeAttr('data-live-search')
                    .removeAttr('data-select2-id')
                    .removeAttr('aria-hidden')
                    .removeAttr('tabindex')
                    .trigger('change');
        }*/
    
    //$('.blocks-script').last().css('background-color','red')
    
    //console.log($blocks);
    
    $clone = $($blocks);//$('.blocks-script').last().clone();
    
    //$clone.find('select').select2("destroy");
    
    $pos = $pos+1;
    
    $clone.attr('data-pos',$pos); 
    
    //$clone.css('background-color','red');
    
    //$clone.find('select').attr("data-select2-id","field-posicao-"+newPos);
    
    //$clone.find('select').select2({ width: '100%' });
    
    console.log("V");
    console.log($pos);
    
    config_cloned_scripts($clone,$pos);
    
    //data-select2-id="field-posicao"
    
    
    
    
    //$(clone).find('select').select2("destroy");  
    
    //$(".blocks-script").last().clone();
    
    //clone.select2({ width: '100%' });
    
    /*if ($element.find('select').data('select2'))
            {
                $element.find('select').select2("destroy");    
            }*/
    
    //clone.find("select").select2("destroy");
    
    //alert('a')
    
});

function config_inputs_scripts($element)
{
   // $("#Scripts").find(".card-body" ).find('select').attr('data-select2-id','select2-0');
    
    $element.find(".card-body" ).find('textarea,input,select').each(function(index,key){
       
       //console.log(key['name']);
       $(this).attr('data-name',key['name']); // .data-name // .prop (data-name) 
       //console.log($(this).data('name'));
       
       key['data-name'] = key['name'];
       
       key['name'] = key['name']+'[0]';
       key['id'] = "select-posicao-0";
       
       
       $(this).val(null);
       if(key.tagName == 'SELECT')
       {
           key['name'] = 'posicao[0]';
           
            //$(this).removeAttr('data-select2-id');
            
            //$(this).trigger("change");
           
            //$(this).select2("destroy");

            //$(this).select2({ width: '100%' });
            
       
       }
    });
    
    $blocks = $element.find(".blocks-script").prop("outerHTML");
    
    //console.log($blocks);
    
    $select.select2({ width: '100%' });
}

function config_cloned_scripts($element,pos)
{
    /*if ($element.find('select').data('select2'))
    {
        $element.find('select').select2("destroy"); 
        
    console.log('aqui')
    }*/
    //$element.find('select').attr('data-select2-id','select2-'+pos);
    //$element.find('select').css('background-color',"pink");///.data('select2-id',pos);
    //$element.find(".card-body" ).find('select').data('name',"script-"+pos);
    
    $element.find('textarea,input,select').each(function(index,key){
       
       //console.log(key['data-name'],$(this).data('name'));
       
       key['id'] = key['data-name'] = key['name'] = $(this).data('name')+'['+pos+']' ;
       
       //key['id'] = "select-script-"+pos;
       
       $(this).val(null);
       
       //$(this).css( "color", "red" );
       
       if(key.tagName == 'SELECT')
       {
           
           key['id'] = key['data-name'] = key['name'] = 'posicao['+pos+']' ;
           
           //$(this).removeData('select2-id');
           //$(this).removeData('name');
           
            //$(this).data('select2-id','field-posicao-'+pos-1);
           
            //console.log($('#'+key['id']))
           
            //$('#'+key['id']).select2("destroy");

            //$element.find('select')
            
            //if ($element.find('select').data('select2'))
            //{
                //console.log($element.find('select').data('select2'))
                // tá entrnado
                //$element.find('select').select2("destroy");    
            //}
            
            
            
            //$('select').select2({ width: '100%' }); //
            //$(this).select2({ width: '100%' });
       }
    });
    
    $("#Scripts").find(".card-body" ).find(".blocks-script").last().after($element);
    
    //$('select').each(function(index,key){
      // $('.chosen-select').select2({ width: '100%', multiple: true, maximumSelectionLength: 1 });
    //});
    
    //$('select').select2("destroy");
    $('.chosen-select').each(function(index,key){
        $(this).delay(500).select2({ width: '100%' }).trigger('change');
    });
    //$element.insertBefore();
}