Information Systems:Notes on Infonet Development

Overview

This page probably won't last as the topic is massive. Nonetheless, an area needs to be devoted to discussing development in Infonet (therefore, mostly talk related to WebSmart). That starts here.

Bootstrap redesign and new conventions

October 2016 (ongoing): In terms of web UI/UX code (but also the PML), Infonet (and Web Orders for that matter) are very outdated. There is heavy use of HTML tables for styling, the Javascript and jQuery functionality is cut-and-paste, and re-usable code is not centralized, but rather also cut-and-pasted into every page/programs where those functions are necessary.

The main feature of WebSmart v11 is Bootstrap. Bootstrap is a CSS/js UI framework (web design template) that has grown exponentially in popularity because it makes sites responsive to screen resolution (i.e. responsive design), and as such, makes web pages very mobile-friendly. Exware designed medicinecentre.com with Bootstrap. Bootstrap is similar to jQuery in that they are both web frameworks, but they do not interfere with each other. In fact, Bootstrap requires jQuery as a dependency. Keep in mind that jQuery UI however does somewhat overlap with Bootstrap (buttons, modals/pop-ups, datepicker, typeahead), and so in areas where they do overlap, Bootstrap will be used in place of jQuery UI.

When it comes to developing new WebSmart programs or adding functionality to existing ones, I have been redesigning the entire page/program with Bootstrap (unless the change is very small). Rather than copy-and-pasting existing programs, I study the program logic instead (the PML), and migrate that over to new source code started from scratch, while scrapping the old HTML/CSS.

Note: Programs developed in this manner are prefixed with IN2.

Notes

Code standardization

Google Analytics - PML include

Google Analytics (GA) is a service that allows you to track and analyze web usage. Read more about the implementation of GA at uniPHARM here. While the tracking code is just a small HTML snippet invoking a Javascript function to send data to GA servers, the fact that we have a test and production environment complicates things. Basically, we use just one WebSmart source file for every program and to achieve two copies we simply compile it into two different objects residing in different environments. Meanwhile, the GA tracking code must be unique to report different statistics for the dev and production environments (yes, both are tracked separately).

Therefore, a PML function should be included in every page as follows:

func z_ga(){
 if (scanstr("WEBDEVP",pgmf_pgmlib) <> 0){
  include("/webroot/unipharm/in2/includes/in2_ga_dev.html");
 }
 else if (scanstr("WEBPRDP",pgmf_pgmlib) <> 0){
  include("/webroot/unipharm/in2/includes/in2_ga_prd.html");
 }
 else return;	
}

This PML function is invoked in the HTML header.

JSON

WebSmart is including more and more JSON functionality with every release, and this will allow Infonet development to have more web-service/API-based functionality. The intent will be to do stuff like make customer names and numbers clickable wherever they exist, which in turn will call (through AJAX) a central program that will return customer information via JSON.

The development for that has started in in2_srvapi.pgm.

SQL PML functions

Polymorphism in sqlexec

There are two main PML query functions - sqlquery and sqlexec, with the latter being polymorphic. Polymorphism, in this context, can be best described as when a field/column in a table has the same name as a PML variable/work field. For example, the table UWDASWPRDD.XXITEMP has the column/field "ITPRDC", but when working with the file in WebSmart, ITPRDC also becomes a programming variable. _{(P.S. I'm dating myself by explaining this here - no one is ever going to read this. In fact, I'll give you $5 if you're reading this. Just come and ask me for $5. I'll know exactly what you're talking about.)}

The syntax for working with polymorphic names, sqlexec is done through the following syntax (memorize this!):

sqlexec("select column1, column2 into :some_variable from some_table where POTATO=:POTATO")

I've forgotten this a million and one times.