portal-oddajanje-solar/templates/solar-oddaja.html

465 lines
20 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Portal za oddajanje besedil</title>
2021-11-16 17:45:20 +00:00
<link rel="stylesheet" href="/static/css/header.css" type="text/css">
<link rel="stylesheet" href="/static/css/form.css" type="text/css">
<link rel="stylesheet" href="/static/css/simple-grid.css" type="text/css">
<link rel="stylesheet" href="/static/css/utils.css" type="text/css">
</head>
<body>
2021-11-16 17:45:20 +00:00
<header>
<div class="logo"><a href="/"><img src="/static/image/logo-white.svg"/></a></div>
<div class="menu-items">
<a href="../logout">Odjava</a>
{% if is_institution_coordinator %}
<a href="../manage-institution">Upravljaj z institucijo</a>
{% endif %}
{% if is_admin %}
<a href="../admin">Administracijski meni</a>
{% endif %}
2021-12-13 20:01:28 +00:00
<a href="https://slovenscina.eu/" target="_blank">Več informacij</a>
2021-11-16 17:45:20 +00:00
</div>
</header>
<div class="container" style="margin-top:8rem;">
<div class="row">
<div class="col-12">
2021-12-15 20:23:26 +00:00
<h1 class="title">Korpus Šolar</h1>
2021-12-13 20:01:28 +00:00
<p class="subtitle">Prosimo, določite podatke o besedilih, ki jih želite oddati, in nato naložite besedila. Če oddajate besedila, ki so nastala v različnih razredih, se razlikujejo glede učiteljskih popravkov in podobno, jih oddajte v ločenih paketih.</p>
2021-11-16 17:45:20 +00:00
<div class="tab-nav">
2021-12-13 20:01:28 +00:00
<a href="/oddaja" class="active">Oddaja besedil</a>
<a href="/zgodovina">Zgodovina sodelovanja</a>
<a href="/pogodbe">Ekipa</a>
2021-11-16 17:45:20 +00:00
</div>
</div>
</div>
<div class="row">
<div class="col-6">
{% if not institution %}
<div class="alert">
<img src="/static/image/alert.svg" alt="alert"/>
<p>Niste član nobene institucije!</p>
</div>
{% elif not institution_contract %}
<div class="alert">
<img src="/static/image/alert.svg" alt="alert"/>
<p>Pogodba s šolo še ni naložena!</p>
</div>
{% endif %}
<div class="alert" id="error-message">
<img src="/static/image/alert.svg" alt="alert"/>
<p></p>
</div>
2021-12-15 20:23:26 +00:00
<div class="alert alert-success" id="success-message">
<img src="/static/image/success.svg" alt="alert"/>
<p></p>
</div>
2021-11-16 17:45:20 +00:00
</div>
</div>
<form id="form-oddaja">
<div class="row">
<div class="col-6">
<div class="form-wrapper">
2021-12-20 10:15:01 +00:00
<label for="regija">Regija</label>
<select id="regija" name="regija">
<option value="CE" selected="selected">Celje (CE)</option>
<option value="GO">Nova Gorica (GO)</option>
<option value="KK">Krško (KK)</option>
<option value="KP">Koper (KP)</option>
<option value="KR">Kranj (KR)</option>
<option value="LJ">Ljubljana (LJ)</option>
<option value="MB">Maribor (MB)</option>
<option value="MS">Murska Sobota (MS)</option>
<option value="NM">Novo Mesto (NM)</option>
<option value="PO">Postojna (PO)</option>
<option value="SG">Slovenj Gradec (SG)</option>
</select>
</div>
</div>
<div class="col-6">
<p></p>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<label for="program">Program</label>
2021-11-16 17:45:20 +00:00
<select id="program" name="program">
<option value="OS" selected="selected">Osnovnošolski (OŠ)</option>
<option value="SSG">Splošna in strokovna gimnazija (SGG)</option>
<option value="MGP">Mednarodni gimnazijski programi (MGP)</option>
<option value="ZG">Zasebne gimnazije (ZG)</option>
<option value="NPI">Nižje poklicno izobraževanje (NPI)</option>
<option value="SPI">Srednje poklicno izobraževanje (SPI)</option>
<option value="SSI">Srednje strokovno izobraževanje (SSI)</option>
2021-12-20 10:15:01 +00:00
<option value="PTI">Poklicno-tehniško izobraževanje (PTI)</option>
2021-11-16 17:45:20 +00:00
</select>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p></p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<label for="predmet">Predmet</label>
<select id="predmet" name="predmet">
2021-12-20 10:15:01 +00:00
<option value="SLO" selected="selected">Slovenščina (SLO)</option>
<option value="DJP">Drugi jezikoslovni predmeti (vtipkajte ime predmeta) (DJP)</option>
<option value="DDP">Drugi družboslovni predmeti (vtipkajte ime predmeta) (DDP)</option>
<option value="DNP">Drugi naravoslovni predmeti (vtipkajte ime predmeta) (DNP)</option>
<option value="DSP">Drugi strokovni predmeti (vtipkajte ime predmeta) (DSP)</option>
<option value="DIP">Drugi izbirni ali dodatni predmeti (vtipkajte ime predmeta) (DIP)</option>
2021-11-16 17:45:20 +00:00
</select>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p></p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row set-open-transition">
<div class="col-6">
<div class="form-wrapper" id="predmet-custom-box">
<label for="predmet-custom">Ime predmeta:</label>
<input type="text" id="predmet-custom" name="predmet-custom"/>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p></p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<label for="letnik">Letnik</label>
<select id="letnik" name="letnik">
<option value="1" selected="selected">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
</select>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p></p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper" >
<label for="vrsta">Vrsta besedila</label>
<select id="vrsta" name="vrsta">
2021-12-20 10:15:01 +00:00
<option value="E" selected="selected">Esej ali spis (E)</option>
<option value="PB">Praktično besedilo (npr. vabila, prošnje ipd. pri pouku slovenščine), napisano za oceno (PB)</option>
<option value="T">Šolski test (T)</option>
<option value="R">Delo v razredu, ne za oceno (vtipkajte besedilo vrsto) (R)</option>
2021-11-16 17:45:20 +00:00
</select>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p></p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row set-open-transition">
<div class="col-6">
<div class="form-wrapper" id="vrsta-custom-box">
<label for="vrsta-custom">Vtipkajte besedilno vrsto:</label>
<input type="text" id="vrsta-custom" name="vrsta-custom"/>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p></p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<label for="solsko-leto">Šolsko leto</label>
<select id="solsko-leto" name="solsko-leto">
<option value="20-21" selected="selected">2020/21</option>
<option value="21-22">2021/22</option>
</select>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p></p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<label for="jezikovni-popravki">Jezikovni popravki</label>
<select id="jezikovni-popravki" name="jezikovni-popravki">
2021-12-20 10:15:01 +00:00
<option value="DD" selected="selected">Besedilo vsebuje učiteljske popravke in strinjam se z njihovo vključitvijo v korpus. (DD)</option>
<option value="N">Besedilo ne vsebuje učiteljskih popravkov. (N)</option>
<option value="DN">Besedilo vsebuje učiteljske popravke in ne strinjam se z njihovo vključitvijo v korpus. (DN)</option>
2021-11-16 17:45:20 +00:00
</select>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p></p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<div id="dropzone-previews" class="dropzone-previews"></div>
</div>
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
<label for="jezikovni-popravki">Datoteka</label>
<div id="my-dropzone" class="dropzone"></div>
</div>
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p>Oddate lahko eno ali (hkrati) več besedil, ki ustrezajo izbranim podatkom. Sprejemljivi formati so: txt, doc, docx, pdf, jpg in png.</p>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="row">
<div class="col-6">
<div class="form-wrapper">
2021-12-15 20:23:26 +00:00
<button id="button-submit" type="button" class="btn">Oddaj</button>
2021-11-16 17:45:20 +00:00
</div>
</div>
<div class="col-6">
</div>
</div>
<div class="row submit-alert" id="data-confirm-notification">
<div class="col-6">
2021-12-15 20:23:26 +00:00
<button id="button-submit-final" type="button" class="btn">Potrdi in oddaj</button>
2021-11-16 17:45:20 +00:00
</div>
<div class="col-6">
2021-12-13 20:01:28 +00:00
<p>Prosimo, preverite, če so vneseni podatki ustrezni in besedila prava. Naknadno spreminjanje ne bo več mogoče.</p>
2021-11-16 17:45:20 +00:00
</div>
</div>
</form>
</div>
2021-05-05 12:26:26 +00:00
<!--{{ dropzone.load_js() }}-->
<script src="/static/dropzone.js"></script>
<script>
/////////////////////////
// Dropzone //
/////////////////////////
var selectPredmet = document.getElementById("predmet");
var selectVrsta = document.getElementById("vrsta");
var btnSubmit = document.getElementById("button-submit");
var btnSubmitFinal = document.getElementById("button-submit-final");
var btnSubmitCancel = document.getElementById("button-submit-cancel");
var elemTermsPopup = document.getElementById("popup-terms");
var termsScrollbox = document.getElementById("popup-terms-text");
var dataConfirmNotification = document.getElementById("data-confirm-notification");
2021-11-16 17:45:20 +00:00
var errorMessage = document.getElementById("error-message");
2021-12-15 20:23:26 +00:00
var successMessage = document.getElementById("success-message");
2021-11-16 17:45:20 +00:00
var form = document.forms["form-oddaja"];
2021-09-16 15:25:20 +00:00
{% if not institution %}
2021-11-26 12:50:32 +00:00
btnSubmit.disabled = true;
2021-09-16 15:25:20 +00:00
{% endif %}
function isEmptyOrSpaces(str){
return str == null || str.match(/^ *$/) !== null;
}
2021-11-16 17:45:20 +00:00
function showError(str) {
errorMessage.querySelector("p").textContent = str;
errorMessage.style.display = "block";
window.scroll({
top: 0,
behavior: 'smooth'
});
}
2021-12-15 20:23:26 +00:00
function showSuccess(str) {
successMessage.querySelector("p").textContent = str;
successMessage.style.display = "block";
window.scroll({
top: 0,
behavior: 'smooth'
});
}
2021-11-16 17:45:20 +00:00
//onready
selectPredmet.addEventListener("change", function(e) {
var predmetCustomBox = document.getElementById("predmet-custom-box").closest('.row');
2021-12-20 10:15:01 +00:00
if (selectPredmet.value.startsWith("D")) {
2021-11-16 17:45:20 +00:00
predmetCustomBox.style.maxHeight = "150px";
} else {
predmetCustomBox.style.maxHeight = "0px";
}
});
selectVrsta.addEventListener("change", function(e) {
var vrstaCustomBox = document.getElementById("vrsta-custom-box").closest('.row');
2021-12-20 10:15:01 +00:00
if (selectVrsta.value == "R") {
2021-11-16 17:45:20 +00:00
vrstaCustomBox.style.maxHeight = "150px";
} else {
vrstaCustomBox.style.maxHeight = "0px";
}
});
var event = new CustomEvent("change");
selectPredmet.dispatchEvent(event);
selectVrsta.dispatchEvent(event);
Dropzone.options.myDropzone = { // The camelized version of the ID of the form element
2021-10-12 09:11:37 +00:00
url: "../upload",
autoProcessQueue: false,
uploadMultiple: true,
parallelUploads: 20,
paramName: "file", // The name that will be used to transfer the file
maxFilesize: 1000, // MB
2021-05-27 07:29:32 +00:00
timeout: 5000000, // milliseconds
2021-11-16 17:45:20 +00:00
acceptedFiles: ".txt, .csv, .pdf, .doc, .docx, .xls, .xlsx, .ppt, .pptx, .jpg, .jpeg, .png, .mkv",
maxFiles: 20,
2021-11-16 17:45:20 +00:00
previewsContainer: "#dropzone-previews",
2021-12-13 20:01:28 +00:00
dictDefaultMessage: "Kliknite to polje ali povlecite datoteke vanj.",
dictFallbackMessage: "Vaš brskalnik ne podpira izbiranje datotek z odlaganjem (\"drag & drop\").",
dictInvalidFileType: "Datoteka je napačnega formata.",
dictFileTooBig: "Datoteke je prevelika {{filesize}}. Največja dovoljena velikost: {{maxFilesize}}MiB.",
dictResponseError: "Napaka strežnika: {{statusCode}}",
dictMaxFilesExceeded: "Ne morete naložiti več datotek.",
2021-12-13 20:01:28 +00:00
dictCancelUpload: "",
dictRemoveFile: "",
dictCancelUploadConfirmation: "Ali res želite odstraniti to datoteko?",
dictUploadCanceled: "Prenos prekinjen",
2021-12-13 20:01:28 +00:00
addRemoveLinks: true,
// The setting up of the dropzone
init: function() {
var dz = this;
2021-11-16 17:45:20 +00:00
dataConfirmNotification.style.display = "none";
errorMessage.style.display = "none";
2021-12-15 20:23:26 +00:00
successMessage.style.display = "none";
btnSubmit.addEventListener("click", function(e) {
// Make sure that the form isn't actually being sent.
e.preventDefault();
e.stopPropagation();
// Check form validity.
2021-12-20 10:15:01 +00:00
var regija = form["regija"].value;
var program = form["program"].value;
var predmet = form["predmet"].value;
var predmetCustom = form["predmet-custom"].value;
var letnik = form["letnik"].value;
var vrsta = form["vrsta"].value;
var vrstaCustom = form["vrsta-custom"].value;
var solskoLeto = form["solsko-leto"].value;
var jezikovniPopravki = form["jezikovni-popravki"].value;
2021-12-20 10:15:01 +00:00
if (predmet.startsWith("D") && isEmptyOrSpaces(predmetCustom)) {
2021-11-16 17:45:20 +00:00
showError("Polje za predmet ne more biti prazno!");
2021-12-20 10:15:01 +00:00
} else if (vrsta === "R" && isEmptyOrSpaces(vrstaCustom)) {
2021-11-16 17:45:20 +00:00
showError("Polje za vrsto besedila ne more biti prazno!");
} else if (dataConfirmNotification.style.display == "none") {
dataConfirmNotification.style.display = "inherit";
2021-11-16 17:45:20 +00:00
btnSubmit.style.display = "none";
} else {
2021-09-16 15:25:20 +00:00
// Hand off data to dropzone
2021-12-13 20:01:28 +00:00
//dz.processQueue();
2021-09-16 15:25:20 +00:00
// Clear fields and hide popup agian
dataConfirmNotification.style.display = "none";
btnSubmit.textContent = "Oddaj";
2021-12-15 20:23:26 +00:00
//form.reset();
}
});
2021-05-24 08:15:54 +00:00
// First change the button to actually tell dropzone to process the queue.
btnSubmitFinal.addEventListener("click", function(e) {
// Hand off data to dropzone
dz.processQueue();
});
2021-11-26 12:50:32 +00:00
// Listen to the sendingmultiple event. In this case, it's the sendingmultiple event instead
// of the sending event because uploadMultiple is set to true.
2021-11-26 12:50:32 +00:00
this.on("sendingmultiple", function() {
// Gets triggered when the form is actually being sent.
// Hide the success button or the complete form.
});
this.on("successmultiple", function(files, response) {
2021-12-15 20:23:26 +00:00
showSuccess(response);
dz.removeAllFiles();
dataConfirmNotification.style.display = "none";
btnSubmit.style.display = "";
return;
// Gets triggered when the files have successfully been sent.
// Redirect user or notify of success.
});
this.on("errormultiple", function(files, response) {
// Gets triggered when there was an error sending the files.
// Maybe show form again, and notify user of error
2021-11-26 12:50:32 +00:00
});
2021-11-16 17:45:20 +00:00
this.on("sending", function(file, xhr, formData) {
2021-12-20 10:15:01 +00:00
formData.append("regija",form["regija"].value);
2021-11-16 17:45:20 +00:00
formData.append("program",form["program"].value);
formData.append("predmet",form["predmet"].value);
formData.append("predmet-custom",form["predmet-custom"].value);
formData.append("letnik",form["letnik"].value);
formData.append("vrsta",form["vrsta"].value);
formData.append("vrsta-custom",form["vrsta-custom"].value);
formData.append("solsko-leto",form["solsko-leto"].value);
formData.append("jezikovni-popravki",form["jezikovni-popravki"].value);
});
2021-05-24 08:15:54 +00:00
2021-11-16 17:45:20 +00:00
},
uploadprogress: function(file, progress, bytesSent) {
if (file.previewElement) {
2021-12-15 20:23:26 +00:00
//console.log(progress);
2021-11-16 17:45:20 +00:00
var progressElement = file.previewElement.querySelector("[data-dz-uploadprogress]");
progressElement.style.width = progress + "%";
//progressElement.querySelector(".progress-text").textContent = progress + "%";
}
}
2021-11-16 17:45:20 +00:00
}
</script>
</body>
</html>