(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);