var j = jQuery.noConflict();    //so jquery does not conflict with prototype
var noFlashUploadCount = 0;    // The number of noFlash uploads currently in progress
j(document).ready(function() {
    // uploader intialization
    // if #uploadBtn exists, then Iframe or xml http request uploading is used
    // if not, use the flash uploader
    if (!j('#uploadBtn').length) {
        initUploadify();
    } else {
        initIframeXhrUploader();
    }
    initDragAndDrop();    
    
    j('#linkStartUpload').bind("click", function() {j('#uploader').uploadifyUpload()});
    j('#linkClearQueue').bind("click",  function() {j('#uploader').uploadifyClearQueue()});
    j('#linkCancelAllUploads').bind("click", function() {j('#uploader').uploadifyClearQueue()});
    j('#clearUpload').bind("click", uploadList.clearUploadList);
    j('#cancelUpload').bind("click", uploadList.cancelUploadList);    
    
    j('.remove').live("click", function() {uploadList.removeUploadedFile(j(this).parent(), false)});

    uploadList.initOrientationData();
});

function initDragAndDrop() {
    //initialize droppable elements
    j('.droppable').each(function (index) {
        j(this).droppable(droppableOptions);
    });
    
    //disable droppable for sides that has a image
    //j('.ui-droppable-disabled').each(function(index) {
    //    j(this).droppable('option', 'disabled', true);  //to remove droppable option on this element
    //});
    
    //initialize draggable elements (if any)
    j('.ufile').each(function (index) {
        j(this).draggable(draggableOptions);
    });
    
    j('.remove').each( function() {
            j(this).bind({
                click: function() {
                    j(this).next(".dropped").fadeOut(1000, function() {j(this).remove()});
                    j(this).parent().removeClass('dropped').removeClass('droppable-highlight').unbind("mouseover");
                    j(this).hide();
                }
            });
    });
}

function initUploadify() {
    var totalBytes = 0;
    // !IMPORTANT get the session id from cookie info
    var start = document.cookie.indexOf("ONPSESS=");
    var end = document.cookie.indexOf(";", start); // First ; after start
    if (end == -1) end = document.cookie.length; // failed indexOf = -1
    var cookie = document.cookie.substring(start+8, end);
   
    j('#uploader').uploadify({
        'auto'       : true,
        'uploader'   : 'swf/uploadify/uploadify.swf',
        'script'     : 'main.php?X=fileUpload',        
        'buttonImg'  : 'img1/uploadify/add_files2.gif',
        'width'      : 170,
        'height'     : 32,
        'rollover'   : false,
		'sizeLimit'  : 104857600,
        'cancelImg'  : 'img1/uploadify/cancel.png',
        'displayData': 'speed',
        'buttonText' : 'Select Files',
        'fileDesc'   : '(Images) *.jpg, *.pdf, *.ai, *.aii, *.tif, *.tiff, *.eps, *.png',
        'fileExt'    : '*.jpg;*.pdf;*.ai;*.aii;*.tif;*.tiff;*.eps;*.png',
        'scriptData' : {'PHPSESSID': cookie, 'p': product},
        'onComplete' : function(evt, qId, fileObj, response, data) {
            var responseObj = j.parseJSON(response);
            var uploadFileElement = j('#uploader' + qId);
            
            if (responseObj.status && responseObj.status != 0) {
                //error
                uploadFileElement.addClass('uploadifyError');
                uploadFileElement.children('.progress-text').text(responseObj.error);
                return false;
            }
            if(responseObj.length <= 1) {
                processSinglePageFile(responseObj, uploadFileElement, qId);
            } else {
                processMultiPageFile(responseObj, uploadFileElement, qId);
            }
            return false;
        },
        'onError' : function(evt, qId,fileObj, errObj) {
            j('#uploader' + qId).addClass('uploadifyError');
        },
        'onClearQueue' : function(evt) {
            j('.uploadifyQueueItem').each( function(index) {
                  //console.log('remove:'+j(this).attr('id'));
                  j(this).remove();
             });
            return false;
        },
        'onSelectOnce' : function(evt, data) {
            uploadList.setTotalProgress(0);
            totalBytes = data.allBytesTotal;
        },
        'onSelect': function(evt, qId, fileObj) {            
            //update the top bar status
            var selectedFile = new uploadListFile();
            
            selectedFile.createNew(fileObj, 'uploader'+qId);
            selectedFile.setProgressPercent(0);
            selectedFile.addToUploadFileList();            
            j('.count-123').children('.one').removeClass('selected');
            j('.count-123').children('.two').addClass('selected');

			if (fileObj.size > 104857600) { // show error
				var uploadFileElement = j('#uploader' + qId);
				uploadFileElement.addClass('uploadifyError');
				uploadFileElement.children('.progress-text').text('Sorry - your file size exceeds the maximum size of 100MB.');
            }

            return false;
        },
        'onProgress': function(evt, qId, fileObj, data) {
            var uploadFileElement = j('#uploader' + qId);
            var progressBar = uploadFileElement.children('.progress-bar-sm');
            var totalPercentage = (data.allBytesLoaded/totalBytes) * 100;
            
            uploadFileElement.children('.progress-text').text('uploading...');
            progressBar.children('#progress_percent_uid').css('width', data.percentage + '%');            
            uploadList.setTotalProgress(totalPercentage);
            return false;
        },
        'multi': true
    });
}

