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: Web
    • Labels:
      None
    • Affected Branches:
      MOODLE_10_STABLE
    • Fixed Branches:
      MOODLE_12_STABLE
    • Rank:
      41736

      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

        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