Waffle Recipes

How-To's and Tutorials for the ActiveWAFL Framework

How to Create a New Page in ActiveWAFL MVC

Posted Oct 4, 2014

In this example, we'll add a new page to a website running an ActiveWAFL MVC Application.

In the instructions and code examples we'll assume that an ActiveWAFL MVC Application is installed at /var/www/vhosts/MyApp, it's root namespace is MyApp, and it is deployed at the domain MyApp.com.

Create the Presentation Template

Create a new file named /var/www/vhosts/MyApp/Presentation/Templates/MyNewPage.tpl with the following contents.

MyNewPage.tplPresentation Template
  1. <h1>Hello World!</h1>

Create the Presentation Stylesheet

Create a new file named /var/www/vhosts/MyApp/Presentation/Stylesheets/MyNewPage.css with the following contents.

MyNewPage.cssPresentation Stylesheet
  1. h1
  2. {
  3.    color: #996655;
  4. }

Create the Server Side Controller

Create a new file named /var/www/vhosts/MyApp/Controllers/MyNewPage.php with the following contents.

MyNewPage.phpServer- Side Controller
  1. namespace MyApp\Controllers;
  2. use DblEj\Application\IMvcWebApplication;
  3. use DblEj\Communication\Http\Request;
  4. use DblEj\Mvc\ControllerBase;
  5. class MyNewPage extends ControllerBase
  6. {
  7.    public function DefaultAction(Request $request, IMvcWebApplication $app) {
  8.       return $this->createResponseFromRequest($request, $app);
  9.    }
  10. }
createResponseFromRequest() is a method available in all Controllers.
It responds with a Site Page using the Presentation Template and Stylesheet with the same name as the Controller, as demonstrated by this example.

Create the Client Side Controller

Create a new file named /var/www/vhosts/MyApp/Controllers/MyNewPage.js with the following contents.

MyNewPage.jsClient Side Controller
  1. Namespace("MyApp.Controllers");
  2.  
  3. MyApp.Controllers.MyNewPage = DblEj.Mvc.ControllerBase.extend({
  4.     init: function()
  5.     {
  6.         this._super();
  7.     },
  8.     DefaultAction: function(args)
  9.     {
  10.         alert("Hello World!");
  11.     }
  12. });

You should now be able to open http:// MyApp.com/MyNewPage in your browser and see a web page that says "Hello World". This is because the server-side controller returned a SitePage that encapsulates the MyNewPage template file."
You should also get a "Hello World" popup, caused by the client-side controller's default action.

You can follow this same pattern for every page in your site. If you want to create pages in sub-folders, then put the Controllers and Templates into sub-folders of their respective parents that mirror your desired structure.

To call an action other than the DefaultAction, pass an HTTP variable name Action with the name of the desired action as the value. Alternately, you can implement a custom Router and map virtually any request to any controller action.