Tag Archive for drag

Drag & Drop with WPF in C#

// WPF Canvas Object
// Canvas LayoutCanvas;
//
// Events Required
//
// Canvas_PreviewMouseLeftButtonDown
// Canvas_PreviewMouseMove
// Canvas_PreviewMouseLeftButtonUp
// Parent_PreviewKeyDown
//
// LayoutCanvas.PreviewMouseLeftButtonDown += LayoutCanvas_PreviewMouseLeftButtonDown;
// LayoutCanvas.PreviewMouseMove += LayoutCanvas_PreviewMouseMove;
// LayoutCanvas.PreviewMouseLeftButtonUp += LayoutCanvas_PreviewMouseLeftButtonUp;
// WindowOrPage.PreviewKeyDown += WindowOrPage_PreviewKeyDown;
//
// Parameters Required
//
// For capturing the mouse position:
// Point ddStartPoint;
//
// The top left corner of the child object (left = x, top = y)
// double ddOriginalLeft;
// double ddOriginalTop;
//
// Properties for managing the state of the drag & drop process:
// bool ddIsMouseDown;
// bool ddIsBeingDragged;
//
// Our original UI element (in my case the children are all Image objects)
// UIElement ddOriginalElement;
//
// The container of the above element when we are in dragging mode
// System.Windows.Shapes.Rectangle ddOverlay;
//

//
// Canvas_PreviewMouseLeftButtonDown
//
// We assign this to our Canvas object as it will control
// catching whether or not we are clicking on the canvas itself
// or on one of its children
//
private void LayoutCanvas_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    // If the source of the click is our canvas object then we want
    // to exit because we are looking for it's children to drag 
    // and not the canvas itself.
    if(e.Source == LayoutCanvas)
    {
	return;
    }
    
    // Identifies that we have started dragging
    ddIsMouseDown = true;

    // Captures the mouse position in the layout canvas
    ddStartPoint = e.GetPosition(LayoutCanvas);

    // Sets up our element that we will be dragging
    ddOriginalElement = (UIElement)e.Source;

    // Tells the Window to give the mouse to the LayoutCanvas
    // object.
    LayoutCanvas.CaptureMouse();

    e.Handled = true;
}	

//
// Canvas_PreviewMouseMove
// 
// Our event handler for updating the position of our
// dragged element
//
// This introduces two helper methods DragStarted() and DragMoved()
// They will be covered later on in the code.
//
private void LayoutCanvas_PreviewMouseMove(object sender, System.Windows.Input.MouseEventArgs e)
{
    if(ddIsMouseDown)
    {
	if(!ddIsBeingDragged)
	{
	    // Capture our mouse position relative to the LayoutCanvas object
	    var mousePosition = e.GetPosition(LayoutCanvas);

	    // Creates a transparent rectangle around our current drag point and we want to 
	    // check here that we are within that rectangle
	    if(Math.Abs(mousePosition.X - ddStartPoint.X) > SystemParameters.MinimumHorizontalDragDistance &&
		    Math.Abs(mousePosition.Y - ddStartPoint.Y) > SystemParameters.MinimumVeritcalDragDistance)
	    {
		DragStarted();
	    }
	}
	else
	{
	    DragMoved();
	}
    }
}

//
// Canvas_PreviewMouseLeftButtonUp
//
// Controls the functionality for finishing our drag and drop process.
// This will also introduce the call to DragFinished(bool state);
//
private void LayoutCanvas_PreviewMouseLeftButtonUp(object sender, MouseButtonEventArgs e)
{
    // This is a fairly simple check. If we are still dragging
    // or starting to drag which means ddIsMouseDown would be 'True'
    // then we don't stop the drag
    if(ddIsMouseDown)
    {
	DragFinished(false);
    }
}

//
// Page_PreviewKeydown
//
// In my code I have my canvas in a Page, you can do this with a Window object as well.
//
private void Page_PreviewKeyDown(object sender, System.Windows.Input.KeyEventArgs e)
{
    if(e.Key == Key.Escape && ddIsBeingDragged)
    {
	DragFinished = true;
    }
}

// Helper Methods

//
// DragStarted()
//
//
private void DragStarted()
{
    // Capture our last remaining properties
    // needed to support our drag and drop
    // process
    ddIsBeingDragged = true;
    ddOriginalLeft = Canvas.GetLeft(ddOriginalElement);
    ddOriginalTop = Canvas.GetTop(ddOriginalElement);

    // What we are doing here is creating a semi-transparent
    // mirror image of the object we are dragging.
    //
    // This allows us to visually see that we have selected 
    // an object and are dragging it.
    var brush = new VisualBrush(ddOriginalElement);
    brush.Opacity = 0.5;

    ddOverlay = new System.Windows.Shapes.Rectangle();
    ddOverlay.Width = ddOriginalElement.RenderSize.Width;
    ddOverlay.Height = ddOriginalElement.RenderSize.Height;
    ddOverlay.Fill = brush;

    // Finally add the overlay to the LayoutCanvas for displaying
    LayoutCanvas.Children.Add(ddOverlay);
}


//
// DragMoved();
//
private void DragMoved()
{
    // Capture the current mouse position, this will be used
    // to redraw the overlay element we created in DragStarted()
    var currentPosition = System.Windows.Input.Mouse.GetPosition(LayoutCanvas);
    var elementLeft = (currentPosition.X - ddStartPoint.X) + ddOriginalLeft;
    var elementTop = (currentPosition.Y - ddStartPoint.Y) + ddOriginalTop;

    // We update the overlay's position on the LayoutCanvas
    // by setting it's top left corner position below
    Canvas.SetLeft(ddOverlay, elementLeft);
    Canvas.SetTop(ddOverlay, elementTop);
}

//
// DragFinished();
//
private void DragFinished(bool canceled)
{
    if(ddOverlay != null)
    {
	// capture our current position
	var topLeft = Canvas.GetLeft(ddOverlay);
	var top = Canvas.GetTop(ddOverlay);

	if(ddIsBeingDragged)
	{
	    LayoutCanvas.Children.Remove(ddOverlay);

	    // If it wasn't prematurely canceled, then
	    // move the element to the current mouse position
	    if(!canceled)
	    {
		Canvas.SetLeft(ddOriginalElement, topLeft);
		Canvas.SetTop(ddOriginalElement, top);
	    }

	    // Release the mouse from the layoutcanvas.
	    // This is very important. If you do not release the mouse
	    // you have to set the focus of the mouse to another application
	    // and then back again to regain mouse control
	    LayoutCanvas.ReleaseMouseCapture();

	    // Reset our drag & drop properties
	    ddOverlay = null;
	    ddIsMouseBeingDragged = false;
	    ddIsMouseDown = false;
	}
    }
}

