touchevents.lzx

<canvas> 
    <mixin name="limitx">
        <attribute name="minx" type="number" value="0"/>
        <attribute name="maxx" type="number" value="${canvas.width - this.width}"/>
        <setter name="x" args="x">
            
            if (x < this.minx) {
                x = minx;
            } else if (x > this.maxx) {
                x = maxx;
            }
            super.$lzc$set_x(x);
            
        </setter>
    </mixin>
    <mixin name="limity">
        <attribute name="miny" type="number" value="0"/>
        <attribute name="maxy" type="number" value="${canvas.height - this.height}"/>
        <setter name="y" args="y">
            
            if (y < this.miny) {
                y = miny;
            } else if (y > this.maxy) {
                y = maxy;
            }
            super.$lzc$set_y(y);
            
        </setter>
    </mixin>

    <view width="100" height="100" opacity="${this.activated ? .5 : 1}" bgcolor="${this.pressed ? 'green' : 'red'}" with="swipegesture, touchevents, limitx, limity" clickable="true">
        <handler name="ongesture" args="g">
            // activate dragging
            this.setAttribute('pressed', true);

            this.setAttribute('rotation', g.rotation);
            this.setAttribute('xscale', g.scale);
            this.setAttribute('yscale', g.scale);
        </handler>
        <handler name="onswipe" args="s">
            var axis = 'x';
            if (s.direction === 'up' || s.direction === 'down') {
                axis = 'y';
            }
            this.animate(axis, s.velocity, 1000, true);
            //Debug.info('onswipe', axis, s);
        </handler>
        <dragstate name="dragger" applied="${parent.pressed}"/>
    </view>
</canvas>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2011 Laszlo Systems, Inc.  All Rights Reserved.                   *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->
<!-- @LZX_VERSION@                                                         -->