( function( $ ) {

  function blmCustomizer( customizerId, selector, property, type='null', unit='null' ){
  	  wp.customize( customizerId , function( value ) {
	    value.bind( function( new_value ) {
	    	if ( typeof new_value == 'object' ) {
	    		if (type === 'typography') {
	    			$( selector ).css( {
	    				'fontSize' : new_value['font-size']+'px',
	    				'fontFamily' : new_value['font-family'],
	    				'fontWeight' : new_value['font-weight'],
	    				'fontStyle' : new_value['font-style'],
	    			} );
	    		}else {
	    			$( selector ).css( { [property] : new_value.top+'px'+ ' '+new_value.left+'px' });
	    		}
	    	}else {
	    		if ( unit === 'px' ) {
	    			$( selector ).css( { [property] : new_value+'px' });
	    			console.log(new_value);
	    		}else {
	    			$( selector ).css( { [property] : new_value });
	    			console.log(new_value);
	    		}
	    	}
	    });
	  });
  }

  // nav bg 
  blmCustomizer( 'blm_customizer[nav_bg]', '.main-nav', 'background', 5 );
  // nav item
  blmCustomizer( 'blm_customizer[nav_color]', '#primary-menu li a', 'color', 5 );
  blmCustomizer( 'blm_customizer[nav_padding]', '#primary-menu li a', 'padding', 5 );
  blmCustomizer( 'blm_customizer[nav_typo]', '#primary-menu li a', 'typo', 'typography' , 5 );

  // search icon 
  blmCustomizer( 'blm_customizer[search_icon_color]', '.search-icon', 'color', 5 );
  blmCustomizer( 'blm_customizer[search_icon_lheight]', '.search-icon', 'lineHeight', 5 );
  blmCustomizer( 'blm_customizer[search_icon_size]', '.search-icon', 'fontSize', null, 'px', 5 );


})(jQuery);