source

Simple JS Calendar

This is very easy to use JavaScript Calendar Control with so many customization option. Date format can be change as

different database support different date formats. It also supports multiple instances on same time and all the

instances are completely independent with others. It is compatible will all major browsers and different style

sheets can be defined to all different instances means every instance can be show in different color scheme on the

same page. It also support expiry date feature so you can prevent users to select past dates. There are lots of

other customization options as well.

source

AS2 Basic Drag-Drop Collision

#include "mc_tween2.as"
// if you don't have mc_tween, comment it out.

var startX:Number = 0; // original X position of item picked up
var startY:Number = 0; // original Y position of item picked up
var drawCollision:Boolean = true; // for debugging

box1_mc.onPress = function() { pickup(this, 1); };
box1_mc.onRelease = function() { dropoff(this, 1, box2_mc); };
//box1_mc.onRollOver = function() { rollover(this, 1); };
//box1_mc.onRollOut = function() { rollout(this, 1); };

function pickup(which_mc:MovieClip, intMC:Number):Void {
which_mc.swapDepths(this.getNextHighestDepth()); // bring picked-up object to foreground
which_mc.startDrag();
startX = which_mc._x;
startY = which_mc._y;
}

function dropoff(which_mc:MovieClip, intMC:Number, target_mc:MovieClip):Void {
which_mc.stopDrag();

if (isColliding(target_mc, which_mc)) // try removing the second parameter here.  See function for more details.
{
status_txt.text += "
collided";
which_mc.slideTo(85, undefined, .5);
} else {
status_txt.text += "
missed";
which_mc.slideTo(startX, startY, .5);
}
}

function rollover(which_mc:MovieClip, intMC:Number):Void {
status_txt.text += "
rolled over";
}

function rollout(which_mc:MovieClip, intMC:Number):Void {
status_txt.text += "
rolled out";
}

function isColliding(target_mc:MovieClip, which_mc:MovieClip):Boolean
{
// If you do not send a "which_mc" this will assume you want to check on the mouse position (which will probably be within the target when the item is dropped)

obj1_x = target_mc._x;
obj1_y = target_mc._y;
if (which_mc) {
obj2_x = which_mc._x - Number(which_mc._width / 2);
obj2_y = which_mc._y - Number(which_mc._height / 2);
} else {
obj2_x = this._xmouse - 1;
obj2_y = this._ymouse - 1;
}

obj1_x2 = target_mc._width + obj1_x;
obj1_y2 = target_mc._height + obj1_y;
if (which_mc) {
obj2_x2 = which_mc._width + obj2_x;
obj2_y2 = which_mc._height + obj2_y;
} else {
obj2_x2 = 2 + this._xmouse;
obj2_y2 = 2 + this._ymouse;
}

if (drawCollision == true)
{
this.createEmptyMovieClip("rectangle_mc", 10);
rectangle_mc._x = obj2_x;
rectangle_mc._y = obj2_y;
if (which_mc) {
drawRectangle(rectangle_mc, which_mc._width, which_mc._height, 0x990000, 50);
} else {
drawRectangle(rectangle_mc, 2, 2, 0x990000, 50);
}

this.createEmptyMovieClip("rectangle2_mc", 11);
rectangle2_mc._x = obj1_x;
rectangle2_mc._y = obj1_y;
drawRectangle(rectangle2_mc, target_mc._width, target_mc._height, 0x99FF00, 50);
}

if ((obj2_x > obj1_x) && (obj2_x2 < obj1_x2) && (obj2_y > obj1_y) && (obj2_y2 < obj1_y2)) {
return true;
} else {
return false;
}

}

function drawRectangle(target_mc:MovieClip, boxWidth:Number, boxHeight:Number, fillColor:Number, fillAlpha:Number):Void {
with (target_mc) {
beginFill(fillColor, fillAlpha);
moveTo(0, 0);
lineTo(boxWidth, 0);
lineTo(boxWidth, boxHeight);
lineTo(0, boxHeight);
lineTo(0, 0);
endFill();
}
}

source

AS2 Basic Drag-Drop Collision

#include "mc_tween2.as"
// if you don't have mc_tween, comment it out.

var startX:Number = 0; // original X position of item picked up
var startY:Number = 0; // original Y position of item picked up
var drawCollision:Boolean = true; // for debugging

box1_mc.onPress = function() { pickup(this, 1); };
box1_mc.onRelease = function() { dropoff(this, 1, box2_mc); };
//box1_mc.onRollOver = function() { rollover(this, 1); };
//box1_mc.onRollOut = function() { rollout(this, 1); };

function pickup(which_mc:MovieClip, intMC:Number):Void {
which_mc.swapDepths(this.getNextHighestDepth()); // bring picked-up object to foreground
which_mc.startDrag();
startX = which_mc._x;
startY = which_mc._y;
}

function dropoff(which_mc:MovieClip, intMC:Number, target_mc:MovieClip):Void {
which_mc.stopDrag();

if (isColliding(target_mc, which_mc)) // try removing the second parameter here.  See function for more details.
{
status_txt.text += "
collided";
which_mc.slideTo(85, undefined, .5);
} else {
status_txt.text += "
missed";
which_mc.slideTo(startX, startY, .5);
}
}

function rollover(which_mc:MovieClip, intMC:Number):Void {
status_txt.text += "
rolled over";
}

function rollout(which_mc:MovieClip, intMC:Number):Void {
status_txt.text += "
rolled out";
}

