Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

The HTML reports give you a lot of possibilities and flexibility. You can generate and customize any type of report with the help of the SIL™ Template language . Basically, as its name suggests, you are building your report based on a html template and injecting your data using Simple Issue Language™ (SIL) syntax. 

Configuring SIL Reporting Gadget

First you need to add the SIL Reporting Gadget to your dashboard. To do that, click Add new gadget. In the Add new gadget dialog, click Load all gadgets. Search for the SIL Reporting Gadget and add it to your dashboard.

...

If you want to return information about another project without having to configure the gadget, all you have to do is add a field for the project using one of the routines for creating fields from gadget routines. After that you will be able to set parameter in the parameter section and run the report with the new value.

...

Anchor
Examples
Examples
Examples

Opened vs Closed Issues Report 

The report is a bar chart showing the number of opened issues vs number of resolved issues for a given list of projects. 

Code Block
$!
string [] project = argv[0];
int resolvedIssues = countIssues("project = " + project  + " AND status in (Done, Closed, Resolved)");
int openedIssues = countIssues("project = " + project  + " AND status not in (Done, Closed, Resolved)");
int totalIssues = resolvedIssues + openedIssues;

int prResolved = round(resolvedIssues/totalIssues * 100, 2);
int prOpened = round(openedIssues/totalIssues * 100, 2);
$

<html>
<head>
<style type="text/css">
body{
  background:#ededeb;
}
  
.report{
    font-family: 'Source Sans Pro', sans-serif;
    color: white;
    box-shadow: none;
    display: -webkit-inline-box;
}
.report ul{
    margin:0px 30px 10px 0px;
    padding:0;
    list-style-type:none;
    font-size:11px;
    font-weight:400;
    line-height:20px;
    }
.report_box{
    width: 85%;
    background: #42526e;
    float: left;
    box-shadow: -1px 0px rgba(255, 255, 255, 0.07);
    cursor: pointer;
    transform: scale(1);
    transition-property: transform,background;
    transition-duration: .3s;
    max-width: -webkit-fill-available;
}
.report_box_inner{
    padding:30px;
}
.report_box_inner span{
    font-size:36px;
    font-weight:700;
}
.progress{
    width:100%;
    margin-top:10px;
    height:6px;
    background:rgba(0, 0, 0, 0.3);
    margin-bottom:15px;
}
.progress_bar_opened{
    height:6px;float:left;
    width:58%;
    background:#e4da57;
    -webkit-animation:bar 2s;
}
.progress_bar_closed{
    height:6px;float:left;
    width:78%;
    background:#1c9c6b;
    -webkit-animation:bar2 2s;
}  
      
.report_box_inner h2{
    font-weight:normal;
    color: white;
    font-size:16px;
    margin:-4px 0px 3px 0px;
}
.report_box_inner p{
    font-size:11px;
    color:rgb(182, 182, 182);clear: left;
    font-weight:300;
    width:160px;
    margin:2px 0px 15px 0px;
}
    

</style>
</head>
<body>
<div class='report'>
  <div class='report_box'>
    <div class='report_box_inner'>
      <h2>
        Opened issue in $project$
      </h2>
      <div class='stat'>
        <span>$prOpened$</span>
      </div>
      <div class='progress'>
        <div class='progress_bar_opened'></div>
      </div>
      <p>This is a simple example. You can render any html and do everything you want.</p>
    </div>
  </div>
  <div class='report_box'>
    <div class='report_box_inner'>
      <h2>
        Closed issue in $project$
      </h2>
      <div class='stat'>
        <span>$prResolved$ %</span>
      </div>
      <div class='progress'>
        <div class='progress_bar_closed'></div>
      </div>
      <p>This is a simple example. You can render any html and do everything you want.</p>
    </div>
  </div>
</div>

</body>
</html>

...

Report

Include Page
Opened vs Closed Issues Report
Opened vs Closed Issues Report