(function( $ ) {

$.widget( "ui.recipeFilter", {  

    options: {
        genreFinder: '.genre',
        //orderingFinder: '.ordering',
        main: '#main',
        filterTemplate: '#filter-template',
        templateName: 'filter-template'
    },

    _init: function() {
        var self = this,
            initialized = false;

        this.$main = $( this.options.main );
        this.$genre = null;this.element.find( this.options.genreFinder );
        //this.$ordering = null;this.element.find( this.options.orderingFinder );

        this.filter = {};

        $( this.options.filterTemplate ).template( this.options.templateName );

        // Load genres and apply the template
        $.getGenreList( this.element.data( 'genre-href' ), function( genres ) {
            $.tmpl( self.options.templateName,{ genres: genres, selected: self.filter.genreId } )
                .appendTo( self.element.empty() );

            self.$genre = self.element.find( self.options.genreFinder );
            //self.$ordering = self.element.find( self.options.orderingFinder );

            self.$genre.change( function() {
                self.$main.recipeManager( 'genreChanged', self.$genre.val() );
            });

            /*
            self.$ordering.change( function() {
                self.$main.recipeManager( 'orderingChanged', self.$ordering.val() );
            });
            */

            if( self.filter.genreId !== undefined ) {
                self.$genre.val( self.filter.genreId );
                //self.$ordering.val( self.filter.ordering );
            }

            initialized = true;
        });


        self.$main.bind( 'update.recipeManager.recipeFilter', function( e, params ) {
            self.filter.genreId = params[ 'genre.id' ] || null;
            //self.filter.ordering = params.ordering || null;

            if( initialized ) {
                self.$genre.val( self.filter.genreId !== null ? self.filter.genreId : '' );
                //self.$ordering.val( self.filter.ordering || 'NEWEST' );
            }
        });

    },

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

        this.$main.unbind( 'update.recipeManager.recipeFilter' );
        this.$genre.unbind( 'change' );
        //this.$ordering.unbind( 'change' );
    }

}); 

})( jQuery );