/**
 * dynamic html for TiledImage 
 * $Id: DragControl.js 15 2013-04-10 20:28:08Z nazotoko $
 * Copyright 2013 Shun N. Watanabe <nazotoko (a+) users.sourceforge.net>
 * @module TiledImage
 */
/**
 * DragControl class. It controls TiledImage by mouse actions.
 * <ul>
 *   <li>example
 *     <div id="dragControl-ex1" style="height:255px;width:400px;"></div>
 *     <script><!--
 *      var dragControl=new TiledImage("dragControl-ex1");
 *      dragControl.addLayer(new TilesLayer("chicago","../../chicago_skyview/z${z}/${x}_${y}.jpg",1920,1218).setTileSize(240,256));
 *      dragControl.addControl(new DragControl());
 *     //--></script>
 *   </li>
 * </ul>
 *
 * @class DragControl
 * @constructor
 */
function DragControl(){
    /**
     * self: produced object scope.
     * @private
     * @property self
     * @type Object
     * @default this
     */
    var self=this,
    /**
     * parent TiledImage object
     * @private
     * @property parent
     * @type Object
     */
    parent,
    /**
     * control: div for this layer.
     * @private
     * @property control
     * @type DOMElement
     */
    control,
    /**
     * sp: position when the drag starts.
     * @private
     * @property sp
     * @type Array[Number,Number]
     */
    sp=[0,0],
    /**
     * dragFlag: true when drag started
     * @private
     * @property dragFlag
     * @type Boolean
     */
    dragFlag=false;

    /**
     * This is event function for "mousemove".
     * @private
     * @method move
     * @param {Object} e event object
     */
    var move=function(e){
	if(!dragFlag) return true;
	if(!e) e=window.event;
	parent.move(sp[0]-e.clientX,sp[1]-e.clientY);
	sp=[e.clientX,e.clientY];
	if(!e.preventDefault) e.returnValue=false;
    },
    /**
     * This is event function for "mousedown", pusing a button of your mouse.
     * @private
     * @method dragStart
     * @param {Object} e event object
     */
    dragStart=function(e){
	if(!e){e=window.event;}
        dragFlag=true;
        sp=[e.clientX,e.clientY];
	control.style.cursor='move';
	if(e.preventDefault) e.preventDefault();
	return false;
    },
    /**
     * This is event function for "mouseup", releasing a button of your mouse.
     * @private
     * @method dragEnd
     * @param {Object} e event object
     */
    dragEnd=function(e){
	if(!e){e=window.event;}
	if(e.button==2){ // right click
	    parent.setZoom(parent.getZoom()-1);
	}
	dragFlag=false;
	control.style.cursor='auto';
    },
    /**
     * This is event function for "dblclick", double-clicking a button of your mouse.
     * @private
     * @method dbl
     * @param {Object} e event object
     */
    dbl=function(e){
	parent.setZoom(parent.getZoom()+1);
	return false;
    },
    /**
     * This is event function for "wheel", rotating a wheel of your mouse.
     * @private
     * @method wheel
     * @param {Object} e event object
     */
    wheel=function(e){
	var delta;
	if(!e){e=window.event;}
	if(e.wheelDelta){delta=-e.wheelDelta;}
	else {delta=e.detail;e.preventDefault();}
	if(delta>0){
	    parent.setZoom(parent.getZoom()-1);
	}else {
	    parent.setZoom(parent.getZoom()+1);
	}
	return false;
    };

    /**
     * Called from TiledImage object.
     * Creating properties and elist.
     * @public
     * @method setParent
     * @required
     * @return {Array} this.elist event list
     */
    this.setParent=function(p){
	parent=p;
	control=p.target;
	/**
	 * Event list
	 * @public
	 * @property elist
	 * @type Array
	 * @required
	 */
	return	this.elist=[
	    {m:'mousedown',t:control,f:dragStart},
	    {m:'mouseup',t:d.d,f:dragEnd},
	    {m:'mousemove',t:control,f:move},
	    {m:'mousewheel',t:control,f:wheel},
	    {m:'dblclick',t:control,f:dbl},
	    {m:'contextmenu',t:control,f:function(e){if(e.preventDefault)e.preventDefault();return false;}}
	];
    };
}