var Bookmark = Class.create();
Bookmark.prototype = {

	action:null,
	deleteAction:null,
	element:null,
	eventMouseMove:null,
	
	initialize: function (element, options) {
		this.setOptions(options);
		this.element = element;
		Element.extend(this.element);
		this.action = this.element.title;
		this.deleteAction = this.element.readAttribute("rel");
		new Draggable(element, {
			revert:false, 
			onStart:function(draggable, event) {
				this.hideDelete();
			}.bind(this),
			onEnd:function(draggable, event) {
				var options = {
					method: "get",
					parameters: "id="+this.element.id+"&x="+draggable.element.style.left+"&y="+draggable.element.style.top,
					onSuccess: function(transport) {
						
					}.bind(this)
				}
				new Ajax.Request(this.action, options);
			}.bind(this)
		});
		
		var icon = new Element("div", {id:this.element.id+"Icon"});
		var iconLink = new Element("a", {"href":"#"}).update("");
		icon.addClassName("bookmarkIcon");
		icon.appendChild(iconLink);
		this.element.parentNode.appendChild(icon);
		Element.insert(this.element, {before:icon});
		Element.hide(icon);
		Event.observe(iconLink, "click", function(ev) {this.doDelete(ev)}.bind(this), false);
		this.element.title = "";
		this.element.rel = "";
		Event.observe(this.element, "mouseover", function(ev) {this.showDelete(ev)}.bind(this), false);
		this.eventMouseMove   = this.move.bindAsEventListener(this);
	},
	
	showDelete: function (ev) {
		this.element.addClassName("active");
		var left = Element.positionedOffset(this.element).left;
		var top = Element.positionedOffset(this.element).top;
		var width = Element.getDimensions(this.element).width;
		$(this.element.id+'Icon').setStyle({top:top+"px",left:(left+width-Element.getDimensions($(this.element.id+'Icon')).width)+"px"});
		$(this.element.id+'Icon').show();
		Event.observe(document, 'mousemove', this.eventMouseMove,false);
	},

	hideDelete: function (ev) {
		this.element.removeClassName("active");
		$(this.element.id+'Icon').hide();
	},

	doDelete: function () {
		var options = {
			method: "get",
			parameters: "id="+this.element.id,
			onSuccess: function(transport) {
				Event.stopObserving(document, 'mousemove', this.eventMouseMove,false);
				$(this.element.id+'Icon').remove();
				this.element.remove();
			}.bind(this)
		}
		new Ajax.Request(this.deleteAction, options);
	},
	
	move: function(e) {
		if($(this.element.id+'Icon').visible()) {
			var left = Element.cumulativeOffset(this.element).left;
			var top = Element.cumulativeOffset(this.element).top;
			var width = Element.getDimensions(this.element).width;
			var height = Element.getDimensions(this.element).height;
			var mouseX = Event.pointerX(e);
			var mouseY = Event.pointerY(e);
			if(mouseX<left || mouseX>left+width || mouseY<top || mouseY>top+height) {
				this.hideDelete();
				Event.stopObserving(document, 'mousemove', this.eventMouseMove,false);
			}
		}
	},
	setOptions: function (options) {
		this.options = {
		}
		Object.extend(this.options, options || {});
	}
	
}