<!DOCTYPE HTML>
<html>
<head>
	<title>Home Organisation Selection</title>
	<meta http-equiv="content-type" content="text/html; charset=utf-8">
	<meta name="keywords" content="Home Organisation, Discovery Service, WAYF, Shibboleth, Login, AAI">
	<meta name="description" content="Choose your home organisation to authenticate">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
  <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/css/bootstrap-select.min.css" rel="stylesheet">

	<style type="text/css">
	body { height: 100%; }

#wrapper {
    background-image: url(images/back.jpg);
    background-repeat: repeat-x;
    background-position: center bottom;
    background-color: #81cff5;
    min-height:100%;
}


.panel-primary {
    border-color: #78c4dd;
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.7);
}

.panel-primary>.panel-heading {
    background-color: #78c4dd;
    border-color: #78c4dd;
}

.btn-primary {
    background-color: #78c4dd;
    border-color: #78c4dd;
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: #528697;
    border-color: #528697;
}

.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover {
    background-color: #78c4dd;
}

#userIdPSelection {
    width:100%;
}

.bootstrap-select {
    width: 90% !important;
}

.bootstrap-select .caret {
    display: none;
}

.selectOptions input{
    width: 20px;
    height: 20px;
    float:left;
}

.selectOptions label{
    position: relative;
    top: 5px;
    width: 90%;
    left: 5px;
}
	</style>


</head>

<body>
  <div id="wrapper">
    <nav class="navbar navbar-inverse navbar-static-top" role="navigation">
        <div class="navbar-header">
            <a class="navbar-brand" href=""><i class="glyphicon glyphicon-home"></i></a>
        </div>
    </nav>

    <div style="height:100px;"><center><a href="http://www.cnous.fr"><img src="http://ds.nuonet.fr/discovery/images/logo.png" alt="CNOUS" id="CnousLogo" width="90"></a></center></div>

    <div class="container">
        <div class="panel panel-primary col-md-offset-3 col-md-6" style="padding:0px;">
            <div class="panel-heading">
                <h4>Permanently set your Home Organisation</h4>
            </div>

            <div class="panel-body">
                <form id="IdPList" name="IdPList" class="form-horizontal" method="post" action="#">
                    <p class="promptMessage">Pour acceder a la ressource 'chronos.cnous.fr' veuillez selectionner ou chercher l'organisation a laquelle vous appartenez.</p><br />
                    <center>
                      <select name="user_idp" id="userIdPSelection" class="selectpicker" data-size="false" data-show-subtext="true" data-live-search="true">
                        <option value="-" >Select the organisation you are affiliated with ...</option>
                          {% for idp in parties %}
                              {% if idp.allIdpSsoDescriptors %}
                                  <option data-idp="{{ idp.entityID }}" data-href="{{ path('lightsaml_sp.login', {idp: idp.entityID}) }}">{{ idp.getFirstOrganization ? idp.getFirstOrganization.organizationName : 'Test Shib Docker' }}</option>
                              {% endif %}
                          {% else %}
                              <p>Aucun IDP n'est disponible</p>
                          {% endfor %}
                      </select>
                      <br><br>
                      <input type="submit" class="btn btn-primary btn-lg" name="Select" accesskey="s" value="Save" >
                    </center>
                    <div>
                      <p class="selectOptions"></p>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <center>Mission communication Cnous & Crous de Dijon</center>
  </div>

  <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
	<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.12.2/js/bootstrap-select.min.js"></script>


	<script language="JavaScript" type="text/javascript">
  	// Prevent that WAYF is loaded in an IFRAME
  	function preventIframeEmbedding(){
  		if (top != self) {
  			top.location = self.location;
  		}
  	}

  	// Set focus to submit button or drop down list
  	function setFocus(){
  		// Skip this if we cannot access the form elements
  		if (
  			!document.IdPList ||
  			!document.IdPList.Select
  			){
  			return;
  		}

  		if (
  				document.IdPList.user_idp &&
  				document.IdPList.user_idp.selectedIndex == 0
  			){
  			// Set focus to select
  			document.IdPList.user_idp.focus();
  		} else {
  			// Set focus to submit button
  			document.IdPList.Select.focus();
  		}
  	}

  	// Confirm action
  	function showConfirmation(){

  		return confirm(unescape('Are you sure that you want to set the selected entry as your default Home Organisation? Don\'t proceed if you have user accounts at multiple organisations.'));
  	}

  	// Confirm permanent selection
  	function showPermanentConfirmation(){

  		var message = unescape('You can reset the default setting by going to: %s');
  		message = message.replace('%s', window.location.href.replace(/\?.+/, ''));
  		return alert(message);
  	}

  	// Perform input validation on WAYF form
  	function checkForm(){
  		if(
  			document.IdPList.user_idp &&
  			document.IdPList.user_idp.selectedIndex == 0
  		){
  			alert(unescape('You must select a valid Home Organisation.'));
  			return false;
  		} else {
  			if (document.IdPList.permanent && document.IdPList.permanent.checked){
  				return showConfirmation();
  			} else {
  			    console.log("bon");
  				return true;
  			}
  		}
  	}

  	// Init WAYF
  	function init(){
  		preventIframeEmbedding();

  		setFocus();

  		if (true){

  			var searchText = 'Type the name of the organisation you are affiliated with';
  			$("#userIdPSelection:enabled option[value='-']").text(searchText);

  					}
  	}

  	// Call init function when DOM is ready
    $(document).ready(function() {
        init();
        $('.selectpicker').selectpicker('show');
        $(".dropdown-menu").css("display","inline-block");
        $(".dropdown-menu").css("width","100%");
        $(".dropdown-menu").css("position","static");
        $(".dropdown-menu ul").css("height","288px");
        $("#wrapper").css("height",$(window).height());
        $(".dropdown-menu ul").css("overflow-y","auto");
        $(".dropdown-menu").show();
        $(".bs-searchbox input").focus();
    });

    $('#IdPList').submit(function(){
      document.location.href = $('#userIdPSelection option:selected').attr('data-href');
      return false;
    });



	</script>
</body>
</html>
