Versions Compared

Old Version 14

changes.mady.by.user Anders Axelsson

Saved on

compared with

New Version 15

changes.mady.by.user Anders Axelsson

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Panel
panelIconId1f3af
panelIcon:dart:
panelIconText🎯
bgColor#DEEBFF

Chapter goals

In this chapter you will learn the basics on how to install and setup widget box pro (tvc helium widgetsconfigurable TVC Helium widget framework), deploy a widget and make some basic modifications to it. You will also learn where to find documentation, examples, installers & license.

Prerequisites

  • Access to a 3DEXPERIENCE dev env (tomee 3dspace exploded web app)

  • Basic xml understanding

  • Optional IDE (vscode, eclipse or similar)

...

The installers adds web resources to 3dspace (schema is optional schema, but required for live UI configuration etc). The web resources includes jar files, js, html, css etc. A servlet is registered with the web.xml.

...

Panel
panelIconId1f446
panelIcon:point_up_2:
panelIconText👆
bgColor#F4F5F7

Exercise 2 - Installation result and Setup

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

    • Search “tvc”, you should find an added servlet definition, mapping etc. <SCREENSHOT>

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

    • Copy below code snippet with minimal setup (used for automatic routing based on object type, more info in docs)

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

    • Copy below code snippet (dev mode, debug logs, user agent, more properties found in docs)

  • (Optional) Locate all installed resources

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

    • ‘3dspace/tvc' (legacy classic component jsp’s)

    • ‘3dspace/helium'

    • ‘3dspace/webapps/helium'

    • ‘3dspace/WEB-INF/tvc*.tld'

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

  • Start server (3dpsace tomee) and find tvc system init in logs <SCREENSHOT>

  • (Optional) Launch log watcher (require admin user) <URL>

WEB-INF/classes/Helium.xml sample

Code Block
<TODO/>

WEB-INF/classes/tvc.properties sample

Code Block
tvc.TODO=debug
tvc.TODO=false
tvc.TODO=User Agent
tvc.TODO=secret123

...

Panel
panelIconId1f446
panelIcon:point_up_2:
panelIconText👆
bgColor#F4F5F7

Exercise 3 - Deploy a widget

  • Download and deploy Issues widget. <issue-widget.zip>

    • view, consider and understand all file content, issue vs common domain

  • Expand zip to ‘3dspace/WEB-INF/tvc’

  • json widget spec < 3dspace PATH>

  • Go to 3ddashboard → platform management → add app

    • Add widget <SCREENSHOT><URL>

  • Find app in compass, add to a dashboard and test it <SCREENSHOT>

json sample

Code Block
<TODO/>

Basic Configuration

Panel
panelIconId1f446
panelIcon:point_up_2:
panelIconText👆
bgColor#F4F5F7

Exercise 4 - Modify widget configuration

  • Add attribute Priority column (consider domain common or issues) <docs link>

  • Using xsd schema and IDE validation support? <xsd link>

  • Add related data (assignee? or CR?Assignee and Change Request) <docs link>

  • Add built in template for fancy Priority rendering example reference <docs link>

  • Modify data set to exclude closed issues ? (or elaborate) <docs link>

  • Add command using calling ootb service invoke <docs link>

  • Add priority Priority pie chart <docs link>

  • TEST all steps incrementally or at the end <SCREENSHOT>

  • (Optional misconfigure ) Misconfigure xml and use tvc log watcher to find details

Attribute

Code Block
<boilerPlate/>

XSD validation with IDE

Code Block
<boilerPlate/>

Related Assignee and CR inc group header

Code Block
<boilerPlate/>

Style cell using built-in handlebar template

Code Block
<boilerPlate/>

Modify Data set to exclude closed issues

Code Block
<boilerPlate/>

Toolbar command to add CR using service invoke

Code Block
<boilerPlate/>

Add priority pie

Code Block
<boilerPlate/>

Create Issue Configuration

Panel
panelIconId1f446
panelIcon:point_up_2:
panelIconText👆
bgColor#F4F5F7

Exercise 5 - Add issue create form

Add toolbar command <docs link>

Add form config <docs link>

TEST <SCREENSHOT>

Toolbar sample

Code Block
<boilerPlate/>

Create form sample

Code Block
<boilerPlate/>

HEX / Launch Pads

Panel
panelIconId1f446
panelIcon:point_up_2:
panelIconText👆
bgColor#F4F5F7

Exercise 6 - Download, expand zip and reference a specific HEX / Launch Pad

Instructions <docs link>

Useful as runnable documentation or real project templates

Code Block
<boilerPlate/> or json

Studio - Live widget configuration using UI (In-app designer)

...