{% extends "global/Page.html" %}
{% load staticfiles otree %}
{% block title %}
<style>
.center {
  padding: 200px 0;
}
.slider {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 5px;
  background: #D3D3D3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
}
/*.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  background: black;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 25px;
  height: 25px;
  background: black;
  cursor: pointer;
}*/

.slider:hover {
  opacity: 1;
}
.rangeslider {
font-size:10pt;
padding-bottom: 5em;
}


</style>

Questionnaire 6 of 9

{% endblock %}
{% block content %}
<div class="alert alert-danger" id="error_message">
              Please answer all questions!
            You can move the slider by clicking on it and moving your mouse (computers) or finger (mobile devices). If it is exactly at the position that matches your answer,
                please click on it to register your answer.
            </div>
<div class="card bg-light instructions">
<div class="card-body">



    <div class="rangeslider">
         <p> Here are a number of statements that may or may not apply to you. Please indicate to what extent you agree or disagree that these statements apply to you. </p>
<br>
        <b>1. Family members should stick together, no matter what sacrifices are required.</b></p>

    <table style="width:100%">

            <tr>
            <td colspan="2" width="15%" align="center"/>Disagree strongly</td>
              <td width="70%"><center><input  onclick="wasClicked5(1)" type="range" name="CultureOrientation9" id="CultureOrientation9" step="0.01" class="slider" min="0" max="1" ></center></td>
              <td width="15%" align="center">Agree strongly</td>
          </tr>

    </table>
    <br><br><br>
    <table style="width:100%">
        <tr height="50px">

                <td colspan="3">
               <b> 2. I feel good when I cooperate with others.</b>
                </td>
        </tr>
    <tr onclick="wasClicked5(2)">
    <td colspan="2" width="15%" align="center">Disagree strongly</td>
      <td width="70%"><center><input type="range" name="CultureOrientation10" id="CultureOrientation10" step="0.01" class="slider" min="0" max="1"/></center></td>

      <td width="15%" align="center">Agree strongly</td>
    </tr>
          </tr>
    </table>
    <br><br><br>
        <table style="width:100%">
        <tr height="50px">

            <td colspan="3">
           <b> 3. Winning is everything.</b>

            </td>
        </tr>
    <tr onclick="wasClicked5(3)">
    <td colspan="2" width="15%" align="center">Disagree strongly</td>
      <td width="70%"><center><input type="range" name="CultureOrientation11" id="CultureOrientation11" step="0.01" class="slider" min="0" max="1"/></center></td>
      <td width="15%" align="center">Agree strongly</td>
  </tr>
              </tr>


        </table>
            <br><br><br>
            <table style="width:100%">
        <tr height="50px">

            <td colspan="3">
            <b>4. I rely on myself most of the time; I rarely rely on others.</b>

            </td>
        </tr>
    <tr onclick="wasClicked5(4)">
    <td colspan="2" width="15%" align="center">Disagree strongly</td>
      <td width="70%"><center><input type="range" name="CultureOrientation12" id="CultureOrientation12" step="0.01" class="slider" min="0" max="1"/></center></td>
      <td width="15%" align="center">Agree strongly</td>
  </tr>
              </tr>


        </table>
    <br><br><br>
        <table style="width:100%">
        <tr height="50px">

            <td colspan="3">
           <b> 5. To me, pleasure is spending time with others.</b>

            </td>
        </tr>
    <tr onclick="wasClicked5(5)">
    <td colspan="2" width="15%" align="center">Disagree strongly</td>
      <td width="70%"><center><input type="range" name="CultureOrientation13" id="CultureOrientation13" step="0.01" class="slider" min="0" max="1"/></center></td>
      <td width="15%" align="center">Agree strongly</td>
  </tr>
              </tr>


        </table>
 <br><br><br>
        <b>6. If a coworker gets a prize, I would feel proud.</b></p>

    <table style="width:100%">

            <tr>
            <td colspan="2" width="15%" align="center"/>Disagree strongly</td>
              <td width="70%"><center><input  onclick="wasClicked5(6)" type="range" name="CultureOrientation14" id="CultureOrientation14" step="0.01" class="slider" min="0" max="1" ></center></td>
              <td width="15%" align="center">Agree strongly</td>
          </tr>

    </table>
    <br><br><br>
    <table style="width:100%">
        <tr height="50px">

                <td colspan="3">
               <b> 7. My personal identity, independent of others, is very important to me.</b>
                </td>
        </tr>
    <tr onclick="wasClicked5(7)">
    <td colspan="2" width="15%" align="center">Disagree strongly</td>
      <td width="70%"><center><input type="range" name="CultureOrientation15" id="CultureOrientation15" step="0.01" class="slider" min="0" max="1"/></center></td>

      <td width="15%" align="center">Agree strongly</td>
    </tr>
          </tr>
    </table>
    <br><br><br>
        <table style="width:100%">
        <tr height="50px">

            <td colspan="3">
           <b> 8. It is important to me that I respect the decisions made by my groups.</b>

            </td>
        </tr>
    <tr onclick="wasClicked5(8)">
    <td colspan="2" width="15%" align="center">Disagree strongly</td>
      <td width="70%"><center><input type="range" name="CultureOrientation16" id="CultureOrientation16" step="0.01" class="slider" min="0" max="1"/></center></td>
      <td width="15%" align="center">Agree strongly</td>
  </tr>
              </tr>


        </table>

 <br><br><br>
<br>
           <div align="right"><input type="submit" name="next" id="next" onclick="return submitForm();" class="btn btn-primary" value="Continue"/></div>

<script>

function submitForm() {
    var submit = false;

    if(getOS() == 'Android' || getOS() == 'iOS' || getOS == 'Mac OS'){
        submit=true;
    }

    if(fields.every(isTrue)==true){
        submit=true;
    }
    else{
        document.getElementById("error_message").style.display = "block";
        document.body.scrollTop = 0; // For Safari
        document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
        //setTimeout(function(){ document.getElementById("error_message").style.display = "none"; }, 10000);
    }
    return submit;
}
document.getElementById("error_message").style.display = "none";



        function getOS() {
        var userAgent = window.navigator.userAgent,
      platform = window.navigator.platform,
      macosPlatforms = ['Macintosh', 'MacIntel', 'MacPPC', 'Mac68K'],
      windowsPlatforms = ['Win32', 'Win64', 'Windows', 'WinCE'],
      iosPlatforms = ['iPhone', 'iPad', 'iPod'],
      os = null;

  if (macosPlatforms.indexOf(platform) !== -1) {
    os = 'Mac OS';
  } else if (iosPlatforms.indexOf(platform) !== -1) {
    os = 'iOS';
  } else if (windowsPlatforms.indexOf(platform) !== -1) {
    os = 'Windows';
  } else if (/Android/.test(userAgent)) {
    os = 'Android';
  } else if (!os && /Linux/.test(platform)) {
    os = 'Linux';
  }

  return os;
}

</script>


{% endblock %}