You found a bug! We've classified it as TOUCH-3288 . We encourage you to continue the discussion and to find an acceptable workaround while we work on a permanent fix.
  1. #1
    Touch Premium Member suzuki1100nz's Avatar
    Join Date
    Apr 2011
    Location
    New Zealand
    Posts
    616
    Vote Rating
    206
    suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold

      0  

    Default Post drag doesn't set the new left, top or right position on the component or element

    REQUIRED INFORMATION

    Touch version tested:
    • Sencha Touch 2.0.2
    Browser versions tested against:
    • Chrome 21.0.1180.81 beta-m
      Firefox 14.0.1 (firebug 1.10.2)
      Safari 5.1.2
    DOCTYPE tested against:
    • <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    Description:
    • After dragging a component the new position details are not set on the component or the element.
    • I expect getLeft() getTop() and getRight to return the new position details post drag when called on the element or the component
    Steps to reproduce the problem:
    • See code below
    The result that was expected:
    • getLeft() getTop() and getRight to return the new position details post drag when called on the element or the component
    The result that occurs instead:
    • The old left and top positions are retained
    • Can use offsets to calculate the new positions or look at the css webkittransform
    Test Case:
    Code:
        
    Ext.application({
      name: 'Test',
      launch: function () {
    
    
      var cont = Ext.create('Ext.Container', {
          width: 100,
          height: 100,
            left: 30,
            top: 30,
            style: 'border : 1px dashed red;',
            draggable: {
                listeners: {
                    dragstart: {
                        fn: function (component, event, offsetX, offsetY, listener) {
                           console.log("Drag Start Container:  left=" + cont.getLeft() + "  right=" + cont.getRight() + " top=" + cont.getTop() + "  width=" + cont.getWidth());
                          console.log("Drag Start Container element:  left=" + cont.element.getLeft() + "  right=" + cont.element.getRight() + " top=" + cont.element.getTop() + "  width=" + cont.element.getWidth());
                        },
                        order: 'before',
                        scope: this
                    },
                    dragend: {
                        fn: function (component, event, offsetX, offsetY, listener) {
                            console.log("Drag end Container:  left=" + cont.getLeft() + "  right=" + cont.getRight() + " top=" + cont.getTop() + "  width=" + cont.getWidth());
                            console.log("Drag end Container element:  left=" + cont.element.getLeft() + "  right=" + cont.element.getRight() + " top=" + cont.element.getTop() + "  width=" + cont.element.getWidth());
    
    
                        },
                        order: 'after',
                        scope: this
                    }
                }
            }
        });
    
    
    
    
        Ext.Viewport.add(cont);
      }
    });

    HELPFUL INFORMATION
    Possible fix:
    • not provided
    Additional CSS used:
    • only default ext-all.css
    Operating System:
    • Win 7

  2. #2
    Sencha - Senior Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    38,212
    Vote Rating
    1044
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default

    Technically if you inspect the <div> for the container it still has left and top as 30px but the -webkit-transform rule is what moves it. We will discus if we can do something about this.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Touch Premium Member suzuki1100nz's Avatar
    Join Date
    Apr 2011
    Location
    New Zealand
    Posts
    616
    Vote Rating
    206
    suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold suzuki1100nz is a splendid one to behold

      1  

    Default

    Hi - I guess what I'm after maybe part of the Droppable class behaviour?

    I would still expect with draggable to get valid component positions that reflect the new position not the old.
    I have coded a workaround in a drag end listener.

    Code:
    me.setLeft(newLeft);
    me.setTop(newTop);
    
    
    //Now remove the webkit transform css as we have set the new left and top positions
    me.getDraggable().setOffset(0, 0);

  4. #4
    Sencha User
    Join Date
    Jan 2013
    Location
    Canada
    Posts
    10
    Vote Rating
    0
    ebernabei is on a distinguished road

      0  

    Default

    Okay, you just saved me from insanity with your simple work-around. I was spending hours (won't admit to days ) trying to understand why my code was broken. Now I know why...

    Thanks, suzuki1100nz !

Thread Participants: 2