function isColliding(target_mc:MovieClip, which_mc:MovieClip):Boolean
{
// If you do not send a "which_mc" this will assume you want to check on the mouse position (which will probably be within the target when the item is dropped)

obj1_x = target_mc._x;
obj1_y = target_mc._y;
if (which_mc) {
obj2_x = which_mc._x - Number(which_mc._width / 2);
obj2_y = which_mc._y - Number(which_mc._height / 2);
} else {
obj2_x = this._xmouse - 1;
obj2_y = this._ymouse - 1;
}

obj1_x2 = target_mc._width + obj1_x;
obj1_y2 = target_mc._height + obj1_y;
if (which_mc) {
obj2_x2 = which_mc._width + obj2_x;
obj2_y2 = which_mc._height + obj2_y;
} else {
obj2_x2 = 2 + this._xmouse;
obj2_y2 = 2 + this._ymouse;
}

if (drawCollision == true)
{
this.createEmptyMovieClip("rectangle_mc", 10);
rectangle_mc._x = obj2_x;
rectangle_mc._y = obj2_y;
if (which_mc) {
drawRectangle(rectangle_mc, which_mc._width, which_mc._height, 0x990000, 50);
} else {
drawRectangle(rectangle_mc, 2, 2, 0x990000, 50);
}

this.createEmptyMovieClip("rectangle2_mc", 11);
rectangle2_mc._x = obj1_x;
rectangle2_mc._y = obj1_y;
drawRectangle(rectangle2_mc, target_mc._width, target_mc._height, 0x99FF00, 50);
}

if ((obj2_x > obj1_x) && (obj2_x2 < obj1_x2) && (obj2_y > obj1_y) && (obj2_y2 < obj1_y2)) {
return true;
} else {
return false;
}

}

function drawRectangle(target_mc:MovieClip, boxWidth:Number, boxHeight:Number, fillColor:Number, fillAlpha:Number):Void {
with (target_mc) {
beginFill(fillColor, fillAlpha);
moveTo(0, 0);
lineTo(boxWidth, 0);
lineTo(boxWidth, boxHeight);
lineTo(0, boxHeight);
lineTo(0, 0);
endFill();
}
}

source

reprise – drag element

private function createTestDragItem() : void
{
m_dragObject = m_rootElement.addComponent('dragElvis');
m_dragObject.addEventListener(MouseEvent.MOUSE_DOWN, dragObject_mouseDown);
m_dragObject.addEventListener(MouseEvent.MOUSE_UP, dragObject_mouseUp);
}

private function dragObject_mouseUp(event : MouseEvent) : void
{
UIComponent(event.currentTarget).removeEventListener(Event.ENTER_FRAME, drag_enterFrame);
}

private function dragObject_mouseDown(event : MouseEvent) : void
{
m_mousePositionOverCurrentDragObject = new Point(event.localX, event.localY);
UIComponent(event.currentTarget).addEventListener(Event.ENTER_FRAME, drag_enterFrame);
}

private function drag_enterFrame(event : Event) : void
{

var leftPosition : Number = Math.min(mouseX - m_mousePositionOverCurrentDragObject.x,
600);
leftPosition = Math.max(leftPosition, 0);
var topPosition : Number = Math.min(mouseY - m_mousePositionOverCurrentDragObject.y,
300);
topPosition = Math.max(topPosition, 0);


m_dragObject.setStyle('left', leftPosition + 'px');
m_dragObject.setStyle('top', topPosition + 'px');
}

source

javascript drag drop function

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--************************************************************************-->
<!--* Windows Demo                                                         *-->
<!--*                                                                      *-->
<!--* Copyright 2001 by Mike Hall                                          *-->
<!--* Please see <a href="http://www.brainjar.com" >http://www.brainjar.com</a> for terms of use.                 *-->
<!--************************************************************************-->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>BrainJar.com: Windows Demo</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link href="/common/default.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.lastLine {
padding-left: 6em;
}
</style>
<style type="text/css">

.window {
background-color: #c0c0c0;
border-color: #f0f0f0 #606060 #404040 #d0d0d0;
border-style: solid;
border-width: 2px;
margin: 0px;
padding: 2px;
position: absolute;
text-align: left;
visibility: hidden;
}

.titleBar {
background-color: #008080;
cursor: default;
color: #ffffff;
font-family: "MS Sans Serif", "Arial", "Helvetica", sans-serif;
font-size: 8pt;
font-weight: bold;
margin: 0px;
padding: 2px 2px 2px .5em;
text-align: right;
white-space: nowrap;
}

.titleBarText {
float: left;
overflow: hidden;
text-align: left;
}

.titleBarButtons {
border-style: none;
border-width: 0px;
vertical-align: middle;
width: 50px;
height: 14px;
}

.clientArea {
background-color: #ffffff;
border-color: #404040 #e0e0e0 #f0f0f0 #505050;
border-style: solid;
border-width: 2px;
color: #000000;
font-family: "Arial", "Helvetica", sans-serif;
font-size: 10pt;
margin: 2px 0px 0px 0px;
overflow: auto;
padding: .5em;
}

</style>

<script type="text/javascript">//<![CDATA[

//*****************************************************************************
// Do not remove this notice.
//
// Copyright 2001 by Mike Hall.
// See <a href="http://www.brainjar.com" >http://www.brainjar.com</a> for terms of use.
//*****************************************************************************

// Determine browser and version.

function Browser() {

var ua, s, i;

this.isIE    = false;  // Internet Explorer
this.isNS    = false;  // Netscape
this.version = null;

ua = navigator.userAgent;

s = "MSIE";
if ((i = ua.indexOf(s)) >= 0) {
this.isIE = true;
this.version = parseFloat(ua.substr(i + s.length));
return;
}

s = "Netscape6/";
if ((i = ua.indexOf(s)) >= 0) {
this.isNS = true;
this.version = parseFloat(ua.substr(i + s.length));
return;
}

// Treat any other "Gecko" browser as NS 6.1.

s = "Gecko";
if ((i = ua.indexOf(s)) >= 0) {
this.isNS = true;
this.version = 6.1;
return;
}
}

var browser = new Browser();

//=============================================================================
// Window Object
//=============================================================================

