Client: Difference between revisions

From MobileX for SageCRM
No edit summary
No edit summary
 
(2 intermediate revisions by the same user not shown)
Line 18: Line 18:


   var onContextChanged = function () {
   var onContextChanged = function () {
    // Add "Orders" tab to the Company Summary
        var _posx = helpers_getMenuLeftPosInc() + helpers_getMenuLeftPosInc() + 5;
    if (cApp.EntityName == "company") {
        var _posy = 2;
         Factory.destroyComponent("btnOrders");
         Factory.destroyComponent("btnLibraryList");
         cApp.btnOrders= Factory.createTopButton("btnOrders");
         cApp.btnLibraryList = Factory.createTopButton("btnLibraryList");
         cApp.btnOrders.pr_caption = "Order";
         cApp.btnLibraryList.pr_caption = "Files";
         cApp.btnOrders.pr_icon = "icon-envelope icon-white";
         cApp.btnLibraryList.pr_icon = "files-o fa-lg";
         cApp.btnOrders.pr_onclick = "cApp.sendOrder();";
         cApp.btnLibraryList.pr_onclick = "cApp.viewLibraryList(cApp.EntityName,cApp.EntityId);";
         cApp.btnOrders.pr_insert = true;
         cApp.btnLibraryList.pr_insert = true;
         cApp.btnOrders.draw("btnContainer");
         if (_posx + 65 < $('#btnContainer').width()) {
        cApp.btnOrders.position(255, 2);
            // cApp.btnLibraryList.draw("btnContainer");
    }
            // cApp.btnLibraryList.position(_posx, _posy);
        }
        cApp.addEntityReworkBtn(cApp.btnLibraryList);
        cApp.drawEntityReworkBtns('plusingnamegoeshere');  //need to call this passing in the name of the plugin
   };
   };


Line 72: Line 75:


is called after the request returns and "Factory.msgBox" displays a message box with the result
is called after the request returns and "Factory.msgBox" displays a message box with the result
----
Icons and font awesome
As of March 2019 the system uses
Font Awesome 4.3.0
Please refer to this online for details.

Latest revision as of 15:38, 19 March 2019

The client plugin is created in the file "SageCRMWS/js/plugins/PLUGINNAME/client/plugin.js"

You would add the following:

 var onDocumentReady = function () {
 }
 var onContextChanged = function () {
 };

This is the basic setup of the client plugin

 onDocumentReady  - Called when the web application has finished loading.
 onContextChanged - Called when a context in the web application has changed, as the result of calling cApp.setContext() method.


Next thing we might want to do is create a button the screen.

 var onContextChanged = function () {
       var _posx = helpers_getMenuLeftPosInc() + helpers_getMenuLeftPosInc() + 5;
       var _posy = 2;
       Factory.destroyComponent("btnLibraryList");
       cApp.btnLibraryList = Factory.createTopButton("btnLibraryList");
       cApp.btnLibraryList.pr_caption = "Files";
       cApp.btnLibraryList.pr_icon = "files-o fa-lg";
       cApp.btnLibraryList.pr_onclick = "cApp.viewLibraryList(cApp.EntityName,cApp.EntityId);";
       cApp.btnLibraryList.pr_insert = true;
       if (_posx + 65 < $('#btnContainer').width()) {
           // cApp.btnLibraryList.draw("btnContainer");
           // cApp.btnLibraryList.position(_posx, _posy);
       }
       cApp.addEntityReworkBtn(cApp.btnLibraryList);
       cApp.drawEntityReworkBtns('plusingnamegoeshere');  //need to call this passing in the name of the plugin
 };

Our client API uses the Factory method to control creating elements.

See Factory API

Next we want to implement the "sendOrder" method

 cTSApp.prototype.sendOrder = function () {
   var params = {
       fileName: "js\\plugins\\PLUGINNAME\\server\\sendOrder.js",
       EntityId: cApp.EntityId
   };
   var onSendOrderCompleted = function (data) {
       Factory.msgBox(data);
   };
   cApp.gatewayPostParams("runServerScript", params, onSendOrderCompleted);
 };

With the code

   var params = {
       fileName: "js\\plugins\\PLUGINNAME\\server\\sendOrder.js",
       EntityId: cApp.EntityId
   };

We tell the system what server js file to make the request to and also pass in the current Entity Id (any params can be set and sent to the server)

The request is actually made with the method "cApp.gatewayPostParams"

 EG 
 cApp.gatewayPostParams("runServerScript", params, onSendOrderCompleted);


The callback "onSendOrderCompleted"

   var onSendOrderCompleted = function (data) {
       Factory.msgBox(data);
   };

is called after the request returns and "Factory.msgBox" displays a message box with the result



Icons and font awesome

As of March 2019 the system uses Font Awesome 4.3.0

Please refer to this online for details.