(function( $ ) {
$.widget( "ui.songEditManager", {  

    options: {
        // The url of the page
        url: null,
        // The url parameters of the address
        params: null,

        // Selectors
        songEdit: '.song-edit',
        audioUpload: '.audio-upload',
        imageUpload: '.image-upload'
    },

    _init: function() {
        var self = this,
            loadPage,
            onLoad;

        if (!this.options.url) {
            throw "The song edit manager must be initialized with a url.";
        }

        self._loadPage();
    },

    destroy: function() {
        $.Widget.prototype.destroy.apply(this, arguments);

        $('#fileupload').fileupload('destroy');

        this.element.empty();
    },

    _loadPage: function () {
        var self = this;
        function loadPage() {
            self.element.empty().load(self.options.url, onLoad);
        }

        function onLoad(responseText, textStatus, xhr) {
            var songUrlTemplate,
                songUrl,
                emptySong,
                songData;

            switch (xhr.status) {
                case 401:
                    $.user.login().then(loadPage);
                    break;
                default:
                    songUrlTemplate = $(self.options.songEdit).data('songUrlTemplate');
                    emptySong = $(self.options.songEdit).data('emptySong');

                    if (self.options.params && self.options.params.id) {
                        songData = {id:self.options.params.id};
                        songUrl = songUrlTemplate.replace(/\|.*?\|/g, function (key) {
                            return songData[key.replace(/\|+/g, "")] || "";
                        });
                    }
                    else {
                        songUrl = emptySong;
                    }

                    $.song.get(songUrl).then(
                        function (song) {
                            self._initializeSongMetadataForm(song);
                            self._initializeAudioUpload(song);
                            self._initializeImageUpload(song);
                            self._initializeDeepLinks();
                        },
                        function () {
                        }
                    );
            }
        };

        loadPage();
    },

    _initializeSongMetadataForm: function (song) {
        this._metadataElement().songMetadataForm({
            song:song
        });
    },

    _initializeAudioUpload: function (song) {
        var that = this,
            $audioUpload = $(this.options.audioUpload),
            songResource = song.songResource || null;

        $audioUpload.fileUploader({
            initialResource: songResource,
            uploadComplete: function (event, result) {
                that._metadataElement().songMetadataForm('attachSong', result);
            }
        });

        if (song.songResource) {
            that._metadataElement().songMetadataForm('attachSong', song.songResource);
        }

        $audioUpload.find('.file-upload')
			.addClass('ui-state-default')
			.mouseover(function () {
				$(this).addClass('ui-state-hover')
				    .removeClass('ui-state-default');
			})
			.mouseout(function () {
				$(this).addClass('ui-state-default')
					.removeClass('ui-state-hover');
			})
			.focus(function () {
				$(this).addClass('ui-state-focus')
				    .removeClass('ui-state-default');
			})
			.blur(function () {
				$(this).addClass('ui-state-default')
					.removeClass('ui-state-focus');
			})
			.mousedown(function () {
				$(this).addClass('ui-state-active')
				    .removeClass('ui-state-default');
			})
			.mouseup(function () {
				$(this).addClass('ui-state-default')
					.removeClass('ui-state-active');
			});
    },

    _initializeImageUpload: function (song) {
        var that = this,
            $imageUpload = $(this.options.imageUpload),
            imageResource = song.imageResource || null;

        $imageUpload.fileUploader({
            initialResource: imageResource,
            uploadComplete: function (event, result) {
                that._metadataElement().songMetadataForm('attachImage', result);
            },
            uploadError: function (event, result) {
                that._metadataElement().songMetadataForm('detachImage');
            }
        });

        if (song.imageResource) {
            that._metadataElement().songMetadataForm('attachImage', song.imageResource);
        }

        $imageUpload.find('.file-upload')
			.addClass('ui-state-default')
			.mouseover(function () {
				$(this).addClass('ui-state-hover')
				    .removeClass('ui-state-default');
			})
			.mouseout(function () {
				$(this).addClass('ui-state-default')
					.removeClass('ui-state-hover');
			})
			.focus(function () {
				$(this).addClass('ui-state-focus')
				    .removeClass('ui-state-default');
			})
			.blur(function () {
				$(this).addClass('ui-state-default')
					.removeClass('ui-state-focus');
			})
			.mousedown(function () {
				$(this).addClass('ui-state-active')
				    .removeClass('ui-state-default');
			})
			.mouseup(function () {
				$(this).addClass('ui-state-default')
					.removeClass('ui-state-active');
			});
    },

    _initializeDeepLinks: function () {
        $('#page').find('.deep-link').click(function (event) {
            var clickedHref = $(this).attr('href');

            event.preventDefault();
            $.location().update(clickedHref);
        });
    },

    _metadataElement: function () {
        var elem = this.element.find(this.options.songEdit);

        return elem;
    }
}); 

})( jQuery );