Upload File + XHR + PHP

Question

Hi Guys, i'm going crazy trying to upload a file to my server.

I'm using the blob sample as a starter and my function is here below. I also created the php file that doesn't seem to be able to process the file. I appriciate if anyone could correct what i'm missing:

function openImage() {
        // Verify that we are currently not snapped, or that we can unsnap to open the picker
        var currentState = Windows.UI.ViewManagement.ApplicationView.value;
        if (currentState === Windows.UI.ViewManagement.ApplicationViewState.snapped && !Windows.UI.ViewManagement.ApplicationView.tryUnsnap()) {
            // fail gracefully if we can't unsnap
            WinJS.log && WinJS.Log("This functionality requires the app to not be snapped", "sample", "status");
            return;
        }

        var picker = new Windows.Storage.Pickers.FileOpenPicker();
        picker.fileTypeFilter.replaceAll([".jpg", ".bmp", ".gif", ".png"]);
        picker.pickSingleFileAsync().done(function (file) {
            // Check that the picker returned a file. The picker will return null if the user clicked cancel.
            if (file) {
                var imageBlobUrl = URL.createObjectURL(file, {oneTimeOnly: true});
                document.getElementById("image").src = imageBlobUrl;
                console.log("send");

            //HERE IS THE PROBLEM
                WinJS.xhr({ type: "POST", url: "http://localhost/upload.php", data: file });

                // Show status
                actionsChangeVisibility("visible");
                WinJS.log && WinJS.log("The src of Image has been set to: " + imageBlobUrl, "sample", "status");
            }
            else {
                WinJS.log && WinJS.log("No file was selected", "sample", "status");
            }
        }, BlobSample.asyncError);
    }

my upload.php:

$blob = (isset($_POST['data']) ? $_POST['data'] : false);
if ($blob) {
file_put_contents($blob, file_get_contents($blob));
}

please help, i'm stuck on this for days :)