The term open source describes practices in production and development that promote access to the end product's source materials. Some consider open source a philosophy, others consider it a pragmatic methodology...
web programming environment. It supports desktop-style applications with rich graphics and direct manipulation abilities, but without the installation or upgrade troubles of conventional desktop applications. Development began at Sun Microsystems
Sun Microsystems
Sun Microsystems, Inc. was a company that sold :computers, computer components, :computer software, and :information technology services. Sun was founded on February 24, 1982...
Menlo Park, California is a city at the eastern edge of San Mateo County, in the San Francisco Bay Area of California, in the United States. It is bordered by San Francisco Bay on the north and east; East Palo Alto, Palo Alto, and Stanford to the south; Atherton, North Fair Oaks, and Redwood City...
The Hasso Plattner Institute ', or HPI, is a German information technology college, affiliated to the University of Potsdam and located in Potsdam-Babelsberg near Berlin. It was founded in 1998 and is the first, and still the only, entirely privately-funded college in Germany...
Babelsberg is the largest district of the Brandenburg capital Potsdam in Germany. The affluent neighbourhood named after a small hill on the Havel river is famous for Babelsberg Palace and Park, part of the Palaces and Parks of Potsdam and Berlin UNESCO World Heritage Site, as well as for Studio...
near Berlin.
Overview
The Lively Kernel is a graphical composition and integrated programming environment written fully in the programming language
Programming language
A programming language is an artificial language designed to communicate instructions to a machine, particularly a computer. Programming languages can be used to create programs that control the behavior of a machine and/or to express algorithms precisely....
JavaScript is a prototype-based scripting language that is dynamic, weakly typed and has first-class functions. It is a multi-paradigm language, supporting object-oriented, imperative, and functional programming styles....
using standard browser graphics (W3C Canvas or SVG). It is thus accessible to any browser as a web page, and it begins operating as soon as the web page is loaded. It is able to edit its own code and graphics, and through its built-in WebDAV support, it can save its results or even clone itself onto new web pages. Along with its application development abilities, it can also function as its own integrated development environment (IDE), making the whole system self-sufficient with no tools except a browser.
The name "Morphic" was taken from the Greek word "morph", its morphs taking on the role of "forms", the basic graphical building blocks in earlier Self systems and in Smalltalk MVC....
graphics model to add behavior to a scene graph built from browser graphics. Simple graphics are thus assembled into such standard widgets as sliders, scroll bars, text views, lists and clipping frames. A simple window system built from these widgets offers object inspectors, file browsers and code browsers. Even the rudimentary demo pages thus have the ability to edit and test new code in a simple code browser while the system is running.
Lively has been used to build simple web sites, including its own tutorial, and also a client-side Wiki system that stores its pages in a versioned repository. Content can vary from relatively static pages of text to fully dynamic models that look and behave like Adobe Flash
Adobe Flash
Adobe Flash is a multimedia platform used to add animation, video, and interactivity to web pages. Flash is frequently used for advertisements, games and flash animations for broadcast...
simulations. The Lively Kernel achieves complex dynamic behavior without any specific animation support (it does not use the animation features of SVG), but by simple scheduling of multiple green-thread processes in JavaScript.
Text and transformations
The Lively Kernel includes its own multifont text editor written in JavaScript. It includes support for centering, justification and similar rudimentary text composition abilities. Working in Lively thus has much the same feel as working in a web page design program, except that the on-the-fly text layout is not being done in an offline composition program, but it is the built-in dynamic behavior of text in the Lively Kernel.
The liveliness of Lively graphics becomes even more apparent when manipulating the scale and rotation handles for objects and text. The whole code browser can be used when tilted 20 degrees on its side. Because the text editor is made up entirely of lively graphics, it works perfectly well when rotated or scaled, just as do the scroll bars, clipping frames, and the rest of the entire user interface.
Cross-browser compatibility
The Lively Kernel depends on browser support for JavaScript and SVG or Canvas graphics, all now part of the W3C standards. As of 2009, this means that it runs in Safari, Firefox, Chrome and Opera browsers.
While this requirement might seem less compatible than HTML, Lively is actually more compatible across the browsers on which it runs than is HTML. This is because there is more uniformity among JavaScript, SVG and Canvas implementations than there is from one HTML implementation to another. Except for one small initial file, the Lively Kernel code base is entirely free of tests for which client browser is being used.
WebKit is a layout engine designed to allow web browsers to render web pages. WebKit powers Google Chrome and Apple Safari and by October 2011 held over 33% of the browser market share between them. It is also used as the basis for the experimental browser included with the Amazon Kindle ebook...
Safari is a web browser developed by Apple Inc. and included with the Mac OS X and iOS operating systems. First released as a public beta on January 7, 2003 on the company's Mac OS X operating system, it became Apple's default browser beginning with Mac OS X v10.3 "Panther". Safari is also the...
Chromium is the open source web browser project from which Google Chrome draws its source code. The project's hourly Chromium snapshots appear essentially similar to the latest builds of Google Chrome aside from the omission of certain Google additions, most noticeable among them: Google's...
Google Chrome is a web browser developed by Google that uses the WebKit layout engine. It was first released as a beta version for Microsoft Windows on September 2, 2008, and the public stable release was on December 11, 2008. The name is derived from the graphical user interface frame, or...
for Windows. Running in Internet Explorer (Windows) requires Google Chrome Frame
Google Chrome Frame
Google Chrome Frame is a plug-in designed for Internet Explorer based on the open-source Chromium project. It went stable on September 2010, on the first birthday of the project....
. Testing in all popular browsers is planned for the next release.
Integrated development environment
Lively includes an integrated development environment of considerable power, designed to work via WebDAV with a local set of a dozen or so source JavaScript files synchronizable with a versioned repository. If the user opens a SystemBrowser, all the JavaScript source files are listed in the file pane of the browser. If the user clicks on one of these files, it will be read, parsed (by an OMeta JavaScript parser) and displayed similar to a Smalltalk
Smalltalk
Smalltalk is an object-oriented, dynamically typed, reflective programming language. Smalltalk was created as the language to underpin the "new world" of computing exemplified by "human–computer symbiosis." It was designed and created in part for educational use, more so for constructionist...
browser with functions or class definitions listed and, for each class, all the method names are shown. The user can click on a method name, edit its code in the bottom pane, and then save the new definition. The new definition will be checked for syntax and, if correct, it will be stored back in the .JS file. Moreover, if in "eval mode" (the usual case), the method will be redefined in the system that is running. This allows non-critical changes to be made without any need to restart Lively or any of the applications being developed. When all the source files are loaded, a rapid scan will find every reference to a selected text, and present all the code bodies that match in a separate sub-browser.
The Lively IDE includes object inspectors and morph style panels for controlling fills, borders, and text styles. There are also facilities for debugging at error points and profiling for performance tuning, but these have not been pushed, owing to the improving quality of such run-time support in all the major browsers.
Lively Wiki
The IDE operates on its source code files in a versioned repository to manage evolution of the Lively code base. The same approach has been used to empower users with control over active web content in the form of a client-side Wiki. Because Lively includes facilities to edit the content in its worlds (scene graphs and other content), and to store that content as web pages, a WebDAV connection allows Lively to store new versions of its page content while it is being incrementally developed. As each new version is saved, it is viewable from the rest of the Internet and prior versions can be retrieved in cases of error or change of mind. It is notable that this Wiki style of evolving web content extends to all the textual, graphical, and scripting content in Lively, as well as to any new forms that may be defined, yet without any need for a Wiki server of any kind. All that is required is a server providing a HTTP WebDAV interface. Increasing amounts of the Lively Project content is now maintained in this manner.
Lively for Qt
Lively for Qt is a new implementation of the Lively Kernel in which the "kernel" parts are replaced by functionality offered by the Qt framework. Lively for Qt inherits most of the basic functionality (such as the implementation of widgets, layout management, core event handling and core JavaScript support) from Qt. Lively for Qt retains the exceptionally interactive nature (the "liveliness") of the Lively Kernel, e.g., by allowing the user interface and application source code to be edited on the fly. However, in Lively for Qt the development work is performed using the familiar, well-documented APIs of the Qt platform.
$super(position.asRectangle.expandBy(radius), "ellipse");
this.openForDragAndDrop = false; // Do not handle drag-and-drop requests
this.makeNewFace; // Construct the clock face
return this;
},
// Construct a new clock face
makeNewFace: function {
var bnds = this.shape.bounds;
var radius = bnds.width/2;
var labels = [];
var fontSize = Math.max(Math.floor(0.04 * (bnds.width + bnds.height)),2);
var labelSize = fontSize; // room to center with default inset
// Add Roman numerals to the clock
for (var i = 0; i < 12; i++) {
var labelPosition = bnds.center.addPt(Point.polar(radius*0.85,
((i-3)/12)*Math.PI*2)).addXY(labelSize, 0);
var label = new TextMorph(pt(0,0).extent(pt(labelSize*3,labelSize)),
['XII','I','II','III','IV','V','VI','VII','VIII','IX','X','XI'][i]);
label.setWrapStyle(WrapStyle.SHRINK);
label.setFontSize(fontSize);
label.setInset(pt(0,0));
label.setBorderWidth(0);
label.setFill(null);
label.align(label.bounds.center,labelPosition.addXY(-2,1));
this.addMorph(label);
}
// Set clock hand angles based on current time
setHands: function {
var now = new Date;
var second = now.getSeconds;
var minute = now.getMinutes + second/60;
var hour = now.getHours + minute/60;
this.hourHand.setRotation(hour/12*2*Math.PI);
this.minuteHand.setRotation(minute/60*2*Math.PI);
this.secondHand.setRotation(second/60*2*Math.PI);
},
// Will be called when the ClockMorph is placed in a world
startSteppingScripts: function {
this.startStepping(1000, "setHands"); // once per second
}
});
