Skip to content
Permalink
Fetching contributors…
Cannot retrieve contributors at this time
54 lines (43 sloc) 1.81 KB
<h2 id="#direct-upload-using-uppy">Direct upload using uppy (<a href="https://uppy.io/" target="_blank" rel="noopener">uppy.io</a>)</h2>
{% assign profile = form.fields.profiles.developer %}
{% assign avatar = profile.custom_images.avatar %}
{% assign image_s3_upload = avatar.image.s3_upload %}
<form hidden action="{{ image_s3_upload.direct_upload_url }}" data-s3-uppy="form">
{% for input in image_s3_upload.form_data %}
<input type="hidden" name="{{ input[0] }}" value="{{ input[1] }}">
{% endfor %}
</form>
<div class="row">
<div class="col-5">
<div class="card">
<div class="card-body">
<div id="drag-drop-area"></div>
</div>
</div>
</div>
<div class="col-7">
<div class="card">
<div class="card-body">
<p>Uppy plugins used:</p>
<ol>
<li>Dashboard</li>
<li>DragDrop</li>
<li>GoldenRetriever</li>
<li>AwsS3</li>
</ol>
<hr>
<p>Source code of this example: <a href="https://github.com/mdyd-dev/marketplace-nearme-example/blob/master/modules/direct_s3_upload/public/assets/Uppy.js" target="_blank">JS</a>, <a href="https://github.com/mdyd-dev/marketplace-nearme-example/blob/master/modules/direct_s3_upload/public/views/partials/uppy.liquid" target="_blank">HTML</a></p>
<hr>
<p>URLs to uploaded files:</p>
<small>
<ol data-s3-uppy="log"></ol>
</small>
</div>
</div>
</div>
</div>
{% content_for "head:bottom" %}
<link rel="stylesheet" href="https://cdn.jsdelivr.net/combine/npm/@uppy/core@1.4.0/dist/style.min.css,npm/@uppy/dashboard@1.3.0/dist/style.min.css">
<script src="https://transloadit.edgly.net/releases/uppy/v1.4.0/uppy.min.js" defer></script>
<script src="{{ 'modules/direct_s3_upload/Uppy.js' | asset_url }}" defer></script>
{% endcontent_for %}
You can’t perform that action at this time.