Difference between revisions of "How Dialog Forms Work"

From truxwiki.com
Jump to navigation Jump to search
Line 37: Line 37:
 
|-
 
|-
 
|}
 
|}
 
== Main Files ==
 
 
::{| class="wikitable"
 
! File
 
! Summary
 
! Path
 
|-
 
| ReportSection.xaml
 
| This view has a WebBrowser element that displays the HTML. It's loaded using the Binding HTMLReport.Stream
 
| \Truxton\Client\TruxtonClient\TruxtonClient\Templates\ReportSection.xaml
 
|-
 
| ReportSectionViewModel.cs
 
| This is the ViewModel for the ReportSection
 
| \Truxton\Client\TruxtonClient\TruxtonClient\ViewModels\Reports\ReportSectionViewModel.cs
 
|-
 
| HTMLReportViewModel.cs
 
| This is where the report-generating functions are called in loadReportContent
 
| \Truxton\Client\TruxtonClient\TruxtonClient\ViewModels\Reports\HTMLReportViewModel.cs
 
|-
 
|}
 
 
 
=== HTMLReportViewModel.cs ===
 
 
::In the <b>loadReportContent</b> function,
 
 
::the relevant reportFactory is selected.
 
 
<div style="display:flex;justify-content:center;"> 
 
{| class="wikitable"
 
! loadReportContent
 
|-
 
|
 
  var reportFactory = _ctx.ReportService.GetReportFactory(req.ReporterID);
 
|-
 
|}
 
</div>
 
 
::Then, the report is generated resulting in a ITruxtonReport.
 
 
<div style="display:flex;justify-content:center;"> 
 
{| class="wikitable"
 
! loadReportContent
 
|-
 
|
 
  var report = await reportFactory.GenerateAsync(req.ReportConfig, req.CTS.Token);
 
|-
 
|}
 
</div>
 
 
::Next, the reportContent(HTML) is generated resulting in a string that contains the HTML.
 
 
<div style="display:flex;justify-content:center;"> 
 
{| class="wikitable"
 
! loadReportContent
 
|-
 
|
 
  string reportContent = await report.GetReportContentAsync(req.CTS.Token);
 
|-
 
|}
 
</div>
 
 
::Eventually, the string is converted into a stream then assigned so that it's available for dataBinding.
 
 
<div style="display:flex;justify-content:center;"> 
 
{| class="wikitable"
 
! loadReportContent
 
|-
 
|
 
  Stream = req.Stream;
 
|-
 
|}
 
</div>
 
 
::For quick reference, the databinding can be found in <b>ReportSection.xaml</b>.
 
 
<div style="display:flex;justify-content:center;"> 
 
{| class="wikitable"
 
! ReportSection.xaml
 
|-
 
|
 
  <controls:WebBrowser x:Name="WebBrowser" Stream="{Binding <b>HTMLReport.Stream</b>}" />
 
|-
 
|}
 
</div>
 
 
::Here's the full snippet of loadReportConent with the relevant code.</b>.
 
 
<div style="display:flex;justify-content:center;"> 
 
{| class="wikitable"
 
! loadReportContent
 
|-
 
|
 
  var reportFactory = _ctx.ReportService.GetReportFactory(req.ReporterID);
 
    if (reportFactory != null)
 
    {
 
        var report = await reportFactory.GenerateAsync(req.ReportConfig, req.CTS.Token);
 
        report.ReportFormatter = ReportFormatter;
 
        string reportContent = await report.GetReportContentAsync(req.CTS.Token);
 
        if (!req.CTS.Token.IsCancellationRequested)
 
        {
 
            var bytes = Encoding.UTF8.GetBytes(reportContent);
 
            req.Stream = new CancellableStream(bytes);
 
            Stream = req.Stream;
 
   
 
            string message = getActionMessage(req, reportFactory.Name);
 
            await _ctx.InvestigationContext.AddActionAsync(message, CancellationToken.None);
 
        }
 
    }
 
|-
 
|}
 
</div>
 

Revision as of 11:43, 22 November 2021

This page documents how the Dialog Forms in Truxton work, or forms that pop up in a modal window work.

UI Guide Menu

  1. Entry Point
  2. Navigation and Routing
  3. Databinding
  4. Dependency Injection
  5. Task Bar Icon
  6. Truxton CLI options
  7. How Reports are Displayed
  8. How Dialog Forms Work

Overview

In the Truxton Analyst App, there are a few pages that have forms to add or update data related to that page. A few examples include: Subjects, Media, and Investigator.
Generally, to change data related to those models, you would go to that page, click a button that opens a form, change the data, and click the button when you are done. When this happens, there are a lot of things happening behind the scenes. A lot of it abstracted out so that there is a centralized code for the common functionality.
For each model, there is a "-PageViewModel", "-Form", "-ViewModel", "-.xaml".
Resource Summary
PageViewModel.cs This class loads and manages the data on the page, the view that you look at when you navigate using the navigation menu.
Form.cs This class loads and manages the data on the Dialog Form, the form that you see when you're on the page and you click the "add" or "new" button. The xaml bindings are here mostly. The FormItems properties are loaded here but they are not defined here. This class also converts the FormItem model to the main Model.
ViewModel.cs This class defines the Model for the FormItem. The FormItem is the model loaded by -Form.cs that contains all the data from the UI.
.xaml Found in Templates/Forms, this xaml defines the form UI. Not to be confused with the View's xaml which may be later added into this wiki.