AngularJS REST API Mailbox Explorer for Sterling B2B Integrator

Mailbox Explorer is an HTML and Javascript program using Angular.js, treeview, bootstrap and dropzone JS libraries. This sample application is a combination of two programs:

1. Mailbox Tree Upload written by Melinda Rose and Christopher Meek.
2. Document Viewer written by Naveen Suryawanshi.

This sample program is used to read a list of mailboxes using a REST call and display them as a treeview. It can upload and view mailbox documents from IBM Sterling B2B Integrator. This sample code can be used with any resources with hierarchy.

Index.html:

 
     
         
		
         
         
         
         
         
             
     
     
     
	 
         

             
             

                 

                 
				 

                     

                           Destination: 

                          


                              The selected node is a message, You cannot drop files here.
							  Choose a mailbox.

                              

                          
                       
                   
				   

                     

                           View file: 
                           View

                          


                              The selected node is a mailbox. Please select a valid message to view.

                          
                       
                   
                 
             
             
         
     
 

Explorer.js

var app = angular.module('mailboxBrowser', ['angularTreeview']);

// --- connection variables ---

var host = 'http://9.155.214.76';

 var port = '5074';

// ----------------------------


// this controller kicks off the chain of 'GET' API calls to get the data from the server
 app.controller('treeCtrl', function($scope, $http) {

    var waitCount = 1;
     var mailboxId = '1';
     $http.defaults.useXDomain = true;
     $scope.nodeValidityMessage = "abc";

    $scope.treedata = [{ // initialize the first node with the root mailbox
         'label' : '/',
         'id' : '1',
         'children' : [],
         'type': 'mailbox',
         'path' : '/'
     }];

    $scope.evaluateType = function() {
         console.log('entered');
         if ($scope.currentNode.type === 'mailbox') {
             $scope.nodeValidityMessage = '';
         } else {
             $scope.nodeValidityMessage = 'The selected node is not a valid destination, ' + 'since it s a file.';
			
			 
         }
     }

    getContents($http, $scope.treedata[0]);
     initializeDropzone();

});

// view a file
 function viewFunction(node){
 var txt = document.getElementById('filename').value;
 console.log('node name' + txt);
 var viewUrl='http://' + host + ':' + port +"/B2BAPIs/svc/documents/"+txt+"/actions/getpayload";
 
$.ajax({ 
   method: 'GET',
    dataType: 'json',
         headers: {
             'Accept':'application/json',
             'Content-Type':'application/json',
             'Authorization':'Basic YWRtaW46cGFzc3dvcmQ='
         },
   url: viewUrl, 
   success: function(data){        
     alert(atob(data.response.toString()),'Alert Dialog');
	          //console.log('Payload ' + atob(data.response.toString()));

   }});

 }
// lists the contents of a node
 function getContents(http, node) {

    var parentMailboxId = node.id.toString();

    http({
         url: 'http://' + host + ':' + port + '/B2BAPIs/svc/mailboxcontents/?detail=true&parentMailboxId=' + parentMailboxId,

        method: 'GET',
         headers: {
             'Accept':'application/json',
             'Content-Type':'application/json',
             'Authorization':'Basic YWRtaW46cGFzc3dvcmQ='
         }
     }).success(function(data, status, headers, config) {
         node.children = new Array(data.length); // create empty slots for the children        
         for (var i=0; i < data.length; i++) {
             var item = data[i];
             node.children[i] = new Node(item);
             if (item.type === 'mailbox'){
                 getContents(http, node.children[i]);
				 
             }
             if (node.label === '/') {

                // the root level already has a slash, so there's no need to add it
                node.children[i].path = node.path + node.children[i].label; 
             } else {

                // prepend a slash to this node's label
                node.children[i].path = node.path + '/' + node.children[i].label; 
				          //add the documentId to the node
						  node.children[i].docid=item.documentId;
						  console.log('id ' + item.documentId);

             }
         }
     }).error(function(data, status, headers, config) {
         console.log('error retrieving messages for mailbox with id ' + parentMailboxId);
     });
 }

// creates a new node from a back-end item
 var Node = function(item) {
     this.label = item.name;
     this.id = item.id.toString();
     this.type = item.type;
     this.children = [];
 }

// sets the parameters needed to perform file upload
 var initializeDropzone = function() {
     var myDropzone = new Dropzone(".uploadpanel", {

        // "batchs" is misspelled on purpose due to framework limitations - do not correct
        url: 'http://' + host + ':' + port + '/B2BAPIs/svc/messagebatchs/', 
         method: 'POST',
         headers: {
             'Authorization':'Basic YWRtaW46cGFzc3dvcmQ=',
             'Cache-Control': ''
         },
         uploadMultiple: true,
         parallelUploads: 1000
     });
 }
 
 

You need to download the 3 needed javaScript libraries to make this application work:

Want to know more about IBM Sterling B2B Integrator REST API architecture.?