Toper Turor

Create a custom CRM dashboard using Google Apps Script

Editors note: This is a guest post by Alex Steshenko. Alex is a core software engineer for Solve360, a highly-rated CRM in the Google Apps Marketplace which was recently chosen as a Staff Pick. Solve360 offers many points of useful integration with Google Apps. Today, in contrast to the conventional Data API integrations, Alex will showcase how he extended Solve360 using Google Apps Script. --- Ryan Boyd

Choosing Google Apps Script

Solve360 CRM integrates with Google services to provide a two-way contact & calendar sync, email sync and a comprehensive Gmail contextual gadget. We use the standard Google Data APIs. However, some of our use cases required us to use Google documents and spreadsheets. Enter Apps Script!. What brought our attention to Google Apps Script was that it allows you to run your application code right within the Google Apps platform itself, where documents can be manipulated using a wide range of native Google Apps Script functions, changing the perspective.

Our first experience with Google Apps Script was writing a "Contact Us" form. We decided to use the power and flexibility of Apps Script again to generate different kinds of reports.

Generating Solve360 Reports using Apps Script

Google Spreadsheets can produce rich reports leveraging features such as filters, pivot tables, built-in functions and charts. But where’s the data to report on? Using Google Apps Script, users can integrate Google Spreadsheets with a valuable source of data - the Solve360 CRM - completing the solution.

Solve360 Google Apps Reporting script lets users configure the reporting criteria while pulling reports into a Google Spreadsheet.

Heres a video demonstrating a real use case for Solve360 Reporting:

Designing Solve360 Reporting using Apps Script

User meet “Script”

For this script, we realized, simply providing spreadsheet functions would not be good enough. We needed a user interface to let users configure their account details and define what kind of data to fetch from the Solve360 CRM. Google Apps Script’s Ui Services came in handy. For instance, here is the function responsible for showing the “Solve360 account info” dialog:

/*
 * Creates new UI application and opens setting window
 */
function settingsUi() {
  var app = UiApp.createApplication();
  app.setTitle(Solve360 account info)
     .setWidth(260)
     .setHeight(205);

  var absolutePanel = app.createAbsolutePanel();

  absolutePanel.add(authenticationPanel_(app));

  app.add(absolutePanel);
  SpreadsheetApp.getActiveSpreadsheet().show(app);
}

Working with Solve360’s API

Solve360 CRM has an external API available so the system can be integrated with custom business applications and processes. Reporting script use case is a good example of what it can be used for.

One of the first tricks learned was creating our own Google Apps-like “service” to encapsulate all those functions responsible for interacting with Solve360 CRM’s API. What is the most interesting is that this service’s code isn’t a part of the distributed Google Apps script. Instead the library is loaded from within the script itself directly from our servers. Why? Let’s say we found a bug or added new functions - if we had many copies of the service we would need to update them all, somehow notifying our clients, and so on. With one source, there’s no such problem. You may think of it as a way to distribute a Google Apps Script solution, or, in our case, a part of the solution. The service is called Solve360Service and its usage looks like this:

var contact = Solve360Service.addContact(contactData);

There were two problems with getting such an external service to work: Google Apps Script permissions restrictions and actually including it in the script.

The issue with permissions is that the Google Apps Script environment can’t see which Google Apps Script services are used inside the external service - that’s why it doesn’t ask you to grant special permissions for them. To force the authorization request for those permissions we added this to the onInstall function (called once when script is added to the spreadsheet):

function onInstall() {
   // to get parseJS permissions
  Xml.parseJS([solve360, 1]);

   // to get base64Encode permissions
  Utilities.base64Encode(solve360);
// ...
}

Here is the solution we used to load our centralized code into the script:

eval(UrlFetchApp.fetch("https://secure.solve360.com/gadgets/resources/js/Solve360Service.js").getContentText());

