docs/partials/uploader-withvars-source.mustache

	uploader-withvars-source.mustache revision c1cc0c913c4ed9ac3de73aaadd3d0db93d2240df
<style type="text/css">
    .uploadButton a {
        display:block;
        width:100px;
        height:40px;
        text-decoration: none;
    }

    .uploadButton a {
        background: url("{{componentAssets}}/uploadFileButton.png") 0 0 no-repeat;
    }

    .uploadButton a:visited {
        background-position: 0 0;
    }

    .uploadButton a:hover {
        background-position: 0 -40px;
    }

    .uploadButton a:active {
        background-position: 0 -80px;
    }
</style>

<div id="selectButton" style="width:100px;height:40px"></div>
<div class="uploadButton"><a href="#" id="uploadButtonLink"></a></div>

<div id="filename">
File selected:
</div>
<div id="percent">
Percent uploaded:
</div>
<div>Sending via GET: foo='bar', foo1='bar1'</div>
<div>Sending via POST: bar='bazz', bar1='bazz1'</div>
<div id="result">Data returned from the server:</div>

<script>

YUI({filter:"raw"}).use('uploader', function (Y) {

var swfURL = Y.Env.cdn + "uploader/assets/uploader.swf";

if (Y.UA.ie >= 7) {
    swfURL += "?t=" + Y.guid();
}

var uploader = new Y.Uploader({boundingBox:"#selectButton",
                               buttonSkin:"{{componentAssets}}/selectFileButton.png",
                               transparent: false,
                               swfURL: swfURL
                               });

uploader.on("uploaderReady", setupUploader);
uploader.on("fileselect", fileSelect);
uploader.on("uploadprogress", updateProgress);
uploader.on("uploadcomplete", uploadComplete);
uploader.on("uploadcompletedata", uploadCompleteData);

Y.one("#uploadButtonLink").on("click", uploadFile);


function setupUploader (event) {
    uploader.set("multiFiles", false);
    uploader.set("log", true);

    var fileFilters = new Array({description:"Images", extensions:"*.jpg;*.png;*.gif"},
                       {description:"Videos", extensions:"*.avi;*.mov;*.mpg"});

    uploader.set("fileFilters", fileFilters);
}


function fileSelect (event) {
    var fileData = event.fileList;

    for (var key in fileData) {
        var output = "File selected: " + fileData[key].name;
        Y.one("#filename").setContent(output);
    }
}

function updateProgress (event) {
    Y.one("#percent").setContent("Percent uploaded: " + Math.round((100 * event.bytesLoaded / event.bytesTotal)) + "%");
}

function uploadComplete (event) {
    Y.one("#percent").setContent("Upload complete!");
}

function uploadCompleteData (event) {
    Y.one("#result").setContent("Data returned from the server:<br>" + event.data);
}

function uploadFile (event) {
    uploader.uploadAll("http://www.yswfblog.com/upload/upload.php?foo=bar&foo1=bar1", "POST", {bar:"bazz", bar1:"bazz1"});
}


});

</script>