SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Evangelist
    Join Date
    Jun 2010
    Location
    Israel
    Posts
    523
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    Need help understanding a small script (file uploads)

    Hey guys, i found this script a while ago when googling for multiple file uploads, its a nice script but i really find it hard to understand how it works
    For instance, i wanna know how do i know when the script has finished, when it finishes uploading i want to redirect to another page for example.

    Here is the script:
    Code JavaScript:
    var sendFile = 4096000;
    sendFile = (function(toString, maxSize){
        var isFunction = function(Function){return  toString.call(Function) === "[object Function]";},
            split = "onabort.onerror.onloadstart.onprogress".split("."),
            length = split.length;
        return  function(handler){
            if(maxSize && maxSize < handler.file.fileSize){
                if(isFunction(handler.onerror))
                    handler.onerror();
                return;
            };
            var xhr = new XMLHttpRequest,
                upload = xhr.upload;
            for(var
                xhr = new XMLHttpRequest,
                upload = xhr.upload,
                i = 0;
                i < length;
                i++
            )
                upload[split[i]] = (function(event){
                    return  function(rpe){
                        if(isFunction(handler[event]))
                            handler[event].call(handler, rpe, xhr);
                    };
                })(split[i]);
            upload.onload = function(rpe){
                if(handler.onreadystatechange === false){
                    if(isFunction(handler.onload))
                        handler.onload(rpe, xhr);
                } else {
                    setTimeout(function(){
                        if(xhr.readyState === 4){
                            if(isFunction(handler.onload))
                                handler.onload(rpe, xhr);
                        } else
                            setTimeout(arguments.callee, 15);
                    }, 15);
                }
            };
            xhr.open("post", handler.url || "?upload=true", true);
            xhr.setRequestHeader("If-Modified-Since", "Mon, 26 Jul 1997 05:00:00 GMT");
            xhr.setRequestHeader("Cache-Control", "no-cache");
            xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
            xhr.setRequestHeader("X-File-Name", handler.file.fileName);
            xhr.setRequestHeader("X-File-Size", handler.file.fileSize);
            xhr.setRequestHeader("Content-Type", "multipart/form-data");
            xhr.send(handler.file);
            return  handler;
        };
    })(Object.prototype.toString, sendFile);
    function sendMultipleFiles(handler){
        var length = handler.files.length,
            i = 0,
            onload = handler.onload;
        handler.current = 0;
        handler.total = 0;
        handler.sent = 0;
        while(handler.current < length)
            handler.total += handler.files[handler.current++].fileSize;
        handler.current = 0;
        if(length){
            handler.file = handler.files[handler.current];
            sendFile(handler).onload = function (rpe, xhr) {
                if (++handler.current < length) {
                    if (handler.current == length-1) {
                        xhr2 = new XMLHttpRequest;
                        xhr2.open("post", handler.url || "?subm=true", true);
                        xhr2.send();
                    }
                    handler.sent += handler.files[handler.current - 1].fileSize;
                    handler.file = handler.files[handler.current];
                    sendFile(handler).onload = arguments.callee;
                } else if (onload) {
                    handler.onload = onload;
                    handler.onload(rpe, xhr);
                }
            };
        };
        return  handler;
    };

    Here's how it gets triggered:
    Code JavaScript:
    onload = function () {
        function size(bytes) {
            var i = 0;
            while (1023 < bytes) {
                bytes /= 1024;
                ++i;
            };
            return i ? bytes.toFixed(2) + ["", " Kb", " Mb", " Gb", " Tb"][i] : bytes + " bytes";
        };
        var input = document.getElementById("pic"),
    	sub = document.getElementById("a1").appendChild(document.createElement("span")),
    	bar = document.getElementById("a2").appendChild(document.createElement("span")),
    	div = document.getElementById("a3"),
        subm = document.getElementById("submit");
        subm.addEventListener("click", function () {
            input.setAttribute("disabled", "true");
            sendMultipleFiles(
    	{
    		files: input.files,
    		onloadstart: function () {
    		    div.innerHTML = "מתחיל העלאה";
    		    sub.style.width = bar.style.width = "0px";
    		},
    		onprogress: function (rpe) {
    		    div.innerHTML = ["מעלה: " + this.file.fileName,"נשלח: " + size(rpe.loaded) + " מתוך " + size(rpe.total),"סך הכל העלאה: " + size(this.sent + rpe.loaded) + " מתוך " + size(this.total)," אנא המתן עד שתופיע הודעה שהנתונים הועלו בהצלחה."].join("<br />");
    		    sub.style.width = ((rpe.loaded * 200 / rpe.total) >> 0) + "px";
    		    bar.style.width = (((this.sent + rpe.loaded) * 200 / this.total) >> 0) + "px";
    		},
    		onload: function (rpe, xhr) {
    		    div.innerHTML += ["","✔ העלאת הנתונים הושלמה."].join("<br />");
    		    sub.style.width = bar.style.width = "200px";
    		    input.removeAttribute("disabled");
    		},
    		onerror: function () {
    			div.innerHTML = "הקובץ: " + this.file.fileName + " גדול מדי, העלאה נכשלה.";
    		    input.removeAttribute("disabled");
    		}
    	});
        }, false);
    };

    Thanks for the help
    ulthane.

  2. #2
    SitePoint Evangelist
    Join Date
    Jun 2010
    Location
    Israel
    Posts
    523
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    Nvm i got it done...


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •