georg90/upload.html

## upload.html
<!--
Change API Token
Change URL
-->
<html lang="en">
    <head>
        <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.0/sweetalert.min.js"></script> <!-- for nice alerts -->
        <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.0/sweetalert.min.css">
    </head>
<body>
<center>
<h1>Upload to koken</h1>
<form enctype="multipart/form-data">
    <input id="uploadfile" type="file" />
    <input type="submit" value="Upload" />
</form>
<progress id="progress"></progress>
</center>
<script type="text/javascript">
$(progress).hide();
var api_url = "https://YOURURL/path/to/koken/api.php?"


// handle file
var files;
$('form').on('submit', uploadFiles);

function uploadFiles(event)
{
    event.stopPropagation(); // Stop stuff happening
    event.preventDefault(); // Totally stop stuff happening

    // START A LOADING SPINNER HERE
    $('#progress').show();

    // Create a formdata object and add the files
    var file_data = $('#uploadfile').prop('files')[0];
    var formData = new FormData();
    formData.append('file', file_data);
    formData.append('visibility', 'public');
    formData.append('name', file_data['name']);
    formData.append('upload_session_start', $.now());
    formData.append('license', 'all');
    formData.append('max_download', 'none');
    formData.append('license', 'all');
    $.ajax({
        url: api_url + '/content',
        type: 'POST',
        headers: {
       		 "X-Koken-Token": 'YOURAPITOKEN'
    	},
        data: formData,
        cache: false,
        processData: false, // Don't process the files
        contentType: false, // Set content type to false as jQuery will tell the server its a query string request
        success: function(data, textStatus, jqXHR)
        {
            if(typeof data.error === 'undefined')
            {
                $("#uploadfile").val('');
                $(progress).hide();
                // Success so call function to process the form
                $(document).ready(function () {
                swal({
                    title: "Bild erfolgreich hochgeladen!",
                    timer: 2000,
                    type: "success"
                }); });
            }
            else
            {
                $("#uploadfile").val('');
                $(progress).hide();
                $(document).ready(function () {
                swal({
                    title: "Bild NICHT hochgeladen!",
                    timer: 2000,
                    type: "error"
                }); });
                // Handle errors here
                console.log('ERRORS: ' + data.error);
            }
        },
        error: function(jqXHR, textStatus, errorThrown)
        {
            $("#uploadfile").val('');
            // Handle errors here
            console.log('ERRORS: ' + textStatus);
            console.log('real error');
            // STOP LOADING SPINNER
            $(progress).hide();
        }
    });
}
</script>
</body>
	<!--
	Change API Token
	Change URL
	-->
	<html lang="en">
	<head>
	<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.0/sweetalert.min.js"></script> <!-- for nice alerts -->
	<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.0/sweetalert.min.css">
	</head>
	<body>
	<center>
	<h1>Upload to koken</h1>
	<form enctype="multipart/form-data">
	<input id="uploadfile" type="file" />
	<input type="submit" value="Upload" />
	</form>
	<progress id="progress"></progress>
	</center>
	<script type="text/javascript">
	$(progress).hide();
	var api_url = "https://YOURURL/path/to/koken/api.php?"


	// handle file
	var files;
	$('form').on('submit', uploadFiles);

	function uploadFiles(event)
	{
	event.stopPropagation(); // Stop stuff happening
	event.preventDefault(); // Totally stop stuff happening

	// START A LOADING SPINNER HERE
	$('#progress').show();

	// Create a formdata object and add the files
	var file_data = $('#uploadfile').prop('files')[0];
	var formData = new FormData();
	formData.append('file', file_data);
	formData.append('visibility', 'public');
	formData.append('name', file_data['name']);
	formData.append('upload_session_start', $.now());
	formData.append('license', 'all');
	formData.append('max_download', 'none');
	formData.append('license', 'all');
	$.ajax({
	url: api_url + '/content',
	type: 'POST',
	headers: {
	"X-Koken-Token": 'YOURAPITOKEN'
	},
	data: formData,
	cache: false,
	processData: false, // Don't process the files
	contentType: false, // Set content type to false as jQuery will tell the server its a query string request
	success: function(data, textStatus, jqXHR)
	{
	if(typeof data.error === 'undefined')
	{
	$("#uploadfile").val('');
	$(progress).hide();
	// Success so call function to process the form
	$(document).ready(function () {
	swal({
	title: "Bild erfolgreich hochgeladen!",
	timer: 2000,
	type: "success"
	}); });
	}
	else
	{
	$("#uploadfile").val('');
	$(progress).hide();
	$(document).ready(function () {
	swal({
	title: "Bild NICHT hochgeladen!",
	timer: 2000,
	type: "error"
	}); });
	// Handle errors here
	console.log('ERRORS: ' + data.error);
	}
	},
	error: function(jqXHR, textStatus, errorThrown)
	{
	$("#uploadfile").val('');
	// Handle errors here
	console.log('ERRORS: ' + textStatus);
	console.log('real error');
	// STOP LOADING SPINNER
	$(progress).hide();
	}
	});
	}
	</script>
	</body>