Well I have had this idea in mind for a while. In my script I have php variables passed to html(now tpl thanks to smarty!) template file, and the process of building tables and forms are handled in PHP. This is usually sufficient for small forms/tables, like this one:

$form =      "<form name='form1' method='post' action='login.php'>
            <p>Username: <input name='username' type='text' id='username'></p>
            <p>Password: <input name='password' type='password' id='password'></p>
            <p><input type='submit' name='Submit' value='Submit'></p>
            </form>";

The form above is a simple login form, which is easy to build anyway. Nonetheless, real life aint as simple as we imagine. In circumstances we come across different types of html elements, some have pre-defined values from MYSQL database! Even worse is a situation of select/option dropdown menu, which means we have to use a while/for loop in any forms/tables that contain them. This can soon turn our script into a mess.

So what is the solution? You get it, its this PHP GUI package I am meditating and actually have already begun working on. With this GUI package, it will be possible to write professional and well organized object oriented code like the one below to construct a page:

$page = new Frame;
$form = new Form("myform", "post", "index.php");
$form->add(new TextField("mytext", "This is a text field"), 1);

$text = new TextField();
$text->setID("text2");
$text->setName("my2ndtext");
$text->setValue("This is yet another text field");
$text->setMaxLength(10);

$form->add($text, 2);
$form->add(new TextArea("mytextarea", 45))

$submit = new Button();
// Default type is submit for button object
$submit->setName("My Button");
$submit->setValue("Click Me");
$submit->setAutofocus(TRUE);

// We are adding submit button to the index 500, lol. It works so long as we do not override existing indexes. 
$form->add($submit, 500);
$page->add($form);
echo $page->render();

The GUI structure is defined as below:

  • Namespace GUI

    • Abstract Class GUIComponent

      • Abstract Class GUIContainer

        • Class Frame

        • Class Table

        • Class Row

        • Class Column

        • Class Form

        • Class Field

        • Abstract Class GUIList

          • Class RadioList

          • Class DataList

          • Class SelectList

          • Class MultiSelectList

      • Abstract Class Button

        • Class StdButton

        • Class RadioButton

        • Class CheckBox

      • Abstract Class TextField

        • Class TextField

          • Class PasswordField

        • Class TextArea

      • Abstract Class Basics

        • Class Option

        • Class Label

        • Class Legend

        • Class Cell

    • Abstract Class GUIRenderer

      • Class ButtonRenderer

      • Class TextRenderer

      • Class ListRenderer

      • Class TableRenderer

      • Class FormRenderer

      • Class ListRenderer

      • Class BasicsRenderer

So this looks quite complicated and ambitious? Maybe, but I'd say its worth trying. The GUI has two basic categories: Components and Renderers. Components can be pure components, or containers that enclose other components or containers. Renderers are objects that convert data field in each GUI component/container to the corresponding html readable string format. This GUI package is written in Composite design pattern, which turns out to be rather powerful. I also considered Decorator pattern, it might work out as well but right now I am sticking to Composite.

The idea is that each page is defined by a frame, a frame is apparently the top level container. But an empty frame renders to nothing, so you may want to add components and other containers to it. Many pages on my site have forms and tables, they are major players in the GUI system since almost all GUI components can be added to them. Basic components include button, which also have subcategories such as StdButton, RadioButton and CheckBox. TextField component has subcategories such as TextField, PasswordField and TextArea. Each component can be added to a container at any given index, the index determines the order they are displayed. The way the script is designed allows multi-layer rendering, which means you can simply render the frame and all tables, forms and buttons, textfields it contains will get rendered too.

So if you want to see an example, this is how it works out on a test script I have just written for StdButton. The script works rather well, as you can see from the screenshot. Right now I only have StdButton and ButtonRenderer concrete classes, but in not so distant all these GUI components will be made available one by one. Should be interesting, isnt it?

<?php

include_once("classes/abstract/abstract_object.php");
include_once("classes/abstract/abstract_guicomponent.php");
include_once("classes/abstract/abstract_guicomponent.php");
include_once("classes/abstract/abstract_guirenderer.php");
include_once("classes/abstract/abstract_button.php");
include_once("classes/class_stdbutton.php");
include_once("classes/class_buttonrenderer.php");

$button = new StdButton();
$button->setText("This is a Button!");
$button->setName("My Button");
$button->setType("button");
$button->setValue("Click Me!");

