<form action='' method="POST" enctype="multipart/form-data">
	{$watermark_nonce}
    <input onClick="display_youtube()" type="checkbox" id="activ_youtube" name="activ_youtube"
           value="{$t::getTraduction( "Activate_youtube")}" {if $youtubeData.youtube_active}checked{/if}/>

    <span style="margin-left: 10px;">{$t::getTraduction( "Activate_youtube")}</span>
	<span style="margin-left: 100px;">{$t::getTraduction( "nb_max_envoi_youtube")}</span><input  id="youtube_nb_max_envoi_jour"
						name="youtube_nb_max_envoi_jour"
						type="number"
						value="{$youtubeData.youtube_nb_max_envoi_jour}"/>

    <div id="youtube_is_active" {if !$youtubeData.youtube_active} class="DigitalSignage4_display_none" {/if}>

        <br>
		<div id="youtube_state0" class="DigitalSignage4_display_none">
        

			<div>{$t::getTraduction( "Youtube_State0_secret_key")} :</div>
			<div>
				<input	type="file"
						name="youtube_json_file"
						id="youtube_json_file"/>
			</div>
			<div>
				<input	onclick="callAjaxSetJsonFile()"
						class="btn btn-primary button_compte"
						name="Youtube_test"
						id="submit_youtube_test"
						type="button"
						value="{$t::getTraduction( "Youtube_State0_Go")}"/>
			</div>
			<div>{$t::getTraduction( "Youtube_State0_documentation",DigitalSignage4_Tools::getAcaciaRedirectionPageUrl("howtofindyoutubejsonwc"))}</div>

		</div>
		<div id="youtube_state1" class="DigitalSignage4_display_none">
			<div>{$t::getTraduction( "Youtube_AuthUrl_PopupText")}</div>
			<div>
				<input 	onclick="callAjaxGetUrlAuth(false)"
						class="btn btn-primary button_compte"
						id="submit_youtube_state1"
						name="submit_youtube_state1"
						type="button"
						value="{$t::getTraduction( "Youtube_State1_Go")}"/>
			</div>
			<br/>
			<div>
				<input 	onclick="callAjaxReset()"
						class="btn btn-primary button_compte"
						id="submit_youtube_state1_reset"
						name="submit_youtube_state1_reset"
						type="button"
						value="{$t::getTraduction( "Youtube_State1_Reset")}"/>
			</div>
		</div>
		<div id="youtube_state2" class="DigitalSignage4_display_none">
			<div>{$t::getTraduction( "Youtube_State2_Text",DigitalSignage4_Tools::getAcaciaRedirectionPageUrl("howtobreakyoutubelink"))}</div>
			<div>
				<input 	onclick="callAjaxReset()"
						class="btn btn-primary button_compte"
						id="submit_youtube_state2_reset"
						name="submit_youtube_state2_reset"
						type="button"
						value="{$t::getTraduction( "Youtube_State2_Reset")}"/>
			</div>
		</div>
		<div id="youtube_state3" class="DigitalSignage4_display_none">
			<div>{$t::getTraduction( "Youtube_State3_Ok")}</div>
			<div>
				<input 	onclick="callAjaxReset()"
						class="btn btn-primary button_compte"
						id="submit_youtube_state3_reset"
						name="submit_youtube_state3_reset"
						type="button"
						value="{$t::getTraduction( "Youtube_State3_Reset")}"/>
			</div>
		</div>
		

    </div>
<br/><input class="btn btn-primary  button_compte" name="Youtube_button" id="submit_youtube_btn" type="submit"
               value="{$t::getTraduction( "Enregistrer")}"/>


</form>

