{% extends '@MauticCore/Default/content.html.twig' %}
{% set header = (activeAsset.getId()) ? 'mautic.asset.asset.menu.edit'|trans({'%name%' : activeAsset.getTitle()}) :
    'mautic.asset.asset.menu.new'|trans %}
{% block headerTitle %}{{ header }}{% endblock %}
{% block mauticContent %}asset{% endblock %}
{% block content %}
<script>
	mauticAssetUploadEndpoint = "{{ uploadEndpoint }}";
	mauticAssetUploadMaxSize = {{ maxSize }};
	mauticAssetUploadMaxSizeError = "{{ maxSizeError }}";
	mauticAssetUploadExtensions = "{{ extensions }}";
	mauticAssetUploadExtensionError = "{{ extensionError }}";
</script>
{{ form_start(form) }}
<!-- start: box layout -->
<div class="box-layout">
    <!-- container -->
    <div class="col-md-9 height-auto bdr-r">
        <div class="pa-md">
	        <div class="row">
		        <div class="col-md-6">
					<div class="col-md-7 pl-0">
						{{ form_row(form.storageLocation) }}
					</div>
			        <div class="text-left mt-lg mb-lg{% if startOnLocal %}  hide {% endif %}" id="remote-button">
						{% if integrations %}
							{% include '@MauticCore/Helper/button.html.twig' with {
								buttons: [
									{
										href: path('mautic_asset_remote') ~ '?tmpl=modal',
										icon: 'ri-file-search-line',
										label: 'mautic.asset.remote.file.browse',
										size: 'sm',
										spin: true,
										variant: 'tertiary',
										attributes: {
											'data-toggle': 'ajaxmodal',
											'data-target': '#RemoteFileModal',
											'data-header': 'mautic.asset.remote.file.browse'|trans,
											'role': 'button'
										}
									}
								]
							} %}
						{% endif %}
					</div>
			        <div id="storage-local"{% if not startOnLocal %} class="hide"{% endif %}>
				        <div class="row">
					        <div class="form-group col-xs-12 ">
								{{ form_label(form.tempName) }}
								{{ form_widget(form.tempName) }}
								{{ form_errors(form.tempName) }}
						        <div class="help-block mdropzone-error"></div>
						        <div class="mdropzone text-center" id="dropzone">
						        	<div class="dz-message">
						        		{% trans %}mautic.asset.drop.file.here{% endtrans %}</h4>
									</div>
						        </div>
					        </div>
				        </div>
			        </div>
			        <div id="storage-remote"{% if startOnLocal %} class="hide"{% endif %}>
						{{ form_row(form.remotePath) }}
			        </div>
		    	</div>
		    	<div class="col-md-6">
		    		<div class="row">
				    	<div class="form-group col-xs-12 preview">
				    		{{- include('@MauticAsset/Asset/preview.html.twig', {
								'activeAsset' : activeAsset,
								'assetDownloadUrl' : url('mautic_asset_action',
                                {'objectAction' : 'preview', 'objectId' : activeAsset.getId()}
                            )}) -}}
			    		</div>
		    		</div>
		    	</div>
		    </div>
		    <div class="row">
				<div class="col-md-6">
					{{ form_row(form.title) }}
				</div>
				<div class="col-md-6">
					{{ form_row(form.alias) }}
				</div>
			</div>
            <div class="row">
                <div class="col-xs-12">
					{{ form_row(form.description) }}
                </div>
            </div>
		</div>
	</div>
 	<div class="col-md-3 height-auto">
		<div class="pr-lg pl-lg pt-md pb-md">
			{{ form_row(form.category) }}
			{{ form_row(form.language) }}
			{{ form_row(form.isPublished, {
				'attr': {
					'data-none': 'mautic.core.form.unavailable_regardless_of_scheduling',
					'data-start': 'mautic.core.form.available_on_scheduled_date',
					'data-both': 'mautic.core.form.available_during_scheduled_period',
					'data-end': 'mautic.core.form.available_until_scheduled_end'
				}
			}) }}
			{{ form_row(form.publishUp, {'label': 'mautic.core.form.available.available_from'}) }}
    		{{ form_row(form.publishDown, {'label': 'mautic.core.form.available.unavailable_from'}) }}
			{{ form_row(form.disallow) }}
		</div>
	</div>
</div>
{{ form_end(form) }}

{% if integrations %}
	{{- include('@MauticCore/Helper/modal.html.twig', {
        'id'            : 'RemoteFileModal',
        'size'          : 'lg',
        'footerButtons' : true,
	}) -}}
{% endif %}

{% endblock %}