<?php

$id = $_GET['id'];
//echo $id;
$curl = curl_init();

  curl_setopt_array($curl, array(
    CURLOPT_URL => 'https://api-us-east-1.graphcms.com/v2/ckkxmrn6cw3ga01ywc1spb2qu/master',
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_ENCODING => '',
    CURLOPT_MAXREDIRS => 10,
    CURLOPT_TIMEOUT => 0,
    CURLOPT_FOLLOWLOCATION => true,
    CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
    CURLOPT_CUSTOMREQUEST => 'POST',
    CURLOPT_POSTFIELDS =>'{"query":"query MyQuery {\\r\\n  trackPixelOScripts(where: {id: \\"'.$id.'\\"}) {\\r\\n    id\\r\\n    script\\r\\n    localizations {\\r\\n      id\\r\\n      script\\r\\n    }\\r\\n  }\\r\\n}\\r\\n","variables":{}}',
    CURLOPT_HTTPHEADER => array(
      'Content-Type: application/json',
      'Cookie: __cfduid=da2693cdfd39b7377a8a05e305da45b8f1613001694'
    ),
  ));

$response = curl_exec($curl);

curl_close($curl);
//echo $response;

$jsonrespuesta = json_decode($response, true);
$id = $jsonrespuesta['data']['trackPixelOScripts'][0]['id'];
$scripten = $jsonrespuesta['data']['trackPixelOScripts'][0]['script'];
$scriptes = $jsonrespuesta['data']['trackPixelOScripts'][0]['script'];
?>

<style>
    
.formprod {
	width: 100%;
	float: left;
}
.formprod input, .formprod textarea {
	width: 100%;
	float: left;
	margin: 0;
	min-height: 38px;
	border-radius: 8px;
	border: 1px solid #ccc;
	font-size: 12px;
	padding: 5px 5px 0;
}
.imgprod {
	width: 130px;
	padding-top:15px;
}

#guardarscript, #guardarhorarios, #guardarmod {
	background: #94b300;
	color: #fff;
	float: none;
	width: 100%;
	padding: 10px;
	border-radius: 8px;
	margin: 10px 0;
	font-weight: bold;
	max-width: 100%;
	display: inline-block;
	cursor: pointer;
    transition:.35s all ease;
}
#guardarmeta:hover {
	background: #333;
    transition:.35s all ease;
	color: #fff;
}
.imagendiv {
	float: none;
	width: 190px;
	position: relative;
	padding: 0 5%;
	margin-bottom: 2.5px;
	margin-top: 10px;
}
.image-upload>input {
  display: none;
}
.image-upload {
	width: auto;
	display: inline-block;
	position: absolute;
	left: 120px;
	top: -10px;
}
#descprod {
	height: 100px;
}
.image-upload img {
	width: 30px;
	cursor: pointer;
	transition: .35s all ease;
}
.image-upload img:hover {
	transition:.35s all ease;
    transform: scale(1.1);
}

.formgroup {
	width: 100%;
	float: left;
	text-align: left;
	font-weight: 500;
	color: #222;
	font-size: 12px;
	padding: 5px;
}
.formgroup.peq {
	width: 33%;
	float: right;
}
.formprod select {
	height: 40px;
	font-size: 13px;
	border-radius: 8px;
	border: 1px solid #ccc;
}
.formgroup.imgcont label {
	width: auto;
	position: relative;
	z-index: 1;
}
.addnew {
	float: right;
	margin-top: 20px;
	text-align: left;
	font-size: 14px;
	background: #72af00;
    background: linear-gradient(-45deg, #72af00, #72af00);
	border-radius: 10px;
	color: #fff;
	line-height: 1.2;
	padding-top: 0;
	cursor: pointer;
	padding: 0 20px 15px 10px;
    transition:.35s all ease;
}
.addnew:hover {
	background: linear-gradient(-45deg, #fd9827, #ffc56b);
    transition:.35s all ease;
}
#btneadd {
	padding: 10px;
	height: 30px;
	display: inline-block;
	font-size: 20px;
}
.formgroup.imgcont {
	padding: 5px 10px;
}
p.discimg {
	font-size: 9px;
	text-align: left;
	color: #ccc;
	padding: 0 !important;
	width: 100%;
	float: left;
	margin: 0 !important;
}
.imagendiv .image-upload label {
	background: #dae6ea;
	border-radius: 50%;
	padding: 10px;
	box-shadow: 1px 3px 10px #ccc;
	border: 3px solid #00b594;
}
.waiterror {
	color: red;
	font-weight: bold;
}
.formprod .inputerror {
	border: 2px solid #fd9797;
	border-radius: 8px;
}
#formhorarios .formgroup h4 {
	margin: 0;
	padding: 0;
	font-weight: bold;
	font-size: 15px;
	padding-top: 10px;
	text-align: left;
	width: 50%;
	padding-left: 10px;
	float: left;
}
.inicio, .fin {
	width: 50%;
	float: left;
	padding: 0 7.55px 20px;
}
#formhorarios .formgroup {
	width: 30%;
	float: left;
	text-align: left;
	font-weight: 500;
	color: #222;
	font-size: 12px;
	padding: 5px;
	border-radius: 16px;
	background: #eaeaea;
	margin: 1.33%;
}
.switch_box {
	display: inline-block;
	max-width: 50px;
	min-width: 50px;
	height: auto;
	float: none;
	display: inline-block;
}
/* Switch 1 Specific Styles Start */

