window-tutorial-$11.lzx

<canvas width="100%" height="400">
  <class name="mediaWindow" x="10" y="10" width="200" height="150" clickable="true">
      <dragstate name="dragger"/>
      <attribute name="minWindowWidth" value="150"/>
      <attribute name="minWindowHeight" value="60"/>

      <view name="topRow" width="${parent.width}">
        <view name="topLeft" resource="resources/media_win_top_left.swf" x="0" y="0" onmousedown="parent.parent.dragger.apply();" onmouseup="parent.parent.dragger.remove();"/>
        <view name="topCenter" resource="resources/media_win_top.swf" x="${parent.topLeft.width}" y="10" width="${parent.width - parent.topLeft.width                      - parent.topRight.width}" stretches="width" onmousedown="parent.parent.dragger.apply();" onmouseup="parent.parent.dragger.remove();"/>
        <view name="topRight" resource="resources/media_win_top_right.swf" x="${parent.width - this.width}" y="10"/>
      </view>

      <view name="body" width="${parent.width}">

        <view name="leftSide" resource="resources/media_win_side.swf" height="${parent.height}" stretches="height"/>
        <view name="content" height="${parent.height}" bgcolor="#BB95C0">
            <!-- This is where content will go -->
        </view>
        <view name="rightSide" resource="resources/media_win_side.swf" height="${parent.height}" stretches="height"/>
        <stableborderlayout axis="x"/>
      </view>

      <view name="bottomRow" width="${parent.width}">
        <view name="bottomLeft" resource="resources/media_win_bottom_left.swf"/>
        <view name="bottomCenter" resource="resources/media_win_bottom.swf" stretches="width"/>
        <view name="bottomRight" resource="resources/media_win_bottom_right.swf" clickable="true" onmousedown="parent.parent.startResize();" onmouseup="parent.parent.stopResize();"/>
        <stableborderlayout axis="x"/>
      </view>
      <stableborderlayout axis="y"/>

      <method name="startResize">
        // set distances from right and bottom edges
        this.resizeOffsetX = this.width 
                             - this.getMouse('x');
        this.resizeOffsetY = this.height 
                             - this.getMouse('y');

        if (!this['sizerDel']) {
          this.sizerDel = new LzDelegate(this, 'adjustSize', 
                                         lz.Idle, 'onidle');
        }
      </method>

      <method name="adjustSize" args="v">
      
        var newWidth = this.getMouse('x') + this.resizeOffsetX;
        var newHeight = this.getMouse('y') + this.resizeOffsetY;
        if (newWidth > this.minWindowWidth) {
          this.setAttribute('width', newWidth);
        }
        if (newHeight > this.minWindowHeight) {
          this.setAttribute('height', newHeight);
        }
      
      </method>

      <method name="stopResize">
        this.sizerDel.unregisterAll();
        this.sizerDel = null;
    </method>
  </class>

  <mediaWindow name="firstWindow" width="250" height="175"/>

  <mediaWindow name="secondWindow" x="100" y="100" width="200" height="200" minWindowWidth="200" minWindowHeight="200">
    <text placement="content" name="myText" x="10" y="13" width="${immediateparent.width - 20}" height="${immediateparent.height - 7}" multiline="true">
      Hello, this is some other content that was included by default. 
      Because we have set the text to multiline, and given it a width of 
      its immediateparent minus a margin, it should wrap nicely.
    </text>
  </mediaWindow>
</canvas>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
* Copyright 2008 Laszlo Systems, Inc.  All Rights Reserved.                   *
* Use is subject to license terms.                                            *
* X_LZ_COPYRIGHT_END ****************************************************** -->