File "coucou02.php"

Full Path: /home/analogde/www/Prog/File explorer/coucou02.php
File size: 19.69 KB
MIME-type: text/x-php
Charset: utf-8

<?php

session_start();

/*
if (  isset($_POST['non_visible']) && $_POST['non_visible'] == "retour" )
{

        echo "Binho ....";

        $data = json_decode($_COOKIE['cookie'], true);

        echo " +++++ " . $data;

        echo "<br><br>";

        echo $_COOKIE["cookie"];

        echo " Redirection en court .... <<<<<<<< " .$_SESSION['url_retour'];

        header("Location: " .$_SESSION['url_retour'] );
        sleep(10);
        exit();
}
    echo "Coucou...";

    echo " ------>>>> " .$_GET['p'];

    echo "<br><br>";

    $url_encode = urlencode($_GET['p']);

    $cookie_name = "cookie";
    $cookie_value = "Zoulou" ; //$_GET['p'];

    $pipo = $_GET['p'];

    setcookie("cookie", $pipo , time() + 86400 ); // 86400 = 1 day

    var_dump($_COOKIE);

    $_SESSION['url_retour'] = $_GET['p'];

    echo '<a href=' .$url_encode .'>  Click Here to Redirect</a>';

    */
?>

<style>
* {
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
}



body {
    font-family: -apple-system, BlinkMacSystemFont, Roboto, Segoe UI,
        Helvetica Neue, Helvetica, Arial, sans-serif;
    margin: 0 auto;
    -webkit-font-smoothing: antialiased;
    box-sizing: border-box;
    color: #2f2f2f;
    line-height: 1.5;
}

.ath_container {
    width: 740px;
    margin: 20px auto;
    padding: 0px 20px 0px 20px;
}

.ath_container {
    width: 820px;
    border: #d7d7d7 1px solid;
    border-radius: 5px;
    padding: 10px 20px 10px 20px;
    box-shadow: 0 0 5px rgba(0, 0, 0, .3);
    /* border-radius: 5px; */
}

/*
#uploadStatus {
    color: #00e200;
}

.ath_container a {
    text-decoration: none;
    color: #2f20d1;
}

.ath_container a:hover {
    text-decoration: underline;
}

.ath_container img {
    height: auto;
    max-width: 100%;
    vertical-align: middle;
}


.ath_container .label {
    color: #565656;
    margin-bottom: 2px;
}
*/

/*
.ath_container .message {
    padding: 6px 20px;
    font-size: 1em;
    color: rgb(40, 40, 40);
    box-sizing: border-box;
    margin: 0px;
    border-radius: 3px;
    width: 100%;
    overflow: auto;
}

.ath_container .error {
    padding: 6px 20px;
    border-radius: 3px;
    background-color: #ffe7e7;
    border: 1px solid #e46b66;
    color: #dc0d24;
}

.ath_container .success {
    background-color: #48e0a4;
    border: #40cc94 1px solid;
    border-radius: 3px;
    color: #105b3d;
}

.ath_container .validation-message {
    color: #e20900;
}

.ath_container .font-bold {
    font-weight: bold;
}

.ath_container .display-none {
    display: none;
}

.ath_container .inline-block {
    display: inline-block;
}

.ath_container .float-right {
    float: right;
}

.ath_container .float-left {
    float: left;
}

.ath_container .text-center {
    text-align: center;
}

.ath_container .text-left {
    text-align: left;
}

.ath_container .text-right {
    text-align: right;
}

.ath_container .full-width {
    width: 100%;
}

.ath_container .cursor-pointer {
    cursor: pointer;
}

.ath_container .mr-20 {
    margin-right: 20px;
}

.ath_container .m-20 {
    margin: 20px;
}

.ath_container table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: 1px solid #ddd;
    margin-top: 20px;
}
*/
/*
.ath_container table th,
.ath_container table td {
    text-align: left;
    padding: 5px;
    border: 1px solid #ededed;
    width: 50%;
}

tr:nth-child(even) {
    background-color: #f2f2f2
}
*/
/*
.ath_container .progress {
    margin: 20px 0 0 0;
    width: 300px;
    border: 1px solid #ddd;
    padding: 5px;
    border-radius: 5px;
}

.ath_container .progress-bar {
    width: 0%;
    height: 24px;
    background-color: #4CAF50;
    margin-top: 15px;
    border-radius: 12px;
    text-align: center;
    color: #fff;
}
*/
/*
@media all and (max-width: 780px) {
    .ath_container {
        width: auto;
    }
}
*/

