Work on db issues and dev docs

CHANGELOG.md

@@ -11,6 +11,8 @@
 - Editor fixes
   - Fixed an issue causing editor content region to be untouchable when window was narrow. [#1940](https://github.com/Tangerine-Community/Tangerine/issues/1940)
   - Improved CSV output so it now contains Release ID, Device ID, and Build Channel on every row [#349](https://github.com/Tangerine-Community/Tangerine/issues/349)
+- Developer notes
+  - We focused on issues with slow performance on tablets when viewing forms. We are caching important configuration files (app-config.json, forms.json, location-list.json) and the Roboto font and have reduced redundant rendering calls. More information in the [Globals doc](./docs/developer/tangerine-globals.md).  
 - Server Admin notes
   - We cleaned up config variables in `config.sh`, deprecated `T_ADMIN` and `T_PASS` [#1986](https://github.com/Tangerine-Community/Tangerine/pull/1986)
   - New `generate-cases` command for load testing a large number of Cases based on your custom content in a group. [#1993](https://github.com/Tangerine-Community/Tangerine/pull/1993) 
@@ -30,7 +32,6 @@ vim -O config.sh config.sh_backup
 # Now you are ready to start the server.
 ./start.sh v3.8.1
 ```
-
 ## v3.8.0
 v3.8.0 is a big and exciting release! To accomodate the long list of changes, we split up this round of release notes into sections: General, Sync Protocol 2 Module, and Case Module, and Developer notes.
 

client/src/app/case/components/event-form-list-item/event-form-list-item.component.ts

@@ -47,13 +47,15 @@ export class EventFormListItemComponent implements OnInit {
   async ngOnInit() {
     const response = await this.formService.getResponse(this.eventForm.formResponseId)
     const getValue = (variableName) => {
-      const variablesByName = response.items.reduce((variablesByName,item) => {
-        for (let input of item.inputs) {
-          variablesByName[input.name] = input.value
-        }
-        return variablesByName
-      }, {})
-      return !Array.isArray(variablesByName[variableName]) ? variablesByName[variableName] : variablesByName[variableName].reduce((optionThatIsOn, option) => optionThatIsOn = option.value === 'on' ? option.name : optionThatIsOn, '')
+      if (response) {
+        const variablesByName = response.items.reduce((variablesByName,item) => {
+          for (let input of item.inputs) {
+            variablesByName[input.name] = input.value
+          }
+          return variablesByName
+        }, {})
+        return !Array.isArray(variablesByName[variableName]) ? variablesByName[variableName] : variablesByName[variableName].reduce((optionThatIsOn, option) => optionThatIsOn = option.value === 'on' ? option.name : optionThatIsOn, '')
+      }
     }
     const getCaseVariable = (variableName) => {
       const variablesByName = this.case.items.reduce((variablesByName,item) => {

client/src/app/shared/_services/search.service.spec.ts

@@ -40,8 +40,8 @@ class MockUserService {
 class MockAppConfigService {
   getAppConfig() {
     return {
-      sharedUserDatabase: false 
-    } 
+      sharedUserDatabase: false
+    }
   }
 }
 
@@ -57,6 +57,7 @@ class MockFormsInfoService {
         description: 'test test',
         type: 'form',
         listed: true,
+        archived: false,
         title: 'Example',
         searchSettings: <FormSearchSettings>{
           shouldIndex: true,

develop.sh

@@ -67,10 +67,6 @@ else
   echo "You have no config.sh. Copy config.defaults.sh to config.sh, change the passwords and try again." && exit 1;
 fi
 
-#
-# Set up couchdb.
-#
-
 T_COUCHDB_ENDPOINT="http://$T_COUCHDB_USER_ADMIN_NAME:$T_COUCHDB_USER_ADMIN_PASS@couchdb:5984/"
 
 docker build -t tangerine/tangerine:local .

docs/developer/viewing-forms-and-data.md

@@ -6,3 +6,76 @@ Use TangyFormService to retrieve form definitions and response data:
     this.formResponse = await this.tangyFormService.getResponse(this.eventForm.formResponseId)
     const tangyFormMarkup = await this.tangyFormService.getFormMarkup(this.eventFormDefinition.formId)
 ```
+
+But there are other ways of getting data out of Tangerine. First you need to see where you are getting data from.
+
+## Mapping of components to forms
+
+EventFormListItemComponent - listing of forms in an event
+CaseEventListItemComponent - listing of events (such as Followup ANC Visits) in a case.
+
+## Helper functions already in components
+
+In the component for a list, helper functions may already expose the properties you need to populate a template. In EventFormListItemComponent, notice the variable exposed:
+
+```js
+    const response = await this.formService.getResponse(this.eventForm.formResponseId)
+    const getValue = (variableName) => {
+// more code inside getValue();
+      }, {})
+// snip
+    const caseInstance = this.case
+    const caseDefinition = this.caseDefinition
+    const caseEventDefinition = this.caseEventDefinition
+    const caseEvent = this.caseEvent
+    const eventForm = this.eventForm
+    const eventFormDefinition = this.eventFormDefinition
+    const formatDate = (unixTimeInMilliseconds, format) => moment(new Date(unixTimeInMilliseconds)).format(format)
+    const TRANSLATE = _TRANSLATE
+    eval(`this.renderedTemplateListItemIcon = this.caseDefinition.templateEventFormListItemIcon ? \`${this.caseDefinition.templateEventFormListItemIcon}\` : \`${this.defaultTemplateListItemIcon}\``)
+    eval(`this.renderedTemplateListItemPrimary = this.caseDefinition.templateEventFormListItemPrimary ? \`${this.caseDefinition.templateEventFormListItemPrimary}\` : \`${this.defaultTemplateListItemPrimary}\``)
+    eval(`this.renderedTemplateListItemSecondary = this.caseDefinition.templateEventFormListItemSecondary ? \`${this.caseDefinition. v}\` : \`${this.defaultTemplateListItemSecondary}\``)
+```
+If there is not a response for a form, response will be false; therefore, if you do a getValue() in your template, be sure to test if response is true. 
+
+If you wish to display the startDatetime in your template, note that is is part of the response object - it is returned as response.startDatetime. In other cases - for values inside the form - use getValue(variableName) - but test if response is true first! Also, remember that the variableName is one of the id's in the inputs array, which is inside each item in the items array. 
+
+## Testing your templates
+
+Here's an easy way to test your template code: in the js console, use the copy() function to copy the value for your template:
+
+```js
+copy(this.caseDefinition.templateEventFormListItemSecondary)
+```
+Then add the fields or functions you need. In this case, I'm adding a getValue:
+
+```js
+`<t-lang en>Status</t-lang><t-lang fr>Statut</t-lang>: ${!eventForm.complete ? '<t-lang en>Incomplete</t-lang><t-lang fr>Incomplète</t-lang>' : '<t-lang en>Complete</t-lang><t-lang fr>Achevée</t-lang>'} ${response ? `Version: ${getValue("content_release_version")}`: ''}`
+```
+
+Output:
+```js
+"<t-lang en>Status</t-lang><t-lang fr>Statut</t-lang>: <t-lang en>Complete</t-lang><t-lang fr>Achevée</t-lang> Start date: 3/13/2020, 11:25:19 AM"
+```
+
+Note that I was testing for existence of response, and also nesting templates to show the "Version" text if there was a value for content_release_version.
+
+Another example:
+
+`<t-lang en>Status</t-lang><t-lang fr>Statut</t-lang>: ${!eventForm.complete ? '<t-lang en>Incomplete</t-lang><t-lang fr>Incomplète</t-lang>' : '<t-lang en>Complete</t-lang><t-lang fr>Achevée</t-lang>'} ${response ? `Start date: ${response.startDatetime}`: ''}`
+
+## debugging templates
+
+To make the dev tool stop on a breakpoint in a Case Definition's template, add the following debugger statement to the content of the template.
+
+```js
+${(()=>{debugger})()}
+```
+
+![alt text](assets/template-debugger.png "Template debugger")
+
+When that template loads, the Chrome devtools will pause and you can inspect local variables/functions available and try running them in the console. Note that different templates will have different helper functions and variables available.
+
+![alt text](assets/inspect-helper-functions.png "Inspect Helper Functions")
+
+