animation.lzx

<!--=======================================================================-->
<!--                                                                       -->
<!-- animation.lzx                                                         -->
<!--                                                                       -->
<!-- Laszlo Application Language (LZX) Example                             -->
<!--                                                                       -->
<!-- Basic animation of a moving object,                                   -->
<!-- Relative vs. Absolute                                                 -->
<!-- Animating various properties                                          -->
<!-- Animating layout                                                      -->
<!--                                                                       -->
<!--=======================================================================-->
<canvas width="800" height="300" bgcolor="#EAEAEA">
    <!-- [2006-9-25 jgrandy] (LPP-2755) commented out <splash/> -->
    <font src="helmetr.ttf" name="Helvetica"/>

    <!-- BUTTONS FOR OPERATING ON THE WINDOW -->
    <view name="wd_buttons">
        <simplelayout axis="x" spacing="3"/>
        <button text="Reset" width="86" height="20" onclick="wd_buttons.resetWindow()"/>
        <button text="Move Left" width="86" height="20" onclick="childWindow.animate('x',-200,1000,true);"/>
        <button text="Move Right" width="86" height="20" onclick="childWindow.animate('x',200,1000,true);"/>
        <button text="Stretch" width="86" height="20" onclick="childWindow.animate('height',30,500,true);"/>
        <view width="30"/>
        <button text="fade" width="86" height="20" onclick="childWindow.animate('opacity',-.33,500,true);"/>
        <button text="full opacity" width="86" height="20" onclick="childWindow.animate('opacity',1,500,false);"/>
        <method name="resetWindow">
            var w = childWindow;
            w.bringToFront();
            w.open();
            if ( w.x != 30 ) w.animate("x",30, 700);
            if ( w.y != 30 ) w.animate("y",30, 700);
            if ( w.width != 215 ) w.animate("width",215, 700);
            if ( w.height != 190 ) w.animate("height",190, 700);
            if ( w.opacity != 1 ) w.animate("opacity",1, 700);
        </method>
    </view>

    <!-- THE WINDOW -->
    <window title="My Window" name="childWindow" x="30" y="30" width="265" height="160" resizable="true" opacity="0" closeable="true" bgcolor="#ccc" oninit="this.open();" font="Helvetica">

         <menubar width="100%" placement="menubar" font="Helvetica">
             <menu text="File" width="180">
                <menuitem text="New"/>
                <menuitem text="open..."/>
                <menuitem text="Close"/>
                <menuseparator/>
                <menuitem text="Save"/>
            </menu>
            <menu text="Edit" width="150">
                <menuitem text="Cut"/>
                <menuitem text="Copy"/>
                <menuitem text="Paste"/>
            </menu>
        </menubar>

        <!-- Laszlo Animation swf -->
        <view width="100%" height="100%">
          <!-- <view x="50" y="20" resource="logo.swf" id="v"/> -->
            <scrollbar/>
        </view>

        
        <animator attribute="opacity" from="0" to="1" duration="750" relative="false"/>
        <animator attribute="height" to="30" duration="750" relative="true"/>
        <animator attribute="width" to="-50" duration="750" relative="true"/>
    </window>


</canvas>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2001-2009 Laszlo Systems, Inc.  All Rights Reserved.              *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->
<!-- @LZX_VERSION@                                                         -->