App.Views.ExtendedContact = Backbone.View.extend({
	template: _.template( $('#extended-contact-template').html() ),
	$container: null,
	tagName: 'tbody',

	initialize: function(options){
		_.bindAll(this,'render','insert');
		this.$container = options.$container;
		this.$contactView = options.$contactView;
		// not sure this is necessary
		// this.listenTo(this.model,'change',this.render);
		this.insert();
	},

	insert: function(){
		this.$container.find('.contact-display').show();
		this.$container.find('.contact-display-extended').remove();
		this.$contactView.find('.contact-display').hide();
		this.$el.insertAfter(this.$contactView);
	},

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

	events : {
		'click .x-contact-edit-button' : 'editContact',
		'click .x-contact-checkbox-checkbox': 'closeExtendedView'
	},

	closeExtendedView: function(e){
		this.$el.remove();
		this.stopListening();
		$('.contact-display').show();
	},
})