echo $button->getText();
echo "<br>";
echo $button->getName();
echo "<br>";
echo $button->getType();
echo "<br>";
echo $button->getValue();
echo "<br>";

echo $button->render();

$button2 = new StdButton("Yet Another Button", "your button", "Meh, what's going on?");
echo $button2->render();
?>

Screenshot:

So what do you think? I hope this will not take me more than 2-3 months to complete, and in fact my winter break is coming up soon so I should have fun doing this GUI project. I know many of you here are better programmers than me, so I definitely would love to hear suggestions and criticism. Thanks, and hope you all have enjoyed your thanksgiving.

    Well I decide to upload a sample .rar file that contains what I have done so far with this GUI system. If you are interested, you are more than welcome to take a look, review their content, and lemme know what you like and dislike. Thanks.

    Download link: [ATTACH]4733[/ATTACH]

    gui package.zip

      Hmm... so you're basically re-inventing bits and pieces of [man]DOM[/man] all over again?

      Alternatively, if you have to do all of this work in your PHP script... what the heck are you using templates for? (Related: Why aren't you using templates as... templates... meaning they already contain the basic layout of the page, you just have to fill in the missing information.)

        Well nope, this one has nothing to do with XML, how am I reinventing the DOM in PHP?

        Regarding templates... In my script the page has several sections such as navlinks, sidebar, title, content and so on. The GUI is only a component inside the content block, which is the only thing that differs from pages to pages. For this reason I want to have only one template file, not many that depend on the content of the table, form and so on. With this GUI system, I do not need to create several html files for various pages since the content block can be altered with PHP.

          Lord Yggdrasill;11018833 wrote:

          Well nope, this one has nothing to do with XML

          I never said anything about XML...?

          Lord Yggdrasill;11018833 wrote:

          how am I reinventing the DOM in PHP?

          Compare this:

          $button = new StdButton(); 
          $button->setText("This is a Button!"); 
          $button->setName("My Button"); 
          $button->setType("button"); 
          $button->setValue("Click Me!"); 

          with this:

          // here, assume $dom is a DOMDocument object
          $button = $dom->createElement('button');
          //not sure what your setText() does...?
          $button->setAttribute('name', 'My Button');
          $button->setAttribute('type', 'button');
          $button->nodeValue = 'Click Me!';

          Notice how strikingly similar the two are?

          Lord Yggdrasill;11018833 wrote:

          In my script the page has several sections such as navlinks, sidebar, title, content and so on. The GUI is only a component inside the content block, which is the only thing that differs from pages to pages.

          To me, this sounds like you'd create one main template that contains the base layout of the page (e.g. the "navlinks, sidebar, title, ... and so on"). You'd then fill in the "content" with a different template; which template would simply depend on which "page" the user is viewing.

          Lord Yggdrasill;11018833 wrote:

          Templates have their usages on my site, and actually only one template file is enough.

          The latter statement suggests that the former isn't very true.

          Lord Yggdrasill;11018833 wrote:

          With this GUI system, I do not need to create several html files for various pages since...

          ... you instead muddy up your PHP scripts with all of this work creating HTML structures that could have instead been defined in a template and simply rendered as needed.

            Oh sorry about that, I thought PHP DOM only deals with XML since all PHP books and articles I read about it were describing how to build a XML template using this instead of actual HTML content.

            Umm you still dont understand, do you? Well lets see a template example in the script:

            {include file="{$root}{$temp}{$theme}/header.tpl"}
            
            <body>
            <div id="wrapper">
            <table cellspacing="0" cellpadding="0">
            <tr><th colspan="2">{$links}</th></tr>
            <tr><td colspan="2" id="image"><span><a href="index.php">{$sitename}</a></span></td></tr>
            <tr><td id="menu">
            {$sidebar}
            
            
            </td><td id="content">
            <h1>{$title}</h1>
            <p>{$document}</p>
            
            </td></tr>
            <tr><td colspan="2" id="footer">{$ads}
            </td></tr>
            
            
            </table>
            </div>
            
            </body>
            
            </html>
            
            

            This is one template file, which defines an entire frame. The GUI system I am designing only works with the $document part, it constructs all necessary components and renders them into a smarty .tpl readable $document. The document by itself is a module, designers can play with its position and basic css, but the main content of this document is built by php coders. The reason for this is that every page has different content, but the other modules such as sidebar, navlinks, title and most widgets are the same. I am doing this to prevent having to write tens of template files that differ in the presentation of tables and forms. Instead, for my script just one .tpl file is enough.

            Actually my site have various themes, users can select which theme they want using a quick style switcher. If each style defines its own way of how a page is constructed and even the document part differs, it will be a pain to keep track and just becomes way confusing over time.

            But anyway I need to thank you for one thing. I just realized that the GUI system's top level container should be named 'Document' instead of 'Frame', a frame should include not only the document content, but also the title, sidebar, navlinks and other widgets. 🙂

              I still fail to see your justification of why $document can't be populated with a separate template.

              However, now that I see you're using <table>'s for anything but tabular data, I'm starting to realize you and I are talking about two entirely different centuries as far as web development goes (I picked this side of the 2000's), so I think I'll bow out of this discussion now. 🙂

                Lord Yggdrasill wrote:

                Oh sorry about that, I thought PHP DOM only deals with XML since all PHP books and articles I read about it were describing how to build a XML template using this instead of actual HTML content.

                Well, HTML is just a floppier version of XML (more accurately, XML is a tightened-up generic syntax); PHP's DOM implementation does a tolerable job of reading HTML (see [man]domdocument.loadhtml[/man]). In fact HTML5 specifies both an HTML syntax and an XML syntax for the same document object model (in other words, HTML5 is defined in terms of the DOM, and the syntax is layered on top of that to standardise serialisation: http://www.w3.org/TR/html5/dom.html#dom).

                In the very early days web browsers treated HTML documents as text; but for many years now they've operated more as DOM viewers with particular rendering rules for those that meet the HTML specification. JavaScript interaction with documents is again via the DOM: https://developer.mozilla.org/en-US/docs/DOM/About_the_Document_Object_Model

                This is one template file, which defines an entire frame. The GUI system I am designing only works with the $document part, it constructs all necessary components and renders them into a smarty .tpl readable $document.

                So.... you're writing a templating system for building templates to be used in another templating system?

                  I see, thanks for bringing up this to me. It does seem that what I've been doing can be easily converted to using PHP's built-in DomDocument system. One difference I do notice is that in my button class its possible to instantiate a simple submit button object using just a simple constructor. The button and other GUI component classes can handle javascript action registration, although at this point I havent completed this yet. I am sure DomDocument can do pretty much everything I am doing, just like how you can simply write a gigantic html readable string. My GUI system is more similar to Java's GUI system, its pretty much like a direct port to PHP. Some of you may not like it, I completely understand,

                  Well technically it kinda seems that way, a template system to be used in another template system... The fact is that I am creating a script for others to use to build their sites. The main template consists of several modules such as title, document/content, navlinks, banner, sidebar and ad-section. Each user of my script can fully customize their css and position in the main template .tpl file, and add their own javascript to the header. But whats inside each module is pre-determined by the serverside PHP, the program written by me. A user of my script aint supposed to modify the content of the document or navlinks by editing the template, otherwise his/her site can easily malfunction. The user of my script only needs to know there is a document module, he/she does not need to know how to alter its content unless they wish to modify the serverside php script. To summarize, the script contains two different types of contents, one supposedly not to be altered by users, while the others can be customized by them. Thats why I am designing a system that specializes in this separation of concerns.

                    8 days later

                    Update: I've successfully designed new gui components CheckBox, RadioButton and RadioList. An example of how this works out is shown below:

                    <?php
                    
                    include_once("object.php");
                    include_once("guicomponent.php");
                    include_once("guicontainer.php");
                    include_once("guirenderer.php");
                    include_once("button.php");
                    include_once("stdbutton.php");
                    include_once("radiobutton.php");
                    include_once("checkbox.php");
                    include_once("radiolist.php");
                    include_once("buttonrenderer.php");
                    include_once("listrenderer.php");
                    
                    $button = new StdButton();
                    $button->setText("This is a Button!");
                    $button->setName("My Button");
                    $button->setType("button");
                    $button->setValue("Click Me!");
                    
                    echo $button->getText();
                    echo "<br>";
                    echo $button->getName();
                    echo "<br>";
                    echo $button->getType();
                    echo "<br>";
                    echo $button->getValue();
                    echo "<br>";
                    
                    echo $button->render();
                    echo "<br>";
                    
                    $button2 = new StdButton("Yet Another Button", "your button", "Meh, what's going on?");
                    echo $button2->render();
                    echo "<br><br>";
                    
                    $checked = "no";
                    $check = new CheckBox();
                    $check->setText("This is a CheckBox!");
                    $check->setName("My Checkbox");
                    $check->setValue("yes");
                    $check->findChecked($checked);
                    
                    echo $check->getText();
                    echo "<br>";
                    echo $check->getName();
                    echo "<br>";
                    echo $check->getType();
                    echo "<br>";
                    echo $check->getValue();
                    echo "<br>";
                    
                    echo $check->render();
                    $check2 = new CheckBox("Yet Another CheckBox", "your checkbox", "no", $checked);
                    echo $check2->render();
                    echo "<br>";
                    
                    $selected = "female";
                    $radio = new RadioButton();
                    $radio->setText("Male");
                    $radio->setName("gender");
                    $radio->setValue("male");
                    
                    $radio2 = new RadioButton("Female", "gender", "female");
                    $radio3 = new RadioButton("Unknown", "gender", "unknown");
                    echo "<br>";
                    
                    $rlist = new RadioList("gender");
                    $rlist->add($radio);
                    $rlist->add($radio2);
                    $rlist->add($radio3);
                    $rlist->findChecked($selected);
                    echo $rlist->render();
                    
                    ?>
                    

                    The screenshot of the above code in a PHP page is shown below:
                    [ATTACH]4739[/ATTACH]

                    The fancy thing about the CheckBox and RadioList classes is that they can detect whether a checkbox or a radiobutton should be checked by default or not. You need to supply an identity variable $identity in the object constructor, or use the method findChecked($identity). By default, the RadioList class has only one identifier, its value. The CheckBox has the following four identifier: "true", "yes", "enabled" and "checked". If the supplied identity variable matches the identifier, it will be marked as checked by default, otherwise the default is unchecked. It is very useful when you work on the edit action of a controller, which may have default values for radiobuttons and checkboxes coming from a database column instead of hardcoded as shown in my example. Plain HTML proves to be way too painful for this, but my GUI package solves it nicely.

                    The new package can be downloaded from the attachment, lemme know what you think about this project and how I can improve it further. My next task is to work on TextField, PasswordField and TextArea gui components.
                    [ATTACH]4741[/ATTACH]

                    guitest 2.png gui package v0.2.zip

                      Why not just TextField with a DisplayType property which can be set to one of TextField::SingleLine, TextField:😛assword and default to SingleLine, and a TextArea class? Why do you need 2 classes for TextField and PasswordField as the only thing that changes is the input type?

                        Derokorian;11019671 wrote:

                        Why not just TextField with a DisplayType property which can be set to one of TextField::SingleLine, TextField:😛assword and default to SingleLine, and a TextArea class? Why do you need 2 classes for TextField and PasswordField as the only thing that changes is the input type?

                        Because there are significant differences from Text Field and Text Area? Even the tags aint the same. TextArea has many unique properties such as col, row, and wrap, so is with Text Field.

                        For PasswordField, well... I am not quite sure of this, perhaps I can just treat it as a special type of Hidden Field. I saw in Java's GUI package PasswordField is considered a child class of TextField, there must be a good reason for that. I definitely aint designing my GUI package completely based on Java, but I do borrow some stuff from it during preliminary design.

                          I've completed the Text type GuiComponent, all concrete text classes extend from an abstract TextComponent class, which has basic properties and methods shared by all child classes. The TextField and TextArea are two major classes in this hierarchy, while another class PasswordField extends from TextField to take care of Password and Hidden Field. This design is pretty simple so far, but soon I will be working on select list(drop down list) which can be trickly. Wish me luck everyone.
                          🙂

                          And here's the new example php code, perhaps I should add an autoload function to avoid loading this many class files next time...

                          <?php
                          
                          include_once("object.php");
                          include_once("guicomponent.php");
                          include_once("guicontainer.php");
                          include_once("guirenderer.php");
                          include_once("inputcomponent.php");
                          include_once("buttoncomponent.php");
                          include_once("textcomponent.php");
                          include_once("button.php");
                          include_once("radiobutton.php");
                          include_once("checkbox.php");
                          include_once("radiolist.php");
                          include_once("buttonrenderer.php");
                          include_once("listrenderer.php");
                          include_once("textarea.php");
                          include_once("textfield.php");
                          include_once("passwordfield.php");
                          include_once("textrenderer.php");
                          
                          $button = new Button();
                          $button->setText("This is a Button!");
                          $button->setName("My Button");
                          $button->setType("button");
                          $button->setValue("Click Me!");
                          
                          echo $button->getText();
                          echo "<br>";
                          echo $button->getName();
                          echo "<br>";
                          echo $button->getType();
                          echo "<br>";
                          echo $button->getValue();
                          echo "<br>";
                          
                          echo $button->render();
                          echo "<br>";
                          
                          $button2 = new Button("Yet Another Button", "your button", "Meh, what's going on?");
                          echo $button2->render();
                          echo "<br><br>";
                          
                          $checked = "no";
                          $check = new CheckBox();
                          $check->setText("This is a CheckBox!");
                          $check->setName("My Checkbox");
                          $check->setValue("yes");
                          $check->findChecked($checked);
                          
                          echo $check->getText();
                          echo "<br>";
                          echo $check->getName();
                          echo "<br>";
                          echo $check->getType();
                          echo "<br>";
                          echo $check->getValue();
                          echo "<br>";
                          
                          echo $check->render();
                          $check2 = new CheckBox("Yet Another CheckBox", "your checkbox", "no", $checked);
                          echo $check2->render();
                          echo "<br>";
                          
                          $selected = "female";
                          $radio = new RadioButton();
                          $radio->setText("Male");
                          $radio->setName("gender");
                          $radio->setValue("male");
                          
                          $radio2 = new RadioButton("Female", "gender", "female");
                          $radio3 = new RadioButton("Unknown", "gender", "unknown");
                          echo "<br>";
                          
                          $rlist = new RadioList("gender");
                          $rlist->add($radio);
                          $rlist->add($radio2);
                          $rlist->add($radio3);
                          $rlist->findChecked($selected);
                          echo $rlist->render();
                          echo "<br>";
                          
                          $textfield = new TextField();
                          $textfield->setName("tfield");
                          $textfield->setMaxLength(6);
                          $textfield->setValue("text"); 
                          
                          
                          echo "This is a ".get_class($textfield);
                          echo "<br>";
                          echo $textfield->render();
                          echo "<br>";
                          
                          $passfield = new PasswordField("password", "pass", "123456", 8);
                          echo "This is a ".get_class($passfield);
                          echo "<br>";
                          echo $passfield->render();
                          echo "<br>";
                          
                          $textarea = new TextArea("tarea");
                          $textarea->setValue("This is a text area, you can enter as many sentences as possible here. ");
                          $textarea->append("Dont you like it?");
                          $textarea->insert("n awesome", 9);
                          $textarea->replace("write", 38, 43);
                          echo "This is a ".get_class($textarea).", it has a total of {$textarea->lineCount()} lines.";
                          echo "<br>";
                          echo $textarea->render();
                          echo "<br>";
                          
                          $hiddenfield = new PasswordField("hidden", "hide", "my hidden field");
                          echo "This is a hidden field, it won't display but it does exist.";
                          echo "<br>";
                          echo $hiddenfield->getType();
                          echo "<br>";
                          echo $hiddenfield->render();
                          
                          ?>
                          

                          Screenshot:
                          [ATTACH]4743[/ATTACH]

                          The demo is available to download too, please do review it and lemme know where I can improve the existing classes further. This is version 0.3 so far, by version 0.5 or 0.6 it should be ready to use to handle PHP forms. By version 1.0 it will take care of tables too, at least I hope.
                          [ATTACH]4745[/ATTACH]

                          guitest 3.png gui package v0.3.zip
                            Lord Yggdrasill wrote:

                            perhaps I should add an autoload function to avoid loading this many class files next time...

                            You wouldn't need to include the entire class hierarchy on each page as long as the file declaring each class includes the files declaring its own immediate dependencies.

                              Well I did build a simple autoloader this time, so guess you wont see long list of include code.

                              Anyway I've completed version 0.5 of my GUI Package. It can now take care of forms and fieldsets, which is another significant improvement. There is a small issue though, you cannot insert comments/text between form elements(textfield, button, radiobuttons or whatever). For this reason I have been using fieldset/legend to handle this, which definitely is just a temporary solution. In version 0.6 I will be implementing a comment and a paragraph class to manipulate text in between forms and other types of containers. In version 0.7 and 0.8 the script should be able to deal with HTML tables too.

                              Here is a sample code of a registration form:

                              <?php
                              
                              function __autoload($class) {
                                  // The autoload function, a bit messy if you ask me
                                  $class_path = strtolower($class}); 
                                  if(file_exists("{$class_path}.php")) include("{$class_path}.php");
                                  else throw new Exception("Fatal Error: Class {$class} either does not exist!");
                              }
                              
                              if($_POST['submit']){
                                  echo "Your Username is: {$_POST['username']}";
                                  echo "<br>";
                                  echo "Your Password is: {$_POST['password']}";
                                  echo "<br>";
                                  echo "Your Confirmed Password is: {$_POST['password2']}";
                                  echo "<br>";
                                  echo "Your Email is: {$_POST['email']}";
                                  echo "<br>";
                                  echo "Your Confirmed Email is: {$_POST['email2']}";
                                  echo "<br>";
                                  echo "Your Gender is: {$_POST['gender']}";
                                  echo "<br>";
                                  echo "Your Country is: {$_POST['country']}";
                                  echo "<br>";
                                  if(empty($_POST['username'])) echo "<b>Error: You have not entered a username, please go back and fill in the blank.</b>";
                                  elseif(empty($_POST['password']) or $_POST['password'] != $_POST['password2']) echo "<b>Error: You have not entered a password, or you have not confirmed it successfully.</b>";
                                  elseif(empty($_POST['email']) or $_POST['email'] != $_POST['email2']) echo "<b>Error: You have not entered an email, or you have not confirmed it successfully.</b>";
                                  else echo "<b>You have registered successfully!</b>";
                                  return;
                              }
                              
                              echo "<b><u>Registration Form</u></b>";
                              echo "<br>";
                              $form = new Form("myform");
                              $form->setAction("test.php");
                              $form->setMethod("post");
                              $form->setLineBreak(FALSE);
                              
                              $field = new FieldSet("field");
                              $field->add(new Legend("username"));
                              $field->add(new TextField("username", "admin", 10));
                              
                              $field2 = new FieldSet("field2");
                              $field2->add(new Legend("password"));
                              $field2->add(new PasswordField("password", "password", "123456"));
                              $field2->add(new PasswordField("password", "password2"));
                              
                              $field3 = new FieldSet(new Legend("email"));
                              $field3->add(new PasswordField("email", "email"));
                              $field3->add(new PasswordField("email", "email2"));
                              
                              $field4 = new FieldSet(new Legend("gender"));
                              $radiolist = new RadioList("gender");
                              $radiolist->add(new RadioButton("Male", "gender", "male"));
                              $radiolist->add(new RadioButton("Female", "gender", "female"));
                              $radiolist->add(new RadioButton("Unknown", "gender", "unknown"));
                              $radiolist->check("unknown");
                              $field4->add($radiolist);
                              
                              $field5 = new FieldSet(new Legend("country"));
                              $countries = array("Britain", "France", "Germany", "Italy", "Spain", "America", "Canada", "Russia", "Australia");
                              $alias = array("gbr", "fra", "ger", "ita", "esp", "usa", "can", "rus", "aus");
                              $default = "usa";
                              $dropdown = new DropdownList("country");
                              $dropdown->fill($countries, $alias, $default);
                              $field5->add($dropdown);
                              
                              $form->add($field);
                              $form->add($field2);
                              $form->add($field3);
                              $form->add($field4);
                              $form->add($field5);
                              $form->add(new Button("Register", "submit", "submit"));
                              echo $form->render();
                              ?>
                              

                              The output of the page may vary depending on whether you submit the form or not, and whether you enter all form credentials. The image attachments below show the default form and the page after a form is submitted successfully:

                              Default Form:
                              http://oi48.tinypic.com/f9eer.jpg

                              Successfully Submitted Form:
                              http://oi50.tinypic.com/14lswm9.jpg

                              The demo can be downloaded from below, it is still not yet recommended to use in live sites, at least not when version 0.6 is completed.
                              [ATTACH]4749[/ATTACH]

                              gui package v0.5.zip

                                I have completed GUI Package version 0.6. The new GUI system is capable of handling text in containers such as form(form), paragraph(p) and division(div). You can play with text styles to make it bold, italic, underlined, and more. It is also possible to create image and link type GUI components, but not a combined image-link. The new example code is given below:

                                <?php
                                
                                function __autoload($class) {
                                    // The autoload function, a bit messy if you ask me
                                    $class_path = strtolower($class}); 
                                    if(file_exists("{$class_path}.php")) include("{$class_path}.php");
                                    else throw new Exception("Fatal Error: Class {$class} either does not exist!");
                                } 
                                
                                if($_POST['submit']){
                                    echo "Your Username is: {$_POST['username']}";
                                    echo "<br>";
                                    echo "Your Password is: {$_POST['password']}";
                                    echo "<br>";
                                    echo "Your Confirmed Password is: {$_POST['password2']}";
                                    echo "<br>";
                                    echo "Your Email is: {$_POST['email']}";
                                    echo "<br>";
                                    echo "Your Confirmed Email is: {$_POST['email2']}";
                                    echo "<br>";
                                    echo "Your Gender is: {$_POST['gender']}";
                                    echo "<br>";
                                    echo "Your Country is: {$_POST['country']}";
                                    echo "<br>";
                                    if(empty($_POST['username'])) echo "<b>Error: You have not entered a username, please go back and fill in the blank.</b>";
                                    elseif(empty($_POST['password']) or $_POST['password'] != $_POST['password2']) echo "<b>Error: You have not entered a password, or you have not confirmed it successfully.</b>";
                                    elseif(empty($_POST['email']) or $_POST['email'] != $_POST['email2']) echo "<b>Error: You have not entered an email, or you have not confirmed it successfully.</b>";
                                    else echo "<b>You have registered successfully!</b>";
                                    return;
                                }
                                
                                echo "<b><u>Registration Form</u></b>";
                                $form = new Form("myform");
                                $form->setAction("test.php");
                                $form->setMethod("post");
                                
                                
                                $field = new FieldSet();
                                $field->setLineBreak(FALSE);
                                $field->add(new Legend("Required Field"));
                                $field->add(new Division(new Comment("Please enter your username here, it must be alphanumeric."), "username"));
                                $field->add(new TextField("username", "admin", 10));
                                $field->add(new Paragraph(new Comment("Please fill in your password confirmed password here.")));
                                $field->add(new PasswordField("password", "password", "123456"));
                                $field->add(new PasswordField("password", "password2"));
                                
                                $email = new Paragraph();
                                $email->add(new Comment("Please type your email and confirmed email here.", TRUE));
                                $email->add(new PasswordField("email", "email"));
                                $email->add(new PasswordField("email", "email2"));
                                $field->add($email);
                                
                                
                                $field2 = new FieldSet(new Legend("Additional Fields"));
                                $radiolist = new RadioList("gender");
                                $radiolist->add(new RadioButton("Male", "gender", "male"));
                                $radiolist->add(new RadioButton("Female", "gender", "female"));
                                $radiolist->add(new RadioButton("Unknown", "gender", "unknown"));
                                $radiolist->check("unknown");
                                
                                $countries = array("Britain", "France", "Germany", "Italy", "Spain", "America", "Canada", "Russia", "Australia");
                                $alias = array("gbr", "fra", "ger", "ita", "esp", "usa", "can", "rus", "aus");
                                $default = "usa";
                                $dropdown = new DropdownList("country");
                                $dropdown->fill($countries, $alias, $default);
                                
                                $comment2 = new Comment("Your Citizenship: ", FALSE);
                                $comment2->setBold(TRUE);
                                $comment2->setUnderlined(TRUE);
                                
                                $field2->add(new Comment("Your Gender: ", FALSE));
                                $field2->add($radiolist);
                                $field2->add($comment2);
                                $field2->add($dropdown);
                                
                                $submit = new Button("Register", "submit", "submit");
                                $submit->setLineBreak(FALSE);
                                
                                $form->add($field);
                                $form->add($field2);
                                $form->add(new Image(new Link("templates/icons/facebook.gif"), "facebook", 20));
                                $form->add($submit);
                                $form->add(new Image(new Link("templates/icons/twitter.gif"), "twitter", 20));
                                echo $form->render();
                                ?>
                                

                                The screenshot for a much more organized and informative PHP form is shown below:
                                http://oi48.tinypic.com/xzryw.jpg

                                I am thinking about redesigning the render() method since it is a bit messy and the way it is designed makes it difficult for GUI components inheritance(since all GUI rendering process needs to call the root object's render() method). I also need to find ways to play with font, color and other html elements. It can be a pain, but hopefully I will prevail.

                                The demo for GUI package v0.6 is available for download, please tell me what you think. Thx.
                                [ATTACH]4751[/ATTACH]

                                gui package v0.6.zip
                                  Write a Reply...