Why subscribe/unsubscribe button in the custom entity named group cannot appear?

Question

I have created a custom render in group_module.js exactly as the example Rendering Entities with the exception of the line items['group/%'] = { instead of items['team/%'] = {. All other content nodes but group nodes (group/%) show ok. Group nodes show no subscribe/unsubscribe button and no menu tabs mentioned below in the groups_menu_module.js. I suppose that this module, groups_menu_module.js, is not loaded somehow.
I have to mention that without the custom rendering of entity group and with 2 LOCAL_TASK_MENU menu tabs, everything works perfect.

groups_menu_module.js

function groups_menu_module_menu() {
  try {
    var items = {};
    items['group/%']={
      title: 'view',
      page_callback: 'drupalgap_get_entity',
      page_arguments: ['groups_menu_module_default_page', 'node', 1]
    };
    items['group/%/provoli'] = {
      title: 'view',    
      type: 'MENU_DEFAULT_LOCAL_TASK'
    };
    items['group/%/melh'] = {
      title: 'members',
      type: 'MENU_LOCAL_TASK',
      page_callback: 'groups_menu_module_melh_page',
      page_arguments: [1],
      title_callback: 'groups_menu_module_melh_page_title',
      title_arguments: [1],
      access_callback: 'groups_menu_module_page_access',
      access_arguments: [1],
      options: {
        reloadPage: true
      }
    };
    items['group/%/anarthseis'] = {
      title: 'posts',
      type: 'MENU_LOCAL_TASK',
      page_callback: 'groups_menu_module_anarthseis_page',
      page_arguments: [1],
      access_callback: 'groups_menu_module_page_access',
      access_arguments: [1],
      options: {
        reloadPage: true
      }
    };
    return items;
  }
  catch (error) {
    console.log('groups_menu_module_menu - ' + error); 
  }
}

function groups_menu_module_default_page(node) {
  try {
    var content = {};
    content['title'] = { markup: node.title };
    return content;
  }
  catch (error) { 
    console.log('groups_menu_module_default_page - ' + error); 
  }
}

I have to mention that all functions needed are present in the actual .js file, i just opted them out because i think they are irrelevant. The pageshow function of the other module is as the example in the above link:

group_module.js

function example_team_pageshow(nid) {
  node_load(nid, {
    success: function(node) {
      var content = node.title; // Add other content here...
      $('#' + example_team_container_id(nid)).html(content).trigger('create');
    }
  });
}

So to conclude the question is how to make the subscribe/unsubscribe button appear in the custom entity render? How to call og_ui_field_formatter_view() from my module to make the button appear?

I don't know if i made my self clear what is needed. If anyone need more information please ask so in the comments below to clarify some points.

Answer 1

Since you are taking over the display of Organic Groups nodes using your custom page callback path group/%, DrupalGap doesn't know to apply the field format view functions to your fields. Essentially you need to manually create/render your own widgets in your page_callback:

var content = {};
content.title = { /* ... */ };
content.subscribe = { /* ... */ };
return content;

There are helper functions in the og.js file related to joining/leaving groups that will be of help. From there just use simple HTML/CSS/JS to build your button(s) (perhaps with an onclick handler) to help the user interact with the group subscriptions.

If you want to call the og_ui_field_formatter_view() function directly (not recommended) you can, you just need to pass it all the correct parameters:

(entity_type, entity, field, instance, langcode, items, display)

• the entity_type is typically 'node'
• the entity will be the fully loaded JSON of the entity (already delivered to your page_callback)
• the field and instance can be retrieved from http://api.drupalgap.org/7/global.html#drupalgap_field_info_field and http://api.drupalgap.org/7/global.html#drupalgap_field_info_instance respectively.
• the langcode will most likely be und unless you are using a multi-lingual site
• the items will be the value(s) within the field itself
• the display you should default to { type: 'og_group_subscribe' }.

Not the easiest things to do to be honest, and you'll probably find yourself happier in the long run by building your own custom widget to subscribe/unsubscribe from the Group.

Feel free to copy any code you need from the og.js file to make your life easier.