29/Moodle Mobile
- Personalización de Moodle Mobile
- Desarrollo de Plugins para Moodle Mobile
- Tutorial del Desarrollo de un Plugin para Moodle Mobile
- Tutorial del Desarrollo de un Plugin para Moodle Mobile parte 2
- Moodle Mobile Construyendo la app para Android
- Moodle Mobile Construyendo la app para iOS
- Moodle Mobile Sistema de construcción automático
Nota: Pendiente de Traducir. ¡Anímese a traducir esta página!. ( y otras páginas pendientes)
For user documentation see Mobile app.
Moodle 2.4
General Overview
MM (Moodle Mobile) is the official mobile app for Moodle. MM is an HTML5 app that uses common web technologies.
Basically, is a Web Services client that uses REST as protocol to obtain and send information to your Moodle installation/s.
The layout is created using HTML5 and CSS3, interaction with the phone and packaging is done using Phonegap.
For calling the Web Services, manipulating the DOM and interacting with Phonegap, we use jQuery as our Javascript framework.
This app is a replacement of the old Mobile app, see the discussion Change in our Moodle mobile app strategy for details.
Features
The features are going to be the same that the old Mobile app plus:
- PUSH Notifications (only iOs in first version)
- Mobile and tablet version (Responsive design)
- Support for contrib plugins
- Support for external settings: Extra CSS
- Support for external translation
- New development and debugging features
Features for future versions:
- Calendar sync
- Offline browsing and posting in forums
- Offline grading
Requirements
- Moodle 2.4
Future versions will require the last minor versions if Web Services are not backported.
Technologies used
- Media queries for screen width and height http://www.w3.org/TR/css3-mediaqueries/
- jQuery http://jquery.com/
- jQuery UI http://jqueryui.com/
- jQuery touchSwipe http://labs.skinkers.com/touchSwipe/
- matchMedia https://github.com/paulirish/matchMedia.js/
- Backbone and Underscore http://backbonejs.org/
- RequireJS requirejs.org
- Google Javascript Style Guide http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml
- Google Closure Lint http://code.google.com/p/closure-linter/
Phonegap
MM uses Phonegap for using Moodle hardware/software features like Camera, Audio/video recorder, access to the file system, etc. Phonegap is loaded in the index page of the app (jQuery, the main lib of the app are also loaded in the index page).
jQuery
For DOM manipulation and some helper functions, is a requirement of others libraries listed below.
jQuery UI
Dialogs and also for enhancing forms elements (buttons, checkboxes, etc...)
jQuery touchSwipe
For detecting mouse gestures
matchMedia
Javascript detection of media queries
Backbone and Underscore
For storage (Models and Collections), Underscore templates, and URL Routing
RequireJS
For handling modules dependencies and loading plugins
Structure of the app (only main directories)
css/ - App main layout and styles img/ - App images lang/ - Default lang lib/ - Main libraries plugins/ - Plugins test/ - Test data when developing in Test mode config.json - Main app configuration file (presets) index.html - Index page of the app
Getting and sending information to Moodle
MM uses standard Moodle Web Services for getting and sending information to Moodle. AJAX (jQuery) and REST + JSON are the technologies used.
Notice that mobile HTML5 apps doesn’t have cross domain restrictions so you can make AJAX calls to any domain.
External settings
In your Moodle installation you can specify an extra CSS file for customizing the app remotely.
This CSS is downloaded and stored in the device database for further use.
You can also translate the app strings using your Moodle translation tool because strings are synced using a specific Web Service.
Storage
We use HTML5 localStorage that is cross browser implemented and there are libraries that can work of top of it.
We use Backbone Models and Collections as a wrapper for localStorage.
Note that localStorage has some limitations like a 5MB max size in some devices and also is considers "Temporal data" for some devices like the new iPhones.
Internationalization
The app includes a language file in JSON (English is the default language).
Once the user is logged-in, the app automatically synchronizes the string translations using a specific Web Service, translations are stored in the device local database in JSON format.
Plugins
Overview
Plugins allow developers to extend the app functionalities. A plugin it’s a subdirectory that implements a set of required functionalities.
Types of plugins
- General: Interactions over the global app, such as the Notifications, Upload, Help and Web
- Course: Interactions over a course, such as course contents or participants
- User: Interactions over an user, such as send a message, add as a contact, write a private note
- Settings: Additional settings for the app
Development
See Moodle Mobile Plugins Development.
There are a couple of tutorials with two sample plugins (grades and forums plugins)
See Moodle Mobile Developing a plugin tutorial and Moodle Mobile Developing a plugin tutorial part 2
Source code:
Creating your custom app
See Moodle Mobile Customization.
Limitations and disadvantages of HTML5 apps
- Less speed and smoothness
- Limited to the Mobile functionalities provided from Phonegap
FAQ
Is the app a replacement of the MyMobile theme?
No, see http://moodle.org/mod/forum/discuss.php?d=206736#p901751
What is the difference between a native app and a Mobile specific theme or responsive theme?
See http://moodle.org/mod/forum/discuss.php?d=206736#p901475
Also http://moodle.org/mod/forum/discuss.php?d=206736#p901751