// initializes xhr / iframe uploader
function initIframeXhrUploader() {
    var fileUploader = new qq.FileUploaderBasic({
            element: j('#uploadBtn')[0],
            action: 'main.php?X=fileUpload',
            debug: false,
            params: {'p': product},
            allowedExtensions: ['jpg', 'jpeg', 'png', 'pdf', 'ai', 'aii', 'tif', 'tiff', 'eps', 'png'],
            showMessage: function(message) {alert(message);},
            button: j('#uploadBtn .button.green')[0],
            onSubmit: function(id, fileName) {
                var selectedFile = new uploadListFile();
                var fileObj = {'id': id, 'name': fileName, 'size': 0};
                selectedFile.createNew(fileObj, 'uploader'+id);
                selectedFile.setProgressPercent(0);
                selectedFile.addToUploadFileList();
                j('.count-123').children('.one').removeClass('selected');
                j('.count-123').children('.two').addClass('selected');
            },
            onProgress: function(id, fileName, loaded, total){
                var uploadFileElement = j('#uploader' + id);
                var progressBar = uploadFileElement.children('.progress-bar-sm');
                var totalPercentage = (loaded/total) * 100;

                uploadFileElement.children('.progress-text').text('uploading...');
                progressBar.children('#progress_percent_uid').css('width', totalPercentage + '%');
                uploadList.setTotalProgress(totalPercentage);
            },
            onComplete: function(id, fileName, responseJSON){
                var responseObj = responseJSON;
                var uploadFileElement = j('#uploader' + id);

                if(responseObj.status && responseObj.status != 0) {
                    //error
                    uploadFileElement.addClass('uploadifyError');
                    uploadFileElement.children('.progress-text').text(responseObj.error);
                    return false;
                }

                if(responseObj.length <= 1) {
                    processSinglePageFile(responseObj, uploadFileElement, id);
                } else {
                    processMultiPageFile(responseObj, uploadFileElement, id);
                }
                return false;
            }
    });

    setupDragDrop(fileUploader);
}

function setupDragDrop(fileUploader) {
    var dropArea = j('.ufiles .overlay');
    var dz = new qq.UploadDropZone({
        element: dropArea,
        onEnter: function(e) {
            j('.ufiles').css('position', 'relative');
            e.stopPropagation();
        },
        onLeave: function(e) {
            j('.ufiles').css('position', 'static');
            e.stopPropagation();
        },
        onLeaveNotDescendants: function(e) {
            j('.ufiles').css('position', 'static');
            e.stopPropagation();
        },
        onDrop: function(e) {
            j(dropArea).css('display', 'none');
            fileUploader._uploadFileList(e.originalEvent.dataTransfer.files);
            j('.ufiles').css('position', 'static');
        }
    });

    j(document).bind('dragenter', function(e) {
        if(!dz._isValidFileDrag(e)) return;
        j('.ufiles').css('position', 'relative');
        j(dropArea).css('display', 'block');
    });

    j(document).bind('dragleave', function(e){
        if(!dz._isValidFileDrag(e)) return;
        
        var relatedTarget = document.elementFromPoint(e.clientX, e.clientY);

        if(!relatedTarget || relatedTarget.nodeName == "HTML" || j(relatedTarget).attr('class') != 'overlay') {
            j(dropArea).css('display', 'none');
            j('.ufiles').css('position', 'static');
        }
    });
}