The Solve360Service is loaded from a single source - no copy-paste. All the functions for accessing the Solve360 API aka “the plumbing” are abstracted and hidden in inside this service, while the essentials of the reports script itself can be modified and tweaked to a particular client’s case. Inside of Solve360Service we use UrlFetchApp:

/**
 * Request to the Solve360 API server
 * data should be an Array in Short Hand notation
 */
request : function(uri, restVerb, data) {
  if (this._credentials == null) {
    throw new Error(Solve360 credentials are not set);
  }

  if (typeof(data) != undefined) {
    if (restVerb.toLowerCase() == get) {
      var parameters = [];
      for each(var parameter in data) {
        parameters.push(encodeURIComponent(parameter[0]) + = + encodeURIComponent(parameter[1]));
      }
      uri += ? +  parameters.join(&);
      data = ;
    } else {
      data.unshift(request);
      data = Xml.parseJS(data).toXmlString();
    }
  } else {
    data = ;
  }

  var options = {
    "contentType" : "application/xml",
    "method" : restVerb.toLowerCase(),
    "payload" : data,
    "headers" : {"Authorization" : "Basic " + this._credentials}
  };
  return Xml.parse(UrlFetchApp.fetch(this._url + uri, options).getContentText()).getElement();
}

As the result is always XML, in order to remove any extra work we call Xml.parse() right inside the request function and always return a XmlElement so you can iterate through it, access nodes and attributes. Here is a simplified version of how we load some items when building a report:

/*
* Builds a search config from user preferences and loads a slice of data from Solve360
* To configure how many items should be loaded at a time, change ITEMS_LOAD_REQUEST_LIMIT constant
*/
function retrieveItems_(parameter, offset) {
  initSolve360Service_();
  // ...
  var searchParameters = [
    [layout, 1],
    [sortdir, ASC],
    [sortfield, name],
    [start,  + offset],
    [limit,  + ITEMS_LOAD_REQUEST_LIMIT],
    [filtermode, filtermode],
    [filtervalue, filtervalue],
    [searchmode, searchmode],
    [searchvalue, searchvalue],
    [special, special],
    [categories, 1]
  ];
  if (parameter.showAllFieldsCheckbox != true && fields.length > 0) {
    searchParameters.push([fieldslist, fields.join(,)]);
  }
  // ...
  var items = Solve360Service.searchProjectBlogs(searchParameters);
  // ...
  return items;
}

To simplify the usage of the service we added another function which initializes the service object, named Solve360Service:

/*
* Loads external Solve360Service
* For the service functions available refer to the source code here:
* https://secure.solve360.com/gadgets/resources/js/Solve360Service.js
*/
var Solve360Service = null;
function initSolve360Service_() {
  if (Solve360Service == null) {
    eval(UrlFetchApp.fetch("https://secure.solve360.com/gadgets/resources/js/Solve360Service.js").getContentText());
    var user = UserProperties.getProperty(USERPROPERTY_USER);
    var token = UserProperties.getProperty(USERPROPERTY_TOKEN);
    if (user == null || user.length == 0 || token == null || token.length == 0) {
      throw new Error(Use Solve360 spreadsheet menu to set email and token first);
    }
    Solve360Service.setCredentials(user, token);
  }
}

As you can see, it uses the email/token pair previously saved in the “Solve360 Account Info” dialog or signals an error if the credentials were not yet saved.

Conclusion

There are many use cases where you can apply the Google Apps Script. The fact that you can work and implement solutions right from “inside” one of the greatest and most universal web applications available is amazing.

You can integrate your own software with Google Docs or even learn from us and build a reporting script for any other system accessible online. Try to look at solving business tasks from a different perspective, from the Google Apps point of view. We encourage it!

The code of the new script is available for use and study here:
https://secure.solve360.com/docs/google-apps-reports.js.

Alex Steshenko profile | twitter | blog Alex Steshenko is a core software engineer for Solve360, a CRM application on the Google Apps Marketplace.