minizmized window repository

[digibrix]

I am putting together a proof of concept and wanted to make it as fucntional as possible. Has any body done anything like the following????

I open a new window and when i minimize it, it goes to a place.. let's say in the left rail, that just shows a layer with the Window title. I open a new window.. and do the same thing.. and it nicely tucks itself underneath the previous one.. and i can continue to do that.. now when i click on a box in the left rail.. it then opens reopens it, however still keeps itself in the left rail order..

i know.. i am asking for a lot.. but i figured i would see if anyone did anyting like this... i am a kick ass graphic designer.. know most front end web code.. however hitting a new front learning complex coding..

thanks all

[antun]

Here's something to get you started; it's pretty rough, but you get the idea:


<canvas debug="true" width="800" height="600">
<debug x="400" />

<attribute name="windowsMinimizedY" type="number" value="258" />

<class name="windowController" width="${canvas.width}" bgcolor="0xeaeaea"
height="60" y="250">
<attribute name="windows" value="new Array()" />
<attribute name="minimizedWindowWidth" type="number" value="100" />
<attribute name="minimizedWindowHeight" type="number" value="44" />
<attribute name="minimizedWindowSpacing" type="number" value="10" />

<method name="addWin" args="w">
// Add window to local stack, and return the x-position
// that the window should be.
// TODO: Check that the window isn't already added.
// If it is, then find what its x-pos should be and restore
// it to that.
this.windows.push( w );
return (this.windows.length-1) * (this.minimizedWindowWidth
+ this.minimizedWindowSpacing );
</method>
</class>

<class name="mywindow" extends="window"
width="200" height="100"
resizable="true"
onclick="this.maximize()">

<attribute name="maximized" value="true" />
<attribute name="origX" type="number" value="$once{this.x}" />
<attribute name="origY" type="number" value="$once{this.y}" />
<attribute name="origWidth" type="number" value="$once{this.width}" />
<attribute name="origHeight" type="number" value="$once{this.height}" />

<button onclick="parent.minimize()">Minimize</button>

<method name="minimize">
if (!this.maximized) return;
this.setAttribute( "origX", this.x );
this.setAttribute( "origY", this.y );
this.setAttribute( "origWidth", this.width );
this.setAttribute( "origHeight", this.height );
var newX = winControl.addWin( this );
this.animate( "x", newX, 1000, false );
this.animate( "y", canvas.windowsMinimizedY, 1000, false );
this.animate( "width", winControl.minimizedWindowWidth, 1000, false );
this.animate( "height", winControl.minimizedWindowHeight, 1000, false );
this.setAttribute( "maximized", false );
</method>

<method name="maximize">
if (this.maximized) return;
this.animate( "x", this.origX, 1000, false );
this.animate( "y", this.origY, 1000, false );
this.animate( "width", this.origWidth, 1000, false );
this.animate( "height", this.origHeight, 1000, false );
this.setAttribute( "maximized", true );
</method>

</class>

<mywindow x="30" y="30" />
<mywindow x="70" y="40" />
<mywindow x="90" y="15" />
<mywindow x="115" y="20" />

<windowController id="winControl" />

</canvas>


I was hoping to do an extremely rough version with a simplelayout, but that didn't work. You don't have to have the windows appear in the bar; you could have some kind of object that represents them (e.g. a rectangle containing an icon) that's created in the window on-the-fly.

-Antun

[digibrix]

can you give me an example on how you would create what you said at the end of your reply to this post..

"you could have some kind of object that represents them (e.g. a rectangle containing an icon) that's created in the window on-the-fly."

thanks

[antun]

LZX is declarative, so normally if you want to create a view (or any subclass thereof) you just declare it:


<view />


You can also create a view at runtime using JavaScript:


var foo = new LzView( canvas );


Normally this isn't recommended for Laszlo apps, but there are times when it's necessary (and BTW your scenario is a perfect example of when it's used).

See this thread for more on dynamically creating views:

http://www.laszlosystems.com/developers/community/forums/showthread.php?s=&threadid=763&highlight=new+window

-Antun