function processMultiPageFile(resultArray, uploadFileElement, qId) {
    if (resultArray[0].status == 0) {
        uploadList.removeUploadedFile(uploadFileElement, true);
        for(var i = 0; i < resultArray.length; i++) {
            var ulFile = new uploadListFile();
            ulFile.createNew(resultArray[i], qId + '_' + i);
            ulFile.setProgressPercent(100);
            ulFile.setProgressText('rendering...');
            ulFile.addToUploadFileList();
            ulFile.render();
        }
        return true;
    }
    //error
    uploadFileElement.addClass('uploadifyError');
    uploadFileElement.children('.progress-text').text(resultArray[0].error);
    return false;
}
function processSinglePageFile(resultArray, uploadFileElement, qId) {
    if (resultArray[0].status == 0) {
        var ulFile = new uploadListFile();
        ulFile.getFromList(uploadFileElement);
        ulFile.setProgressText('upload complete...');
        ulFile.setFileSize(resultArray[0].size);
        ulFile.fileId = resultArray[0].id;
        ulFile.render();
        return true;
    }
    //error
    uploadFileElement.addClass('uploadifyError');
    uploadFileElement.children('.progress-text').text(resultArray[0].error);
    return false;
}

function renderFile(qId, fileId) {
    var uploadFileElement = j('#uploader' + qId);
  

    uploadFileElement.children('.progress-text').text('upload complete...rendering');
    uploadFileElement.children('.progress-text').addClass('rendering');
            
    j.ajax({
        url: "main.php?X=fileRender",
        dataType: 'json',
        data: {fileId: fileId},
        async: true,
        success: function(renderResult) {
			uploadFileElement.children('.remove').show();
            uploadList.processRenderResult(uploadFileElement, renderResult);
            if (renderResult.status == 0) {
                j.event.trigger("renderComplete", [uploadFileElement]);
            }
        }
        });
}

var uploadList = {
	listCount: 0,
	cancelUploadList: function () {
        j('.ufile').each(function() {
            if (!uploadList.isUploaded(j(this))) {
				if (j(this).children('.remove').css('display') != 'none') {
					uploadList.removeUploadedFile(j(this), true);
				}
            }
        });
        uploadList.setTotalProgress(0);
		j('#uploader').uploadifyClearQueue();
    },
    clearUploadList: function () {
		if (uploadList.listCount == 0) {
			return false;
		}
        var ans = confirm("Delete File(s)?");
        if (ans) {
			j('.ufile').each(function() {
				if (j(this).children('.remove').css('display') != 'none') {
					uploadList.removeUploadedFile(j(this), true);
				}
			} );
        }
        uploadList.setTotalProgress(0);
    },
    createListItem: function() {
    },
	decrement: function() {
		uploadList.listCount--;
		if(uploadList.listCount == 0) {
			uploadList.setTotalProgress(0);
			j('.count-123').children('.one').addClass('selected');
			j('.count-123').children('.two').removeClass('selected');
			j('.count-123').children('.three').removeClass('selected');
		}
	},
    initOrientationData: function() {
        j('.orientation').each( function () {
            var value = j(this).attr('value') == 1 ? true : false;
            j(this).parent().data('isLandScape', value);
        });
    },
    processRenderResult: function(fileDiv, renderResult) {
        if (renderResult.status == 0) {
            fileDiv.children('.progress-text').removeClass('rendering');
            fileDiv.children('.progress-text').text('complete');
            fileDiv.data('isLandScape', renderResult.isLandScape);
            createThumbPreview(fileDiv, renderResult);
            makeDraggable(fileDiv);
            fileDiv.fadeIn(1000);
            j('.count-123').children('.one').removeClass('selected');
            j('.count-123').children('.two').removeClass('selected');
            j('.count-123').children('.three').addClass('selected');
        } else {
            fileDiv.addClass('uploadifyError');
            var msg;
            if(renderResult.error.indexOf('file is encrypted') != -1) {
                msg = 'Your file is encrypted. Please decrypt it and try again.';
            } else {
                msg = 'There was a problem rendering your file. Please check the file.';
            }
            fileDiv.children('.progress-bar-sm').remove();
            fileDiv.children('.progress-text').text(msg);
            linkCode('Rendering error, error:' + renderResult.error + 'status code:' + renderResult.status);
        }
    },
    removeUploadedFile: function(uFile, bNoConfirm) {
        if (!bNoConfirm) {
            var ans = confirm("Delete File?");
        }

        if (ans || bNoConfirm) {
            if (uploadList.isUploaded(uFile)) {    //already uploaded
                var fileId = uFile.children('#uploadedFileId').attr('value');
                var e = j.Event('removeUploadedFile');
                j.event.trigger(e, [fileId]);

                if (e.result) {
                    //Ajax to remove from db table
                    j.ajax({
                        type: "POST",
                        url: "main.php?X=removeUploadedFile",
                        data: {id: fileId},
                        success: function(response){
                            //console.log( "Response status: " + response.status);
                            if(response.status == 0 || response.status == 1) {
                                uFile.fadeOut(1000, function () {j(this).remove()});
                                uploadList.decrement();
                            } else {
                                uFile.children('.progress-text').text(response.error + '(' + response.status + ')');
                                uFile.addClass('uploadifyError');
                                return false;
                            }
                        },
                        dataType: "json"
                    });
                } else {
                    uFile.addClass('uploadifyError');
                    uFile.children('.progress-text').text('Could not remove, file used in design');
                }
            } else if (uFile.hasClass('uploadifyError')) {    //user uploaded, but there was a error
                uFile.fadeOut(1000, function () {j(this).remove();});
                uploadList.decrement();
            } else {  //not uploaded, or uploading -> remove from uploadify
                j('#uploader').uploadifyCancel(uFile.attr('id').substring(8));
                uFile.fadeOut(1000, function () {j(this).remove();});
                uploadList.decrement();
            }
        } else {
            return false;
        }
    },
    setTotalProgress: function(progress) {
        j('#total_progress_percent_uid').css('width', progress + '%');
    },
    getTotalProgress: function() {
        return j('#total_progress_percent_uid').css('width');                      
    },
    isUploaded: function (uFile) {
        return uFile.children('#uploadedFileId').length == 1 ? true : false;
    },
    hasPendingUploads: function() {
        j('.ufile').each(function() {
            if (!uploadList.isUploaded(j(this))) {
                return true;
            }
        });
        return false;
    }
}

