/**
 *  Sample 'ArticleDraggable' object which extends the Rico.Draggable to
 *  override the behaviors associated with a draggable object...
 *
 **/
var ArticleDraggable = Class.create();

ArticleDraggable.removeOnDrop = true;

ArticleDraggable.prototype = (new Rico.Draggable()).extend( {

   OLDinitialize: function( htmlElement, name, position ) {
      this.type        = 'Article';
      //this.htmlElement = $(htmlElement);
      this.htmlElement = htmlElement;
      this.name        = name;
      this.removeOnDrop = true;
      this.position = position;
   },
   
   initialize: function( htmlElement, name, type ) {
      this.type        = type;
      //this.htmlElement = $(htmlElement);
      this.htmlElement = htmlElement;
      this.name        = name;
      this.removeOnDrop = true;
   },
   
   getHTMLElement: function() {
      //return this.htmlElement;
      return $(this.htmlElement);
   },
   getMouseDownHTMLElement: function() {
      //return this.htmlElement;
      return this.getHTMLElement();
   },

   log: function(str) {
      new Insertion.Bottom( $('logger'), "<span class='logMsg'>" + str + "</span>" );
      $('logger').scrollTop = $('logger').lastChild.offsetTop;

   },

   select: function() {
      this.selected = true;
      var el = this.getHTMLElement();
      //gCurrentArticle = el.getAttribute("id");

      // show the item selected.....
      el.style.color           = "#ffffff";
      el.style.backgroundColor = "#08246b";
      el.style.border          = "1px solid blue";
   },

   deselect: function() {
      this.selected = false;
      var el = this.getHTMLElement();
      if (null != el) {
         el.style.color           = "#2b2b2b";
         el.style.backgroundColor = "transparent";
         el.style.border = "1px solid #ffffee";
      } else {
         //TODO do we need an error when the selected element no longer exists
      }
   },

   startDrag: function() {
      //var el = this.getHTMLElement();
      //this.log("startDrag: [" + this.name +"]");
      //TODO DaMc do we need the fade new Rico.Effect.FadeTo( $('result'), .5, 250, 4 );
      
   },

   cancelDrag: function() {
      //var el = this.getHTMLElement();
      //this.log("cancelDrag: [" + this.name +"]");
      new Rico.Effect.FadeTo( $('result'), 1, 250, 4 );
   },

   endDrag: function() {
      //var el = this.getHTMLElement();
      //this.log("endDrag: [" + this.name +"]");
      //if ( ArticleDraggable.removeOnDrop )
      //   this.getHTMLElement().style.display = 'none';
      new Rico.Effect.FadeTo( $('result'), 1, 250, 4 );

   },

   getSingleObjectDragGUI: function() {
      //this.log("getSingleObjectDragGUI: [" + this.name +"]");
      var el = this.getHTMLElement().parentNode.parentNode.cloneNode(true);
      el.setAttribute("id", "drag_" + this.getHTMLElement().parentNode.parentNode.getAttribute("id"));
		//TODO DaMc attempt to set a white bg
      el.style.backgroundColor = "#ffffff";
      el.style.border          = "5px solid red";
		//TODO DaMc End attempt to set a white bg
	   return el;
      //var div = document.createElement("div");
      //div.className = 'articleDraggable';
      //div.style.width = (this.getHTMLElement().offsetWidth - 10) + "px";
      //new Insertion.Top( div, this.name );
      //return div;
   },

   getMultiObjectDragGUI: function( draggables ) {
      //this.log("getMultiObjectDragGUI: [" + this.name +"]");
      var el = this.getHTMLElement();

      var names = "";
      for ( var i = 0 ; i < draggables.length ; i++ ) {
         names += draggables[i].name;
         if ( i != (draggables.length - 1) )
            names += ",<br/>";
      }

      var div = document.createElement("div");
      div.className = 'articleDraggable';
      div.style.width = (this.getHTMLElement().offsetWidth - 10) + "px";
      new Insertion.Top( div, names );
      return div;
   },

   getDroppedGUI: function() {
      //this.log("getDroppedGUI: [" + this.name +"]");
      var el = this.getHTMLElement();
	  return el;
   },

   toString: function() {
      //this.log("toString: [" + this.name +"]");
      return this.name;
   }

} );