/*
.ath_container input,
.ath_container textarea,
.ath_container select {
    box-sizing: border-box;
    width: 200px;
    height: initial;
    padding: 8px 5px;
    border: 1px solid #9a9a9a;
    border-radius: 4px;
}

.ath_container input[type="checkbox"] {
    width: auto;
    vertical-align: text-bottom;
}

.ath_container textarea {
    width: 300px;
}

.ath_container select {
    display: initial;
    height: 30px;
    padding: 2px 5px;
}

.ath_container button,
.ath_container input[type=submit],
.ath_container input[type=button] {
    padding: 8px 30px;
    font-size: 1em;
    cursor: pointer;
    border-radius: 25px;
    color: #ffffff;
    background-color: #6213d3;
    border-color: #9554f1 #9172bd #4907a9;
}

.ath_container input[type=submit]:hover {
    background-color: #f7c027;
}

::placeholder {
    color: #bdbfc4;
}

.ath_container label {
    display: block;
    color: #565656;
}
*/
/*
@media all and (max-width: 400px) {
    .ath_container {
        padding: 0px 20px;
    }

    .ath_container {
        width: auto;
    }

    .ath_container input,
    .ath_container textarea,
    .ath_container select {
        width: 100%;
    }
}
*/
</style>    

<style>
    
