Exercise 1 - Install product

1. Go to https://products.technia.com and download the latest Helium installers. Use customer license file or generate a time limited developers license.

2. Stop TomEE

3. Install Helium

   • Include ‘Structure Browser’ & 'Graphic Reporting'

Exercise 2 - Installation result and Setup

1. ‘3dspace/WEB-INF/web.xml’

   • Search “tvc”, you should find an added servlet, filter, mapping etc.

2. ‘3dspace/WEB-INF/classes/helium.xml’

   • Copy below minimal setup code snippet (used for object routing etc)

3. ‘3dspace/WEB-INF/classes/tvc.properties'

   • Copy below properties, remove conflicts from ‘web.xml’

4. Locate all installed resources

   • ‘3dspace/WEB-INF/lib/tvc*.jar

   • ‘3dspace/webapps/HETrueWidget'

   • ‘3dspace/webapps/tvc'

   • ‘3dspace/WEB-INF/classes/technia.license'

   • ‘3dspace/WEB-INF/tvc' (configs go here in next step)

5. With the current release a manual bug fix is needed, expand the

   View file
   name trainingjs.zip

   fix in ‘3dspace/webapps/HETrueWidget/helium/custom/hex'

6. Start server (3dspace TomEE)

   1. Verify that TVC system initialize correctly in logs (see above screenshot for reference)

7. (Optional) Useful actions

   1. Clear cache (required in production mode): ‘/3dspace/tvc-action/clearCache’

   2. Set log levels runtime: ‘/3dspace/tvc-action/setLogLevel?logLevel=INFO’

   3. Monitor status & set runtime param: ‘/3dspace/tvc-action/monitorStatus’

   4. List all actions: ‘/3dspace/tvc-action/showActionMappings’

   5. MQL client: ‘/3dspace/tvc-action/MQLClient’

   6. Logs: '/3dspace/tvc/core/tvcLogWatcher.jsp'

   7. User persistence data: '/3dspace/tvc-action/tcm-showDataObjects'

<?xml version="1.0" encoding="UTF-8"?>
<Application xmlns="http://technia.com/helium/Application">
  <DateFormat>YYYY-MM-DD</DateFormat>
  <DateTimeFormat>YYYY-MM-DD hh:mm</DateTimeFormat>
</Application>

tvc.core.logLevel=DEBUG
tvc.core.productionMode=false
tvc.core.user=User Agent
tvc.core.password=secret123
tvc.3ddashboard.showEndUserConfigObjects=false
tvc.3ddashboard.searchanddrop.enable=true
tvc.helium.theme.3ddashboard=3dd

Exercise 3 - Deploy a widget

1. Download issues widget

   View file
   name training-1.zip

2. Expand zip to ‘3dspace/WEB-INF/tvc/training’

   1. View, consider and understand overall file structure.

   2. Reflect on domains ‘training/common’ vs ‘training/issue’.

   3. Find and reflect on the template reference in the originated column

3. Specify widget in JSON and deploy it somewhere reachable by 3ddashboard e.g. '3dspace/webapps/HETrueWidget/config'.

   1. Use “Sample JSON” code snippet below