<script>

    

    
	
	var id_forfait = {($forfait)?$forfait->getId():0};
	
	async function callAjaxReset()
	{
		if (confirm('Confirmez-vous la réinitialisation du lien Youtube ?'))
        {
			if (id_forfait != 0)
			{
				fetch("{$youtubeAPIUrl}", {
					method: 'POST',
					body: JSON.stringify({
				"action": "resetStatus",
				"idForfait": id_forfait
				})
				}).then(res=>res.text())
					.then(function (data) {
						dataJson = JSON.parse(data);
						if (dataJson.response_code = 200)
						{
							document.getElementById("youtube_state1").style.display = "none";
							document.getElementById("youtube_state2").style.display = "none";
							document.getElementById("youtube_state3").style.display = "none";
							document.getElementById("youtube_state0").style.display = "block";
						}
					});
			}
		}
	}
	
	async function callAjaxGetState()
	{
		if (id_forfait != 0)
		{
			
			fetch("{$youtubeAPIUrl}", {
                method: 'POST',
                body: JSON.stringify({
			   "action": "getStatus",
			   "idForfait": id_forfait
			  })
            }).then(res=>res.text())
                .then(function (data) {
                    dataJson = JSON.parse(data);
					if (dataJson.response_code = 200)
					{
						currentState = dataJson.datas.state;
						document.getElementById("youtube_state0").style.display = "none";
						document.getElementById("youtube_state1").style.display = "none";
						document.getElementById("youtube_state2").style.display = "none";
						document.getElementById("youtube_state3").style.display = "none";
						if (currentState == 0)	document.getElementById("youtube_state0").style.display = "block";
						if (currentState == 1)	document.getElementById("youtube_state1").style.display = "block";
						if (currentState == 2)	document.getElementById("youtube_state2").style.display = "block";
						if (currentState == 3)	document.getElementById("youtube_state3").style.display = "block";

					}
                });
		}
	}

	function readeronload(evt)
	{
		fetch("{$youtubeAPIUrl}", {
                method: 'POST',
                body: JSON.stringify({
			   "action": "setJson",
			   "idForfait": id_forfait,
			   "json": evt.target.result
			  })
            }).then(res=>res.text())
                .then(function (data) {
					dataJson = JSON.parse(data);
					if (dataJson.response_code = 200)
					{
						
						callAjaxGetUrlAuth(true);
						document.getElementById("youtube_state0").style.display = "none";
						document.getElementById("youtube_state2").style.display = "none";
						document.getElementById("youtube_state3").style.display = "none";
						document.getElementById("youtube_state1").style.display = "block";
					}
                });
	}
	
	function callAjaxSetJsonFile()
	{
		if (id_forfait != 0)
		{
			var file = document.getElementById('youtube_json_file').files[0];
			var reader = new FileReader();
			reader.onload = readeronload;
			reader.readAsText(file);
		}
	}
	
	async function callAjaxGetUrlAuth(showPopup = true)
	{
		//console.log('appel callAjaxGetUrlAuth');
		if (id_forfait != 0)
		{
			//console.log('callAjaxGetUrlAuth idForfait = ' + id_forfait);
			fetch("{$youtubeAPIUrl}", {
                method: 'POST',
                body: JSON.stringify({
			   "action": "getUrlAuth",
			   "idForfait": id_forfait
			  })
            }).then(res=>res.text())
                .then(function (data) {
					//console.log('callAjaxGetUrlAuth then');
                    dataJson = JSON.parse(data);
					//console.log('callAjaxGetUrlAuth response_code = ' + dataJson.response_code);
					if (dataJson.response_code = 200)
					{
						
						//console.log(dataJson.datas);
						authUrl = dataJson.datas.authUrl;
						if (showPopup)
						{
							if (confirm('{$t::getTraduction( "Youtube_AuthUrl_PopupText")}'))
							{
								window.open(authUrl, '_blank');
							}
						}
						else
						{
							window.open(authUrl, '_blank');
						}
					}
                });
		}
	}

    function display_youtube() {
        document.getElementById("youtube_is_active").style.display = "none"; //cache le formulaire par defaut
        if (document.getElementById("activ_youtube").checked) { //affiche le formulaire si besoin
            document.getElementById("youtube_is_active").style.display = "block"; //affiche le formulaire
        }
    }
    function display_iframe(display) {
        document.getElementById("youtube_is_testing").style.display = (display?"block":"none");
    }

    callAjaxGetState();

</script>
