Trying to fix video upload (not working at all yet)

This commit is contained in:
Jan 2024-08-20 15:30:38 +02:00
parent dfb37e4a86
commit b1e939adeb
5 changed files with 670 additions and 29 deletions

View File

@ -33,6 +33,7 @@ app = Flask(__name__)
# configure the database, give it a path (it will be in the instances folder)
app.config["SQLALCHEMY_DATABASE_URI"] = "sqlite:///database.db"
app.config["PERMANENT_SESSION_LIFETIME"] = 10800 #3 Stunden, 10800 sekunden
app.config['MAX_CONTENT_LENGTH'] = 16 * 1000 * 1000 # try and fix video upload not working
db.init_app(app)
#set the secret key (TODO change this for final deployment)
@ -41,6 +42,9 @@ app.secret_key = b"29fe9e8edd407c5491d4f1c05632d9fa33e26ed8734a3f5e080ebac3772a5
UPLOAD_FOLDER = 'uploads'
EXPORT_FOLDER = 'exports'
PASSWORD = '#1ACGmsjd'
# CONFIGFILE = 'userstudy1.json'
CONFIGFILE = 'test.json'
# CONFIGFILE = 'default.json'
#csrf = CSRFProtect(app) #enable CSRF protection globally
@ -70,7 +74,7 @@ except SQLAlchemyError as e:
#open, parse and execute json file
#open the json file with the config
configfile = open("default.json", encoding='utf-8') #todo replace with other name
configfile = open(CONFIGFILE, encoding='utf-8') #todo replace with other name
#convert it to dict
config = json.load(configfile)
configfile.close()
@ -346,7 +350,20 @@ def sendpage():
# handle possible Video that was send
if 'recordedVideo' in request.files:
print("------------------------trying to save the video-------------------------------")
print("request.max_content_length:", request.max_content_length)
print("request.max_form_memory_size:", request.max_form_memory_size)
print("request.accept_mimetypes:", request.accept_mimetypes)
print("request.args:", request.args)
print("request.content_length:", request.content_length)
video = request.files['recordedVideo']
print("request.data:", request.data)
print("request.files:", request.files)
print("request.form:", request.form)
print("video: ",video)
print("video.content_length: ", video.content_length)
print("MIME type: ", video.mimetype)
print("File name: ", video.filename)
formatted_date = date.strftime("%Y.%m.%d %H-%M-%S")
print("date: ", date)
video_name = str(session_user_id) + "_" + session["current_block_name"] + "_" + session["current_stimulus_name"] + "_" + str(formatted_date) + ".webm"
@ -354,6 +371,7 @@ def sendpage():
print("path: ",path)
os.makedirs(UPLOAD_FOLDER, exist_ok=True)
video.save(path)
print("------------------------END trying to save the video-------------------------------")
if 'recordedVideo' in request.files:
if hasattr(new_entry, "video_upload"):

View File