4. 3DDashboard Helium widget docs: 3DDashboard → Platform Management → Add app (Source code URL: https://<BASE_URL>/3dspace/webapps/HETrueWidget/heliumWidget.html, Configuration file URL: PATH TO JSON)

5. Find the app in compass, add to a dashboard and test it! (should look like above screenshot)

{
	"id": "training-issues",
	"title": "Training Issues",
	"path": "/goto/d/",
	"parameters": "tvc:dashboard:training:issue/IssuesDashboard.xml",
	"custom": "true"
}

Folder structure notice

Note that there is a difference between the structure of configuration xml references and the folder structure.

Config reference: 'tvc:<CONF_TYPE>:<DOMAIN>:<SUB_1>:<SUB_N>:<FILE>.xml’

Folder structure: ‘tvc/<DOMAIN>/<SUB_1>/<SUB_N>/<CONF_TYPE>/<FILE>.xml’

Exercise 4 - Modify widget configuration

It is recommended to TEST all below steps incrementally (refresh widget in dev mode)

1. Open 'WEB-INF/tvc' with an IDE, setup to use .xsd schema support, validate and autocomplete

2. Add Priority column (copy an existing column, use issue domain, reflect why, Column configuration docs).

   1. Add auto colour template (see state column) Auto Colouring Docs

   2. Click an edit a cell value

3. Add related data column e.g. 'from[Technical Assignee].to.name' (copy column type from owner), and/or Affected Item, Resolved By multiple properties

4. Modify Data set to exclude closed issues (see docs link and elaborate, maybe past year only..).

5. Chart configuration (copy paste state chart)

   1. Priority pie

      1. Note the matching table value colour mapping

   2. Owner bar

   3. Originated line

   4. Position the new widgets in a good layout (client reset might be needed) Image Added

6. Drag drop to OOTB widget

   1. PHYSICALID REQUIRED! use data set select as object id is default.

   2. see below boiler plate and drag drop docs in name column, add lifecycle widget and drop an issue

7. Create issue using OOTB service (Invoke service command, DS docs docs)

   1. Create servicecommand folder

   2. Create a file with the below service command code snippet

   3. Refer the definition form IssuesTableWidget toolbar <ServiceCommand ref="tvc:servicecommand:training1:issue/CreateIssue.xml"/>

8. Enable built in table settings (se below boiler plate inc data group, export, sort, filter….)

   1. Try data group by state column in the UI and other features

Expected config result after exercise:

<?xml version="1.0" encoding="UTF-8"?>
<Column xmlns="http://technia.com/TVC/Table" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
	xsi:schemaLocation="http://technia.com/TVC/Table http://products.technia.com/tvc/schema/latest/TableColumn.xsd">
	<Name>assignee</Name>
	<Label>Technical Assignee</Label>
	<Expression>from[Technical Assignee].to.name</Expression>
	<HeaderNoWrap>true</HeaderNoWrap>
	<Editable>false</Editable>
	<ColumnType>helium-user</ColumnType>
</Column>

<DataSet
    xsi:schemaLocation="http://technia.com/TVC/DataSet http://products.technia.com/tvc/schema/latest/DataSet.xsd"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 	xsi:schemaLocationxmlns="http://technia.com/TVC/Table http://products.technia.com/tvc/schema/latest/TableColumn.xsd">
	<Name>assignee</Name>
	<Label>Technical Assignee</Label>
	<Expression>from[Technical Assignee].to.name</Expression>
	<HeaderNoWrap>true</HeaderNoWrap>
	<Editable>false</Editable>
	<ColumnType>helium-user</ColumnType>
</Column>

<Draggable>true</Draggable>
<Setting name="template" value="helium/templates/table/object-link" />

<DataSet
    xsi:schemaLocation="http://technia.com/TVC/DataSet http://products.technia.com/tvc/schema/latest/DataSet.xsd"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://technia.com/TVC/DataSet">
    <Query>
        <TypePattern>
            <Type>type_Issue</Type>
        </TypePattern>
        <Where>current!=Closed</Where>
        <Select>physicalid</Select>
    </Query>
</DataSet>

<ServiceCommand>
    <Label>Create</Label>
    <FontIcon>ti-c ti-add</FontIcon>
    <Setting name="templateOnClick" value="helium/templates/table/object-linkApp.dataTable.invokeServiceCall" />

<DataTable>
...
	<Toolbar>
	...
		<DataGroup/>
		<ExportExcel />
		<ExportPDF />
		<Search />
		<ToggleColumnVisibility />
		<AdvanceSorting />
	</Toolbar>
</DataTable>

Exercise 5 - Add issue create form

1. Add servicecommand & toolbar reference Toolbar Docs

2. Add form config Form Docs

Expected config result after exercise:

<DataTable>
...
	<Toolbar>
	...
		<ServiceCommand ref="tvc:servicecommand:training:issue/CreateIssueByForm.xml" />
	</Toolbar>
</DataTable>

<ServiceCommand>
    <Label>Create Issue Form</Label>
    <FontIcon>ti-c ti-plus</FontIcon>
    <Setting name="OnClick" value="App.dataTable.invokeServiceCall" />
    <Setting name="OnClickParams">{
		"macro":"false",
        "macroElements":"",
		"selectionCriteria": "none",
		"form":{
		     "options":{
		                 "formConfigName": "tvc:form:training:issue/CreateIssueForm.xml",
		                  "fullscreen":true,
		                 "modal":{
		                          "position":{"top":"30%","bottom":"20%","left":"40%","right":"10%"},
		                          "controls":{"dock":true,"expand":true,"close":true}
		                          }
		      },
		     "url":  "resources/v1/modeler/dsiss/issue",
		     "body":{"type": "Issue", "description":"{{description.values[0].value}}","priority": "{{priority.values[0].value}}"},
		     "method":"POST",
		     "options":{
		addSecurityContext": true,
             "addCsrfToken": "true",
		     "formConfigNamebodyResolver": "tvc:form:training:issue/CreateIssueForm.xml",description.values[0].value,priority.values[0].value"
		}
		}</Setting>    
</ServiceCommand>

<Form>
    <Title>Create   Issue</Title>
   "fullscreen":true,
		 <Layout>
        <Columns>1</Columns>
    </Layout>
  "modal":{ 		 <Section>
        <Field id="description">
              "position":{"top":"30%","bottom":"20%","left":"40%","right":"10%"},
		<Label>Description</Label>
            <Editable>true</Editable>
            <FieldType>textarea</FieldType>
      "controls":{"dock":true,"expand":true,"close":true} 		 </Field>
        <Field id="priority">
            <Label>Priority</Label>
 } 		      }, 		   <Editable>true</Editable>
 "url":  "resources/v1/modeler/dsiss/issue", 		     "body":{"type": "Issue", "description":"{{description.values[0].value}}","priority": "{{priority.values[0].value}}"},
		 <FieldType>select</FieldType>
         "method":"POST", 		  <Defaults>
  "addSecurityContext": true,             <Value value="addCsrfTokenLow": selected="true",>
  		     "bodyResolver": "description.values[0].value,priority.values[0].value" 		} 		}</Setting>     </ServiceCommand>