Revision as of 21:03, 19 October 2012

Introduction

One immediately recognizable features of the web application is the diversity of widgets on the right-hand side of the window, each containing some user input and/or output. Each of those widgets is generated by a class that extends X2Widget, which can be found in protected/components. The widgets are loaded into the controller by the setPortlets filter (and inherited by all subclasses of x2base).

Creating a widget

The first step to creating a new widget is to make a new PHP class that extends X2Widget, name the file after the class, and to place the widget in the protected/components directory. Note the inheritance of properties from CWidget, the parent class of X2Widget. A complete widget should contain, at minimum, an override of the CWidget::run() method that constructs the markup associated with that widget.

Adding the widget to the registry

Widgets loaded by filterSetPortlets are loaded are contained in the application configuration parameter "registeredWidgets" (in protected/config/main.php), in the format "ClassName" => "Widget Title":

		'registeredWidgets'=>array(
			'TimeZone' => 'Time Zone',
			'MessageBox'=>'Message Board',
			'QuickContact'=>'Quick Contact',
			'GoogleMaps'=>'Google Map',
			'TwitterFeed'=>'Twitter Feed',
			'ChatBox'=>'Chat',
			'NoteBox'=>'Note Pad',
			'ActionMenu'=>'My Actions',
			'TagCloud'=>'Tag Cloud',
			'OnlineUsers'=>'Active Users',
			'MediaBox' => 'Media',
			'DocViewer' => 'Doc Viewer',
			'TopSites' => 'Top Sites',
		),

Widget views

Like controllers, widgets use view files to generate the final HTML. The markup associated with a widget can be placed in a separate view file in that directory and then rendered in the widget's run() method, passing it any parameters needed in the view: <syntaxhighlight lang="php"> $this->render('actionMenu', array( 'total' => $total, 'unfinished' => $unfinished, 'overdue' => $overdue, 'complete' => $complete, ));</sourcecodehiglight>

By default, widgets look for view files in protected/components/views.