{% extends "global/Page.html" %}
{% load otree static %}

{% block title %}
    <div class=" alert alert-warning" align="center">Runde {{player.round_number}} von {{Constants.num_rounds}}</div>
{% endblock %}

{% block content %}

<div class="card bg-light m-3">
    <div class="card-body">

    <p align="center"> Wie viele Objekte sind in diesem Bild zu sehen? </p>
<p align="center">


        <img src="{% static image_path %}" width=" auto"
        height=" 505px" class="center"/>

        <div class="cover" style="margin-top:-550px;"></div>


</p>

 </div>
</div>

<br>



<br>
<br>
<br>
<br>
<br>
<br>




<style>

img {
    //pointer-events: none;
    user-drag: none; -moz-user-select: none; -webkit-user-drag: none;
}


.cover{
  position: absolute;
  height: 100%;
  width: 100%;
  display: block;
  z-index: 999;
  //background-color: #EBEBEB;
}

.input-group {

    margin-left: auto;
    margin-right: auto;
    //width: 200px
    //margin-left: 25px;
}

.form-control  {
    //color: #3e93e8;
    margin-left: 25px;
    //margin-right: 300px;
    //min-width: 150px;
}

//.otree-form {
//    width: 80%;
//    padding-left: 200px
//}

.otree-timer {
    display: none;
}

</style>

<script type="text/javascript"><!--
// Image Preloader version 1.0
// Copyright 2009 Bontrager Connection, LLC
// https://www.willmaster.com/
//
// Leave the next line as is.
var preload = new Array();

// List the images to be loaded, each
//   image assigned to preload[#], with
//   consecutive numbering starting at 0.

preload[0] = "{% static "Bilder/Foto_14.jpg" %}";
preload[1] = "{% static "Bilder/Foto_26.jpg" %}";
preload[2] = "{% static "Bilder/Foto_10.jpg" %}";
preload[3] = "{% static "Bilder/Foto_40.jpg" %}";
preload[4] = "{% static "Bilder/Foto_17.jpg" %}";
preload[5] = "{% static "Bilder/Foto_16.jpg" %}";
preload[6] = "{% static "Bilder/Foto_8.jpg" %}";
preload[7] = "{% static "Bilder/Foto_29.jpg" %}";
preload[8] = "{% static "Bilder/Foto_39.jpg" %}";
preload[9] = "{% static "Bilder/Foto_2.jpg" %}";
preload[10] = "{% static "Bilder/Foto_31.jpg" %}";
preload[11] = "{% static "Bilder/Foto_38.jpg" %}";
preload[12] = "{% static "Bilder/Foto_22.jpg" %}";
preload[13] = "{% static "Bilder/Foto_12.jpg" %}";
preload[14] = "{% static "Bilder/Foto_27.jpg" %}";
preload[15] = "{% static "Bilder/Foto_19.jpg" %}";

// Leave the next 5 lines as they are.
var loadedimages = new Array();
for(var i=0; i<preload.length; i++) {
loadedimages[i] = new Image();
loadedimages[i].src = preload[i];
}
//--></script>

<script>
    document.addEventListener('contextmenu', event => event.preventDefault());

    document.title = 'Experiment';

    window.onload = function(){
    setTimeout(function(){
    document.getElementById("form").submit();
    }, 30000);
    };

</script>

{% endblock %}