(function ($) {

    window.Settings = Backbone.Model.extend({
        defaults: {
            "layout":       "list",
            "classname":    $("#DocClassname").val(),
            "fkid":         $("#DocFkid").val(),
            "isNode":       null,
            "addUrl":       "/admin/docs/add"
        }
    });

    window.Doc = Backbone.Model.extend({
        urlRoot: "/docs/",
        url:    function(){
            var base = "/docs";
            if(this.isNew()) return base + ".json";
            return base + (base.charAt(base.length - 1) == "/" ? "" : "/") + this.id + ".json";
        }
    });
/**************************************************************/
/*          EVENTS
/**************************************************************/
    var aggregator = {};
    _.extend(aggregator, Backbone.Events);

    aggregator.on("fileUpdated", function(model){
        if(app.libraryCollection && app.galleryCollection){
            libraryModel = app.libraryCollection.get(model.get("id"));
            galleryModel = app.galleryCollection.get(model.get("id"));
            libraryModel.set(model.attributes);
            galleryModel.set(model.attributes);
        }
    });



/**************************************************************/
/*          LIBRARY COLLECTION (ALL FILES)
/*          GALLERY COLLECTION (ATTACHED ONLY)
/**************************************************************/

    window.LibraryCollection = Backbone.Collection.extend({
        model:      Doc,
        url:        "/docs/index.json",

        parse: function(response) {
            this.page = response.page;
            this.limit = response.limit;
            this.count = response.count;
            data = [];
            _.each(response.models, function(obj){
                data.push(obj.Doc);
            });
            return data;
        }

    });

    window.GalleryCollection = Backbone.Collection.extend({
        model:      Doc,
        url:        function(){
            classname = appSettings.get("classname");
            fkid = appSettings.get("fkid");
            if(classname && fkid){
                return "/docs/index/classname:" + classname + "/fkid:" + fkid + ".json";
            }
        },

        parse: function(response) {
            data = [];
            _.each(response.models, function(obj){
                data.push(obj.Doc);
            });
            return data;
        }

    });


    window.UploadView = Backbone.View.extend({
         template: _.template($("#docsAdd").html()),

         events: {
            "click #fm-start-upload": "uploadFiles"
         },

         initialize: function() {
            _.bindAll(this, "render");
         },

         render: function() {
            $(this.el).html(this.template());

            return this;
         },

         initUploader: function() {
            var self = this;
            this.uploader = new plupload.Uploader({
                runtimes : "gears, html5, flash, silverlight, browserplus",
                container: 'fm-upload-table-container',
                browse_button : "fm-add-files",
                drop_element : "fm-upload-dropper",
                url : '/admin/docs/async_upload',
                flash_swf_url : '/js/plupload/plupload.flash.swf',
                silverlight_xap_url : '/js/plupload/plupload.silverlight.xap',
                filters : [
                    {title : "Image files", extensions : "jpg,gif,png"},
                    {title : "Zip files", extensions : "zip"}
                ]
            });

            this.uploader.bind('Init', function(up, params){
                $("#fm-upload-container").prepend("<h1>" + params.runtime + "</h1>");
            });

            this.uploader.init();

            this.uploader.bind('FilesAdded', function(up, files){
                $.each(files, function(i, file){
                    tdName = document.createElement("td");
                        tdName.innerHTML = file.name;
                    tdStatus = document.createElement("td");
                        tdStatus.className = "plupload_file_status";
                        tdStatus.innerHTML = "0%";
                    tdSize = document.createElement("td");
                        tdSize.className = "plupload_file_size";
                        tdSize.innerHTML = plupload.formatSize(file.size);
                    tdDelete = document.createElement("td");
                        tdDelete.innerHTML = "X";
                        tdDelete.className = "plupload_delete"
                    tr = document.createElement("tr");
                        tr.id = file.id;
                        tr.appendChild(tdName); tr.appendChild(tdStatus); tr.appendChild(tdSize); tr.appendChild(tdDelete);
                    $("#fm-upload-table tbody").append(tr);
                    //Delete Function
                    $("#" + file.id + " td.plupload_delete").click(function(e){
                        e.preventDefault();
                        self.uploader.removeFile(self.uploader.getFile(file.id));
                        $("#" + file.id).remove();
                        return false;
                    });

                });
            });

            this.uploader.bind('UploadProgress', function(up, file){
                $("#" + file.id + " .plupload_file_status").html(file.percent + "%");

            });

            this.uploader.bind('FileUploaded', function(up, file){

                files = self.uploader.files;
                lastfile = files[files.length-1];


                model = new Doc({
                    filename: file.name,
                    classname: appSettings.get("classname"),
                    fkid: appSettings.get("fkid")
                });
                model.save(model.attributes, {
                    success: function(model, response){
                        if(model.get("classname") && model.get("fkid")){
                            app.galleryCollection.add(model);
                        }
                        if(app.libraryCollection){
                            app.libraryCollection.add(model);
                        }
                        if(lastfile.id == file.id && self.uploader.state == 1){
                            app.navigate("", {trigger: true, replace: true});
                        }
                    }
                });
            });


            //The plupload HTML5 code gives a negative z-index making add files button unclickable
            $(".plupload.html5").css({zIndex: 0});
            $("#fm-add-files").css({zIndex: 2});

            return this;
         },

         uploadFiles: function(e){
            e.preventDefault();
            this.uploader.start();
            return false;
         }

    });

    window.NavView = Backbone.View.extend({
        el: $("#fm-nav"),

        initialize: function(){
            if(appSettings.get("classname")){
                $("#fm-gallery-link").show();
            }
        },

        events: {
            "click #fm-upload-link":    "loadUploader",
            "click #fm-gallery-link":   "loadGallery",
            "click #fm-library-link": "loadLibrary"
        },

        loadUploader: function(e){
            e.preventDefault();
            $("#fm-nav a").removeClass("solum-button-primary");
            $("#fm-upload-link").addClass("solum-button-primary");
            app.navigate("add", {trigger: true, replace: true});
        },

        loadGallery: function(){
            $("#fm-nav a").removeClass("solum-button-primary");
            $("#fm-gallery-link").addClass("solum-button-primary");
            app.navigate("", {trigger: true, replace: true});
        },

        loadLibrary: function(){
            $("#fm-nav a").removeClass("solum-button-primary");
            $("#fm-library-link").addClass("solum-button-primary");
            app.navigate("library", {trigger: true, replace: true});
        }
    });

    window.ListView = Backbone.View.extend({
        tagName: "ul",
        id: "docs-list",

        initialize: function(){
            _.bindAll(this, "render");
            this.collection.bind("reset", this.render);
        },

        render: function(){
            var self = this;
            this.collection.each(function(doc){
                item = new ListItemView({model: doc});
                $(self.el).append(item.render().el);
            });
            return this;
        }

    });

    window.ListItemView = Backbone.View.extend({
        tagName: "li",
        template: _.template($("#docs-list-item").html()),
        events: {
            "click .toggle" :           "toggleEditor",
            "click .fm-delete-link":    "deleteModel"
        },

        initialize: function(){
            _.bindAll(this, "render");
            this.model.bind("change", this.render);
            this.render();
        },

        render: function(){
            $(this.el).html(this.template(this.model.toJSON()));
            return this;
        },

        toggleEditor: function(){
            $editor = $(this.el).find(".fm-list-item-editor");
            view = new EditorView({model: this.model});
            $editor.html(view.render().el);
            $(this.el).find(".fm-list-item-editor").slideToggle();
        },

        deleteModel: function(){
            self = this;
            if(confirm("Are you sure")){
                self.model.destroy({
                    success: function(model, response){
                        if(response.success){
                            $(self.el).remove();
                        }
                    }
                });
            }
        }

    });

    window.EditorView = Backbone.View.extend({
        template: _.template($("#fm-editor").html()),
        events: {
            "click .fm-save-button" :   "saveModel"
        },

        initialize: function(){
            _.bindAll(this, "render");
            this.render();
        },

        render: function(){
            $(this.el).html(this.template(this.model.toJSON()));
            $(this.el).find('.fm-details-link').addClass("active-link");
            return this;
        },

        saveModel: function(){
            self = this;
            form = $(this.el).find("form").serializeArray();
            _.each(form, function(field){
                self.model.set(field["name"], field["value"]);
            });
            self.model.save();
            aggregator.trigger("fileUpdated", this.model);
        }
    });

    var AppRouter = Backbone.Router.extend({
        routes: {
            "":             "gallery",
            "add":          "add",
            "edit/:id":     "edit",
            "library":      "library"
        },
        initialize: function() {

            new NavView();
            this.galleryCollection = new GalleryCollection();
            this.galleryCollection.fetch();

            _.bindAll(this, "index");
            this.bind("all", function(){
                if(window.ias) window.ias.cancelSelection();
            });
        },

        index: function(){

        },

        library: function() {
            if(!this.libraryCollection){
                this.libraryCollection = new LibraryCollection();
                this.libraryCollection.fetch();
            }
            $("#fm-nav a").removeClass("solum-button-primary");
            $("#fm-library-link").addClass("solum-button-primary");
            $("#fm-content").empty();
            view = new ListView({collection: this.libraryCollection});
            $("#fm-content").append(view.render().el);
        },

        gallery: function(){
            $("#fm-nav a").removeClass("solum-button-primary");
            $("#fm-gallery-link").addClass("solum-button-primary");
            $("#fm-content").empty();
            view = new ListView({collection: this.galleryCollection});
            $("#fm-content").append(view.render().el);
        },

        add: function(){
            $("#fm-nav a").removeClass("solum-button-primary");
            $("#fm-upload-link").addClass("solum-button-primary");
            $("#fm-content").empty();
            view = new UploadView();
            $("#fm-content").append(view.render().el);
            view.initUploader();
        },

        edit: function(id) {
            $("#fm-content").empty();
            view = new DocEditView({model: this.docs.get(id)});
            $("#fm-content").html(view.render().el);
        }
    });

    var appSettings = new Settings();
    var app = new AppRouter();
    Backbone.history.start();

})(jQuery);