Skip to main content
arisud
Participant
December 6, 2018
Answered

help with simply drag and drop game and timer on multiple frame/scene

  • December 6, 2018
  • 1 reply
  • 285 views

hi, i have project i've been working on for a while and stuck on my very basic game concept.

for the record i never work with actionscript 3 nor any coding involve before, so i kinda need kindergarten-type-explanation.

this is the concept i've been working on

so i need to drag this 2 object into one target. The first object will direct to "correct page" and the other object to "incorrect page".

i found a lot of code/tutor but it's kinda hard to apply to what i intend to do since.

my question was, how i go to another frame after droping the object to another frame?

other related question

how to  add timer/countdown on multiple frame/scene? also how to direct to other frame once its hit 0?

really need the helping hand

ps: i use cs6 flash

    This topic has been closed for replies.
    Correct answer JoãoCésar17023019

    Hi.

    Sorry for the delay.

    Here is a sample.

    Don't be scared about the amount of code.

    My idea here is to try to create a generalist and reusable drag and drop game component and also a timer component.

    If you'not comfortable with external custom classes and OOP techiniques, try to at least understand how to use the classes inside of the FLA. You'll see it's not that hard.

    AS3 code:

    [FLA]

    [Frame 1]

    import flash.display.DisplayObject;

    var game:DragAndDropGame;

    var timer:CustomTimer;

    function start():void

    {

        stop();

        game = new DragAndDropGame(pieces, slots, true, onMatch, onMismatch);

        timer = new CustomTimer(15, timerText, null, onTimeFinished);

        timer.start();

    }

    function onMatch(target:DisplayObject):void

    {

        trace("Correct!");

        gotoAndStop("correct");

    }

    function onMismatch(target:DisplayObject):void

    {

        trace("Incorrect...");

        gotoAndStop("incorrect");

    }

    function onTimeFinished(target:CustomTimer):void

    {

        trace("Time is out!");

        gotoAndStop("timeout");

    }

    start();

    [Frame 2]

    timer.stop();

    [Frame 3]

    timer.start(10);

    You only need to understand up until here.

    [EXTERNAL CLASSES]

    [DragAndDropGame.as]

    package

    {

        import flash.display.DisplayObject;

        import flash.display.DisplayObjectContainer;

        import flash.events.MouseEvent;

        public class DragAndDropGame

        {

              public var resetPosition:Boolean;

              public var piecePrefix:String;

              public var slotPrefix:String;

              public var win:Boolean = false;

              public var pieces:DisplayObjectContainer;

              public var slots:DisplayObjectContainer;

              public var onMatch:Function;

              public var onMismatch:Function;

              public var onWin:Function;

              private var _piecesList:Object;

              public function DragAndDropGame(pieces:DisplayObjectContainer, slots:DisplayObjectContainer, resetPosition:Boolean = true, onMatch:Function  = null, onMismatch:Function  = null, onWin:Function = null, piecePrefix:String = "piece", slotPrefix:String = "slot")

              {

                  var i:uint;

                  var total:uint;

                  this.pieces = pieces;

                  this.slots = slots;

                  this.resetPosition = resetPosition;

                  this.onMatch = onMatch;

                  this.onMismatch = onMismatch;

                  this.onWin = onWin;

                  this.piecePrefix = piecePrefix;

                  this.slotPrefix = slotPrefix;

                  _piecesList = {};

                  for (i = 0, total = pieces.numChildren; i < total; i++)

                  {

                        var piece = pieces.getChildAt(i);

                        _piecesList[piece.name] = {piece:piece, originalX:piece.x, originalY:piece.y, inPlace:false};

                  }

                  pieces.addEventListener(MouseEvent.MOUSE_DOWN, _onMouse);

                  pieces.addEventListener(MouseEvent.MOUSE_UP, _onMouse);

                  slots.mouseChildren = false;

              }

              function _onMouse(e:MouseEvent):void

              {

                  if (e.type == MouseEvent.MOUSE_DOWN)

                  {

                        if (e.currentTarget == pieces)

                        {

                            if (!e.target || e.target == pieces)

                                  return;

                            pieces.setChildIndex(e.target as DisplayObject, pieces.numChildren - 1);

                            e.target.startDrag();

                        }

                  }

                  else if (e.type == MouseEvent.MOUSE_UP)

                  {

                        var slot:DisplayObject;

                        var target:DisplayObject = e.target as DisplayObject;

                        if (!target || target == pieces)

                            return;

                        target["stopDrag"]();

                        for (var i:uint = 0, total:uint = slots.numChildren; i < total; i++)

                        {

                            slot = slots.getChildAt(i);

                            if (target.hitTestObject(slot))

                            {

                                  if (target.name.replace(piecePrefix, "") == slot.name.replace(slotPrefix, ""))

                                  {

                                      target.x = slot.x;

                                      target.y = slot.y;

                                      target["mouseEnabled"] = false;

                                      if (onMatch != null)

                                            onMatch(target);

                                      else

                                            defaultOnMatch(target);

                                      _piecesList[target.name].inPlace = true;

                                      break;

                                  }

                                  else

                                      _callMiss(target);

                            }

                        }

                        if (!_piecesList[target.name].inPlace)

                            _callMiss(target);

                        for (var key:String in _piecesList)

                            if (!_piecesList[key].inPlace)

                                return;

                        if (onWin != null)

                            onWin();

                        else

                            defaultOnWin();

                        pieces.removeEventListener(MouseEvent.MOUSE_DOWN, _onMouse);

                        pieces.removeEventListener(MouseEvent.MOUSE_UP, _onMouse);

                        slots.mouseChildren = true;

                        win = true;

                  }

              }

              public function returnToOrigin(target:DisplayObject):void

              {

                  target.x = _piecesList[target.name].originalX;

                  target.y = _piecesList[target.name].originalY;

              }

              public function defaultOnMatch(target:DisplayObject):void

              {

                  trace("Match.");

                  target.alpha = 0.5;

              }

              public function defaultOnMismatch(target:DisplayObject):void

              {

                  trace("Miss...");

              }

              public function defaultOnWin():void

              {

                  trace("You win!");

              }

              private function _callMiss(target:DisplayObject):void

              {

                  if (onMismatch != null)

                        onMismatch(target);

                  else

                        defaultOnMismatch(target);

                  if (resetPosition)

                        returnToOrigin(target);

              }

        }

    }

    [CustomTimer.as]

    package

    {

         import flash.text.TextField;

         import flash.utils.setInterval;

         import flash.utils.clearInterval;

         public class CustomTimer

         {

              public var time:uint;

              public var textField:TextField;

              public var savedTime:int;

              public var paused:Boolean = false;

              public var onUpdate:Function;

              public var onFinish:Function;

              public var update:Function;

              public var _interval:uint = 0;

              public function CustomTimer(time:uint = 0, textField:TextField = null, onUpdate:Function = null, onFinish:Function = null)

              {

                   this.time = time;

                   this.textField = textField;

                   this.onUpdate = onUpdate;

                   this.onFinish = onFinish;

                   savedTime = this.time;

              }

              public function start(time:uint = 0):void

              {

                   clearInterval(_interval);

                   this.time = time || savedTime;

                   if (textField)

                        Utils.timerText(textField, this.time);

                   _interval = setInterval(updateTime, 1000);

              }

              public function stop():void

              {

                   if (textField)

                        Utils.timerText(textField, 0);

                   clearInterval(_interval);

              }

              public function pause():void

              {

                   paused = true;

              }

              public function resume():void

              {

                   paused = false;

              }

              public function updateTime():void

              {

                   if (paused)

                        return;

                   time--;

                   if (onUpdate != null)

                        onUpdate(time);

                   if (textField)

                        Utils.timerText(textField, time);

                   if (time == 0)

                   {

                        if (onFinish != null)

                             onFinish(this);

                        clearInterval(_interval);

                   }

              }

         }

    }

    [Utils.as]

    package

    {

         import flash.text.TextField;

         public class Utils

         {

              public static function toTimeCode(milliseconds:uint):Object

              {

                   var seconds = Math.floor((milliseconds / 1000) % 60);

                   var strSeconds = (seconds < 10) ? ("0" + String(seconds)) : String(seconds);

                   var minutes = Math.round(Math.floor((milliseconds / 1000) / 60));

                   var strMinutes = (minutes < 10) ? ("0" + String(minutes)) : String(minutes);

                   return {seconds: strSeconds, minutes: strMinutes};

              }

              public static function timerText(textField:TextField, time:uint):void

              {

                   var timeCode:Object = Utils.toTimeCode(time * 1000);

                   textField.text = timeCode.minutes + ":" + timeCode.seconds;

              }    

         }

    }

    FLA download:

    animate_cc_as3_drag_and_drop_2.zip - Google Drive

    I hope this helps.

    Regards,

    JC

    1 reply

    JoãoCésar17023019
    Community Expert
    JoãoCésar17023019Community ExpertCorrect answer
    Community Expert
    December 6, 2018

    Hi.

    Sorry for the delay.

    Here is a sample.

    Don't be scared about the amount of code.

    My idea here is to try to create a generalist and reusable drag and drop game component and also a timer component.

    If you'not comfortable with external custom classes and OOP techiniques, try to at least understand how to use the classes inside of the FLA. You'll see it's not that hard.

    AS3 code:

    [FLA]

    [Frame 1]

    import flash.display.DisplayObject;

    var game:DragAndDropGame;

    var timer:CustomTimer;

    function start():void

    {

        stop();

        game = new DragAndDropGame(pieces, slots, true, onMatch, onMismatch);

        timer = new CustomTimer(15, timerText, null, onTimeFinished);

        timer.start();

    }

    function onMatch(target:DisplayObject):void

    {

        trace("Correct!");

        gotoAndStop("correct");

    }

    function onMismatch(target:DisplayObject):void

    {

        trace("Incorrect...");

        gotoAndStop("incorrect");

    }

    function onTimeFinished(target:CustomTimer):void

    {

        trace("Time is out!");

        gotoAndStop("timeout");

    }

    start();

    [Frame 2]

    timer.stop();

    [Frame 3]

    timer.start(10);

    You only need to understand up until here.

    [EXTERNAL CLASSES]

    [DragAndDropGame.as]

    package

    {

        import flash.display.DisplayObject;

        import flash.display.DisplayObjectContainer;

        import flash.events.MouseEvent;

        public class DragAndDropGame

        {

              public var resetPosition:Boolean;

              public var piecePrefix:String;

              public var slotPrefix:String;

              public var win:Boolean = false;

              public var pieces:DisplayObjectContainer;

              public var slots:DisplayObjectContainer;

              public var onMatch:Function;

              public var onMismatch:Function;

              public var onWin:Function;

              private var _piecesList:Object;

              public function DragAndDropGame(pieces:DisplayObjectContainer, slots:DisplayObjectContainer, resetPosition:Boolean = true, onMatch:Function  = null, onMismatch:Function  = null, onWin:Function = null, piecePrefix:String = "piece", slotPrefix:String = "slot")

              {

                  var i:uint;

                  var total:uint;

                  this.pieces = pieces;

                  this.slots = slots;

                  this.resetPosition = resetPosition;

                  this.onMatch = onMatch;

                  this.onMismatch = onMismatch;

                  this.onWin = onWin;

                  this.piecePrefix = piecePrefix;

                  this.slotPrefix = slotPrefix;

                  _piecesList = {};

                  for (i = 0, total = pieces.numChildren; i < total; i++)

                  {

                        var piece = pieces.getChildAt(i);

                        _piecesList[piece.name] = {piece:piece, originalX:piece.x, originalY:piece.y, inPlace:false};

                  }

                  pieces.addEventListener(MouseEvent.MOUSE_DOWN, _onMouse);

                  pieces.addEventListener(MouseEvent.MOUSE_UP, _onMouse);

                  slots.mouseChildren = false;

              }

              function _onMouse(e:MouseEvent):void

              {

                  if (e.type == MouseEvent.MOUSE_DOWN)

                  {

                        if (e.currentTarget == pieces)

                        {

                            if (!e.target || e.target == pieces)

                                  return;

                            pieces.setChildIndex(e.target as DisplayObject, pieces.numChildren - 1);

                            e.target.startDrag();

                        }

                  }

                  else if (e.type == MouseEvent.MOUSE_UP)

                  {

                        var slot:DisplayObject;

                        var target:DisplayObject = e.target as DisplayObject;

                        if (!target || target == pieces)

                            return;

                        target["stopDrag"]();

                        for (var i:uint = 0, total:uint = slots.numChildren; i < total; i++)

                        {

                            slot = slots.getChildAt(i);

                            if (target.hitTestObject(slot))

                            {

                                  if (target.name.replace(piecePrefix, "") == slot.name.replace(slotPrefix, ""))

                                  {

                                      target.x = slot.x;

                                      target.y = slot.y;

                                      target["mouseEnabled"] = false;

                                      if (onMatch != null)

                                            onMatch(target);

                                      else

                                            defaultOnMatch(target);

                                      _piecesList[target.name].inPlace = true;

                                      break;

                                  }

                                  else

                                      _callMiss(target);

                            }

                        }

                        if (!_piecesList[target.name].inPlace)

                            _callMiss(target);

                        for (var key:String in _piecesList)

                            if (!_piecesList[key].inPlace)

                                return;

                        if (onWin != null)

                            onWin();

                        else

                            defaultOnWin();

                        pieces.removeEventListener(MouseEvent.MOUSE_DOWN, _onMouse);

                        pieces.removeEventListener(MouseEvent.MOUSE_UP, _onMouse);

                        slots.mouseChildren = true;

                        win = true;

                  }

              }

              public function returnToOrigin(target:DisplayObject):void

              {

                  target.x = _piecesList[target.name].originalX;

                  target.y = _piecesList[target.name].originalY;

              }

              public function defaultOnMatch(target:DisplayObject):void

              {

                  trace("Match.");

                  target.alpha = 0.5;

              }

              public function defaultOnMismatch(target:DisplayObject):void

              {

                  trace("Miss...");

              }

              public function defaultOnWin():void

              {

                  trace("You win!");

              }

              private function _callMiss(target:DisplayObject):void

              {

                  if (onMismatch != null)

                        onMismatch(target);

                  else

                        defaultOnMismatch(target);

                  if (resetPosition)

                        returnToOrigin(target);

              }

        }

    }

    [CustomTimer.as]

    package

    {

         import flash.text.TextField;

         import flash.utils.setInterval;

         import flash.utils.clearInterval;

         public class CustomTimer

         {

              public var time:uint;

              public var textField:TextField;

              public var savedTime:int;

              public var paused:Boolean = false;

              public var onUpdate:Function;

              public var onFinish:Function;

              public var update:Function;

              public var _interval:uint = 0;

              public function CustomTimer(time:uint = 0, textField:TextField = null, onUpdate:Function = null, onFinish:Function = null)

              {

                   this.time = time;

                   this.textField = textField;

                   this.onUpdate = onUpdate;

                   this.onFinish = onFinish;

                   savedTime = this.time;

              }

              public function start(time:uint = 0):void

              {

                   clearInterval(_interval);

                   this.time = time || savedTime;

                   if (textField)

                        Utils.timerText(textField, this.time);

                   _interval = setInterval(updateTime, 1000);

              }

              public function stop():void

              {

                   if (textField)

                        Utils.timerText(textField, 0);

                   clearInterval(_interval);

              }

              public function pause():void

              {

                   paused = true;

              }

              public function resume():void

              {

                   paused = false;

              }

              public function updateTime():void

              {

                   if (paused)

                        return;

                   time--;

                   if (onUpdate != null)

                        onUpdate(time);

                   if (textField)

                        Utils.timerText(textField, time);

                   if (time == 0)

                   {

                        if (onFinish != null)

                             onFinish(this);

                        clearInterval(_interval);

                   }

              }

         }

    }

    [Utils.as]

    package

    {

         import flash.text.TextField;

         public class Utils

         {

              public static function toTimeCode(milliseconds:uint):Object

              {

                   var seconds = Math.floor((milliseconds / 1000) % 60);

                   var strSeconds = (seconds < 10) ? ("0" + String(seconds)) : String(seconds);

                   var minutes = Math.round(Math.floor((milliseconds / 1000) / 60));

                   var strMinutes = (minutes < 10) ? ("0" + String(minutes)) : String(minutes);

                   return {seconds: strSeconds, minutes: strMinutes};

              }

              public static function timerText(textField:TextField, time:uint):void

              {

                   var timeCode:Object = Utils.toTimeCode(time * 1000);

                   textField.text = timeCode.minutes + ":" + timeCode.seconds;

              }    

         }

    }

    FLA download:

    animate_cc_as3_drag_and_drop_2.zip - Google Drive

    I hope this helps.

    Regards,

    JC