@ -46,12 +46,14 @@ document.getElementById("question_form").addEventListener("submit", function (ev
// code to handle proper redirection after submit
console.log('Response:', response);
// check if response is a redirect
/*
if (response.redirected) {
console.log("Redirecting to:", response.url);
window.location.href = response.url; // Redirect to the new page
} else {
console.log("No redirect response received.");
}
*/
})
.catch(error => {
console.error('Error:', error);
@ -90,11 +92,19 @@ async function cameraButton() {
// adjust CSS to make the video fit properly
// this makes sure that there is no buggy "jumping" when the video display source changes
videoContainer.style.setProperty("padding-bottom", "min("+videoHeight+"px,"+aspectratio+"%)");
videoContainer.style.setProperty("padding-bottom", "min("+videoHeight+"px,"+aspectratio+"%), 100vh");
//TODO: Solution for this part:
// If the video is vertical, I need to set the width to 0, the max-height to 100% and do the padding on the width, so turn the code around
//This should always make the video fitt
// adjust the max width for horizontal and vertical video input
if (videoHeight > videoWidth){ //hochkant video
videoContainer.style.setProperty("max-width", "min(80%,576");
// I did this originally to display vertical video on a horizontal screen properly (video should not be higher than the screem)
// but now I do this by adjusting the paddint to be at most 100vh, so this whole part should be useless now
// But a new problem could be if I do too little padding and the ratio is lost because of it, so actually I also need to adjust the width
videoContainer.style.setProperty("max-width", "min(80%,576)"); // maybe actually use the screen height here: instead of 80% maybe 80vh
}else{ //normal, horizontal
videoContainer.style.setProperty("max-width", "100%");
}

View File

@ -1,37 +1,325 @@
{
"Block 1":{
"type": "SinglePage",
"template": "startpage.html"
},
"Block 2":{
"Block 2": {
"type": "TaskTemplate",
"tempalte": "tempaltetest1.html",
"name" : "Block2Responses",
"databasetable": {
"question_title" : {
"type":"likert"
"tempalte": "standard_template.html",
"stimuli": {
"type": "single_video",
"order": "random",
"list": {
"video_1": "https://www.youtube-nocookie.com/embed/iI2bjpgLgu0?si=pWWwitq8Tl9zAs04",
"video_2": "https://www.youtube-nocookie.com/embed/R_LNEJiShRM?si=vm5mj-xs04nfijkf",
"video_3": "https://www.youtube-nocookie.com/embed/DJnHVnT2YEk?si=e6qe7nrHaRYJ3NQe",
"video_4": "https://www.youtube-nocookie.com/embed/6BTZn7tqSzk?si=jQH8RHGMIP9ARsT5",
"video_5": "https://www.youtube-nocookie.com/embed/bCRqmhWjuCk?si=iM2dwOSTosLq08Pr",
"video_6": "https://www.youtube-nocookie.com/embed/hgE2k8y9-qc?si=kR2rshmVcb9P70r0"
},
"configuration": {
"embed": "yt"
}
},
"questions": {
"question1": {
"type": "likert",
"name": "likertscale",
"text": "Wie würden sie dieses Video bewerten?",
"required": "true",
"points": {
"p1": {
"value": "1",
"text": "Ich finde es gar nicht gut 🙁👎"
},
"p2": {
"value": "2",
"text": "Ich finde es nicht gut 👎"
},
"p3": {
"value": "3",
"text": "Ich finde es weder gut noch schlecht"
},
"p4": {
"value": "4",
"text": "Ich finde es gut 👍"
},
"p5": {
"value": "5",
"text": "Ich finde es sehr gut 😊👍"
}
}
},
"question2": {
"type": "textinput",
"name": "text_feedback",
"text": "Hier können sie uns Feedback geben",
"required": "false",
"size": "250"
},
"question3": {
"type": "videoinput",
"text": "Hier können sie per Video Feedback geben",
"name": "video_feedback",
"required": "false"
}
},
"infovideo": {
"videourl": "https://www.youtube-nocookie.com/embed/F_w50c5Us3Y?si=-H07MmQ4lYOC2Bwh",
"infotext": "Hier wird in Zukunft ein Erklärtext stehen, in dem die Fragestellungen erklärt werden.\\n Dazu werden alle Fragen der Seite einzeln durchgegangen und einfach erklärt.\\n Zum Beispiel wird hier erklärt, dass man um Feedback zu geben, ein Video aufnehmen kann. Dazu drückt man auf den Knopf mit dem Videokamera Symbol. Danach muss man oben links am Browser bestätigen, dass der Browser auf die Kamera zugreifen darf.",
"configuration": {
"embed": "yt"
}
},
"database_table": {
"table_name": "single_video_responses",
"fields": {
"likertscale": {
"type": "integer",
"nullable": "false"
},
"text_feedback": {
"type": "string",
"size": "250",
"nullable": "true"
},
"video_upload": {
"type": "string",
"size": "100",
"nullable": "true"
}
}
}
},
"question 3":{
"type": "single",
"video1": "https://www.youtube-nocookie.com/embed/XTMIomsXxKM?si=r2zB6OKERH6Jdpi6",
"scales": {
"block1":{
"type": "likert",
"numberofpoints": "3",
"points":{
"point1": "left",
"point2": "none",
"point3": "right"
"Block 1": {
"type": "TaskTemplate",
"tempalte": "standard_template.html",
"stimuli": {
"type": "empty",
"list": {
"empty_stimulus": ""
}
},
"questions": {
"question1_alter": {
"type": "numberinput",
"name": "alter",
"text": "Alter:",
"required": "true",
"min": "1",
"max": "120"
},
"question2_geschlecht": {
"type": "dropdowninput",
"name": "geschlecht",
"text": "Geschlecht:",
"required": "true",
"defaulttext": "",
"points": {
"männlich": {
"value": "Männlich",
"text": "Männlich"
},
"weiblich": {
"value": "Weiblich",
"text": "Weiblich"
},
"divers": {
"value": "Divers",
"text": "Divers"
},
"keine_angabe": {
"value": "keine_angabe",
"text": "Keine Angabe"
}
}
},
"block2":{
"type": "textinput",
"length": "200"
"question3_hoerstatus": {
"type": "dropdowninput",
"name": "hoerstatus",
"text": "Hörstatus:",
"required": "true",
"defaulttext": "",
"points": {
"hörend": {
"value": "Hörend",
"text": "Hörend"
},
"schwerhörig": {
"value": "Schwerhörig",
"text": "Schwerhörig"
},
"gehörlos": {
"value": "Gehörlos",
"text": "Gehörlos"
}
}
},
"block3":{
"type": "video"
"question4_bevorzugte_kommunikation": {
"type": "dropdowninput",
"name": "bevorzugte_kommunikation",
"text": "Bevorzugte Kommunikationsform:",
"required": "true",
"defaulttext": "",
"points": {
"gesprochen": {
"value": "Gesprochene Sprache",
"text": "Gesprochene Sprache"
},
"text": {
"value": "Text",
"text": "Text"
},
"gebärdensprache": {
"value": "Gebärdensprache",
"text": "Gebärdensprache"
}
}
},
"question5_gebeardenzeitraum": {
"type": "numberinput",
"name": "gebärdenzeitraum",
"text": "Wie viele Jahre verwenden sie schon Gebärdensprache:",
"required": "true",
"min": "0",
"max": "100",
"step": "0.5"
},
"question6_sprachkompetenz": {
"type": "numberinput",
"name": "gebärdensprachkompetenz",
"text": "Wie schätzen sie ihre Gebärdensprachkompetenz ein (1-10):",
"required": "true",
"min": "1",
"max": "10"
}
},
"infovideo": {
"videourl": "https://www.youtube-nocookie.com/embed/F_w50c5Us3Y?si=-H07MmQ4lYOC2Bwh",
"infotext": "Hier wird in Zukunft ein Erklärtext stehen, in dem die Fragestellungen erklärt werden. \n Dazu werden alle Fragen der Seite einzeln durchgegangen und einfach erklärt. Zum Beispiel wird hier erklärt, dass man um Feedback zu geben, ein Video aufnehmen kann. Dazu drückt man auf den Knopf mit dem Videokamera Symbol. Danach muss man oben links am Browser bestätigen, dass der Browser auf die Kamera zugreifen darf.",
"configuration": {
"embed": "yt"
}
},
"database_table": {
"table_name": "demographic_data",
"fields": {
"alter": {
"type": "integer",
"nullable": "false"
},
"geschlecht": {
"type": "string",
"size": "14",
"nullable": "false"
},
"hoerstatus": {
"type": "string",
"size": "14",
"nullable": "false"
},
"bevorzugte_kommunikation": {
"type": "string",
"size": "22",
"nullable": "false"
},
"gebärdenzeitraum": {
"type": "float",
"nullable": "false"
},
"gebärdensprachkompetenz": {
"type": "integer",
"nullable": "false"
}
}
}
},
"Block 3": {
"type": "TaskTemplate",
"tempalte": "standard_template.html",
"stimuli": {
"type": "double_video",
"list_1": {
"video_1": "https://www.youtube-nocookie.com/embed/IqGVT1q1PtM?si=kel7ZWEQl3h-h522",
"video_2": "https://www.youtube-nocookie.com/embed/g9KA72jN5SM?si=O7dfqTXdFCCAScJ-"
},
"list_2": {
"video_2": "https://www.youtube-nocookie.com/embed/g9KA72jN5SM?si=O7dfqTXdFCCAScJ-",
"video_1": "https://www.youtube-nocookie.com/embed/IqGVT1q1PtM?si=kel7ZWEQl3h-h522"
},
"configuration": {
"embed": "yt"
}
},
"questions": {
"question1": {
"type": "likert",
"name": "likertscale",
"text": "Welches Video gefällt ihnen besser?",
"required": "true",
"points": {
"p1": {
"value": "1",
"text": "Ich finde das linke Video besser"
},
"p2": {
"value": "2",
"text": "Ich finde beide Videos gleich gut"
},
"p3": {
"value": "3",
"text": "Ich finde das rechte Video besser"
}
}
}
},
"infovideo": {
"videourl": "https://www.youtube-nocookie.com/embed/F_w50c5Us3Y?si=-H07MmQ4lYOC2Bwh",
"infotext": "Hier wird in Zukunft ein Erklärtext stehen, in dem die Fragestellungen erklärt werden. Dazu werden alle Fragen der Seite einzeln durchgegangen und einfach erklärt. Zum Beispiel wird hier erklärt, dass man um Feedback zu geben, ein Video aufnehmen kann. Dazu drückt man auf den Knopf mit dem Videokamera Symbol. Danach muss man oben links am Browser bestätigen, dass der Browser auf die Kamera zugreifen darf.",
"configuration": {
"embed": "yt"
}
},
"database_table": {
"table_name": "double_video_responses",
"fields": {
"likertscale": {
"type": "integer",
"nullable": "false"
}
}
}
},
"Block 4": {
"type": "TaskTemplate",
"tempalte": "standard_template.html",
"stimuli": {
"type": "empty",
"list": {
"empty_stimulus": ""
}
},
"questions": {
"question1": {
"type": "textinput",
"name": "formfeedback",
"text": "Das war der Prototyp für dieses Studientool. Über Feedback würde ich mich freuen. Entweder hier oder per Email unter: jan.dickmann@web.de",
"required": "false",
"size": "1000"
}
},
"infovideo": {
"videourl": "https://www.youtube-nocookie.com/embed/F_w50c5Us3Y?si=-H07MmQ4lYOC2Bwh",
"infotext": "Hier wird in Zukunft ein Erklärtext stehen, in dem die Fragestellungen erklärt werden. Dazu werden alle Fragen der Seite einzeln durchgegangen und einfach erklärt. Zum Beispiel wird hier erklärt, dass man um Feedback zu geben, ein Video aufnehmen kann. Dazu drückt man auf den Knopf mit dem Videokamera Symbol. Danach muss man oben links am Browser bestätigen, dass der Browser auf die Kamera zugreifen darf.",
"configuration": {
"embed": "yt"
}
},
"database_table": {
"table_name": "feedback_responses",
"fields": {
"formfeedback": {
"type": "string",
"size": "1000",
"nullable": "true"
}
}
}
}

325
slaeforms/userstudy1.json Normal file
View File

@ -0,0 +1,325 @@
{
"Block 1": {
"type": "TaskTemplate",
"tempalte": "standard_template.html",
"stimuli": {
"type": "empty",
"list": {
"empty_stimulus": ""
}
},
"questions": {
"question1_alter": {
"type": "numberinput",
"name": "alter",
"text": "Alter:",
"required": "true",
"min": "1",
"max": "120"
},
"question2_geschlecht": {
"type": "dropdowninput",
"name": "geschlecht",
"text": "Geschlecht:",
"required": "true",
"defaulttext": "",
"points": {
"männlich": {
"value": "Männlich",
"text": "Männlich"
},
"weiblich": {
"value": "Weiblich",
"text": "Weiblich"
},
"divers": {
"value": "Divers",
"text": "Divers"
},
"keine_angabe": {
"value": "keine_angabe",
"text": "Keine Angabe"
}
}
},
"question3_hoerstatus": {
"type": "dropdowninput",
"name": "hoerstatus",
"text": "Hörstatus:",
"required": "true",
"defaulttext": "",
"points": {
"hörend": {
"value": "Hörend",
"text": "Hörend"
},
"schwerhörig": {
"value": "Schwerhörig",
"text": "Schwerhörig"
},
"gehörlos": {
"value": "Gehörlos",
"text": "Gehörlos"
}
}
},
"question4_bevorzugte_kommunikation": {
"type": "dropdowninput",
"name": "bevorzugte_kommunikation",
"text": "Bevorzugte Kommunikationsform:",
"required": "true",
"defaulttext": "",
"points": {
"gesprochen": {
"value": "Gesprochene Sprache",
"text": "Gesprochene Sprache"
},
"text": {
"value": "Text",
"text": "Text"
},
"gebärdensprache": {
"value": "Gebärdensprache",
"text": "Gebärdensprache"
}
}
},
"question5_gebeardenzeitraum": {
"type": "numberinput",
"name": "gebärdenzeitraum",
"text": "Wie viele Jahre verwenden sie schon Gebärdensprache:",
"required": "true",
"min": "0",
"max": "100",
"step": "0.5"
},
"question6_sprachkompetenz": {
"type": "numberinput",
"name": "gebärdensprachkompetenz",
"text": "Wie schätzen sie ihre Gebärdensprachkompetenz ein (1-10):",
"required": "true",
"min": "1",
"max": "10"
}
},
"infovideo": {
"videourl": "https://www.youtube-nocookie.com/embed/F_w50c5Us3Y?si=-H07MmQ4lYOC2Bwh",
"infotext": "Hier wird in Zukunft ein Erklärtext stehen, in dem die Fragestellungen erklärt werden. \n Dazu werden alle Fragen der Seite einzeln durchgegangen und einfach erklärt. Zum Beispiel wird hier erklärt, dass man um Feedback zu geben, ein Video aufnehmen kann. Dazu drückt man auf den Knopf mit dem Videokamera Symbol. Danach muss man oben links am Browser bestätigen, dass der Browser auf die Kamera zugreifen darf.",
"configuration": {
"embed": "yt"
}
},
"database_table": {
"table_name": "demographic_data",
"fields": {
"alter": {
"type": "integer",
"nullable": "false"
},
"geschlecht": {
"type": "string",
"size": "14",
"nullable": "false"
},
"hoerstatus": {
"type": "string",
"size": "14",
"nullable": "false"
},
"bevorzugte_kommunikation": {
"type": "string",
"size": "22",
"nullable": "false"
},
"gebärdenzeitraum": {
"type": "float",
"nullable": "false"
},
"gebärdensprachkompetenz": {
"type": "integer",
"nullable": "false"
}
}
}
},
"Block 2": {
"type": "TaskTemplate",
"tempalte": "standard_template.html",
"stimuli": {
"type": "single_video",
"order": "random",
"list": {
"video_1": "https://www.youtube-nocookie.com/embed/iI2bjpgLgu0?si=pWWwitq8Tl9zAs04",
"video_2": "https://www.youtube-nocookie.com/embed/R_LNEJiShRM?si=vm5mj-xs04nfijkf",
"video_3": "https://www.youtube-nocookie.com/embed/DJnHVnT2YEk?si=e6qe7nrHaRYJ3NQe",
"video_4": "https://www.youtube-nocookie.com/embed/6BTZn7tqSzk?si=jQH8RHGMIP9ARsT5",
"video_5": "https://www.youtube-nocookie.com/embed/bCRqmhWjuCk?si=iM2dwOSTosLq08Pr",
"video_6": "https://www.youtube-nocookie.com/embed/hgE2k8y9-qc?si=kR2rshmVcb9P70r0"
},
"configuration": {
"embed": "yt"
}
},
"questions": {
"question1": {
"type": "likert",
"name": "likertscale",
"text": "Wie würden sie dieses Video bewerten?",
"required": "true",
"points": {
"p1": {
"value": "1",
"text": "Ich finde es gar nicht gut 🙁👎"
},
"p2": {
"value": "2",
"text": "Ich finde es nicht gut 👎"
},
"p3": {
"value": "3",
"text": "Ich finde es weder gut noch schlecht"
},
"p4": {
"value": "4",
"text": "Ich finde es gut 👍"
},
"p5": {
"value": "5",
"text": "Ich finde es sehr gut 😊👍"
}
}
},
"question2": {
"type": "textinput",
"name": "text_feedback",
"text": "Hier können sie uns Feedback geben",
"required": "false",
"size": "250"
},
"question3": {
"type": "videoinput",
"text": "Hier können sie per Video Feedback geben",
"name": "video_feedback",
"required": "false"
}
},
"infovideo": {
"videourl": "https://www.youtube-nocookie.com/embed/F_w50c5Us3Y?si=-H07MmQ4lYOC2Bwh",
"infotext": "Hier wird in Zukunft ein Erklärtext stehen, in dem die Fragestellungen erklärt werden.\\n Dazu werden alle Fragen der Seite einzeln durchgegangen und einfach erklärt.\\n Zum Beispiel wird hier erklärt, dass man um Feedback zu geben, ein Video aufnehmen kann. Dazu drückt man auf den Knopf mit dem Videokamera Symbol. Danach muss man oben links am Browser bestätigen, dass der Browser auf die Kamera zugreifen darf.",
"configuration": {
"embed": "yt"
}
},
"database_table": {
"table_name": "single_video_responses",
"fields": {
"likertscale": {
"type": "integer",
"nullable": "false"
},
"text_feedback": {
"type": "string",
"size": "250",
"nullable": "true"
},
"video_upload": {
"type": "string",
"size": "100",
"nullable": "true"
}
}
}
},
"Block 3": {
"type": "TaskTemplate",
"tempalte": "standard_template.html",
"stimuli": {
"type": "double_video",
"list_1": {
"video_1": "https://www.youtube-nocookie.com/embed/IqGVT1q1PtM?si=kel7ZWEQl3h-h522",
"video_2": "https://www.youtube-nocookie.com/embed/g9KA72jN5SM?si=O7dfqTXdFCCAScJ-"
},
"list_2": {
"video_2": "https://www.youtube-nocookie.com/embed/g9KA72jN5SM?si=O7dfqTXdFCCAScJ-",
"video_1": "https://www.youtube-nocookie.com/embed/IqGVT1q1PtM?si=kel7ZWEQl3h-h522"
},
"configuration": {
"embed": "yt"
}
},
"questions": {
"question1": {
"type": "likert",
"name": "likertscale",
"text": "Welches Video gefällt ihnen besser?",
"required": "true",
"points": {
"p1": {
"value": "1",
"text": "Ich finde das linke Video besser"
},
"p2": {
"value": "2",
"text": "Ich finde beide Videos gleich gut"
},
"p3": {
"value": "3",
"text": "Ich finde das rechte Video besser"
}
}
}
},
"infovideo": {
"videourl": "https://www.youtube-nocookie.com/embed/F_w50c5Us3Y?si=-H07MmQ4lYOC2Bwh",
"infotext": "Hier wird in Zukunft ein Erklärtext stehen, in dem die Fragestellungen erklärt werden. Dazu werden alle Fragen der Seite einzeln durchgegangen und einfach erklärt. Zum Beispiel wird hier erklärt, dass man um Feedback zu geben, ein Video aufnehmen kann. Dazu drückt man auf den Knopf mit dem Videokamera Symbol. Danach muss man oben links am Browser bestätigen, dass der Browser auf die Kamera zugreifen darf.",
"configuration": {
"embed": "yt"
}
},
"database_table": {
"table_name": "double_video_responses",
"fields": {
"likertscale": {
"type": "integer",
"nullable": "false"
}
}
}
},
"Block 4": {
"type": "TaskTemplate",
"tempalte": "standard_template.html",
"stimuli": {
"type": "empty",
"list": {
"empty_stimulus": ""
}
},
"questions": {
"question1": {
"type": "textinput",
"name": "formfeedback",
"text": "Das war der Prototyp für dieses Studientool. Über Feedback würde ich mich freuen. Entweder hier oder per Email unter: jan.dickmann@web.de",
"required": "false",
"size": "1000"
}
},
"infovideo": {
"videourl": "https://www.youtube-nocookie.com/embed/F_w50c5Us3Y?si=-H07MmQ4lYOC2Bwh",
"infotext": "Hier wird in Zukunft ein Erklärtext stehen, in dem die Fragestellungen erklärt werden. Dazu werden alle Fragen der Seite einzeln durchgegangen und einfach erklärt. Zum Beispiel wird hier erklärt, dass man um Feedback zu geben, ein Video aufnehmen kann. Dazu drückt man auf den Knopf mit dem Videokamera Symbol. Danach muss man oben links am Browser bestätigen, dass der Browser auf die Kamera zugreifen darf.",
"configuration": {
"embed": "yt"
}
},
"database_table": {
"table_name": "feedback_responses",
"fields": {
"formfeedback": {
"type": "string",
"size": "1000",
"nullable": "true"
}
}
}
}
}

Binary file not shown.