<div dir="ltr"><br><div class="gmail_extra"><br><div class="gmail_quote">On Fri, Mar 10, 2017 at 2:56 PM, Johan Brichau <span dir="ltr"><<a href="mailto:johan@inceptive.be" target="_blank">johan@inceptive.be</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div style="word-wrap:break-word"><span class=""><br><div><blockquote type="cite"><div>On 10 Mar 2017, at 16:34, Mariano Martinez Peck <<a href="mailto:marianopeck@gmail.com" target="_blank">marianopeck@gmail.com</a>> wrote:</div><br class="m_-7554107875475957886Apple-interchange-newline"><div><span style="font-family:Helvetica;font-size:12px;font-style:normal;font-variant-caps:normal;font-weight:normal;letter-spacing:normal;text-align:start;text-indent:0px;text-transform:none;white-space:normal;word-spacing:0px;float:none;display:inline!important">I haven't thought about that one. Seems like a good idea. Let me ask...when you need to open a new tab (say a main menu button was clicked), how do you avoid having to re-render all the "workspace" (all tabs) ?  Do you only render the new one and do an append() or something?</span></div></blockquote></div><br></span><div>The easiest is when you _can_ render all tabs at once, but if that gets to heavy (as Esteban is mentioning), you should do it lazily, which means doing ajax requests when necessary.</div><div>I cannot really copy/paste any code for this, but let me try to outline what I would do:</div><div><br></div><div>- Each of the tabs should be Seaside components, nested inside a ‘window’ component that holds onto all the tabs.</div><div>- When you render the page, the ‘window’ component renders the open tab and does not render anything for the others.</div><div>- The tab controls are implemented using javascript and when you click a new tab, this code checks if the tab is on the page and if it’s not it asks the server to render it via an ajax request and appends the generated html to the page in the correct location, followed by a hide() and show().</div><div>- One way we do this is generate <div> elements with a unique id that identifies the tab component. If the div is empty, we launch a callback with the id as an argument and our Seaside component then knows which component to render. That just requires you to keep a dictionary of components in the ‘window’ component with mappings id -> tab component.</div><div><br></div><div>So… basically what you already had in mind, but using the DOM as the place to store the tab html instead of somewhere else.</div><div><br></div><div>My guess is that the hardest problem is to know when you need to rerender a tab’s html (based on changes on the server…) instead of just showing the content already on the page.</div><span class="HOEnZb"><font color="#888888"><div><br></div></font></span></div></blockquote><div><br></div><div><br></div><div>Thanks Johan,</div><div><br></div><div>I ended up doing pretty much all what you suggest above!! And so far it have a working version! Quite easy to do in fact. I still need to fix a fix issues, but your solution was pretty straightforward.</div><div><br></div><div>Thanks a lot in advance. </div><div><br></div><div> </div><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div style="word-wrap:break-word"><span class="HOEnZb"><font color="#888888"><div></div><div>Johan</div></font></span></div><br>______________________________<wbr>_________________<br>
seaside mailing list<br>
<a href="mailto:seaside@lists.squeakfoundation.org">seaside@lists.<wbr>squeakfoundation.org</a><br>
<a href="http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside" rel="noreferrer" target="_blank">http://lists.squeakfoundation.<wbr>org/cgi-bin/mailman/listinfo/<wbr>seaside</a><br>
<br></blockquote></div><br><br clear="all"><div><br></div>-- <br><div class="gmail_signature" data-smartmail="gmail_signature">Mariano<br><a href="http://marianopeck.wordpress.com" target="_blank">http://marianopeck.wordpress.com</a><br></div>
</div></div>