|
|
| Línea 2: |
Línea 2: |
| <p class="note">For user documentation see '''[[:en:Mobile app|Mobile app]]'''.</p> | | <p class="note">For user documentation see '''[[:en:Mobile app|Mobile app]]'''.</p> |
| {{Moodle Mobile}} | | {{Moodle Mobile}} |
| See [https://docs.moodle.org/dev/Moodle_Mobile https://docs.moodle.org/dev/Moodle_Mobile] for the original English language DEV documentation. | | See [https://docs.moodle.org/dev/Mobile_app https://docs.moodle.org/dev/Mobile_app] for the original English language DEV documentation. |
| | |
| == 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 [https://moodle.org/mod/forum/discuss.php?d=206736 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 ==
| |
| | |
| * HTML5 http://www.w3.org/TR/2011/WD-html5-20110525/
| |
| | |
| * CSS3 http://www.w3.org/Style/CSS/
| |
| | |
| * Media queries for screen width and height http://www.w3.org/TR/css3-mediaqueries/
| |
| | |
| * Phonegap http://wiki.phonegap.com/w/page/16494772/FrontPage
| |
| | |
| * 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
| |
| | |
| * jsdoc http://code.google.com/p/jsdoc-toolkit/
| |
| | |
| * 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 [https://docs.moodle.org/dev/Moodle_Mobile_Plugins_Development Moodle Mobile Plugins Development].
| |
| | |
| There are a couple of tutorials with two sample plugins (grades and forums plugins)
| |
| | |
| See [https://docs.moodle.org/dev/Moodle_Mobile_Developing_a_plugin_tutorial Moodle Mobile Developing a plugin tutorial] and [https://docs.moodle.org/dev/Moodle_Mobile_Developing_a_plugin_tutorial_part_2 Moodle Mobile Developing a plugin tutorial part 2]
| |
| | |
| Source code:
| |
| | |
| * https://github.com/moodlehq/moodlemobile
| |
| | |
| == Creating your custom app ==
| |
| | |
| See [https://docs.moodle.org/dev/Moodle_Mobile_Customization 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
| |
| | |
| == See also ==
| |
|
| |
|
| * [[Personalización de Moodle Mobile]] | | * [[Personalización de Moodle Mobile]] |
