Matter Physics 2 for 1 special

Phaser 3
1

I have adapted some example code to exemplify 2 problems I am having in my real program.

First, I’d like to have a draggable object that can not collide while dragged, but can after the mouse is up.
For example, if I dragged a block object it will pass through all other objects, but if I fling the object with the mouse it will hit the other objects.

Second, I’d like to have a delay inside a function. Notice how I am outputting a loop variable over ten iterations, obviously, it is too fast to see. How do I add a delay inside that function?

var config = {
    type: Phaser.AUTO,
    width: 800,
    height: 600,
    backgroundColor: '#1b1464',
    parent: 'phaser-example',
    physics: {
        default: 'matter',
        matter: {
            gravity: {
                x: 0,
                y: 0
            }
        }
    },
    scene: {
        preload: preload,
        create: create
    }
};

var game = new Phaser.Game(config);

function preload ()
{
    this.load.image('block', 'assets/star.png');
}

function create ()
{
    var blockA = this.matter.add.image(100, 300, 'block');
    var blockB = this.matter.add.image(300, 300, 'block');
    var blockC = this.matter.add.image(600, 300, 'block').setStatic(true);
    text = this.add.text(100, 400, "Hello World");

    this.matter.add.mouseSpring({ length: 1, stiffness: 0.6});

    blockA.setOnCollideWith(blockC, myFunction);
}

function myFunction(){

    for (var i = 10; i >= 0; i--) {
            text.setText(i);
        }      
}