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

{% block title %}
    Welcome to our task
{% endblock %}

{% block content %}
    <p id="welcome_text">
        You are seeing this message because your browser does not support JavaScript or because you have deactivated JavaScript. 

        In order to be able to work on this HIT, please use a browser that supports JavaScript (e.g. Chorme, Firefox or Edge) and allow JavaScript to be loaded.
    </p>

    <!-- <p>
        We are academics who value your work and always pay as promised. To participate in this HIT, you must answer a short quiz correctly.
        Your compensation will consist of two components, the fixed amount that you earn for this HIT plus a payment that is based on your performance
    </p>

    <p>
        You have to answer the quiz correctly and complete this HIT to receive your payment.
    </p>



    <p>
        Please click "Next" to continue and to receive further instructions.
    </p> -->

   <!-- Input Tags to record answers -->
   <input type="hidden" name="browser_name" id="id_browser_name" />


    <!-- Java Script to set local page variables -->
    <script type="text/javascript"  language="javascript" >

        //When windows is loaded, check if JavaScript is activated
        $(function(){
            checkJava();
            checkBrowser();
        });

        function checkJava(){
            console.log('HAllo12');
            $('#welcome_text').html('<p>' + 
                'We are academics who value your work and always pay as promised. To participate in this HIT, you must answer a short quiz correctly.' +
                'Your compensation will consist of two components, the fixed amount of 0.01 USD that you earn for this HIT plus a payment that is based on your performance' +
                '</p>' +
                '<p>' +
                'You have to answer the quiz correctly and complete this HIT to receive your payment.' +
                '</p>' +
                '<p>' +
                'Please click "Next" to continue and to receive further instructions.' +
                '</p>' +
                '<button class="otree-btn-next btn btn-primary next-button otree-next-button" style="float: right;" id="next_button">Next</button>');}

        function checkBrowser(){
            // Opera 8.0+
            var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0;

            // Firefox 1.0+
            var isFirefox = typeof InstallTrigger !== 'undefined';

            // Safari 3.0+ "[object HTMLElementConstructor]" 
            var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && safari.pushNotification));

            // Internet Explorer 6-11
            var isIE = /*@cc_on!@*/false || !!document.documentMode;

            // Edge 20+
            var isEdge = !isIE && !!window.StyleMedia;

            // Chrome 1 - 71
            var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime);

            // Blink engine detection
            var isBlink = (isChrome || isOpera) && !!window.CSS;

            var browser_name = 'undefined';
            if(isFirefox){
                browser_name = 'FireFox';
            }else if(isChrome){
                browser_name = 'Chrome';
            }else if(isSafari){
                browser_name = 'Safari';
            }else if(isOpera){
                browser_name = 'Opera';
            }else if(isIE){
                browser_name = 'IE';
            }else if(isEdge){
                browser_name = 'Edge';
            }else if(isBlink){
                isEdge = 'Blink';
            }

            document.getElementById("id_browser_name").value = browser_name;
        }
    </script>

{% endblock %}