JS Giulian

(function($){

    var textoTemplate = '<div class="texto" style="display: none;"><input type="text" class="" /></div>',
        optionsTemplate = '<option value="&&&&" >$$$$$</option>',
        selectTemplate = '<select name="$$$$" id="%%%%%">%%options%%</select>';

    var convertirEnSelector = function( elementos ) {
        $( elementos ).each(function( index, item ) {
            var vcgroup = $( item ).find( '.vpc-group' ), component_id = $( item ).data('component_id');
            $( vpc.config.components ).each( function( index2, item2 ){
                if ( item2.component_id == component_id ) {
                    var options = '', name = item2.cname;

                    // var optionsArray = item2.options;
                    //
                    // optionsArray = $.map(optionsArray, function(value, index) {
                    //  return [value];
                    // });
                    var optionsVisible = vcgroup.find( '.vpc-single-option-wrap' ) ;
                    for ( i = 0; optionsVisible.length > i; i++) {
                        if ( ! $(optionsVisible[i]).attr('style') || $(optionsVisible[i]).css('display') != 'none' ) {
                            var item = $(optionsVisible[i]).find('input');
                            item.hide();
                            options += optionsTemplate.replace('&&&&', item.attr('id')).replace('$$$$$', item.attr('value'));
                        }
                    }

                    vcgroup.find ('> div').hide();
                    var id = 'select' + Math.random().toString(36).substr(2);
                    vcgroup.find('select').remove();
                    vcgroup.append ( selectTemplate.replace( '$$$$', name ).replace( '%%options%%', options ).replace( '%%%%%', id ) );

                    $( '#' + id ).unbind().change( function() {
                        $('[data-oid="'+ $(this).val() +'"]').click();
                        vcgroup.find ( '> div' ).hide();
                    });
                }
            });
        });
    };

    var introducirTexto = function ( elementos ) {
        $( elementos ).each(function( index, item ){
            var vcgroup = $( item ).parent().parent();
            if ( ! vcgroup.find('.texto').length ) {
                vcgroup.append( textoTemplate );
            }
        });
    };

    $(document).ready(function(){
        var elementosASelectores = $('[data-campo1="si"]:visible');
        convertirEnSelector ( elementosASelectores );

        var elementosConTexto = $('[data-campo1="no"]').find('input[data-campo2="si"]');
        introducirTexto ( elementosConTexto );

        $('[data-campo1="no"]').find('input[data-campo2]').click(function(){
            if ( $(this).data('campo2') === 'si' ) {
                $(this).parent().parent().find('.texto').show();
            }else{
                $(this).parent().parent().find('.texto').hide();
            }
        });

        $('[data-campo1="si"]').click(function(ev) {
            var that = $(this);
            var updateSelectors = function( el ) {
                if ($(el).find( '.vpc-single-option-wrap:visible' ).length > 0) {
                    convertirEnSelector ( $(el) );
                }
            };
            setTimeout(function () {
                // updateSelectors(that);
            }, 50);
            // if ( ! ($(that).find('.vpc-options').is(':visible') ) ){
            //
            // }else{
            //  updateSelectors(that);
            // }
        });
    });
})(jQuery);