Fakultas Ilmu Komputer UI

Commit b8f2b16e authored by Josh Sudung's avatar Josh Sudung
Browse files

Merge branch '1706039824-61' into 'master'

[#61] Material: Upload Confirmation

Closes #61

See merge request !84
parents 48451211 0eba22b8
Pipeline #60038 passed with stages
in 32 minutes and 6 seconds
......@@ -24,6 +24,7 @@
<!-- Custom styles for this page -->
<link href="{% static 'vendor/datatables/dataTables.bootstrap4.min.css' %}" rel="stylesheet">
{% block stylesheets %}{% endblock %}
{% block scripts %}{% endblock %}
</head>
<body id="page-top" style="font-family: 'Poppins', sans-serif;">
......
......@@ -5,6 +5,10 @@
<title>Unggah Materi | Digipus</title>
{% endblock %}
{% block scripts %}
<script src="{% static 'js/upload-preview.js' %}"></script>
{% endblock %}
{% block content %}
<div class="container">
<div class="col-20">
......@@ -36,6 +40,17 @@
{% if field.help_text %}
<p class="help">{{ field.help_text|safe }}</p>
{% endif %}
{% if field.name == 'cover' %}
<div hidden id="frame_cover_parent" class="my-3">
<div class="mb-2">Preview Cover:</div>
<img id="frame_cover" class="constraint-frame" alt="Cover Preview" />
</div>
{% elif field.name == 'content' %}
<div hidden id="frame_content_parent" class="my-3">
<div class="mb-2">Preview Content:</div>
<embed id="frame_content" width="550px" height="550px" />
</div>
{% endif %}
</div>
</div>
{% endfor %}
......
......@@ -117,4 +117,9 @@
.margin-content {
margin: 0;
padding: 0;
}
.constraint-frame {
max-width: 550px;
max-height: 550px;
}
\ No newline at end of file
window.onload = () => {
document.querySelector('input[name="cover"]').setAttribute("onchange", "preview('frame_cover')");
document.querySelector('input[name="content"]').setAttribute("onchange", "preview('frame_content')");
}
const preview = (elementClass) => {
let frame = document.getElementById(elementClass);
let frameParent = document.getElementById(`${elementClass}_parent`);
// Embed elements need to be recreated on source change
if (frame.nodeName.toLowerCase() === 'embed') {
frameParent.removeChild(frame);
frameParent.insertAdjacentHTML(
'beforeend',
'<embed id="frame_content" width="550px" height="550px" />'
);
frame = document.getElementById(elementClass);
}
frame.src = URL.createObjectURL(event.target.files[0]);
frameParent.removeAttribute('hidden');
}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment