Moodle Mobile
  1. Moodle Mobile
  2. MOBILE-153 Move UMM to MM
  3. MOBILE-157

Make the app more modular (support for modules/buttons, auth plugins and themes)

    Details

    • Type: Sub-task Sub-task
    • Status: Resolved
    • Priority: Minor Minor
    • Resolution: Fixed
    • Affects Version/s: 1.0
    • Fix Version/s: 1.2
    • Component/s: Others
    • Labels:
      None
    • Affected Branches:
      MOODLE_10_STABLE
    • Fixed Branches:
      MOODLE_12_STABLE

      Description

      Modules: These are the main buttons displayed in the first screen once logged

      Auth: The way the users get a valid WS auth token. There are request for using external methods

      Themes: For creating your own appearance

        Gliffy Diagrams

          Activity

          Hide
          Jérôme Mouneyrac added a comment - - edited

          One thing that could be worth to look at is to have some kind of data binding framework to manage model and avoid to play with the DOM. I checked different javascript framework and end up with these two:

          • backbone.js (most famous)
          • angular.js (supported by Google)

          If you google them you'll find few ways to merge them with Jquery Mobile. I'm wondering if one of them would make the app maintenance easier? I think it could be worth to spend few days to check their benefit.

          Show
          Jérôme Mouneyrac added a comment - - edited One thing that could be worth to look at is to have some kind of data binding framework to manage model and avoid to play with the DOM. I checked different javascript framework and end up with these two: backbone.js (most famous) angular.js (supported by Google) If you google them you'll find few ways to merge them with Jquery Mobile. I'm wondering if one of them would make the app maintenance easier? I think it could be worth to spend few days to check their benefit.
          Hide
          Juan Leyva added a comment -

          Hi Jerome,

          I've been reading these days about Backbone but I can't see how can it help to avoid DOM manipulation. I read this article: http://coenraets.org/blog/2012/03/using-backbone-js-with-jquery-mobile/ and http://lostechies.com/derickbailey/2012/02/20/using-jquery-plugins-and-ui-controls-with-backbone/ and it seems that you add a new layer of "structured" views but not avoid the actual DOM manipulation.

          I think that for the first version we have to try to KISS I mean, I prefer to not add new frameworks and keep a low learning curve for new developers.
          I think the mobile app will not have so much "views", a tipical action (get contact info for an user) may take visit 3 different pages

          About models, I was thinking in use the same DB methods that moodle uses, (db.get_record, etc..) It's easy to use and for developers coming for Moodle will be easy to understand how it works. It also provides and abstraction layer over the storage (in this case, the local sqlite database)

          We can discuss this in a real example, i.e the Users button code once finished. I will create a new comment

          Regards

          Show
          Juan Leyva added a comment - Hi Jerome, I've been reading these days about Backbone but I can't see how can it help to avoid DOM manipulation. I read this article: http://coenraets.org/blog/2012/03/using-backbone-js-with-jquery-mobile/ and http://lostechies.com/derickbailey/2012/02/20/using-jquery-plugins-and-ui-controls-with-backbone/ and it seems that you add a new layer of "structured" views but not avoid the actual DOM manipulation. I think that for the first version we have to try to KISS I mean, I prefer to not add new frameworks and keep a low learning curve for new developers. I think the mobile app will not have so much "views", a tipical action (get contact info for an user) may take visit 3 different pages About models, I was thinking in use the same DB methods that moodle uses, (db.get_record, etc..) It's easy to use and for developers coming for Moodle will be easy to understand how it works. It also provides and abstraction layer over the storage (in this case, the local sqlite database) We can discuss this in a real example, i.e the Users button code once finished. I will create a new comment Regards
          Hide
          Juan Leyva added a comment -

          I just reviewed again Backbone after our live meeting and reading about the SQLite persistence in Phonegap, I've also read new articles and tutorials that explains very well the Bakcbone's views/template system

          Please, check: http://tracker.moodle.org/browse/MOBILE-184

          I think that it can help us to solve the problem of choosing the correct storage system and also for creating the view of the app, it will allow also us to have an app initial version working in WindowsPhone7 (WP7 lacks of sqlite support but it has local storage)

          Show
          Juan Leyva added a comment - I just reviewed again Backbone after our live meeting and reading about the SQLite persistence in Phonegap, I've also read new articles and tutorials that explains very well the Bakcbone's views/template system Please, check: http://tracker.moodle.org/browse/MOBILE-184 I think that it can help us to solve the problem of choosing the correct storage system and also for creating the view of the app, it will allow also us to have an app initial version working in WindowsPhone7 (WP7 lacks of sqlite support but it has local storage)
          Hide
          Juan Leyva added a comment -

          It seems that will need this type of plugins:

          Auth
          Theme
          Modules:
          App modules: Interactions over the global app. Like the Upload, Help and Web
          Course modules: Interactions over a course. Like course contents or participants
          User modules: Interactions over an user. Like send a message, add as a contact, write a private note

          Also it seems that the plugins would implement two version of it pages, one for mobile and one for tablet (we can fallback in mobile if not present the version for tablet)

          Show
          Juan Leyva added a comment - It seems that will need this type of plugins: Auth Theme Modules: App modules: Interactions over the global app. Like the Upload, Help and Web Course modules: Interactions over a course. Like course contents or participants User modules: Interactions over an user. Like send a message, add as a contact, write a private note Also it seems that the plugins would implement two version of it pages, one for mobile and one for tablet (we can fallback in mobile if not present the version for tablet)
          Hide
          Juan Leyva added a comment -

          After some reading of successful implementations of routed - navigation systems in jquery mobile (see http://msdn.microsoft.com/en-us/magazine//hh377172.aspx also http://coenraets.org/blog/2012/03/using-backbone-js-with-jquery-mobile/ and also http://jquerymobile.com/demos/1.1.1/docs/pages/page-dynamic.html) I've been playing and testing different approaches to implement device detection (tablet and mobile) and browsing using routes for loading the correct page based on the device detected.

          The main idea is that core systems and plugins must declare a Router object with this information:

          routes = {
          "core_settings" : "settings.html",
          "mod_courses_index" :

          {mobile: "courses/index_mobile.html", tablet: "course/index_tablet.html"}

          ,
          "mod_participants_index" : MM.mod.participants.someFunction
          }

          Routes are stored in a global object, links are like:

          <a href="#mod_courses_index">My courses</a>

          We have a function binded to the event pagebeforechange, so at any time jQueryMobile is going to load a page we can route to the correct html page or call a function.

          $(document).bind( "pagebeforechange", function( e, data ) {

          whereToGo = routes[e.hash];

          if (typeof whereToGo is object)

          else if (typeof whereToGo is function)

          else
          ...

          I'm just reading the Backbone Router documentation and some good Routers implementations (like google appengine webapp2) for ideas

          Show
          Juan Leyva added a comment - After some reading of successful implementations of routed - navigation systems in jquery mobile (see http://msdn.microsoft.com/en-us/magazine//hh377172.aspx also http://coenraets.org/blog/2012/03/using-backbone-js-with-jquery-mobile/ and also http://jquerymobile.com/demos/1.1.1/docs/pages/page-dynamic.html ) I've been playing and testing different approaches to implement device detection (tablet and mobile) and browsing using routes for loading the correct page based on the device detected. The main idea is that core systems and plugins must declare a Router object with this information: routes = { "core_settings" : "settings.html", "mod_courses_index" : {mobile: "courses/index_mobile.html", tablet: "course/index_tablet.html"} , "mod_participants_index" : MM.mod.participants.someFunction } Routes are stored in a global object, links are like: <a href="#mod_courses_index">My courses</a> We have a function binded to the event pagebeforechange, so at any time jQueryMobile is going to load a page we can route to the correct html page or call a function. $(document).bind( "pagebeforechange", function( e, data ) { whereToGo = routes [e.hash] ; if (typeof whereToGo is object) else if (typeof whereToGo is function) else ... I'm just reading the Backbone Router documentation and some good Routers implementations (like google appengine webapp2) for ideas
          Hide
          Juan Leyva added a comment -

          The plugin subsystem is finished

          Show
          Juan Leyva added a comment - The plugin subsystem is finished

            People

            • Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved:

                Development