function removeUploadedFile(uFile, bNoConfirm) {
    if (!bNoConfirm) {
        var ans = confirm("Delete File?");
    }
    
    if (ans || bNoConfirm) {
        if (uploadList.isUploaded(uFile)) {    //already uploaded
            var fileId = uFile.children('#uploadedFileId').attr('value');
            var str = "id=" + fileId;
            
            if( fileId == droppableElement.getUploadedFileId(j('#product_front_uid'))       ||
                fileId == droppableElement.getUploadedFileId(j('#product_front_spot_uid'))  ||
                fileId == droppableElement.getUploadedFileId(j('#product_back_spot_uid'))   ||
                fileId == droppableElement.getUploadedFileId(j('#product_back_uid')) ) {
                    uFile.addClass('uploadifyError');
                    uFile.children('.progress-text').text('Could not remove, file used in design');
                    return false;
            }
            
            //Ajax to remove from db table
            j.ajax({
                type: "POST",
                url: "main.php?X=removeUploadedFile",
                data: str,
                success: function(response){
                    //console.log( "Response status: " + response.status);                
                    if(response.status == 0) {
                        uFile.fadeOut(1000, function () {j(this).remove()});
						uploadList.decrement();
                    } else {
                        uFile.children('.progress-text').text(response.error + '(' + response.status + ')');
                        uFile.addClass('uploadifyError');
                        return false;
                    }
                },
                dataType: "json"
            });
        }
        else if (uFile.hasClass('uploadifyError')) {    //user uploaded, but there was a error
            uFile.fadeOut(1000, function () {j(this).remove();});
			uploadList.decrement();
        }
        else if (!uFile.children('.progress-text').hasClass('rendering')) {  //not uploaded, or uploading -> remove from uploadify        
            j('#uploader').uploadifyCancel(uFile.attr('id').substring(8));
			uploadList.decrement();
        }
    } else {
        return false;
    }
}

function formatFileName(filename) {
    var dot = filename.lastIndexOf('.');
    var name = filename.slice(0, dot);
    var maxlen = 12;
    
    if (name.length >= maxlen) {
        var partial = name.slice(0, maxlen);
        var newname= partial.concat('...jpg');
        
        return newname;
    }
    return filename;
}

function updateRenderStatus(fileDiv, per, k){
    var progressBar = fileDiv.children('.progress-bar-sm');
    progressBar.children('#progress_percent_uid').css('width', per + '%');
    if(per<90)
        setTimeout(function (){updateRenderStatus(fileDiv, per+10, k);}, 200+k);
}