function Window(el) {

var i, mapList, mapName;

// Get window components.

this.frame           = el;
this.titleBar        = winFindByClassName(el, "titleBar");
this.titleBarText    = winFindByClassName(el, "titleBarText");
this.titleBarButtons = winFindByClassName(el, "titleBarButtons");
this.clientArea      = winFindByClassName(el, "clientArea");

// Find matching button image map.

mapName = this.titleBarButtons.useMap.substr(1);
mapList = document.getElementsByTagName("MAP");
for (i = 0; i < mapList.length; i++)
if (mapList[i].name == mapName)
this.titleBarMap = mapList[i];

// Save colors.

this.activeFrameBackgroundColor  = this.frame.style.backgroundColor;
this.activeFrameBorderColor      = this.frame.style.borderColor;
this.activeTitleBarColor         = this.titleBar.style.backgroundColor;
this.activeTitleTextColor        = this.titleBar.style.color;
this.activeClientAreaBorderColor = this.clientArea.style.borderColor;
if (browser.isIE)
this.activeClientAreaScrollbarColor = this.clientArea.style.scrollbarBaseColor;

// Save images.

this.activeButtonsImage   = this.titleBarButtons.src;
this.inactiveButtonsImage = this.titleBarButtons.longDesc;

// Set flags.

this.isOpen      = false;
this.isMinimized = false;

// Set methods.

this.open       = winOpen;
this.close      = winClose;
this.minimize   = winMinimize;
this.restore    = winRestore;
this.makeActive = winMakeActive;

// Set up event handling.

this.frame.parentWindow = this;
this.frame.onmousemove  = winResizeCursorSet;
this.frame.onmouseout   = winResizeCursorRestore;
this.frame.onmousedown  = winResizeDragStart;

this.titleBar.parentWindow = this;
this.titleBar.onmousedown  = winMoveDragStart;

this.clientArea.parentWindow = this;
this.clientArea.onclick      = winClientAreaClick;

for (i = 0; i < this.titleBarMap.childNodes.length; i++)
if (this.titleBarMap.childNodes[i].tagName == "AREA")
this.titleBarMap.childNodes[i].parentWindow = this;

// Calculate the minimum width and height values for resizing
// and fix any initial display problems.

var initLt, initWd, w, dw;

// Save the inital frame width and position, then reposition
// the window.

initLt = this.frame.style.left;
initWd = parseInt(this.frame.style.width);
this.frame.style.left = -this.titleBarText.offsetWidth + "px";

// For IE, start calculating the value to use when setting
// the client area width based on the frame width.

if (browser.isIE) {
this.titleBarText.style.display = "none";
w = this.clientArea.offsetWidth;
this.widthDiff = this.frame.offsetWidth - w;
this.clientArea.style.width = w + "px";
dw = this.clientArea.offsetWidth - w;
w -= dw;
this.widthDiff += dw;
this.titleBarText.style.display = "";
}

// Find the difference between the frame's style and offset
// widths. For IE, adjust the client area/frame width
// difference accordingly.

w = this.frame.offsetWidth;
this.frame.style.width = w + "px";
dw = this.frame.offsetWidth - w;
w -= dw;
this.frame.style.width = w + "px";
if (browser.isIE)
this.widthDiff -= dw;

// Find the minimum width for resize.

this.isOpen = true;  // Flag as open so minimize call will work.
this.minimize();
// Get the minimum width.
if (browser.isNS && browser.version >= 1.2)
// For later versions of Gecko.
this.minimumWidth = this.frame.offsetWidth;
else
// For all others.
this.minimumWidth = this.frame.offsetWidth - dw;

// Find the frame width at which or below the title bar text will
// need to be clipped.

this.titleBarText.style.width = "";
this.clipTextMinimumWidth = this.frame.offsetWidth - dw;

// Set the minimum height.

this.minimumHeight = 1;

// Restore window. For IE, set client area width.

this.restore();
this.isOpen = false;  // Reset flag.
initWd = Math.max(initWd, this.minimumWidth);
this.frame.style.width = initWd + "px";
if (browser.isIE)
this.clientArea.style.width = (initWd - this.widthDiff) + "px";

// Clip the title bar text if needed.

if (this.clipTextMinimumWidth >= this.minimumWidth)
this.titleBarText.style.width = (winCtrl.minimizedTextWidth + initWd - this.minimumWidth) + "px";

// Restore the window to its original position.

this.frame.style.left = initLt;
}

//=============================================================================
// Window Methods
//=============================================================================

function winOpen() {

if (this.isOpen)
return;

// Restore the window and make it visible.

this.makeActive();
this.isOpen = true;
if (this.isMinimized)
this.restore();
this.frame.style.visibility = "visible";
}

function winClose() {

// Hide the window.

this.frame.style.visibility = "hidden";
this.isOpen = false;
}

function winMinimize() {

if (!this.isOpen || this.isMinimized)
return;

this.makeActive();

// Save current frame and title bar text widths.

this.restoreFrameWidth = this.frame.style.width;
this.restoreTextWidth = this.titleBarText.style.width;

// Disable client area display.

this.clientArea.style.display = "none";

// Minimize frame and title bar text widths.

if (this.minimumWidth)
this.frame.style.width = this.minimumWidth + "px";
else
this.frame.style.width = "";
this.titleBarText.style.width = winCtrl.minimizedTextWidth + "px";

this.isMinimized = true;
}

function winRestore() {

if (!this.isOpen || !this.isMinimized)
return;

this.makeActive();

// Enable client area display.

this.clientArea.style.display = "";

// Restore frame and title bar text widths.

this.frame.style.width = this.restoreFrameWidth;
this.titleBarText.style.width = this.restoreTextWidth;

this.isMinimized = false;
}

function winMakeActive() {

if (winCtrl.active == this)
return;

// Inactivate the currently active window.

if (winCtrl.active) {
winCtrl.active.frame.style.backgroundColor    = winCtrl.inactiveFrameBackgroundColor;
winCtrl.active.frame.style.borderColor        = winCtrl.inactiveFrameBorderColor;
winCtrl.active.titleBar.style.backgroundColor = winCtrl.inactiveTitleBarColor;
winCtrl.active.titleBar.style.color           = winCtrl.inactiveTitleTextColor;
winCtrl.active.clientArea.style.borderColor   = winCtrl.inactiveClientAreaBorderColor;
if (browser.isIE)
winCtrl.active.clientArea.style.scrollbarBaseColor = winCtrl.inactiveClientAreaScrollbarColor;
if (browser.isNS && browser.version < 6.1)
winCtrl.active.clientArea.style.overflow = "hidden";
if (winCtrl.active.inactiveButtonsImage)
winCtrl.active.titleBarButtons.src = winCtrl.active.inactiveButtonsImage;
}

// Activate this window.

this.frame.style.backgroundColor    = this.activeFrameBackgroundColor;
this.frame.style.borderColor        = this.activeFrameBorderColor;
this.titleBar.style.backgroundColor = this.activeTitleBarColor;
this.titleBar.style.color           = this.activeTitleTextColor;
this.clientArea.style.borderColor   = this.activeClientAreaBorderColor;
if (browser.isIE)
this.clientArea.style.scrollbarBaseColor = this.activeClientAreaScrollbarColor;
if (browser.isNS && browser.version < 6.1)
this.clientArea.style.overflow = "auto";
if (this.inactiveButtonsImage)
this.titleBarButtons.src = this.activeButtonsImage;
this.frame.style.zIndex = ++winCtrl.maxzIndex;
winCtrl.active = this;
}

