{{ R.jsOnce('steps') }}
{{ R.css('steps') }}


{% set boudoudidadidudu = random(50000) %}
<div class="moussaSteps">
    <div id="save-image-{{ Entity }}{{ boudoudidadidudu }}"
     class="steps-form"
     data-moussabind="moussajax.moussaForm"
     data-url="/admin/crud/save/{{ Entity }}?saveSteps&prefix=step1-image"
     data-url-refresh="/admin/crud/getAll/Media?m2m[{{ Entity}}]={{ EntityId }}&tpl=CropThumb">

    <input type="hidden" name="step1-imagerecropMediaId" id="step1-imagerecropMediaId" value="false"/>
    {#<input id="WorkId" type="hidden" value="{{ work.workId }}" name="WorkId">#}
    <input type="hidden" name="{{ Entity }}Id" value="{{ EntityId }}" />
    <input id="step1-imageh" type="hidden" value="false" name="step1-h">
    <input id="step1-imagew" type="hidden" value="false" name="step1-w">
    <input id="step1-imagex" type="hidden" value="false" name="step1-x">
    <input id="step1-imagey" type="hidden" value="false" name="step1-y">

    <input id="step2-imageh" type="hidden" value="false" name="step2-h">
    <input id="step2-imagew" type="hidden" value="false" name="step2-w">
    <input id="step2-imagex" type="hidden" value="false" name="step2-x">
    <input id="step2-imagey" type="hidden" value="false" name="step2-y">
    <input id="step1-imagetempMediaId" class="step1-imagetempMediaId" type="hidden" value="false" name="step1-imagetempMediaId">


    <button class="btn btn-default btn-warning" aria-label="Left Align" type="button" id="switch-mode" style="display:none">
        <span class="glyphicon glyphicon-retweet" aria-hidden="true"></span> <span class="switch-label">Switch mode</span>
    </button>
    <button class="btn btn-default btn-info" aria-label="Left Align" type="button" id="next-step-img" style="display:none">
        Next step <span class="glyphicon glyphicon-fast-forward" aria-hidden="true"></span>
    </button>
    <button class="btn btn-default btn-success" aria-label="Left Align" data-ajax-form="save-image-{{ Entity }}{{ boudoudidadidudu }}" type="button" id="btn-save-img" style="display:none">
        Save
    </button>
</div>
<br class="clear" />
<span id="info-steps" > </span>
<div id="drop-photo-video-meta" class="border-dashed">
    <div id="" class="crop-size-ref drop-photo-video"  data-moussabind="moussajax.moussaDropnCrop"
         data-url="{{ R.url('ajaxSaveDropImage',{'context' : 'Intranet'}) }}"
         data-getinject="{{ Entity }}Id"
         data-entity="{{ Entity }}"
            {#data-autoSave#}
         data-inputprefix="step1-image"
         class="_border-dashed">

        Drop image
    </div>
</div>


<div class="drag-zone">

    <img style="display: none;width: 878px " src="{{ media.url }}" id='workImg'
         class="cropimg imgToCrop imgToCropArtist"/>





</div>

<p class="text-danger"></p>


<div id="" data-url="{{ R.url('rellIndexAjax') }}"
     class="sortable containervv"
     data-moussabind="moussajax.moussaSortable"
     data-messageTarget="list-works-box" data-placeholder="ui-state-highlight-box" data-item=""
     data-ent1id="{{ EntityId }}"
     data-handle=".drag" data-ent1="{{ Entity }}" data-ent2="Media" >

<br />
    Loading...
<br class="clear" />
<br class="clear" />
    {#{% include '/Intranet/WorkAjax/ajaxLoadWorkPhotoVideo.php.twig' %}#}

</div>

{#<script>#}
    {#$(#}
            {#function(){#}
                {#$.get($('#save-image-{{ Entity }}').data('url-refresh'),function(eee){#}
                    {#$('#toto').html(eee);#}
                    {#hoverDragDel();#}
                {#} );#}
            {#}#}
    {#)#}
{#</script>#}

{#</div>#}
</div>