## -*- coding: utf_8 -*-
<form id="imageCroper_form" enctype="multipart/form-data" method="post" onsubmit="return FC.imageCropper.saveAndCrop(this);" style="font-size:.8em;text-align:center;">
    <!-- hidden crop params -->
    <input type="hidden" id="x1" name="x1" />
    <input type="hidden" id="y1" name="y1" />
    <input type="hidden" id="x2" name="x2" />
    <input type="hidden" id="y2" name="y2" />
    <div id="uploadarea">
    <br /><div>Step1: Please select image.</div><br />
    <div><input type="file" name="image_file" id="image_file" onchange="fileSelectHandler()" size="50px" /></div>
    </div><br />
    <div class="error"></div>
    <div class="step2">
        <div>Step2: Select a crop region, then click 'Upload'.</div><br />
        <img id="preview" />
        <div class="info">
            <label>Cropped Width:</label> <span id="w" name="w" style="padding-right:15px;">0</span>
            <label>Cropped Height:</label> <span id="h" name="h" style="padding-right:15px;">0</span><br /><br />
            <div class='fc-progress'><span class='fc-fill blue'></span></div>
	        <input type="button" onclick="$('#imageCroper_form').submit();" value="Upload" />&nbsp;&nbsp;&nbsp;<input type="button" onclick="return FC.imageCropper.closeUploadDialog();" value="Cancel" />
        </div>

    </div>
</form>