.upload_form_cont {
    /*
    background: -moz-linear-gradient(#ffffff, #f2f2f2);
    background: -ms-linear-gradient(#ffffff, #f2f2f2);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f2f2f2));
    background: -webkit-linear-gradient(#ffffff, #f2f2f2);
    background: -o-linear-gradient(#ffffff, #f2f2f2);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f2f2f2');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f2f2f2')";

    background: linear-gradient(#ffffff, #f2f2f2);
*/
    color:#000;
    overflow:hidden;
}
#upload_form {
    float:left;
    padding:20px;
    width:700px;
}
#preview {
    background-color:#fff;
    display:block;
    float:right;
    width:200px;
}
#upload_form > div {
    margin-bottom:10px;
}
#speed,#remaining {
    float:left;
    width:100px;
}
#b_transfered {
    float:right;
    text-align:right;
}
.clear_both {
    clear:both;
}
input {
    border-radius:10px;
    -moz-border-radius:10px;
    -ms-border-radius:10px;
    -o-border-radius:10px;
    -webkit-border-radius:10px;

    border:1px solid #ccc;
    font-size:14pt;
    padding:5px 10px;
}
/*
input[type=button] {
    background: -moz-linear-gradient(#ffffff, #dfdfdf);
    background: -ms-linear-gradient(#ffffff, #dfdfdf);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #dfdfdf));
    background: -webkit-linear-gradient(#ffffff, #dfdfdf);
    background: -o-linear-gradient(#ffffff, #dfdfdf);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dfdfdf');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dfdfdf')";
    background: linear-gradient(#ffffff, #dfdfdf);
}*/
#image_file {
    width:400px;
}
#progress_info {
    font-size:10pt;
}
#fileinfo,#error,#error2,#abort,#warnsize,#nofile {
    color:#aaa;
    display:none;
    font-size:10pt;
    font-style:italic;
    margin-top:10px;
}
#progress {
    border:1px solid #ccc;
    display:none;
    float:left;
    height:14px;

    border-radius:10px;
    -moz-border-radius:10px;
    -ms-border-radius:10px;
    -o-border-radius:10px;
    -webkit-border-radius:10px;

    background: -moz-linear-gradient(#66cc00, #4b9500);
    background: -ms-linear-gradient(#66cc00, #4b9500);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #66cc00), color-stop(100%, #4b9500));
    background: -webkit-linear-gradient(#66cc00, #4b9500);
    background: -o-linear-gradient(#66cc00, #4b9500);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#66cc00', endColorstr='#4b9500');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#66cc00', endColorstr='#4b9500')";
    background: linear-gradient(#66cc00, #4b9500);
}
#progress_percent {
    float:right;
}
#upload_response {
    margin-top: 10px;
    padding: 20px;
    overflow: hidden;
    display: none;
    border: 1px solid #ccc;

    border-radius:10px;
    -moz-border-radius:10px;
    -ms-border-radius:10px;
    -o-border-radius:10px;
    -webkit-border-radius:10px;

    box-shadow: 0 0 5px #ccc;
    background: -moz-linear-gradient(#bbb, #eee);
    background: -ms-linear-gradient(#bbb, #eee);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #bbb), color-stop(100%, #eee));
    background: -webkit-linear-gradient(#bbb, #eee);
    background: -o-linear-gradient(#bbb, #eee);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bbb', endColorstr='#eee');
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#bbb', endColorstr='#eee')";
    background: linear-gradient(#bbb, #eee);
}
</style>

<script>
// common variables
var fileName ='';
var iBytesUploaded = 0;
var iBytesTotal = 0;
var iPreviousBytesLoaded = 0;
var iMaxFilesize = 10485760; // 10MB
var oTimer = 0;
var sResultFileSize = '';

function secondsToTime(secs)
{ 
			// we will use this function to convert seconds in normal time format
			var hr = Math.floor(secs / 3600);
			var min = Math.floor((secs - (hr * 3600))/60);
			var sec = Math.floor(secs - (hr * 3600) -  (min * 60));

			if (hr < 10) {hr = "0" + hr; }
			if (min < 10) {min = "0" + min;}
			if (sec < 10) {sec = "0" + sec;}
			if (hr) {hr = "00";}
			return hr + ':' + min + ':' + sec;
};

function bytesToSize(bytes)
{
			var sizes = ['Bytes', 'KB', 'MB'];
			if (bytes == 0) return 'n/a';
			var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)));
			return (bytes / Math.pow(1024, i)).toFixed(1) + ' ' + sizes[i];
};

function fileSelected()
{

    // hide different warnings
    document.getElementById('upload_response').style.display = 'none';
    document.getElementById('error').style.display = 'none';
    document.getElementById('error2').style.display = 'none';
    document.getElementById('abort').style.display = 'none';
    document.getElementById('warnsize').style.display = 'none';
    document.getElementById('nofile').style.display = 'none';

    // get selected file element
    var oFile = document.getElementById('image_file').files[0];

    fileName = oFile;

    // filter for image files
    //var rFilter = /^(image\/bmp|image\/gif|image\/jpeg|image\/png|image\/tiff)$/i;
    //if (! rFilter.test(oFile.type)) {
    //   document.getElementById('error').style.display = 'block';
    //    return;
    //}

    //if( document.getElementById("videoUploadFile").files.length == 0 )
    //{
    //    console.log("no files selected");
    //}

       
			if (oFile.size > iMaxFilesize) 
			{
				document.getElementById('warnsize').style.display = 'block';
				return;
			}

			else
			{
	
					// get preview element
					//var oImage = document.getElementById('preview');

					// prepare HTML5 FileReader
					var oReader = new FileReader();
				
					oReader.onload = function(e)
					{

						// e.target.result contains the DataURL which we will use as a source of the image
						oImage.src = e.target.result;

						oImage.onload = function () { // binding onload event

							// we are going to display some custom image information here
							sResultFileSize = bytesToSize(oFile.size);
							document.getElementById('fileinfo').style.display = 'block';
							document.getElementById('filename').innerHTML = 'Name: ' + oFile.name;
							document.getElementById('filesize').innerHTML = 'Size: ' + sResultFileSize;
							document.getElementById('filetype').innerHTML = 'Type: ' + oFile.type;
							document.getElementById('filedim').innerHTML = 'Dimension: ' + oImage.naturalWidth + ' x ' + oImage.naturalHeight;
						};
					};

					// read selected file as DataURL
					oReader.readAsDataURL(oFile);
			}
     		
}

function startUploading() 
{
   if (fileName.length == 0 )
   {
       //alert(" ++++++ Aucun fichier !"); 
       document.getElementById('nofile').style.display = 'block';
       document.getElementById('nofile').innerHTML = "Aucun fichier n'a été selectionné !.";
   }

   else
   {
        // cleanup all temp states
        iPreviousBytesLoaded = 0;
        document.getElementById('upload_response').style.display = 'none';
        document.getElementById('error').style.display = 'none';
        document.getElementById('error2').style.display = 'none';
        document.getElementById('abort').style.display = 'none';
        document.getElementById('warnsize').style.display = 'none';
        document.getElementById('progress_percent').innerHTML = '';
        var oProgress = document.getElementById('progress');
        oProgress.style.display = 'block';
        oProgress.style.width = '0px';

        // get form data for POSTing
        //var vFD = document.getElementById('upload_form').getFormData(); // for FF3
        var vFD = new FormData(document.getElementById('upload_form')); 

        // create XMLHttpRequest object, adding few event listeners, and POSTing our data
        var oXHR = new XMLHttpRequest();        
        oXHR.upload.addEventListener('progress', uploadProgress, false);
        oXHR.addEventListener('load', uploadFinish, false);
        oXHR.addEventListener('error', uploadError, false);
        oXHR.addEventListener('abort', uploadAbort, false);
        oXHR.open('POST', 'test_upload.php');
        oXHR.send(vFD);

        // set inner timer
        oTimer = setInterval(doInnerUpdates, 300);
    }

}

function doInnerUpdates() { // we will use this function to display upload speed
    var iCB = iBytesUploaded;
    var iDiff = iCB - iPreviousBytesLoaded;

    // if nothing new loaded - exit
    if (iDiff == 0)
        return;

    iPreviousBytesLoaded = iCB;
    iDiff = iDiff * 2;
    var iBytesRem = iBytesTotal - iPreviousBytesLoaded;
    var secondsRemaining = iBytesRem / iDiff;

    // update speed info
    var iSpeed = iDiff.toString() + 'B/s';
    if (iDiff > 1024 * 1024) {
        iSpeed = (Math.round(iDiff * 100/(1024*1024))/100).toString() + 'MB/s';
    } else if (iDiff > 1024) {
        iSpeed =  (Math.round(iDiff * 100/1024)/100).toString() + 'KB/s';
    }

    document.getElementById('speed').innerHTML = iSpeed;
    document.getElementById('remaining').innerHTML = '| ' + secondsToTime(secondsRemaining);        
}

function uploadProgress(e) { // upload process in progress
    if (e.lengthComputable) {
        iBytesUploaded = e.loaded;
        iBytesTotal = e.total;
        var iPercentComplete = Math.round(e.loaded * 100 / e.total);
        var iBytesTransfered = bytesToSize(iBytesUploaded);

        document.getElementById('progress_percent').innerHTML = iPercentComplete.toString() + '%';
        document.getElementById('progress').style.width = (iPercentComplete * 4).toString() + 'px';
        document.getElementById('b_transfered').innerHTML = iBytesTransfered;
        if (iPercentComplete == 100) {
            var oUploadResponse = document.getElementById('upload_response');
            oUploadResponse.innerHTML = '<h1>Patienter...envoi en cours</h1>';
            oUploadResponse.style.display = 'block';
        }
    } else {
        document.getElementById('progress').innerHTML = 'unable to compute';
    }
}

function uploadFinish(e) { // upload successfully finished
    var oUploadResponse = document.getElementById('upload_response');
    oUploadResponse.innerHTML = e.target.responseText;
    oUploadResponse.style.display = 'block';

    document.getElementById('progress_percent').innerHTML = '100%';
    document.getElementById('progress').style.width = '400px';
    document.getElementById('filesize').innerHTML = sResultFileSize;
    document.getElementById('remaining').innerHTML = '| 00:00:00';

    clearInterval(oTimer);
}

function uploadError(e) { // upload error
    document.getElementById('error2').style.display = 'block';
    clearInterval(oTimer);
}  

function uploadAbort(e) { // upload abort
    document.getElementById('abort').style.display = 'block';
    clearInterval(oTimer);
}

</script>

<!--
    <div class="ath_container tile-container ">
        <div id="uploadStatus"></div>
        <h2 style="margin-bottom:10px">AJAX File Upload with Progress Bar using JavaScript</h2>
        <input type="file" id="fileUpload" multiple /> 
        <br>
        <br>
        <button onclick="uploadFiles()">Upload</button> 
        <div>
            <table id="progressBarsContainer">
            </table>
        </div> 
        <br>
    </div>
-->


<!--    
    <form method="post" action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>">  
        <input type="hidden" id="non_visible" name="non_visible" value="retour">
        <input type="submit" name="submit" value="Submit">  
    </form>
-->

<div class="ath_container tile-container ">

<!--
<div class="container">
-->       

          <div class="upload_form_cont">
              <form id="upload_form" enctype="multipart/form-data" method="post" action="upload.php">
                  <div>
                      <div><label for="image_file">Choisir un fichier</label></div>
                      <div><input type="file" name="image_file" id="image_file" onchange="fileSelected();" /></div>
                  </div>
                  <div>
                      <input type="button" value="Télécharger" onclick="startUploading()" />
                  </div>
                  <div id="fileinfo">
                      <div id="filename"></div>
                      <div id="filesize"></div>
                      <div id="filetype"></div>
                      <div id="filedim"></div>
                  </div>
                  <div id="error">You should select valid image files only!</div>
                  <div id="error2">An error occurred while uploading the file</div>
                  <div id="abort">The upload has been canceled by the user or the browser dropped the connection</div>
                  <div id="warnsize">Your file is very big. We can't accept it. Please select more small file</div>
                  <div id="nofile">blabla</div>


                  <div id="progress_info">
                      <div id="progress"></div>
                      <div id="progress_percent">&nbsp;</div>
                      <div class="clear_both"></div>
                      <div>
                          <div id="speed">&nbsp;</div>
                          <div id="remaining">&nbsp;</div>
                          <div id="b_transfered">&nbsp;</div>
                          <div class="clear_both"></div>
                      </div>
                      <div id="upload_response"></div>
                  </div>
              </form>
<!--
              <img id="preview" />
-->              
          </div>
    <!--
        </div>
-->
</div>


<html>
   <head>
   <meta charset="UTF-8">
      <script type="text/javascript">
         function Redirect() {

            var variableRecuperee = <?php echo json_encode($_GET['p']); ?>;

            //location.href="https://www.tutorix.com";

            location.href = variableRecuperee; 

         }
      </script>
   </head>
   <body>

      <!--   
      <p>Click the following button to redirect to tutorix.com.</p>
        -->
      <form>
         <input type="button" value="Retour " onclick="Redirect();" />
      </form>
   </body>
</html>