KoolUIControl - Excellent PHP, HTML5 and Javascript Controls
KoolUIControl is a library of PHP, HTML5 and Javascript controls developed using a common Model-View-Controller (MVC) pattern.
At heart of KoolUIControl are HTML5 and javascript controller classes and HTML templates.
Besides their self functions, controller classes are easy to extend and customize for each developer's uses.
HTML templates are even easier for manipulating to change your control interface in a second.

Basic principles:
  • Each control must have an unique id.
  • A control is determined by its HTML template, options and data.
  • A HTML template can be built upon other previous templates without duplicate code.
  • Each DOM element in HTML templates can have:
    • Multiple parameters (set by its kParams attribute).
    • Multiple javascript controllers (set by its kControls attribute).
    • Multiple javascript listeners (set by its kListeners attribute).
    • Multiple commands (set by its kCommands attribute).
    • Multiple data (set by its kData attribute).
  • Javascript controllers and listeners can be extended.
Key features:
  • Fast setup with minimal code.
  • Versatile client functions and data API.
  • Support user-interactivity
  • Continously developed and supported.

Step by step guides

<?php
    # Step 1: Import KoolUIControl class
    $KoolControlsFolder = "KoolControls";
    require $KoolControlsFolder . "/KoolUIControl/KoolUIControl.php";
 
    # Step 2: Create a KoolUI control and process
    $info = array(
        'id' => 'KoolPanel1',
        'height' => '150px',
        'contentHeight' => '200px',
        'templateSelector' => 'KPanel t0',
        'data' => array(
            'title' => 'My panel',
            'content' => ''
                .'Line 1 Line 1 Line 1 Line 1 Line 1<br>'
                .'Line 2<br>'
                .'Line 3<br>'
                .'Line 4<br>'
                .'Line 5<br>'
                .'Line 6<br>'
                .'Line 7<br>'
                .'Line 8<br>'
                .'Line 9<br>'
                .'Line 10<br>',
        ),
    );
    $ui = KoolUI::newUI($info);
    $ui->process();
?>
<html>
    <head></head>
    <body>
        <?php 
            <!-- Step 3: Render the control -->
            echo $ui->render();
        ?>
    </body>
</html>