.disableday {
	background: #f5e0e0 !important;
}
.disableday .inicio, .disableday .fin {
	pointer-events: none;
	opacity: .6;
}

input[type="checkbox"].switch_1 {
	font-size: 22px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 50px;
	height: 25px;
	background: #ddd;
	border-radius: 20px;
	position: relative;
	cursor: pointer;
	outline: none;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	min-height: 20px;
}
  input[type="checkbox"].switch_1:checked{
	background: #72ac42;
  }
  input[type="checkbox"].switch_1::after {
	position: absolute;
	content: "";
	width: 33px;
	height: 33px;
	border-radius: 50%;
	background: #fff;
	-webkit-box-shadow: 0 0 .25em rgba(0,0,0,.3);
	box-shadow: 0 0 .25em rgba(0,0,0,.3);
	-webkit-transform: scale(.7);
	transform: scale(.7);
	left: -4.5px;
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
	top: -5px;
}
input[type="checkbox"].switch_1:checked::after {
	left: 20px;
}
	
/* Switch 1 Specific Style End */


.switch {
	width: 50%;
	float: left;
	padding-top: 10px;
	text-align: right;
	padding-right: 10px;
	font-weight: 500;
	font-size: 11px;
}
.switch p {
	font-weight: 500;
	font-size: 11px;
	width: auto;
	float: none;
	/* text-align: right; */
	display: inline-block;
	padding: 5px;
	padding-right: 10px;
	transform: translateY(-7.5px);
}
.popUpHorarios .pocont {
	max-width: 1200px;
}
.fullcont {
	width: 100%;
	float: left;
	padding: 10px;
}
.fullcont #guardarmeta {
	max-width: 500px;
}
.timeselector {
	width: 120px;
}
.timeselector-item {
	width: 53.50px;
}
.timeselector-button {
	background: #fff;
	padding: 7px 7px;
}
#respuestadelete {
	width: 100%;
	position: fixed;
	bottom: -250px;
	left: 0;
	text-align: center;
	background: rgba(4, 64, 61, 0.9);
	padding: 20px 20px 10px;
	z-index: 9999;
	box-shadow: 1px 3px 14px #ccc;
	transition: 1s all ease;
}
#respuestadelete.openresp {
	bottom: 0px;
    transition:1s all ease;
}
#listamods {
	width: 100%;
	float: left;
	padding: 15px;
	border-radius: 16px;
	background: #f8f8f8;
	margin-top: 20px;
}
#listamods .platillo {
	width: 22%;
	float: left;
	border-radius: 8px;
	background: #e3e3e3;
	margin: 0 1.5% 30px;
	padding: 10px 10px 15px;
	color: #000;
	font-weight: bold;
	font-size: 15px;
	box-shadow: 1px 2px 8px #d2d2d2;
	border: 1px solid #e2e2e2;
}
.borrabtn {
	cursor: pointer;
}
#listamods .platillo p {
	font-weight: 500;
	font-size: 12px;
	padding: 10px;
	margin: 0;
	padding-top: 0;
    padding: 10px;
}
#addmodcont {
	width: 100%;
	float: left;
	padding: 10px;
	color: #222;
	font-weight: 500;
}
#listamods .borrabtn {
	position: absolute;
	right: 0;
	background: #fff;
	padding: 2.5px;
	border-radius: 50%;
	box-shadow: 1px 2px 6px #ccc;
	bottom: -8px;
	width: 30px;
	height: 30px;
}
#listamods .platillo {
	position: relative;
}

</style>
<form class="formprod" id="formprod" enctype="multipart/form-data" autocomplete="off">
        <input name="id" id="idprod" type="hidden" value="">

        
        <div class="formgroup">
            <label for="scriptes">script (ES)*</label>
            <input name="scriptes" type="text" id="scriptes" maxlength="100" placeholder="Al menos 3 caracteres" value="<?php echo $scriptes;?>">
        </div>
        


        <div class="formgroup">
            <label for="scripten">script (EN)*</label>
            <input name="scripten" type="text" id="scripten" maxlength="100" placeholder="Al menos 3 caracteres" value="<?php echo $scripten;?>">
        </div>
        


        <a id="guardarscript" onclick="saveScript('<?php echo $id;?>');">Guardar</a>

    </form>

    <script>
        function saveScript(id){
            var scripten = $("#scripten").val();
            var scriptes = $("#scriptes").val();
           
            $.ajax({
                url : "/admin/gral/updateScript.php",
                type: "POST",
                data : "id="+id+"&scripten="+scripten+"&scriptes="+scriptes,
                success:function(data){
                    $('#respuestascript').html(data);
                    
            }
            });
        }
    </script>