Skip to content
Browse files

Moved manual files out of version control. The manual can be found at…

  • Loading branch information...
1 parent 2d74242 commit 8088c1454ecb026345791f700a0de3beb09a1d80 @Beliaar committed May 9, 2011
View
651 lua/geyser/Geyser.html
@@ -1,651 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html><head><meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>Geyser</title><style type="text/css">
-/* Debug borders */
-p, li, dt, dd, div, pre, h1, h2, h3, h4, h5, h6 {
-/*
-border: 1px solid red;
-*/
-}
-body {
-margin: 1em 5% 1em 5%;
-}
-a {
-color: blue;
-text-decoration: underline;
-}
-a:visited {
-color: fuchsia;
-}
-em {
-font-style: italic;
-color: navy;
-}
-strong {
-font-weight: bold;
-color: #083194;
-}
-tt {
-color: navy;
-}
-h1, h2, h3, h4, h5, h6 {
-color: #527bbd;
-font-family: sans-serif;
-margin-top: 1.2em;
-margin-bottom: 0.5em;
-line-height: 1.3;
-}
-h1, h2, h3 {
-border-bottom: 2px solid silver;
-}
-h2 {
-padding-top: 0.5em;
-}
-h3 {
-float: left;
-}
-h3 + * {
-clear: left;
-}
-div.sectionbody {
-font-family: serif;
-margin-left: 0;
-}
-hr {
-border: 1px solid silver;
-}
-p {
-margin-top: 0.5em;
-margin-bottom: 0.5em;
-}
-ul, ol, li > p {
-margin-top: 0;
-}
-pre {
-padding: 0;
-margin: 0;
-}
-span#author {
-color: #527bbd;
-font-family: sans-serif;
-font-weight: bold;
-font-size: 1.1em;
-}
-span#email {
-}
-span#revnumber, span#revdate, span#revremark {
-font-family: sans-serif;
-}
-div#footer {
-font-family: sans-serif;
-font-size: small;
-border-top: 2px solid silver;
-padding-top: 0.5em;
-margin-top: 4.0em;
-}
-div#footer-text {
-float: left;
-padding-bottom: 0.5em;
-}
-div#footer-badges {
-float: right;
-padding-bottom: 0.5em;
-}
-div#preamble {
-margin-top: 1.5em;
-margin-bottom: 1.5em;
-}
-div.tableblock, div.imageblock, div.exampleblock, div.verseblock,
-div.quoteblock, div.literalblock, div.listingblock, div.sidebarblock,
-div.admonitionblock {
-margin-top: 1.0em;
-margin-bottom: 1.5em;
-}
-div.admonitionblock {
-margin-top: 2.0em;
-margin-bottom: 2.0em;
-margin-right: 10%;
-color: #606060;
-}
-div.content { /* Block element content. */
-padding: 0;
-}
-/* Block element titles. */
-div.title, caption.title {
-color: #527bbd;
-font-family: sans-serif;
-font-weight: bold;
-text-align: left;
-margin-top: 1.0em;
-margin-bottom: 0.5em;
-}
-div.title + * {
-margin-top: 0;
-}
-td div.title:first-child {
-margin-top: 0.0em;
-}
-div.content div.title:first-child {
-margin-top: 0.0em;
-}
-div.content + div.title {
-margin-top: 0.0em;
-}
-div.sidebarblock > div.content {
-background: #ffffee;
-border: 1px solid silver;
-padding: 0.5em;
-}
-div.listingblock > div.content {
-border: 1px solid silver;
-background: #f4f4f4;
-padding: 0.5em;
-}
-div.quoteblock, div.verseblock {
-padding-left: 1.0em;
-margin-left: 1.0em;
-margin-right: 10%;
-border-left: 5px solid #dddddd;
-color: #777777;
-}
-div.quoteblock > div.attribution {
-padding-top: 0.5em;
-text-align: right;
-}
-div.verseblock > div.content {
-white-space: pre;
-}
-div.verseblock > div.attribution {
-padding-top: 0.75em;
-text-align: left;
-}
-/* DEPRECATED: Pre version 8.2.7 verse style literal block. */
-div.verseblock + div.attribution {
-text-align: left;
-}
-div.admonitionblock .icon {
-vertical-align: top;
-font-size: 1.1em;
-font-weight: bold;
-text-decoration: underline;
-color: #527bbd;
-padding-right: 0.5em;
-}
-div.admonitionblock td.content {
-padding-left: 0.5em;
-border-left: 3px solid #dddddd;
-}
-div.exampleblock > div.content {
-border-left: 3px solid #dddddd;
-padding-left: 0.5em;
-}
-div.imageblock div.content { padding-left: 0; }
-span.image img { border-style: none; }
-a.image:visited { color: white; }
-dl {
-margin-top: 0.8em;
-margin-bottom: 0.8em;
-}
-dt {
-margin-top: 0.5em;
-margin-bottom: 0;
-font-style: normal;
-color: navy;
-}
-dd > *:first-child {
-margin-top: 0.1em;
-}
-ul, ol {
-list-style-position: outside;
-}
-ol.arabic {
-list-style-type: decimal;
-}
-ol.loweralpha {
-list-style-type: lower-alpha;
-}
-ol.upperalpha {
-list-style-type: upper-alpha;
-}
-ol.lowerroman {
-list-style-type: lower-roman;
-}
-ol.upperroman {
-list-style-type: upper-roman;
-}
-div.compact ul, div.compact ol,
-div.compact p, div.compact p,
-div.compact div, div.compact div {
-margin-top: 0.1em;
-margin-bottom: 0.1em;
-}
-div.tableblock > table {
-border: 3px solid #527bbd;
-}
-thead, p.table.header {
-font-family: sans-serif;
-font-weight: bold;
-}
-tfoot {
-font-weight: bold;
-}
-td > div.verse {
-white-space: pre;
-}
-p.table {
-margin-top: 0;
-}
-/* Because the table frame attribute is overriden by CSS in most browsers. */
-div.tableblock > table[frame="void"] {
-border-style: none;
-}
-div.tableblock > table[frame="hsides"] {
-border-left-style: none;
-border-right-style: none;
-}
-div.tableblock > table[frame="vsides"] {
-border-top-style: none;
-border-bottom-style: none;
-}
-div.hdlist {
-margin-top: 0.8em;
-margin-bottom: 0.8em;
-}
-div.hdlist tr {
-padding-bottom: 15px;
-}
-dt.hdlist1.strong, td.hdlist1.strong {
-font-weight: bold;
-}
-td.hdlist1 {
-vertical-align: top;
-font-style: normal;
-padding-right: 0.8em;
-color: navy;
-}
-td.hdlist2 {
-vertical-align: top;
-}
-div.hdlist.compact tr {
-margin: 0;
-padding-bottom: 0;
-}
-.comment {
-background: yellow;
-}
-.footnote, .footnoteref {
-font-size: 0.8em;
-}
-span.footnote, span.footnoteref {
-vertical-align: super;
-}
-#footnotes {
-margin: 20px 0 20px 0;
-padding: 7px 0 0 0;
-}
-#footnotes div.footnote {
-margin: 0 0 5px 0;
-}
-#footnotes hr {
-border: none;
-border-top: 1px solid silver;
-height: 1px;
-text-align: left;
-margin-left: 0;
-width: 20%;
-min-width: 100px;
-}
-@media print {
-div#footer-badges { display: none; }
-}
-div#toc {
-margin-bottom: 2.5em;
-}
-div#toctitle {
-color: #527bbd;
-font-family: sans-serif;
-font-size: 1.1em;
-font-weight: bold;
-margin-top: 1.0em;
-margin-bottom: 0.1em;
-}
-div.toclevel1, div.toclevel2, div.toclevel3, div.toclevel4 {
-margin-top: 0;
-margin-bottom: 0;
-}
-div.toclevel2 {
-margin-left: 2em;
-font-size: 0.9em;
-}
-div.toclevel3 {
-margin-left: 4em;
-font-size: 0.9em;
-}
-div.toclevel4 {
-margin-left: 6em;
-font-size: 0.9em;
-}
-/* Workarounds for IE6's broken and incomplete CSS2. */
-div.sidebar-content {
-background: #ffffee;
-border: 1px solid silver;
-padding: 0.5em;
-}
-div.sidebar-title, div.image-title {
-color: #527bbd;
-font-family: sans-serif;
-font-weight: bold;
-margin-top: 0.0em;
-margin-bottom: 0.5em;
-}
-div.listingblock div.content {
-border: 1px solid silver;
-background: #f4f4f4;
-padding: 0.5em;
-}
-div.quoteblock-attribution {
-padding-top: 0.5em;
-text-align: right;
-}
-div.verseblock-content {
-white-space: pre;
-}
-div.verseblock-attribution {
-padding-top: 0.75em;
-text-align: left;
-}
-div.exampleblock-content {
-border-left: 3px solid #dddddd;
-padding-left: 0.5em;
-}
-/* IE6 sets dynamically generated links as visited. */
-div#toc a:visited { color: blue; }
-</style></head>
-<body>
-<h1><a name="The_Geyser_Layout_Manager"></a>The
-Geyser Layout Manager</h1>
-(Some Texts, mostly those in the Intruduction and Windows section, are
-taken from guy's pdf)<br>
-<h2><a name="Geyser_Introduction"></a>Introduction</h2>
-Geyser is an object oriented framework for creating, updating and
-organizing GUI elements<br>
-within Mudlet.<br>
-<br>
-<h4>Motivation</h4>
-Mudlet makes the creation of label, miniconsoles and gauges a quick and
-easy thing. Mudlet provides<br>
-a nice signal when window resize events happen. Mudlet does not provide
-a good framework for<br>
-complex window management, which Geyser attempts to address. The name
-`Geyser' was partly<br>
-chosen to go with Crucible...sort of like if you were to pour some
-window glass into a hot crucible<br>
-it might shoot up or something.<br>
-<br>
-<h4>Main Geyser Features<span style="font-weight: bold;"></span></h4>
-Geyser is based on traditional GUI concepts and should feel similar to
-using Java's Swing. The<br>
-biggest difference is in how positions are specified.<br>
-<br>
-<ul>
-<li>All window positions are specified relative to their
-container -
-nothing new there. However, window positions can also take on
-percentages and negative pixel and
-character values. For instance, a window could be constrained to have a
-height of 50% of its
-container and a width such that the window's right edge is always 20
-characters from its
-container's right edge. See examples below and the demos/tests that
-come with Geyser.
-&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;
-&nbsp;&nbsp;&nbsp; </li>
-<li>All windows under Geyser control are automatically resized
-as necessary
-when the main Mudlet window is resized. Once you create a window and
-assign it to a
-container, you never have to worry about positioning it again.
-Nonetheless, it's very easy
-to shift the container that a window is in, maintaining its constraints
-so that it resizes as
-needed according to the dimensions of the new container.</li>
-<li>Due to the container heirarchy, hiding a container window
-automatically
-hides all its contained windows too. The same for show. With clever
-construction and labels
-with callbacks, this lets one make complex GUI elements that are
-minimizable or maximizable
-or ...</li>
-<li>However, there is always some overhead for automation
-systems and
-Geyser is no exception. Fortunately, most of the overhead is during
-window creation and resize
-events - not things that happen frequently.</li>
-</ul>
-<h4><span style="font-weight: bold;">Constraints
-format</span></h4>
-Geyser position constraints are very simple. They are a
-string composed of a number and a format type. For example, "10px"
-means 10 pixels, either pixels from the origin (e.g. x or y) or a value
-for the width or height. A negative number indicates distance from a
-container's right or bottom border depending on whether is a constraint
-for x/width or y/height, respectively. Percentages for width and height
-are in terms of the container's dimensions and negative values are
-converted to the equivalent positive value. A 100% width subwindow with
-an x-coordinate of 10 will have part of itself displayed outside the
-confines of its container. There is no hard limit on maximum window
-size, just as with regular Mudlet windows. If a number, n, is passed as
-a contraint instead of a string, it is assumed to be equivalent to
-"npx". Any Lua table that contains entries for x, y, width and height
-in the proper format can be used for Geyser constructors and setting
-constraints. <br>
-<br>
-The following is a valid example:<br>
-<br>
-<div class="listingblock">
-<div class="content">
-<pre><tt>{x = "20px", y = "-10c", width = "40%", height = 30}</tt></pre>
-</div>
-</div>
-<h2><a name="Geyser_Windows"></a>Windows<br>
-</h2>
-<h4>Container</h4>
-The Container class is the root type of window. The Geyser
-table/namespace has the functionality of a Container and represents the
-main Mudlet window and control of other windows therein. Notice that
-because Container is the root class, that all types of Geyser windows
-can act as a container - labels anchored within miniconsoles anchored
-within gauges are possible (but not necessarily desireable).<br>
-<h4>HBox/VBox</h4>
-These are special types of containers. Every window in these are
-horizontally or vertically aligned in the order <br>
-<h4>Window</h4>
-Abstract class meant to be subclassed into Label and MiniConsole that
-contains functions common<br>
-to both<br>
-<h4>Label</h4>
-Based on the primitive Mudlet label, nothing new.<br>
-<h4>Minoconsole</h4>
-Based on the primitive Mudlet miniconsole, nothing new.<br>
-<h4>Gauge</h4>
-This is a composite window. Gauge duplicates the functionality of the
-built in Mudlet gauges, but in a clean and easily extended way.
-Internally, a Geyser Gauge is a container holding two Labels, front and
-back, which are initially scaled to fill the entire Gauge container.
-Hence, a gauge, g, can be given callbacks with the
-g.front:setClickCallback() method.<br>
-The backgroundColor parameter initially sets the colors of the gauge,
-but of course the front and back components can be accessed
-individually as labels for high control over their looks. Gauges can be
-horizontal or vertical and decrease in value left to right, right to
-left, down up or up down depending on the value of the orientation
-parameter.<br>
-<h2>Tutorial</h2>
-Note: This tutorial assumes you know how scripts in mudlet work. If not
-then you should look at the manual first. Also it only shows how Geyser
-basically works and explains Geysers special windows. It wont go into
-detail about the windows that where already in Mudlet.<br><br>
-<h4>Hello World</h4>
-Let's start with something simple. A Label.<br>
-<br>
-<div class="listingblock">
-<div class="content">
-<pre>Geyser.Label:new({<br> name="HelloWorld",<br> x=50, y=50,<br> width=200, height=50,<br>})</pre>
-
-
-
-
-</div>
-</div>
-<img style="width: 319px; height: 269px;" alt="" src="Geyser_HW_1.png"><br>
-<br>
-This
-code creates a blank Label with a size of 200x50 at a position of 50
-points horizontal and vertical from its parent window - which is the
-main window since we didn't specify any.<br>
-<br>
-You can manipulate the
-Label through the normal functions but Geyser.Label:new() returns an
-object which can be used to manipulate the label directly. So you
-should store it:<br>
-<div class="listingblock">
-<div class="content">
-<pre>local HelloWorld = Geyser.Label:new({...</pre>
-</div>
-</div>
-Then you can, for example print a text on it:<br>
-<br>
-<div class="listingblock">
-<div class="content">
-<pre>HelloWorld:echo("Hello World")</pre>
-</div>
-</div>
-<img style="width: 390px; height: 254px;" alt="" src="Geyser_HW_2.png"><br>
-<br>
-You can put a format parameter so that the text is, for example,
-centered.<br>
-<div class="listingblock">
-<div class="content">
-<pre>HelloWorld:echo("Hello World", nil, "c")</pre>
-</div>
-</div>
-<img style="width: 383px; height: 232px;" alt="" src="Geyser_HW_3.png"><br>
-<br>
-The second parameter is the color. We set it to nil which means the
-labels foreground color will be used.<br>
-<br>
-The
-color parameter either accepts a string ("red"), a hex value("#FF0000"
-or "0xFF0000" or "|cFF0000", or a decimal value
-"&lt;255,0,0&gt;"<br>
-<br>
-Example:<br>
-<div class="listingblock">
-<div class="content">
-<pre>HelloWorld:echo("Hello World", "red", "c")</pre>
-</div>
-</div>
-<img style="width: 415px; height: 216px;" alt="" src="Geyser_HW_4.png"><br>
-<br>
-Note:<br>
-This
-will automatically set the foreground color, so any echo, without the
-color parameter set, after that
-will use the same color.<br>
-<br>
-You can also set the foreground color with the setFgColor method:<br>
-<br>
-<div class="listingblock">
-<div class="content">
-<pre>HelloWorld:setFgColor("red")<br>HelloWorld:echo("Hello World", nil, "c")</pre>
-</div>
-</div>
-<img style="width: 415px; height: 216px;" alt="" src="Geyser_HW_4.png"><br><h4>Containers</h4>Containers
-are windows that can contain other windows. Actually, since all other
-Geyser windows subclass container, every window can do that. But
-containers do not have any visible content by themselves. <br><br>Let's show that by an example:<br><div class="listingblock">
-<div class="content">
-<pre>local container = Geyser.Container:new({<br> name="container",<br> x=50, y=50,<br> width=250, height=50,<br> })</pre>
-</div>
-</div>This will create a container, but if you look at the screen you will see nothing at the positon.<br>There is a way to make containers visible though:<br><div class="listingblock">
-<div class="content">
-<pre>container:flash()</pre>
-</div>
-</div>This will flash the container for a short period of time.<br><br><img style="width: 368px; height: 293px;" alt="" src="Geyser_Container_1.png"><br><br>flash() accepts a number as paremeter which defines the time, in seconds, the flash is shown.<br><br>Now, that the container is created, you can add other windows to it. There are 2 ways:<br><br>Directly when creating the window<br><div class="listingblock">
-<div class="content">
-<pre>local container_label = Geyser.Label:new({<br> name="container_label",<br> x=0, y=0,<br> width="100%", height="100%",<br> },<br> container)<br>container_label:echo("This is a label in a container", nil, "c")</pre>
-</div>
-</div>Later, after the window was created<br><div class="listingblock">
-<div class="content">
-<pre>local container_label = Geyser.Label:new({<br> name="container_label",<br> x=0, y=0,<br> width="100%", height="100%",<br> })<br>container_label:echo("This is a label in a container", nil, "c")<br>container:add(container_label)</pre>
-</div>
-</div>Both will lead to the same outcome<br><img style="width: 330px; height: 234px;" alt="" src="Geyser_Container_2.png"><br><br><br>Note
-that we gave a width and height of "100%" to the constructor of the
-container. This means that the label will take 100% of the containers
-width and height. If values are given in percent they will even resize
-with its parent:<br><br><div class="listingblock">
-<div class="content">
-<pre>container:resize(325, nil)</pre>
-</div>
-</div><img style="width: 429px; height: 256px;" alt="" src="Geyser_Container_3.png"><br><br>The first parameter is the width, the second the height. If the value is nil the current value is used.<br><br>As said in the "Hello World" tutorial the position is relative to its
-parent window. Thats why we could set both x and y to 0 and it is at
-the position we wanted - the position of the container.<br><br>When we now move the container the label moves with it:<br><div class="listingblock">
-<div class="content">
-<pre>container:move(400, nil)</pre>
-</div>
-</div><img style="width: 897px; height: 229px;" alt="" src="Geyser_Container_4.png"><br>The first parameter is the x-, the second the y-position. If the value is nil the current value is used.<br><h4>VBox and HBox</h4>The VBox and HBox classes are special Containers.<br>They
-will automatically align its containing windows vertically or
-horizontally, respectively, in the order they where added to them.<br><br><div class="listingblock">
-<div class="content">
-<pre>local HBox = Geyser.HBox:new({<br> name="HBox",<br> x=0, y=0,<br> width=400, height=30,<br> })</pre>
-
-
-
-</div>
-</div>Like containers you won't see them by themselves.<br><br>Adding childs works like with containers<br><div class="listingblock">
-<div class="content">
-<pre>local label1 = Geyser.Label:new({<br> name="Label1",<br> },<br> HBox)<br>label1:echo("Label 1", "black", "c")<br>label1:setColor(255, 0, 0)</pre>
-
-
-
-
-
-
-
-</div>
-</div><img style="width: 439px; height: 166px;" alt="" src="HVBox_1.png"><br><br>We didn't &nbsp;set any position or size, but the label gets the same size as the HBox.<br><br>If we add another window:<br><div class="listingblock">
-<div class="content">
-<pre>local label2 = Geyser.Label:new({<br> name="Label2",<br> },<br> HBox)<br>label2:echo("Label 2", "black", "c")<br>label2:setColor(0, 255, 0)</pre>
-
-
-
-
-
-
-
-</div>
-</div><img style="width: 449px; height: 164px;" alt="" src="HVBox_2.png"><br><br>the size will be divided equally between them!<br><br>What if you want a child that takes more or less space than the others?<br>Thats possible too:<br><div class="listingblock">
-<div class="content">
-<pre>local label3 = Geyser.Label:new({<br> name="Label3",<br> h_stretch_factor=2.0,<br> },<br> HBox)<br>label3:echo("Label 3", nil, "c")<br>label3:setColor(0, 0, 255)</pre>
-
-
-
-
-
-
-
-</div>
-</div><img style="width: 446px; height: 173px;" alt="" src="HVBox_3.png"><br><br>As you can see, Label 3 takes the same space as Label 1 and 2 Together. <br>Thats because we supplied a horizontal stretch factor with "h_stretch_factor=2.0"<br><br>This works also with a vertical stretch factor, just replace "h_stretch_factor" with "v_stretch_factor"<br><br>Now you may have windows that should not be stretched at all.<br>To accomplish this you have to set the horizontal and/or vertical policy:<br><br><div class="listingblock">
-<div class="content">
-<pre>local label4 = Geyser.Label:new({<br> name="Label4",<br> width="13%",<br> h_policy=Geyser.Fixed,<br> },<br> HBox)<br>label4:echo("Label 4", "black", "c")<br>label4:setColor(0, 255, 255)</pre>
-
-
-
-
-
-
-
-</div>
-</div><img style="width: 459px; height: 171px;" alt="" src="HVBox_4.png"><br><br>Possible values for the policies are Geyser.Fixed and Geyser.Dynamic. The default is Geyser.Dynamic.<br>Note that, like in the example above, the label will retain relative values (like percent) if used.<br><br>The VBox works like the HBox, only that the child windows are aligned vertically.
-<ul>
-</ul>
-</body></html>
View
BIN lua/geyser/Geyser_Container_1.png
Deleted file not rendered
View
BIN lua/geyser/Geyser_Container_2.png
Deleted file not rendered
View
BIN lua/geyser/Geyser_Container_3.png
Deleted file not rendered
View
BIN lua/geyser/Geyser_Container_4.png
Deleted file not rendered
View
BIN lua/geyser/Geyser_HW_1.png
Deleted file not rendered
View
BIN lua/geyser/Geyser_HW_2.png
Deleted file not rendered
View
BIN lua/geyser/Geyser_HW_3.png
Deleted file not rendered
View
BIN lua/geyser/Geyser_HW_4.png
Deleted file not rendered
View
BIN lua/geyser/HVBox_1.png
Deleted file not rendered
View
BIN lua/geyser/HVBox_2.png
Deleted file not rendered
View
BIN lua/geyser/HVBox_3.png
Deleted file not rendered
View
BIN lua/geyser/HVBox_4.png
Deleted file not rendered

0 comments on commit 8088c14

Please sign in to comment.
Something went wrong with that request. Please try again.