//=============================================================================
// Event handlers.
//=============================================================================

function winClientAreaClick(event) {

// Make this window the active one.

this.parentWindow.makeActive();
}

//-----------------------------------------------------------------------------
// Window dragging.
//-----------------------------------------------------------------------------

function winMoveDragStart(event) {

var target;
var x, y;

if (browser.isIE)
target = window.event.srcElement.tagName;
if (browser.isNS)
target = event.target.tagName;

if (target == "AREA")
return;

this.parentWindow.makeActive();

// Get cursor offset from window frame.

if (browser.isIE) {
x = window.event.x;
y = window.event.y;
}
if (browser.isNS) {
x = event.pageX;
y = event.pageY;
}
winCtrl.xOffset = winCtrl.active.frame.offsetLeft - x;
winCtrl.yOffset = winCtrl.active.frame.offsetTop  - y;

// Set document to capture mousemove and mouseup events.

if (browser.isIE) {
document.onmousemove = winMoveDragGo;
document.onmouseup   = winMoveDragStop;
}
if (browser.isNS) {
document.addEventListener("mousemove", winMoveDragGo,   true);
document.addEventListener("mouseup",   winMoveDragStop, true);
event.preventDefault();
}

winCtrl.inMoveDrag = true;
}

function winMoveDragGo(event) {

var x, y;

if (!winCtrl.inMoveDrag)
return;

// Get cursor position.

if (browser.isIE) {
x = window.event.x;
y = window.event.y;
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (browser.isNS) {
x = event.pageX;
y = event.pageY;
event.preventDefault();
}

// Move window frame based on offset from cursor.

winCtrl.active.frame.style.left = (x + winCtrl.xOffset) + "px";
winCtrl.active.frame.style.top  = (y + winCtrl.yOffset) + "px";
}

function winMoveDragStop(event) {

winCtrl.inMoveDrag = false;

// Remove mousemove and mouseup event captures on document.

if (browser.isIE) {
document.onmousemove = null;
document.onmouseup   = null;
}
if (browser.isNS) {
document.removeEventListener("mousemove", winMoveDragGo,   true);
document.removeEventListener("mouseup",   winMoveDragStop, true);
}
}

//-----------------------------------------------------------------------------
// Window resizing.
//-----------------------------------------------------------------------------

function winResizeCursorSet(event) {

var target;
var xOff, yOff;

if (this.parentWindow.isMinimized || winCtrl.inResizeDrag)
return;

// If not on window frame, restore cursor and exit.

if (browser.isIE)
target = window.event.srcElement;
if (browser.isNS)
target = event.target;
if (target != this.parentWindow.frame)
return;

// Find resize direction.

if (browser.isIE) {
xOff = window.event.offsetX;
yOff = window.event.offsetY;
}
if (browser.isNS) {
xOff = event.layerX;
yOff = event.layerY;
}
winCtrl.resizeDirection = ""
if (yOff <= winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "n";
else if (yOff >= this.parentWindow.frame.offsetHeight - winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "s";
if (xOff <= winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "w";
else if (xOff >= this.parentWindow.frame.offsetWidth - winCtrl.resizeCornerSize)
winCtrl.resizeDirection += "e";

// If not on window edge, restore cursor and exit.

if (winCtrl.resizeDirection == "") {
this.onmouseout(event);
return;
}

// Change cursor.

if (browser.isIE)
document.body.style.cursor = winCtrl.resizeDirection + "-resize";
if (browser.isNS)
this.parentWindow.frame.style.cursor = winCtrl.resizeDirection + "-resize";
}

function winResizeCursorRestore(event) {

if (winCtrl.inResizeDrag)
return;

// Restore cursor.

if (browser.isIE)
document.body.style.cursor = "";
if (browser.isNS)
this.parentWindow.frame.style.cursor = "";
}

function winResizeDragStart(event) {

var target;

// Make sure the event is on the window frame.

if (browser.isIE)
target = window.event.srcElement;
if (browser.isNS)
target = event.target;
if (target != this.parentWindow.frame)
return;

this.parentWindow.makeActive();

if (this.parentWindow.isMinimized)
return;

// Save cursor position.

if (browser.isIE) {
winCtrl.xPosition = window.event.x;
winCtrl.yPosition = window.event.y;
}
if (browser.isNS) {
winCtrl.xPosition = event.pageX;
winCtrl.yPosition = event.pageY;
}

// Save window frame position and current window size.

winCtrl.oldLeft   = parseInt(this.parentWindow.frame.style.left,  10);
winCtrl.oldTop    = parseInt(this.parentWindow.frame.style.top,   10);
winCtrl.oldWidth  = parseInt(this.parentWindow.frame.style.width, 10);
winCtrl.oldHeight = parseInt(this.parentWindow.clientArea.style.height, 10);

// Set document to capture mousemove and mouseup events.

if (browser.isIE) {
document.onmousemove = winResizeDragGo;
document.onmouseup   = winResizeDragStop;
}
if (browser.isNS) {
document.addEventListener("mousemove", winResizeDragGo,   true);
document.addEventListener("mouseup"  , winResizeDragStop, true);
event.preventDefault();
}

winCtrl.inResizeDrag = true;
}

function winResizeDragGo(event) {

var north, south, east, west;
var dx, dy;
var w, h;

if (!winCtrl.inResizeDrag)
return;

// Set direction flags based on original resize direction.

north = false;
south = false;
east  = false;
west  = false;
if (winCtrl.resizeDirection.charAt(0) == "n")
north = true;
if (winCtrl.resizeDirection.charAt(0) == "s")
south = true;
if (winCtrl.resizeDirection.charAt(0) == "e" || winCtrl.resizeDirection.charAt(1) == "e")
east = true;
if (winCtrl.resizeDirection.charAt(0) == "w" || winCtrl.resizeDirection.charAt(1) == "w")
west = true;

// Find change in cursor position.

if (browser.isIE) {
dx = window.event.x - winCtrl.xPosition;
dy = window.event.y - winCtrl.yPosition;
}
if (browser.isNS) {
dx = event.pageX - winCtrl.xPosition;
dy = event.pageY - winCtrl.yPosition;
}

// If resizing north or west, reverse corresponding amount.

if (west)
dx = -dx;
if (north)
dy = -dy;

// Check new size.

w = winCtrl.oldWidth  + dx;
h = winCtrl.oldHeight + dy;
if (w <= winCtrl.active.minimumWidth) {
w = winCtrl.active.minimumWidth;
dx = w - winCtrl.oldWidth;
}
if (h <= winCtrl.active.minimumHeight) {
h = winCtrl.active.minimumHeight;
dy = h - winCtrl.oldHeight;
}

// Resize the window. For IE, keep client area and frame widths in synch.

if (east || west) {
winCtrl.active.frame.style.width = w + "px";
if (browser.isIE)
winCtrl.active.clientArea.style.width = (w - winCtrl.active.widthDiff) + "px";
}
if (north || south)
winCtrl.active.clientArea.style.height = h + "px";

// Clip the title bar text, if necessary.

if (east || west) {
if (w < winCtrl.active.clipTextMinimumWidth)
winCtrl.active.titleBarText.style.width = (winCtrl.minimizedTextWidth + w - winCtrl.active.minimumWidth) + "px";
else
winCtrl.active.titleBarText.style.width = "";
}

// For a north or west resize, move the window.

if (west)
winCtrl.active.frame.style.left = (winCtrl.oldLeft - dx) + "px";
if (north)
winCtrl.active.frame.style.top  = (winCtrl.oldTop  - dy) + "px";

if (browser.isIE) {
window.event.cancelBubble = true;
window.event.returnValue = false;
}
if (browser.isNS)
event.preventDefault();
}

function winResizeDragStop(event) {

winCtrl.inResizeDrag = false;

// Remove mousemove and mouseup event captures on document.

if (browser.isIE) {
document.onmousemove = null;
document.onmouseup   = null;
}
if (browser.isNS) {
document.removeEventListener("mousemove", winResizeDragGo,   true);
document.removeEventListener("mouseup"  , winResizeDragStop, true);
}
}

//=============================================================================
// Utility functions.
//=============================================================================

function winFindByClassName(el, className) {

var i, tmp;

if (el.className == className)
return el;

// Search for a descendant element assigned the given class.

for (i = 0; i < el.childNodes.length; i++) {
tmp = winFindByClassName(el.childNodes[i], className);
if (tmp != null)
return tmp;
}

return null;
}

//=============================================================================
// Initialization code.
//=============================================================================

var winList = new Array();
var winCtrl = new Object();

function winInit() {

var elList;

// Initialize window control object.

winCtrl.maxzIndex                        =   0;
winCtrl.resizeCornerSize                 =  16;
winCtrl.minimizedTextWidth               = 100;
winCtrl.inactiveFrameBackgroundColor     = "#c0c0c0";
winCtrl.inactiveFrameBorderColor         = "#f0f0f0 #505050 #404040 #e0e0e0";
winCtrl.inactiveTitleBarColor            = "#808080";
winCtrl.inactiveTitleTextColor           = "#c0c0c0";
winCtrl.inactiveClientAreaBorderColor    = "#404040 #e0e0e0 #f0f0f0 #505050";
winCtrl.inactiveClientAreaScrollbarColor = "";
winCtrl.inMoveDrag                       = false;
winCtrl.inResizeDrag                     = false;

// Initialize windows and build list.

elList = document.getElementsByTagName("DIV");
for (var i = 0; i < elList.length; i++)
if (elList[i].className == "window")
winList[elList[i].id] = new Window(elList[i]);
}

window.onload = winInit;  // run initialization code after page loads.

//]]></script>
</head>
<body>

<!-- Normal page content. -->

<div id="demoBox">

<h3>Windows Demo</h3>

<p>This page contains three sample windows which can be opened using the links
below.</p>

<p>
<a href="" onclick="if (winList['sample1']) winList['sample1'].open(); return false;">Window 1</a>

|
<a href="" onclick="if (winList['sample2']) winList['sample2'].open(); return false;">Window 2</a>
|
<a href="" onclick="if (winList['sample3']) winList['sample3'].open(); return false;">Window 3</a>
</p>

<p>The first two use the default window style while the third demonstrates how
an individual window can be customized. Use your browser's
<code>View Source</code> option to see the full source code.</p>

</div>

<!-- Sample Window 1 -->

<div id="sample1" class="window" style="left:50px;top:150px;width:480px;">
<div class="titleBar">
<span class="titleBarText">The Raven</span>
<img class="titleBarButtons" alt="" src="graphics/buttons.gif" usemap="#sampleMap1" width="50" height="14" />
<map id="sampleMap1" name="sampleMap1">
<area shape="rect" coords="0,0,15,13"  href="" alt="" title="Minimize" onclick="this.parentWindow.minimize();return false;" />
<area shape="rect" coords="16,0,31,13" href="" alt="" title="Restore"  onclick="this.parentWindow.restore();return false;" />
<area shape="rect" coords="34,0,49,13" href="" alt="" title="Close"    onclick="this.parentWindow.close();return false;" />

</map>
</div>
<div class="clientArea" style="height:200px;">

<h3>The Raven</h3>

<p>Once upon a midnight dreary, while I pondered, weak and weary<br />
Over many a quaint and curious volume of forgotten lore-<br />

While I nodded, nearly napping, suddenly there came a tapping<br />
As of some one gently rapping, rapping at my chamber door<br />
"'T is some visitor," I muttered, "tapping at my chamber door-<br />
<span class="lastLine">Only this and nothing more."</span></p>

<p>Ah, distinctly I remember it was in the bleak December;<br />
And each separate dying ember wrought its ghost upon the floor.<br />

Eagerly I wished the morrow;-vainly I had sought to borrow<br />
From my books surcease of sorrow-sorrow for the lost Lenore-<br />
For the rare and radiant maiden whom the angels name Lenore-<br />
<span class="lastLine">Nameless here for evermore.</span></p>

<p>Then the silken, sad, uncertain rustling of each purple curtain<br />
Thrilled me-filled me with fantastic terrors never felt before;<br />

So that now, to still the beating of my heart, I stood repeating,<br />
"'T is some visitor entreating entrance at my chamber door-<br />
Some late visitor entreating entrance at my chamber door;-<br />
<span class="lastLine">This it is and nothing more."</span></p>

<p>Presently my soul grew stronger; hesitating then no longer,<br />
"Sir," said I, "or Madam, truly your forgiveness I implore;<br />

But the fact is I was napping, and so gently you came rapping,<br />
And so faintly you came tapping, tapping at my chamber door,<br />
That I scarce was sure I heard you"-here I opened wide the door;-<br />
<span class="lastLine">Darkness there and nothing more."</span></p>

<p>Deep into that darkness peering, long I stood there wondering, fearing,<br />
Doubting, dreaming dreams no mortal ever dared to dream before;<br />

But the silence was unbroken, and the stillness gave no token,<br />
And the only word there spoken was the whispered word, "Lenore?"<br />
This I whispered, and an echo murmured back the word, "Lenore!"<br />
<span class="lastLine">Merely this and nothing more.</span></p>

<p>Back into the chamber turning, all my soul within me burning,<br />
Soon again I heard a tapping somewhat louder than before.<br />

"Surely," said I, "surely that is something at my window lattice;<br />
Let me see, then, what thereat is, and this mystery explore-<br />
Let my heart be still a moment and this mystery explore;-<br />
<span class="lastLine">'T is the wind and nothing more!"</span></p>

<p>Open here I flung the shutter, when, with many a flirt and flutter,<br />
In there stepped a stately Raven of the saintly days of yore;<br />

Not the least obeisance made he; not a minute stopped or stayed he;<br />
But, with mien of lord or lady, perched above my chamber door-<br />
Perched upon a bust of Pallas just above my chamber door-<br />
<span class="lastLine">Perched, and sat, and nothing more.</span></p>

<p>Then this ebony bird beguiling my sad fancy into smiling,<br />
By the grave and stern decorum of the countenance it wore,<br />

"Though thy crest be shorn and shaven, thou," I said,"art sure no craven,<br />
Ghastly grim and ancient Raven wandering from the Nightly shore-<br />
Tell me what they lordly name is on the Night's Plutonian shore!"<br />
<span class="lastLine">Quoth the Raven, "Nevermore."</span></p>

<p>Much I marvelled the ungainly fowl to hear discourse so plainly,<br />
Though its answer little meaning-little relevancy bore;<br />

For we cannot help agreeing that no living human being<br />
Ever yet was blessed with seeing bird above his chamber door-<br />
Bird or beast upon the culptured bust above his chamber door,<br />
<span class="lastLine">With such name as "Nevermore."</span></p>

<p>But the Raven, sitting lonely on the placid bust, spoke only<br />
That one word, as if his soul in that one word he did outpour.<br />

Nothing farther then he uttered-not a feather then he fluttered-<br />
Till I scarcely more than muttered, "Other friends have flown before-<br />
On the morrow he will leave me, as my Hopes have flown before."<br />
<span class="lastLine">Then the bird said, "Nevermore."</span></p>

<p>Startled at the stillness broken by reply so aptly spoken,<br />
"Doubtless," said I, "what it utters is its only stock and store<br />

Caught from some unhappy master whom unmerciful Disaster<br />
Followed fast and followed faster till his songs one burden bore-<br />
Till the dirges of his Hope that melancholy burden more<br />
<span class="lastLine">Of 'Never-nevermore.'"</span></p>

<p>But the Raven still beguiling my sad fancy into smiling,<br />
Straight I wheeled a cushioned seat in front of bird and bust and door;<br />

Then, upon the velvet sinking, I betook myself to linking<br />
Fancy unto fancy, thinking what this ominous bird of yore-<br />
What this grim, ungainly, ghastly, gaunt, and ominous bird of yore<br />
<span class="lastLine">Meant in croaking "Nevermore."</span></p>

<p>This I sat engaged in guessing, but no syllable expressing<br />
To the fowl whose fiery eyes now burned into my bosom's core;<br />

This and more I sat divining, with my head at ease reclining<br />
On the cushion's velvet lining that the lamp-light gloating o'er,<br />
But whose velvet-violet lining with the lamp-light gloating o'er,<br />
<span class="lastLine">She shall press, ah, nevermore!</span></p>

<p>Then, methought, the air grew denser, perfumed from an unseen censer<br />
Swung by seraphim whose foot-falls tinkled on the tufted floor.<br />

"Wretch," I cried, "thy God hath lent thee-by these angels he hath sent thee<br />
Respite-respite and nepenthe from thy memories of Lenore;<br />
Quaff, oh, quaff this kind nepenthe and forget this lost Lenore!"<br />
<span class="lastLine">Quoth the Raven, "Nevermore."</span></p>

<p>"Prophet!" said I, "thing of evil!-prophet still, if bird or devil!-<br />
By that Heaven that bends above us-by that God we both adore-<br />

Tell this soul with sorrow laden if, within the distant<br />
Aidenn, It shall clasp a sainted maiden whom the angels name Lenore-<br />
Clasp a rare and radiant maiden whom the angels name Lenore."<br />
<span class="lastLine">Quoth the Raven, "Nevermore."</span></p>

<p>"Be that word our sign of parting, bird or fiend!" I shrieked, upstarting-<br />
"Get thee back into the tempest and the Night's Plutonian shore!<br />

Leave no black plume as a token of that lie thy soul hath spoken!<br />
Leave my loneliness unbroken!-quit the bust above my door!<br />
Take thy beak from out my heart, and take thy form from off my door!"<br />
<span class="lastLine">Quoth the Raven, "Nevermore."</span></p>

<p>And the Raven, never flitting, still is sitting, still is sitting<br />
On the pallid bust of Pallas just above my chamber door;<br />

And his eyes have all the seeming of a demon's that is dreaming,<br />
And the lamp-light o'er him streaming throws his shadow on the floor;<br />
And my soul from out that shadow that lies floating on the floor<br />
<span class="lastLine">Shall be lifted-nevermore!</span></p>

<p><cite>Edgar Allan Poe</cite></p>

</div>
</div>

<!-- Sample Window 2 -->

<div id="sample2" class="window" style="left:200px;top:100px;width:280px;">
<div class="titleBar">
<span class="titleBarText">The Conqueror Worm</span>
<img class="titleBarButtons" alt="" src="graphics/buttons.gif" usemap="#sampleMap2" width="50" height="14" />
<map id="sampleMap2" name="sampleMap2">
<area shape="rect" coords="0,0,15,13"  href="" alt="" title="Minimize" onclick="this.parentWindow.minimize();return false;" />

<area shape="rect" coords="16,0,31,13" href="" alt="" title="Restore"  onclick="this.parentWindow.restore();return false;" />
<area shape="rect" coords="34,0,49,13" href="" alt="" title="Close"    onclick="this.parentWindow.close();return false;" />
</map>
</div>
<div class="clientArea" style="height:175px;">

<h3>The Conqueror Worm</h3>

<p>Lo! 'tis a gala night<br />

Within the lonesome latter years!<br />
An angel throng, bewinged, bedight<br />
In veils, and drowned in tears,<br />
Sit in a theatre, to see<br />
A play of hopes and fears,<br />
While the orchestra breathes fitfully<br />

The music of the spheres.</p>

<p>Mimes, in the form of God on high,<br />
Mutter and mumble low,<br />
And hither and thither fly-<br />
Mere puppets they, who come and go<br />
At bidding of vast formless things<br />

That shift the scenery to and fro,<br />
Flapping from out their Condor wings<br />
Invisible Woe!</p>

<p>That motley drama- oh, be sure<br />
It shall not be forgot!<br />
With its Phantom chased for evermore,<br />

By a crowd that seize it not,<br />
Through a circle that ever returneth in<br />
To the self-same spot,<br />
And much of Madness, and more of Sin,<br />
And Horror the soul of the plot.</p>

<p>But see, amid the mimic rout<br />

A crawling shape intrude!<br />
A blood-red thing that writhes from out<br />
The scenic solitude!<br />
It writhes!- it writhes!- with mortal pangs<br />
The mimes become its food,<br />
And seraphs sob at vermin fangs<br />

In human gore imbued.</p>

<p>Out- out are the lights- out all!<br />
And, over each quivering form,<br />
The curtain, a funeral pall,<br />
Comes down with the rush of a storm,<br />
While the angels, all pallid and wan,<br />

Uprising, unveiling, affirm<br />
That the play is the tragedy, "Man,"<br />
And its hero the Conqueror Worm.</p>

<p><cite>Edgar Allan Poe</cite></p>

</div>
</div>

<!-- Sample Window 3 -->

<div id="sample3" class="window" style="left:350px;top:50px;width:300px;background-color:#f0c090;border-color:#ffe0b0 #a07040 #805020 #e0b080;">
<div class="titleBar" style="background-color:#c08060;color:#ffffcc;">
<span class="titleBarText">Spirits of the Dead</span>
<img class="titleBarButtons" alt="" src="graphics/altbuttons.gif" longdesc="graphics/altbuttonslow.gif" usemap="#sampleMap3" width="50" height="14" />
<map id="sampleMap3" name="sampleMap3">
<area shape="rect" coords="0,0,15,13"  href="" alt="" title="Minimize" onclick="this.parentWindow.minimize();return false;" />
<area shape="rect" coords="16,0,31,13" href="" alt="" title="Restore"  onclick="this.parentWindow.restore();return false;" />

<area shape="rect" coords="34,0,49,13" href="" alt="" title="Close"    onclick="this.parentWindow.close();return false;" />
</map>
</div>
<div class="clientArea" style="height:150px;background-color:#ffffcc;color:#806040;border-color:#805020 #e0b080 #ffe0b0 #a07040;scrollbar-base-color:#f0c090;">

<h3>Spirits of the Dead</h3>

<p>Thy soul shall find itself alone<br />
'Mid dark thoughts of the grey tomb-stone;<br />

Not one, of all the crowd, to pry<br />
Into thine hour of secrecy.</p>

<p>Be silent in that solitude,<br />
Which is not loneliness- for then<br />
The spirits of the dead, who stood<br />
In life before thee, are again<br />

In death around thee, and their will<br />
Shall overshadow thee; be still.</p>

<p>The night, though clear, shall frown,<br />
And the stars shall not look down<br />
From their high thrones in the Heaven<br />
With light like hope to mortals given,<br />

But their red orbs, without beam,<br />
To thy weariness shall seem<br />
As a burning and a fever<br />
Which would cling to thee for ever.</p>

<p>Now are thoughts thou shalt not banish,<br />
Now are visions ne'er to vanish;<br />

From thy spirit shall they pass<br />
No more, like dew-drop from the grass.</p>

<p>The breeze, the breath of God, is still,<br />
And the mist upon the hill<br />
Shadowy, shadowy, yet unbroken,<br />
Is a symbol and a token.<br />

How it hangs upon the trees,<br />
A mystery of mysteries!</p>

<p><cite>Edgar Allan Poe</cite></p>

</div>
</div>

</body>
</html>

source

Mootools Draggable / Resize Example

function resizeDrag(){
//create an array of elements with class 'drag'
var draggables = $ES('.drag');
//For each of the above elements run this function(pass in the selected function el)
draggables.each(function(el){
//Make the element dragable. Draging starts on the element with class = handle
el.makeDraggable({handle: el.getElementsBySelector('.handle')[0]});
//Make the element resizable. Resizing starts on the element with class = resize
el.makeResizable({handle: el.getElementsBySelector('.resize')[0]});
});
}

source

movieClip.DragWithEasign && bringToFront

//-----------------------------------//
// Drag with easign and bringToFront //
//-----------------------------------//
//
MovieClip.prototype.dragEasing = function(handCursor) {
// control hand cursor
(handCursor == "") ? this.useHandCursor=true : this.useHandCursor=handCursor;
this.xfinal = this._x;
this.yfinal = this._y;
// on press drag
this.onPress = function() {
//bring to front
mx.behaviors.DepthControl.bringToFront(this);
this.arrastrar = true;
this.xd = this._x-_root._xmouse;
this.yd = this._y-_root._ymouse;
//on enterframe move the mc with easing
this.onEnterFrame = function() {
if (this.arrastrar == true) {
this.x = _root._xmouse+this.xd;
this.y = _root._ymouse+this.yd;
} else {
this.x = this.xfinal+this.xd;
this.y = this.yfinal+this.yd;
}
this._x = this._x+(this.x-this._x)/3;
this._y = this._y+(this.y-this._y)/3;
// end of easing
if (Math.abs((this.x-this._x)/3)<0.5 && this.arrastrar == false) {
delete this.onEnterFrame;
}
};
};
// on release set the end point
this.onRelease = this.onReleaseOutside=function () {
this.arrastrar = false;
this.xfinal = _root._xmouse;
this.yfinal = _root._ymouse;
};
};

source