function uploadListFile() {
    this.fileId = 0;
    this.fileDiv = null;
    
    this.createNew = function(file, id) {
        this.fileId              = file.id;
        this.fileDiv             = j('<div />').addClass('ufile repeat-sprite').css('display', 'none').attr('id', id) ;
        //this.dragDiv             = j('<div />').addClass('drag repeat-sprite').appendTo(this.fileDiv);
        this.thumb               = j('<div />').addClass('thumb').appendTo(this.fileDiv);
        this.filename            = j('<div />').addClass('file-name').text(file.name).appendTo(this.fileDiv);
        this.filesize            = j('<div />').addClass('file-size').text(file.size).appendTo(this.fileDiv);
        this.progress_bar        = j('<div />').addClass('progress-bar-sm');
        this.progress_percent    = j('<div />').addClass('repeat-sprite').addClass('progress_percent').attr('id', 'progress_percent_uid').css('width', '0').appendTo(this.progress_bar);
        
        j('<div />').addClass('progress-text').appendTo(this.fileDiv);
        j('<div />').addClass('remove').prependTo(this.fileDiv);
        this.progress_bar.appendTo(this.fileDiv);
    };
    
    this.getFromList = function(div) {
        this.fileDiv             = div;
        this.filename            = div.children('file-name').text();
        this.filesize            = div.children('file-size').text();
    };
    this.setFileSize = function(size) {
        this.fileDiv.children('.file-size').text(size);
    };
    this.setProgressPercent = function(percent) {
        this.progress_bar.children('.progress_percent').css('width', percent+'%');
    };
    this.setProgressText = function(text) {
        this.fileDiv.children('.progress-text').text(text);
    };
    this.addToUploadFileList = function() {
        //console.log(this.fileDiv);
        this.fileDiv.appendTo(j('.ufiles'));
        this.fileDiv.fadeIn(1000);
        uploadList.listCount++;
    };
    this.render = function() {
        if( this.fileId == 0 ) {
            console.error('could not render, no file id set for uploadListFile object');
        }
		this.fileDiv.children('.remove').hide();
        this.setProgressText('upload complete...rendering');

        var qId = this.fileDiv;
        var size = this.fileDiv.children('.file-size').text();
        var m = 1;
        if(size.indexOf('MB') != -1)m = 1024;
        size = parseInt(size) * m;
        setTimeout(function (){
            updateRenderStatus(qId, 0, size*0.5);
        }, 50);

        j.ajax({
            url: "main.php?X=fileRender",
            dataType: 'json',
            data: {fileId: this.fileId},
            async: true,
            context: this,
            success: function(renderResult) {
				this.fileDiv.children('.remove').show();
                uploadList.processRenderResult(this.fileDiv, renderResult);
                if (renderResult.status == 0) {
                    j.event.trigger("renderComplete", [this.fileDiv]);
                }
            },
            error: function (xhr, textStatus, errorThrown) {
				this.fileDiv.children('.remove').show();
               this.setProgressText(xhr.statusText);
               linkCode('Upload error:' + xhr.statusText);
               return false;
            }
        });
    };
    return true;
}

function makeDraggable(uploadedFileElement) {
    uploadedFileElement.draggable(draggableOptions);
}

var draggableOptions = {
    opacity: .75,
    revert: 'invalid',
    helper: 'clone',
    containment: false
};

var droppableOptions = {
    drop: function(event, ui) {
        var dropDiv = j(this);
        var file = new Object();
        var clone = ui.draggable.clone();
        var img = clone.children('.thumb').children('img');
        
        file.name = clone.children('.file-name').text();
        file.id = clone.children('#uploadedFileId').attr('value');
        file.path = img.attr('src').replace('th_', 'low_');
        file.isLandScape = ui.draggable.data().isLandScape;
        
        j.event.trigger("uploadedFileDropped", [dropDiv, file]);
    },
    hoverClass: 'droppable-highlight',
    tolerance: 'pointer'

};

function createThumbPreview(uploadedFileElement, fileObj) {
    var thumb       = uploadedFileElement.children('.thumb');    
    var input       = j('<input />')
                            .attr({
                                type: 'hidden',
                                value: fileObj.id,
                                name: 'uploadedFileId',
                                id: 'uploadedFileId'
                                })
                            .appendTo(uploadedFileElement);
    var imgElement  = j('<img />')
                            .attr({
                                src: fileObj.thumbnailUrl,
                                width: thumb.width(),
                                height: thumb.height()
                                })
                            .appendTo(thumb);
    uploadedFileElement.children('.progress-bar-sm').remove();
}

function randomInt() {
    return Math.ceil(100*Math.random());
}

//omniture function to track uploader errors
function linkCode(specificErrorCode) {var s=s_gi('farheaponpdev');s.linkTrackVars='prop4,prop8,eVar23,events';s.linkTrackEvents='event5';s.prop4='Upload Error';s.prop8=specificErrorCode;s.eVar23=specificErrorCode;s.events='event5';s.tl(this,'o',specificErrorCode);}