<html><body style="word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; "><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">On Pyroglyph, an introduction to an object graph/constraint-based XML UI language written in python, as presented at the Python Meetup in LA on 2/12/09</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><br><span style="letter-spacing: 0.0px"></span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">When decomposing any (2d) UI a combination of colored (or transparent) boxes, images, and text where each of those elements may receive events such as mousedown, keydown, focus, and so forth, is all that is needed to make widgets of arbitrary complexity. Pyroglyph is a fully *self-contained* (as opposed to XUL) language that is formed in XML for the numerous advantages that the format provides which are uniquely suited to such an endeavor. It boasts the following capabilities, either real or planned:</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div>
<ul>
<li style="margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica"><span style="letter-spacing: 0.0px">cross-platform and cross-device faithful and exact recreation of interfaces</span></li>
<li style="margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica"><span style="letter-spacing: 0.0px">constraint-based for natural and readable delegate/listener patterns</span></li>
<li style="margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica"><span style="letter-spacing: 0.0px">abstract-able and able to be generated from a variety of third party code generators </span></li>
<li style="margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica"><span style="letter-spacing: 0.0px">fun and easy to pickup for beginners and expert UI designers alike</span></li>
<li style="margin: 0.0px 0.0px 0.0px 0.0px; font: 12.0px Helvetica"><span style="letter-spacing: 0.0px">python based, of course, so that our favorite language can be used on more (and more exciting) projects. </span></li>
</ul><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">The current copy of code is available from <a href="http://code.google.com/p/pyroglyph"><span style="text-decoration: underline ; letter-spacing: 0.0px color: #000099">http://code.google.com/p/pyroglyph</span></a>. A new project, called wildfire, boasts the exact form of the pyroglyph language while offering a compilation model instead of an interpreted one, removing the need for external dependancies. For those that attended the last meeting, I hope the introduction has prepared you adequately to run and edit some of the examples. For those that didn’t, each day I’ll publish to the list a guide to a particular component, pattern, or structure that will together form a continuing look into why I think that XML has a real and immediate advantage over other ways of working with UI toolkits, and hopefully, after a few weeks, you will too. </span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">The first installment follows, “How to install pyroglyph and run your first demo”</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">-----</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">How to install pyroglyph and run your first demo.</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">2/15/09</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">James Robey</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px"><span class="Apple-tab-span" style="white-space:pre"> </span>Pyroglyph was designed to have as few dependancies as possible. The first UI to be abstracted and offered as a prototyping platform is OpenGL. In the near future, wxpython will be added and is meant to be the first production ready version of the language. Using OpenGL made certain design decisions easier, at the expense of how fast and how complex applications can be (it currently linearly scales with the number of components used in total, while wxPython will scale with the number of components being actively used in any given “frame” but not components that are statically being displayed). Thus, you will need python 2.5 (minimum) and only one other external python library installed to use Pyroglyph, “Pyglet” which is a library that lightly abstracts access to OpenGL. It was chosen because pyglet itself has no other dependancies, at all, unlike other frameworks. </span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px"><span class="Apple-tab-span" style="white-space:pre"> </span>To get started, visit the homepage of the project, </span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; color: rgb(0, 0, 153); "><span style="text-decoration: underline ; letter-spacing: 0.0px"><a href="http://code.google.com/p/pyroglyph">http://code.google.com/p/pyroglyph</a></span><span style="letter-spacing: 0.0px color: #000000">. </span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">To cut to the chase, use SVN to retrieve the source by running </span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; color: rgb(0, 0, 153); "><span style="letter-spacing: 0.0px color: #000000">“svn checkout <a href="http://pyroglyph.googlecode.com/svn/trunk/"><span style="text-decoration: underline ; letter-spacing: 0.0px">http://pyroglyph.googlecode.com/svn/trunk/</span></a> pyroglyph”</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">to check out a copy of the latest (although still alpha strictly speaking) copy of the code. Then visit</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; color: rgb(0, 0, 153); "><span style="text-decoration: underline ; letter-spacing: 0.0px"><a href="http://www.pyglet.org/download.html">http://www.pyglet.org/download.html</a></span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">To download the latest version of pyglet, specifically pyglet 1.1.2. Follow their directions to install the package. </span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px"><span class="Apple-tab-span" style="white-space:pre"> </span>After you have successfully installed pyglet, return to the directory containing the copy of Pyroglyph. We are ready to run our first demo. Pyroglyph comes with about 20 demonstration programs that individually test features, or provide a few more complex examples. Not all examples work - almost all do - there is a bug with images and dragging in some instances that prevents a few examples from working correctly. These bugs are not big and are being addressed actively. In the topmost Pyroglyph directory, a python script, “run” is provided to load and start a program. If you run it without arguments you will see the program “hello.lzx” in the topmost directory. Otherwise you may provide the path to the program to run, e.g. </span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">“run apps/minesweeper.lzx”</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">If you have any problems installing the engine or running the demos i’d love to hear about it, especially since this is the first time i’ve posted publicly about the project. Just reply to this email. Any broader questions about what pyroglyph is or why to use it, i would appreciate having a public discourse on.</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; min-height: 14px; "><span style="letter-spacing: 0.0px"></span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span style="letter-spacing: 0.0px">Tomorrow’s installment will be entitled, “canvas, views, positioning, color, and nesting”</span></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; ">Thanks for your interest, and the chance to have met such a vibrant and distinguished group of fellow pythonistas!</div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span class="Apple-tab-span" style="white-space:pre"> </span><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><span class="Apple-tab-span" style="white-space:pre"> </span>James Robey<br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><br></div><div style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; font: normal normal normal 12px/normal Helvetica; "><br></div><div><font class="Apple-style-span" face="Helvetica"><br></font></div></body></html>