Product uploader

product_uploader.js

/**
 * Part of virtualset project.
 *
 * @copyright  Copyright (C) 2015 {ORGANIZATION}. All rights reserved.
 * @license    GNU General Public License version 2 or later.
 */

;(function($)
{
    "use strict";

    var S3Config = {};

    function DvsProductUploader(options) {

        var self = this;

        S3Config = window.S3Config;

        this.options      = options;
        this.fileInput    = $('#up-file-' + options.alias);
        this.downloadButton = $('#up-download-' + options.alias);
        this.trashButton  = $('#up-trash-' + options.alias);
        this.progress     = $('#up-upload-bar-' + options.alias);
        this.progressBar  = this.progress.find('.progress-bar');
        this.uploadButton = $('#up-upload-' + options.alias);

        // Register events
        this.fileInput.on('change', function() {
            self.start();
            $(this).val(null);
        });

        this.trashButton.on('click', function() {
            swal({
                    title: "Are you sure?",
                    text: "You will not be able to recover this imaginary file!",
                    type: "warning",
                    showCancelButton: true,
                    confirmButtonColor: "#DD6B55",
                    confirmButtonText: "Yes, delete it!",
                    closeOnConfirm: true
                },
                function(){
                    self.trash();
                }
            );
        });
    }

    DvsProductUploader.prototype.start = function() {

        var self     = this;
        var options  = this.options;
        var file     = document.getElementById('up-file-' + options.alias).files[0];
        var fileData = new FormData;
        var ext      = file.name.split('.').slice(-1)[0].toLowerCase();

        if (ext != 'zip')
        {
            swal('Please select zip file', '', 'error');

            return;
        }

        this.progress.show();
        this.uploadButton.hide();

        fileData.append('key',            options.key);
        fileData.append('AWSAccessKeyId', S3Config.apikey);
        fileData.append('policy',         S3Config.policy);
        fileData.append('signature',      S3Config.signature);
        fileData.append('Content-type',   file.type);
        fileData.append('Content-Disposition', 'attachment; filename=' + options.filename);
        fileData.append('file',           file);

        var xhr = getXmlHttpObject();

        xhr.upload.addEventListener("progress", uploadProgress, false);
        xhr.addEventListener("load",  uploadComplete, false);
        xhr.addEventListener("error", uploadFailed, false);
        xhr.addEventListener("abort", uploadCanceled, false);

        xhr.open('POST', 'https://' + S3Config.bucket + '.s3.amazonaws.com/', true); //MUST BE LAST LINE BEFORE YOU SEND

        xhr.send(fileData);

        // PROTECTED
        // -----------------------------------------------------------------------
        function uploadComplete(event) {

            self.progress.hide();
            self.progressBar.attr('width', 0);

            var name = file.name.split('.').slice(-2)[0];
            var ext  = file.name.split('.').slice(-1)[0].toLowerCase();
            var url  = Phoenix.Router.route('myformat');

            $.ajax({
                url: url,
                data: {alias: options.alias, product_id: options.product_id, _method: 'PATCH'},
                dataType: 'json',
                success: function(response)
                {
                    self.trashButton.attr('disabled', false);
                    self.downloadButton.show();
                },
                error: function(error)
                {
                    swal('Error!', '', 'error');

                    console.log(error);

                    self.uploadButton.show();
                }
            });
        }

        function uploadFailed(event) {
            self.progress.hide();
            self.uploadButton.show();

            alert("There was an error attempting to upload the file." + event);
        }

        function uploadCanceled(event) {
            self.progress.hide();
            self.uploadButton.show();
            alert("The upload has been canceled by the user or the browser dropped the connection.");
        }

        function uploadProgress(event) {
            if (event.lengthComputable) {
                var percentage = event.loaded / event.total * 100;

                self.progressBar.css('width', Math.floor(percentage) + '%');
                self.progressBar.text(Math.floor(percentage) + '%');
            } else {
                // Unable to compute progress information since the total size is unknown
            }
        }
    };

    DvsProductUploader.prototype.trash = function() {
        var self = this;
        var url  = Phoenix.Router.route('myformat');

        self.trashButton.attr('disabled', true);

        $.ajax({
            url: url,
            data: {alias: this.options.alias, product_id: this.options.product_id, _method: 'DELETE'},
            dataType: 'json',
            success: function(response)
            {
                if (response.success)
                {
                    console.log(self.downloadButton);
                    console.log(self.uploadButton);

                    self.downloadButton.hide();
                    self.uploadButton.show();
                }
                else
                {
                    self.trashButton.attr('disabled', false);

                    swal('Error!', '', 'error');
                }
            },
            error: function(error)
            {
                self.trashButton.attr('disabled', false);

                swal('Error!', '', 'error');

                console.log(error);
            }
        });
    };

    DvsProductUploader.prototype.getS3Url = function()
    {
        return this.getBucketDomain() + options.key;
    };

    DvsProductUploader.prototype.getBucketDomain = function()
    {
        return 'https://' + S3Config.bucket + '.s3.amazonaws.com/';
    };

    function getXmlHttpObject() {
        var xmlHttp = null;

        try {
            xmlHttp = new XMLHttpRequest();
        }
        catch(e) {
            try {
                xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
            }
            catch(e) {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
        }

        return xmlHttp;
    }

    $.fn.dvsProductUploader = function(params) {
        return new DvsProductUploader(params, this);
    }
}(jQuery));