var Okienko = new Class({

	Implements: [Options, Events],
	options: {
		parentID: undefined,
		contentID: undefined,
		Parent: undefined,
		Content: undefined
	},
	dontClose: false,

	initialize: function( options ){
		this.setOptions( options );
		this.options.Parent = $( this.options.parentID );
		this.options.Content = $( this.options.contentID );

		this.options.Parent.addEvent( 'click', this.showOkienko.bind( this ) );
		this.options.Content.addEvent( 'click', this.setDontClose.bind( this ) );
		window.document.addEvent( 'click', this.hideOkienko.bind( this ) );
	},

	setDontClose: function() {
		this.dontClose = true;
	},

	showOkienko: function() {
		var cord = this.options.Parent.getCoordinates();
		this.options.Content.setStyle( 'display', 'block' );
		this.options.Content.position( { x: cord.left+5, y: cord.top+cord.height+5 } );

		var myEffect = new Fx.Morph( this.options.contentID, {
			duration: 'short',
			transition: Fx.Transitions.Sine.easeOut
		});

		this.options.Content.setStyle( 'width', '2px' );
		this.options.Content.setStyle( 'height', '2px' );
		myEffect.start({
			'height': cord.height,
			'width': cord.width
		});

		this.dontClose = true;
	},

	hideOkienko: function() {
		if( this.dontClose ) {
			this.dontClose = false;
		} else {
			this.options.Content.setStyle( 'display', 'none' );
		}
	}

});