webCOMAND

webCOMAND Apps

This tutorial builds on the Content Types, Packages and MVC Apps Tutorials to create a webCOMAND App.  webCOMAND Apps are launched from within webCOMAND and can take advantage of the shared environment and webCOMAND framework.

Create "Presidents" webCOMAND App

To turn our existing package into a simple webCOMAND app:

  1. Click "Presidents Demo" under Tutorial in the folder tree on the left.
  2. Click the New Menu (New Menu) in the Contents field and select "webCOMAND App" from the drop-down.
  3. Enter Title "Presidents"
  4. Enter Identifier "presidents"
  5. Select Package "Presidents Demo"
  6. Enter Summary "View and manage United States presidents."
  7. Upload Icon of United States Flag (same one used for Presidents Content Type)
  8. Click Approve

The new Presidents app should now appear last in the Apps drop-down and on the Dashboard.

Create "app.php" PHP File

If all the app functionality we want is a title bar and scroll bar, then we are done.  However, to take advantage of the webCOMAND Framework and utilize the built in user interface components, we need to create a class that extends webcomand_app and defines a launch method, which will be called when the app is launched.

We will add two panels for our user interface for a list of all presidents on the left and a selected president on the right.

  1. Click "PHP File" under "Presidents Demo" in the folder tree on the left.
  2. Click the New Button (New Menu) in the Collection Bar.
  3. Enter Filename "app.php"
  4. Enter Text:
    <?php
    namespace com_presidentsdemo_www;
    
    use com_webcomand\models\WebCOMANDApp;
    use com_webcomand\components\cpath_view;
    
    class app extends WebCOMANDApp {
        public function launch($options = []) {
            // populate LeftViewContainer with all presidents
            $this->add_component('\com_webcomand\components\cpath_view', [
                    'Container' => 'LeftViewContainer',
                    'Identifier' => 'list',
                    cpath_view::CPATH => '[:President]'
            ]);
    
            // populate CenterViewContainer with first president
            $this->add_component('\com_webcomand\components\cpath_view', [
                 'Container' => 'CenterViewContainer',
                 'Identifier' => 'form',
                 // link this view to the list above with:
                 cpath_view::PARENT_IDENTIFIER => ['list'],
                 // display first president initially
                 cpath_view::CPATH => '[:President AND Number=1]'
            ]);
        }
    }
  5. Click Approve

Update "index.php" PHP File

Next, we need to update the package router to run the app instead of using the MVC framework.

  1. Click "PHP File" under "Presidents Demo" in the folder tree on the left.
  2. Click "index.php" on the left.
  3. Update the Text to:
    <?php
    namespace com_presidentsdemo_www;
    
    $framework = new \com_webcomand\framework();
    $framework->require_login();
    
    app::run($framework);
    
  4. Click Approve

Update "Presidents" webCOMAND App

Finally, we need to update the webCOMAND App to specify the webCOMAND App class, so webCOMAND knows what to launch.

  1. Click "WebCOMAND Apps" under "Presidents Demo" in the folder tree on the left.
  2. Click "Presidents" on the left.
  3. Enter the Class Name "app"
  4. Click Approve

Conclusion

The Presidents app can now be launched from the webCOMAND Dashboard and Apps drop-down.  It uses the webCOMAND framework to display a mobile-friendly list of presidents that can be clicked to view and edit their details.