M3 API Calls with the H5 Client

Like any kid with a new toy, I find it a little hard to resist having a play – so this evening I decided that I would expand my mind with research and experimentation… J

I had a quick look through the H5 Development Guide and discovered that it is a little thin on information – infact it’s very similar to the M3 Smart Office development guide – but it provides us with some clues about what we can do.

And in this instance, I was wondering how hard it would be to call the M3 APIs from within the Javascript as this is something I do for many customers scripts and I was wondering if I would need to pass authentication information. As it turns out, once I stopped trying to work with a broken API , it’s pretty simple as we can examine the H5 generated code to get some good clues about how it works.

So what I’ll do is show you the process that I went through and some example code – I haven’t got a nice code pattern, and I haven’t really done much on web development so apologies in advance…

I decided to use IE, it has some nice debugging tools. So I went in to the H5 client and opened OIS300, then like I’m sure 90% of people (I’m sure), I opened the developer tools

Which gave me something like this. The DOM Explorer being very interesting as I could start looking at how the webpage was constructed. Scrolling down I noted some M3 REST calls to the APIs, specifically MNS410MI.LstRoles

And I found the apiBaseUrl further up the document

So now I had a method to call the APIs – but processing them, well…I didn’t really have the time or inclination to search the web, so scanning through the code in the DOM explorer I found the function getCustomizationRoles referenced a couple of screenshots above.

So now we have the code to process the returned API results.

I wrote a little code to ensure that the nameValue[j].Name related to the field name returned from the API and the nameValue[j].Value is the actual value – which it was.

Now that we have some useful information and I moved on to call a simple API, CRS008MI.ListFacility – it will list the facilities, and if you supply a facility it will list the facilities from that point onwards. Something nice and easy.

I also wanted to present the information in one of the H5 pop up dialogs – which is helpfully documented in the H5 Development Guide.

The result is this:

And the code (it needs to be saved as sacTest.js and you need to associate it to a panel as sacTest):

// a test script to call a M3 API
// and display a message box
var sacTest = new function()
{
	
	
	this.Init = function(scriptArgs)
	{
		var host = scriptArgs.controller.ParentWindow;
		var cont = scriptArgs.controller;
		var args = scriptArgs.args;
		var el = scriptArgs.elem;
		var debug = scriptArgs.debug;
		
		var content = cont.RenderEngine.Content;

		debug.WriteLine("sacTEST script was called");
		
		// this is the our actual call to the REST services
		$.ajax(
		{
			url:'/m3api-rest/execute/CRS008MI/ListFacility?FACI=IFL', dataType: 'json', success : function(miResult) { processItems(miResult, debug); }
		}
		).error(function(e, msg) { debug.WriteLine("error: " + e + " " + msg); });
		
	}
	
	// process the items that are returned
	function processItems(result, debug)
	{
		var miRecords = result.MIRecord;
		
		if(null != miRecords)
		{
			var strOutput = "";
			for(var i = 0; i < miRecords.length; i++)
			{
				var nameValue = miRecords[i].NameValue;

				for(var j = 0; j < nameValue.length; j++)
				{
					// look for the FACI or FACN fields
					if("FACI" == nameValue[j].Name)
					{
						strOutput += nameValue[j].Value + " ";
					}
					else if("FACN" == nameValue[j].Name)
					{
						strOutput += nameValue[j].Value + "<br>";
					}
				}
			}
			// display an information dialog box
			ConfirmDialog.ShowMessageDialog({dialogType: "Information", header : "PotatoIT!", message: strOutput});
		}
		else
		{
			debug.WriteLine("No records returned");
		}
	}
}
		

This entry was posted in Development, H5 Client. Bookmark the permalink.

3 Responses to M3 API Calls with the H5 Client

  1. Hello. My name is Mathieu Bourcet.
    I am developer H5 / javascript with Mr Kham for 3klesConsulting.
    I am contacting you on behalf of Thibaut. I encounter a problem with javascript / mashup, indeed I must update the headers of a Mashup list with data from a screen F. My problem is that I do not find the option to retrieve the instance of the mashup in javascipt code.
    I manage to store the values of the screen ‘F’ in variable but I can not seem to inject it into the Mashup List. The mashup of the list must be positioned on the variable. Do you have an idea or example on this.
    Thank you

    • potatoit says:

      Hi Mathieu,

      from your browser if you enable the developer mode, you should be able to inspect the code that makes up the page that the mashup is on. It may should provide some clues as to the object names which will allow you to manipulate the mashup.

      I haven’t had enough of a play with the H5 client to offer much more advice, sorry.

      Cheers,
      Scott

  2. potatoit says:

    Habit really :-O. Whenever I do stuff with M3 I use IE – probably because it’s what I have used to extract the cert for Smart Office 🙂

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s