<div>Hi Robert</div> <div> </div> <div>This is very helpful. Thank you.</div> <div><br>Steve<br></div> <div class="gmail_quote">On Wed, Jun 23, 2010 at 9:58 AM, Robert Krahn <span dir="ltr"><<a href="mailto:robert.krahn@student.hpi.uni-potsdam.de">robert.krahn@student.hpi.uni-potsdam.de</a>></span> wrote:<br> <blockquote class="gmail_quote" style="PADDING-LEFT: 1ex; MARGIN: 0px 0px 0px 0.8ex; BORDER-LEFT: #ccc 1px solid"> <div style="WORD-WRAP: break-word">Hi, Steve -- <div><br></div> <div> <div> <div class="im"> <blockquote type="cite"> <div>What are the main organizational concepts in Lively? What are Areas, Workspaces, Packages and Classes?</div></blockquote> <div> <blockquote type="cite"> <div>I am somewhat bemused by the way Javascript builds class-instance behaviour on top of a prototype system (although it's been a while since I read much about it, so I might be mistaken). Does Lively retain the idea of classes or is it purely a prototype system?</div> </blockquote><br></div></div> <div><b>Modules</b></div> <div><b><br></b></div> <div>The main package entity for source cod in Lively is what we call a module. A module integrates several things:</div> <div>- It has a name and this name is used as a namespace when the module is loaded</div> <div>- A module can be loaded asynchronously on demand simply by referencing them with their name</div> <div>- A module include class definitions (also function and object definitions but we want to stick to the class concept whenever possible)</div> <div>(Note: Since a module namespace can be currently extended from anywhere, modules do not enforce encapsulation)</div> <div><br></div> <div><br></div> <div> <div><b>Module Example</b></div> <div><br></div> <div>module('lively.ide').requires('lively.Tools', 'lively.Ometa').toRun(function() {</div> <div>// Code depending on lively.Tools and lively.Ometa</div> <div>}); // end of module</div> <div><br></div> <div>This definition does two things:</div> <div><br></div> <div>a) Define the module lively.ide. The module can then be required from somewhere else:</div> <div>require('lively.ide').toRun(function() { new lively.ide.SystemBrowser().open() })</div> <div>Evaluating this will let the system:</div> <div>1. Check if lively.ide is loaded. If not then the module name is translated to an URL: {Config.codeBase}/lively/ide.js. That URL will be used to load the file ide.js asynchronously. *</div> <div>2. When the file is loaded run the code of toRun()</div> <div><br></div> <div>b) Define the namespace lively.ide.</div> <div>That means that if the module is there you can access it's members in JavaScript. For example the class lively.ide.SystemBrowser is such a member. **</div> <div><br></div> <div>For more information (module-file-mapping, how to get started in the wiki, etc.) please read:</div> <div><a href="http://lists.hpi.uni-potsdam.de/archive/lively-kernel/2010-April/000347.html" target="_blank">http://lists.hpi.uni-potsdam.de/archive/lively-kernel/2010-April/000347.html</a></div> <div><a href="http://lists.hpi.uni-potsdam.de/archive/lively-kernel/2010-April/000360.html" target="_blank">http://lists.hpi.uni-potsdam.de/archive/lively-kernel/2010-April/000360.html</a></div> <div><br></div> <div><br></div> <div><b>Classes</b></div> <div><b><br></b></div> <div>Lively implements it's own class system implementation that was inspired by Prototype's class system.</div> <div><br></div> <div>e.g.</div> <div>Object.subclass('Foo', {</div> <div><span></span>method: function() { return 23 },</div> <div>});</div></div> <div>new Foo().method() // --> 23</div> <div><br></div> <div><br></div><b>IDE</b></div> <div><b><br></b></div> <div><b><span style="FONT-WEIGHT: normal">Lively implements a complete JavaScript IDE, it's main part is the System code browser. It can be opened using the WorldMenu.</span></b></div> <div class="im"> <div><b><span style="FONT-WEIGHT: normal"><br></span></b></div> <div> <blockquote type="cite"> <div>A friend suggested that Lively might be a good environment to learn Javascript but I'd like to have a better idea of how people manage dependencies among various libraries. It seems that managing a pool of *.js files also needs to represented. Does Lively let you mix and match other Javascript libraries? If so, would it be possible to add visual tools to help with this or is the fundamental browser model too restrictive for that?</div> </blockquote></div><br></div></div> <div>It's definitely better to learn JavaScript in Lively than using in-place HTML scripting since Lively gives you immediate feedback (evaluate any expression in a Workspace or any other TextMorph with CMD+d (CMD+p to print the result).</div> <div><br></div> <div>Managing files: see modules.</div> <div><br></div> <div>Best,</div> <div>Robert</div></div></blockquote></div><br>