Extending Community Quiz Using Template System

Community Quiz allow you to extend the template without loosing the work you've done when upgrading the component. Before moving forward, below are few facts about the template framework of Community Quiz.

• Community Quiz uses jQuery framework for all Ajax and user interaction. The required jQuery and jQuery UI libraries will be loaded from the assets/scripts directory when the component is loaded.
• Community Quiz stores default template under components/com_communityquiz/templates. The default folder stores the default template and required files.
• Community Quiz has the mechanism to load your css and JavaScript  files automatically from the templates. You need not include your scipts or styles manually. All you need to do is to place the scripts and styles in appropriate directories which you will learn later in this article.
• When extending the templates, you need to copy all resources from the template you are extending into your custom template. This includes images, scripts and styles etc.
• The custom template location of Community Quiz is JOOMLAROOT/templates/communityquiz/ .

So here is the procedure to extend the default template that is part of the Community Quiz package (components/com_communityquiz/templates/default)

1. Copy the template directory "default" from the templates folder to the custom templates folder Do not rename the folder for now as you are extending the default template and want to keep the name as is.
2. Keep the template files (*.php files) that you want to customize and remove all other .php files in your custom template folder. Below are the template files which you may be interested in:
   1. create_edit_quiz.php - The initial quiz creation page where you enter description of the quiz etc.
   2. quiz_form.php: The page where you create the questions and saves them. This page mostly rely on Quiz JavaScript framework and css.
   3. quiz_choose_answers.php: This is the page comes after saving your quiz questions. In this page you will choose the right answers for your questions.
   4. quiz_intro.php: This is the intro page that displays the quiz intro while a user is responding to the quiz
   5. quiz_list.php: Quizzes listing page
   6. quiz_response.php: The quiz response page where a user is displayed with the questions that he need to respond.
   7. quiz_results.php: The page which shows the result of the user response with final score.
3. The Community Quiz template system is intelligent enough to take the available template file from your custom template folder/template folder/default template folder. It looks for a template file in the sequential order of the following locations:
   
   1. JOOMLAROOT/templates/communityquiz/TEMPLATENAME folder where TEMPLATENAME is the name of your custom template (for now you can treat this as default as your custom template is extending from default template).
   2. components/com_communityquiz/templates/TEMPLATENAME folder
   3. components/com_communityquiz/templates/default folder
4. Now if you want to customize only home page of Community Quiz, just keep quiz_list.php file and remove other template files. Please note that you still need to keep all resources that you copied from default template
5. Now customize the template file as you wish and Community Quiz loads your template instantly.

Below are the variables available that you can make use of:
$this->list - Array stores the list of questions. Each question is a PHP object with the following properties

• id - id of the question (number)
• title - title of the question (string)
• description - description (string)
• alias - alias for sef urls (string, sef safe)
• catid - category id (number)
• category - category name (string)
• catalias - category alias (string sef safe)
• published - 1 = published , 0 = unpublished (number)
• responses - total number of quiz this question has received so far (number)
• created_by - user who created the question (number)
• created - date created in the format "mm-dd-yyyy hh:mm:ss" (string)
• ip_adress - ip address of the creator (string)
• show_responses - boolean flag tells if the quiz creator allows showing the quiz_results.php page after user response
• show_template - tells if the Joomla template is to be shown or the quiz has to be displayed in full screen
• multiple_responses - tells if the quiz allow multiple responses from single user
• duration - duration of the quiz in minutes

Always use $this->escape($YOUR_STRING_VARIABLE) function when you are printing a string variable for security reasonsEx: echo $this->escape($row->title);