{% form_theme form 'form/my_theme.html.twig' %}

{% block media_collection_widget %}

{% endblock %}

{% block media_widget %}
   
    	
    	<div id="{{ id }}">
    		<div class="form-group">

    			<label for="{{ id }}_file_file" class="custom-file-label">{{ label }}</label>
    		</div>
    		<div>
    			<img id="{{ id }}_image_view" src="{{ asset(media(data)) }}"  />
				
    			<input onchange="readURL(this, '{{ id }}_image_view');"  style="display: none;"  type="file" id="{{ id }}_file_file" name="{{ full_name  }}[file][file]" class="custom-file-input">
    					
        	</div>

        	<div class="form-group">
						<div class="form-check">        
							<input type="checkbox" id="{{ id }}_file_delete" name="{{ full_name  }}[file][delete]" class="form-check-input" value="1">
        					<label class="form-check-label" for="{{ id }}_file_delete">Delete?</label>
        				</div>
        			</div>
        
        	<input type="hidden" id="{{ id }}_directory" name="{{ full_name  }}[directory]" value="{{ data ? data.directory : '' }}">
    
    </div>

    <script>
    	document.getElementById("{{ id }}_image_view").addEventListener('click', function() {
	    		
			    $("#{{ id }}_file_file").click();
			    return false;
		
		});

    </script>
{% endblock %}