Technology and Learning: Add mobile support to your Moodle plugin – part four

Source: Technology and Learning: Add mobile support to your Moodle plugin – part four

In the previous part of this series, I modified my mobile addon so that clicking on a plugin instance loaded and displayed a “Hello World!” screen. Now, I will add some services so that it will retrieve the number of responses made to the particular questionnaire and display them, when a user clicks on an instance. I’m also going to add a link handler, that will handle the questionnaire when it is selected by a link in other site content.

First, I’m going to add the link function. In all of the other addons I’ve looked at, a handler was defined for links. In the moodle.org forum, I asked about this, and learned that it was so the mobile plugin was handled properly if it was reached from a link other than the course instance.

Adding the link function is apparently very easy now. The latest release of the mobile app has a simplified handler function that manages the links for me. I really just have to add one line to my main.js file and one line to my services/handlers.js file, as follows:

main.js:

.config(function($mmCourseDelegateProvider, $mmContentLinksDelegateProvider) {    $mmCourseDelegateProvider.registerContentHandler( ‘mmaModQuestionnaire’, ‘questionnaire’, ‘$mmaModQuestionnaireHandlers.courseContent’);   $mmContentLinksDelegateProvider.registerLinkHandler( ‘mmaModQuestionnaire’, ‘$mmaModQuestionnaireHandlers.linksHandler’);

services/handlers.js:

self.linksHandler = $mmContentLinksHelper.createModuleIndexLinkHandler( ‘mmaModQuestionnaire’, ‘questionnaire’, $mmaModQuestionnaire);

Now, when I create a link in my course that goes to a questionnaire instance, instead of launching in the browser, it uses the questionnaire mobile plugin.

In the last iteration, I left the isPluginEnabled function in a state where it always returned true. Now, I need to make it do something that actually checks with the site to see if the plugin really is enabled. This will require changing this function in the mobile plugin, and adding a web service to the questionnaire module.

Both the certificate and feedback call the ‘mod_[pluginname]_get_[pluginname]_by_courses’ web service, so I’ll start there. Note that feedback also calls mod_feedback_get_feedback service, but I’ll look at that later.

Starting with the mobile plugin, I’ll update the services/questionnaire.js::isPluginEnabled function as follows:

self.isPluginEnabled = function(siteId) {
siteId = siteId || $mmSite.getId();

    return $mmSitesManager.getSite(siteId).then(function(site) {
return site.wsAvailable( ‘mod_questionnaire_get_questionnaires_by_courses’);
});
};

What this code does, is verify that the questionnaire module is enabled on the Moodle site by checking for the availability of the web service, mod_quesrionnaire_get_questionnaire_by_courses, on the Moodle site. This means I will need to create that web service in the main questionnaire activity plugin. For this one, I am going to copy from the certificate module, but simplify it down for now to only provide the basic module information and only check for ‘view’ capabilities.

To add the web service to my module, I do the following:

Add the necessary external services to the classes/external.php file:

This requires creating the file with the external class extending the core external_api class in the mod_questionnaire namespace. In that class, I need to add the function for get_questionnaires_by_courses as well as two other helper functions, get_questionnaires_by_courses_parameters and get_questionnaires_by_courses_returns. These three functions are required to fully define the web service as described in the web services developer documentation.

It is the job of this function to return result information for all questionnaire instances in the identified courses. You can see the full code for this here.

Add the db/services.php file to define the services available by web services:

Web services need to be described in this file. When a plugin is installed or upgraded, the Moodle system uses this file to add the services described in this file to its known, available services. This is more fully described here. Once the Moodle site knows about them, it can allow them to be used by external systems.

Since I already have the questionnaire module installed on my Moodle site, I will need to bump up the version number in my version.php file, to trigger a module upgrade, and get the Moodle site to load my new web service. Once I have done this, I should be able to see that my new service has been installed by going to my site’s admin/webservice/service_functions.php screen and looking for the web service there. I upgrade my site with new version and check for the service on the admin screen. Successfully, I see the following:

Since I’m writing web services, I might as well create one that provides some meaningful information from the Moodle site that I can display in my mobile plugin.

Currently, when I click on a questionnaire in the mobile app, I just get the “Hello World!” screen. I am going to modify it so that it tells me how many responses I have made to that instance. To do that, I will need a web service in the Moodle plugin to provide that information back to the mobile plugin.

Back at my db/services.php file, I define a new service called ‘mod_questionnaire_get_user_responses’ and define it as a service that returns ‘a count of the current user responses’.

Then, I code the new service in my classes/external.php file. Its a simple function, that simply returns the count of responses for the user / questionnaire instance in question.

Lastly, I perform a version bump to force an upgrade and verify that the service has been added to the Moodle site:

Now, I need to modify the mobile plugin to use this new service and display the information appropriately. Starting with templates/index.html file, I modify so that it will display a count of the user’s responses:

<ion-view>
<ion-nav-title>{{ title }}</ion-nav-title>
<ion-content padding=”true” mm-state-class>
<mm-course-mod-description description=”description”></mm-course-mod-description>
{{mymessage}}<br />
You have {{responses}} responses.
</ion-content>
</ion-view>

The template will look for a value in the {{responses}} tag, which means I need to add code to the controllers/index.js file to populate that. The code includes a function that uses the promise mechanism to add the response count to the template scope variable, and a helper function to call the plugin service function, $mmaModQuestionnaire.getUserResponses located in services/questionnaire.js.

In the services/questionnaire.js file, I add the code that will call the new web service I created in the Moodle plugin. This is the part that will actually call the site service and extract the response information. The actual call to the web service is in this line:

return $mmSite.read(‘mod_questionnaire_get_user_responses’, params, preSets).then(function(response) {

This should be all I need to change the behaviour of the questionnaire module in the mobile app, so that it will also show me the number of responses.

With my new code added to the mobile plugin, and the new services added to the Moodle module, I need to verify that I can still access the questionnaire in the mobile app, and that I can see the number of responses.

I ramp up my mobile app, click the questionnaire instance, and achieve success:

I still have a lot of work ahead of me to make my questionnaire plugin functional in the mobile app, but I at least now have a good working understanding of what needs to be done, how to use web services, and how to make them useful in the mobile plugin. I will get back to this (eventually), and document my learnings in future posts.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s