gerrit.onap Code Review - portal/sdk.git/blob

   1 <style>
   2 table tbody td {
   3     border: none;
   4 }
   5
   6 table tbody tr {
   7     border: none;
   8 }
   9
  10 table{
  11     border: none;
  12     margin-bottom:0px;
  13 }
  14
  15 #RangeTable{
  16         margin-top: 5px;
  17         border: 1px solid black;
  18 }
  19 </style>
  20
  21 <div id="page-content">
  22 <h1 class="heading-page">Report Chart Configuration</h1>
  23 <!-- <div style="color:#2ca02c" ng-show="successSubmit">Your configurations have been successfully submitted</div> -->
  24
  25
  26
  27 <div>
  28 <table>
  29         <thead>
  30             <tr>
  31                 <th width="30%">Chart Type</th>
  32                 <th>Animate</th>
  33             </tr>
  34         </thead>
  35
  36     <tbody>
  37         <tr>
  38             <td>
  39                                 <select name="chartType" b2b-dropdown ng-model="reportRunJson.chartTypeJSON.value" placeholder-text="Select">
  40                                         <option b2b-dropdown-list option-repeat="d in chartTypeOptions" value="{{d.value}}">{{d.text}}</option>
  41                     </select>
  42             </td>
  43             <td>
  44                 <label for="animateCheckbox" class="checkbox">
  45                     <input id="animateCheckbox" type="checkbox" ng-model="reportRunJson.animation" /><i class="skin"></i><span></span>
  46                 </label>
  47                         </td>
  48         </tr>
  49     </tbody>
  50 </table>
  51
  52 <table>
  53         <thead>
  54             <tr>
  55                 <th width="50px">Width (px)</th>
  56                 <th>Height (px)</th>
  57             </tr>
  58         </thead>
  59     <tbody>
  60         <tr>
  61             <td>
  62             <input type="text" name="displayName" ng-model="reportRunJson.width" style="width:100px;">
  63             </td>
  64             <td>
  65             <input type="text" name="displayName" ng-model="reportRunJson.height" style="width:100px;">
  66             </td>
  67         </tr>
  68     </tbody>
  69 </table>
  70
  71 <table>
  72         <thead>
  73             <tr>
  74                 <th width="50px">Title</th>
  75             </tr>
  76         </thead>
  77     <tbody>
  78         <tr>
  79                 <fieldset role="radiogroup" radio-group-accessibility>
  80             <td>
  81             <label for="optionsRadiosShowTitleTrue" class="radio">
  82                 <input type="radio" ng-model="reportRunJson.showTitle" id="optionsRadiosShowTitleTrue" name="optionsRadiosShowTitleTrue" value="true">
  83                 <i class="skin"></i>
  84                 <span>Show</span>
  85             </label>
  86             </td>
  87             <td>
  88             <label for="optionsRadiosShowTitleFalse" class="radio">
  89                 <input type="radio" ng-model="reportRunJson.showTitle" id="optionsRadiosShowTitleFalse" name="optionsRadiosShowTitleFalse" value="false">
  90                 <i class="skin"></i>
  91                 <span>Hide</span>
  92             </label>
  93             </td>
  94             </fieldset>
  95         </tr>
  96
  97     </tbody>
  98 </table>
  99
 100 <table>
 101         <thead>
 102             <tr>
 103                 <th width="30%">Domain Axis</th>
 104                 <th  width="30%">Category</th>
 105                 <th  width="40%"></th>
 106             </tr>
 107         </thead>
 108     <tbody>
 109         <tr>
 110             <td>
 111                                 <select name="chartType" b2b-dropdown ng-model="reportRunJson.domainAxisJSON" placeholder-text="Select">
 112                                         <option b2b-dropdown-list option-repeat="d in reportRunJson.chartColumnJSONList" value="{{d.value}}">{{d.title}}</option>
 113                     </select>
 114             </td>
 115             <td>
 116                                 <select name="chartType" b2b-dropdown ng-model="reportRunJson.categoryAxisJSON" placeholder-text="Select">
 117                                         <option b2b-dropdown-list option-repeat="d in reportRunJson.chartColumnJSONList" value="{{d.value}}">{{d.title}}</option>
 118                     </select>
 119             </td>
 120         </tr>
 121     </tbody>
 122 </table>
 123
 124
 125         <div id="RangeTable">
 126
 127 <table ng-repeat="rangeReport in reportRunJson.rangeAxisList">
 128         <thead>
 129             <tr>
 130                 <th width="25%">Range Axis</th>
 131                 <th  width="10%">Y Axis</th>
 132                 <th  width="20%">Chart Title</th>
 133                 <th  width="22%">Color</th>
 134                 <th  width="18%">Line Type</th>
 135                 <th></th>
 136             </tr>
 137         </thead>
 138     <tbody>
 139         <tr>
 140             <td>
 141                                 <select name="chartType" b2b-dropdown ng-model="rangeReport.rangeAxisLabelJSON.value" placeholder-text="Select">
 142                                         <option b2b-dropdown-list option-repeat="d in reportRunJson.chartColumnJSONList" value="{{d.value}}">{{d.title}}</option>
 143                     </select>
 144             </td>
 145             <td>
 146                 <input type="text" name="displayName" ng-model="rangeReport.rangeYAxis" style="width:100px;">
 147             </td>            <td>
 148                 <input type="text" name="displayName" ng-model="rangeReport.rangeChartGroup" style="width:150px;">
 149             </td>
 150             <td>
 151                                 <select name="chartType" b2b-dropdown ng-model="rangeReport.rangeColorJSON" placeholder-text="Select">
 152                                         <option b2b-dropdown-list option-repeat="d in rangeColors" value="{{d.value}}">{{d.title}}</option>
 153                     </select>
 154             </td>
 155             <td>
 156                                 <select name="chartType" b2b-dropdown ng-model="rangeReport.rangeLineTypeJSON" placeholder-text="Select">
 157                                         <option b2b-dropdown-list option-repeat="d in lineTypes" value="{{d.value}}">{{d.title}}</option>
 158                     </select>
 159             </td>
 160             <td>
 161                 <button ng-show="$index==0" type="submit" style="width: 90px; height:35px;margin-left:5px;" class="btn btn-secondary btn-small" ng-click="addRangeAxisRow()">Add</button>
 162                 <button ng-hide="$index==0" type="submit" style="width: 90px; height:35px;margin-left:5px;" class="btn btn-secondary btn-small" ng-click="removeRangeAxisRow($index)">Remove</button>
 163             </td>
 164         </tr>
 165
 166     </tbody>
 167 </table>
 168 </div>
 169
 170 </div>
 171
 172 <div ng-show=false style="min-height:500px" data-ng-init="init()">
 173         <div class="fn-ebz-container" >
 174                 <label class="fn-ebz-text-label">Chart Type</label><BR>
 175                 <div class="form-field" att-select="chartTypes" ng-model="reportRunJson.chartTypeJSON" placeholder="Select an Option" show-input-filter="true" ng-change="actionClicked()"></div>
 176         </div>
 177
 178
 179         <div class="fn-ebz-container" style="position:relative; top: -8px;">
 180                 <label class="fn-ebz-text-label">Animate</label><BR>
 181                         <div><input type="checkbox" ng-model="reportRunJson.animation" att-checkbox data-ng-value="true"></div>
 182         </div>
 183         <BR>
 184
 185         <div class="fn-ebz-container" >
 186                 <label class="fn-ebz-text-label">Width (Px)</label><BR>
 187                 <input type="text"  name="chartWidth"  maxlength=4  only-digits ng-model="reportRunJson.width" style="width:80px"/>
 188         </div>
 189
 190         <div class="fn-ebz-container" >
 191                 <label class="fn-ebz-text-label">Height (Px)</label><BR>
 192                 <input type="text" name="chartHeight" maxlength=4  only-digits ng-model="reportRunJson.height" style="width:80px"/>
 193         </div>
 194         <BR>
 195
 196         <div class="fn-ebz-container">
 197                 <label class="fn-ebz-text-label">Title</label><BR>
 198                 <span><input  name="tle" type="radio" ng-model="reportRunJson.showTitle"  data-ng-value="true"/>Show</span>
 199                 <span><input name="tle" type="radio" ng-model="reportRunJson.showTitle" data-ng-value="false"/>Hide</span>
 200         </div>
 201         <BR>
 202
 203
 204         <div class="fn-ebz-container" >
 205                 <label class="fn-ebz-text-label">Domain Axis</label><BR>
 206                 <div class="form-field" att-select="reportRunJson.chartColumnJSONList" ng-model="reportRunJson.domainAxisJSON" placeholder="Select an Option" show-input-filter="true"></div>
 207         </div>
 208
 209         <div class="fn-ebz-container" >
 210                 <label class="fn-ebz-text-label">Category</label><BR>
 211                 <div class="form-field" att-select="reportRunJson.chartColumnJSONList" ng-model="reportRunJson.categoryAxisJSON" placeholder="Select an Option" show-input-filter="true"></div>
 212         </div>
 213         <BR>
 214
 215 <div style="border:2px;border-style:solid;border-color:#808080;margin-bottom:9px">
 216 <div ng-repeat="rangeReport in reportRunJson.rangeAxisList">
 217         <div style="margin-left:5px">
 218         <div class="fn-ebz-container">
 219                 <label class="fn-ebz-text-label">Range Axis</label><BR>
 220                 <div class="form-field" att-select="reportRunJson.chartColumnJSONList"
 221                         ng-model="rangeReport.rangeAxisLabelJSON" placeholder="Select an Option" show-input-filter="true"></div>
 222         </div>
 223
 224
 225         <div class="fn-ebz-container" >
 226                 <label class="fn-ebz-text-label">Y Axis</label><BR>
 227                 <input id="yaxs" type="text" name="yAxis" maxlength=50 ng-model=rangeReport.rangeYAxis style="width:100px"/>
 228         </div>
 229
 230         <div class="fn-ebz-container" >
 231                 <label class="fn-ebz-text-label">Chart Title</label><BR>
 232                 <input type="text" name="chartTitle"  maxlength=50 ng-model="rangeReport.rangeChartGroup" style="width:200px"/>
 233         </div>
 234
 235         <div class="fn-ebz-container" >
 236                 <label class="fn-ebz-text-label">Color</label><BR>
 237                 <div class="form-field" att-select="rangeColors" ng-model="rangeReport.rangeColorJSON" placeholder="Select an Option" show-input-filter="true"></div>
 238         </div>
 239
 240         <div class="fn-ebz-container" >
 241                 <label class="fn-ebz-text-label">Line Type</label><BR>
 242                 <div class="form-field" att-select="lineTypes" ng-model="rangeReport.rangeLineTypeJSON" placeholder="Select an Option" show-input-filter="true"></div>
 243         </div>
 244
 245         <div class="fn-ebz-container" ng-show="reportRunJson.chartTypeJSON.value=='FlexTimeChart' ||
 246                         reportRunJson.chartTypeJSON.value=='AnnotationChart'" style="position:relative; top: -8px;">
 247                 <label class="fn-ebz-text-label">Area</label><BR>
 248                 <input type="checkbox" ng-model="rangeReport.showAsArea" att-checkbox data-ng-value="true">
 249         </div>
 250
 251         <div class="fn-ebz-container" style="position:relative; top: 25px;">
 252         <a href="javascript:void(0)" ng-show="{{$index==0}}" style="float: right;" att-button btn-type="secondary" size="small" att-accessibility-click="13,32"
 253                         ng-click="addRangeAxisRow(rangeReport);" >Add</a>
 254         <a href="javascript:void(0)" ng-show="{{$index>0}}" style="float: right;" att-button btn-type="secondary" size="small" att-accessibility-click="13,32" ng-click="removeRangeAxisRow($index);" >
 255                         Remove</a>
 256           </div>
 257           </div>
 258          </div>
 259         </div>
 260         <BR>
 261
 262 <accordion close-others="true" css="att-accordion--no-box">
 263         <accordion-group id="additionalOptions" heading="Additional Options"  child-length="10">
 264         <div class="fn-ebz-container">
 265                 <label class="fn-ebz-text-label">Primary Axis Label</label><BR>
 266                 <input type="text" name="prAxis" maxlength=50 ng-model="reportRunJson.primaryAxisLabel" style="width:210px"/>
 267         </div>
 268         <div class="fn-ebz-container" >
 269                 <label class="fn-ebz-text-label">Secondary Axis Label</label><BR>
 270                 <input type="text" name="secAxis" maxlength=75 ng-model="reportRunJson.secondaryAxisLabel"  style="width:210px"/>
 271         </div>
 272         <BR>
 273         <div class="fn-ebz-container" >
 274                 <label class="fn-ebz-text-label">Range Axis Minimum Range</label><BR>
 275                 <input type="text" name="rAxisMinRange" only-digits ng-model="reportRunJson.minRange" style="width:210px"/>
 276         </div>
 277         <div class="fn-ebz-container">
 278                 <label class="fn-ebz-text-label">Maximum Range</label><BR>
 279                 <input type="text" name="rAxisMaxRange" only-digits ng-model="reportRunJson.maxRange"  ng-maxLength="35" style="width:210px"/>
 280         </div><BR>
 281         </accordion-group>
 282 </accordion>
 283
 284
 285
 286
 287 <div ng-show="reportRunJson.chartTypeJSON.value=='BarChart3D'">
 288
 289         <accordion close-others="true" css="att-accordion--no-box">
 290         <accordion-group id="accBar" heading="Bar Chart Options"  child-length="10">
 291
 292
 293         <div style="border:2px;border-style:solid;border-color:#808080;margin-bottom:9px">
 294                 <div class="fn-ebz-container" style="position:relative;margin:10px;" >
 295                         <label class="fn-ebz-text-label">Orientation</label><BR>
 296                         <span><input  name="orient" type="radio" ng-model="reportRunJson.barChartOptions.verticalOrientation"  data-ng-value="true"/>Vertical</span>
 297                         <span><input name="orient" type="radio" ng-model="reportRunJson.barChartOptions.verticalOrientation" data-ng-value="false"/>Horizontal</span>
 298                 </div>
 299
 300         <div class="fn-ebz-container" style="position:relative;margin:10px;">
 301                 <label class="fn-ebz-text-label">Stacked</label><BR>
 302                 <span><input  name="stack" type="radio" ng-model="reportRunJson.barChartOptions.stackedChart"  data-ng-value="true"/>Yes</span>
 303                 <span><input name="stack" type="radio" ng-model="reportRunJson.barChartOptions.stackedChart" data-ng-value="false"/>No</span>
 304         </div>
 305
 306         <div class="fn-ebz-container" style="position:relative;margin:10px;">
 307                 <label class="fn-ebz-text-label">Show Controls</label><BR>
 308                 <span><input  name="shwcontrol" type="radio" ng-model="reportRunJson.barChartOptions.displayBarControls"  data-ng-value="true"/>Yes</span>
 309                 <span><input name="shwcontrol" type="radio" ng-model="reportRunJson.barChartOptions.displayBarControls" data-ng-value="false"/>No</span>
 310         </div>
 311
 312         <div class="fn-ebz-container" style="position:relative;margin:10px;">
 313                 <label class="fn-ebz-text-label">XAxis Date Type</label><BR>
 314                 <span><input  name="xAxisDtype" type="radio" ng-model="reportRunJson.barChartOptions.xAxisDateType"  data-ng-value="true"/>Yes</span>
 315                 <span><input name="xAxisDtype" type="radio" ng-model="reportRunJson.barChartOptions.xAxisDateType" data-ng-value="false"/>No</span>
 316         </div>
 317
 318         <div class="fn-ebz-container" style="position:relative;margin:10px;">
 319                 <label class="fn-ebz-text-label">Display less XAxis tickers</label><BR>
 320                 <span><input  name="xTicker" type="radio" ng-model="reportRunJson.barChartOptions.minimizeXAxisTickers"  data-ng-value="true"/>Yes</span>
 321                 <span><input name="xTicker" type="radio" ng-model="reportRunJson.barChartOptions.minimizeXAxisTickers" data-ng-value="false"/>No</span>
 322         </div><BR>
 323
 324         <div class="fn-ebz-container" style="position:relative;margin:10px;">
 325                 <label class="fn-ebz-text-label">Is Time Axis?</label><BR>
 326                 <span><input  name="timeAxis" type="radio" ng-model="reportRunJson.barChartOptions.timeAxis"  data-ng-value="true"/>Yes</span>
 327                 <span><input name="timeAxis" type="radio" ng-model="reportRunJson.barChartOptions.timeAxis" data-ng-value="false"/>No</span>
 328         </div>
 329
 330         <div class="fn-ebz-container" style="position:relative;margin:10px;">
 331                 <label class="fn-ebz-text-label">Log Scale (Y Axis)</label><BR>
 332                 <span><input type="checkbox" ng-model="reportRunJson.barChartOptions.yAxisLogScale" att-checkbox data-ng-value="true"></span>
 333
 334         </div>
 335  </div>
 336
 337   </accordion-group>
 338 </accordion>
 339 </div>
 340
 341         <div ng-show="reportRunJson.chartTypeJSON.value=='TimeSeriesChart'">
 342         <!-- <div class="fn-ebz-text-label"><b>Time Series Chart Options</b></div><BR> -->
 343          <accordion close-others="true" css="att-accordion--no-box">
 344                 <accordion-group id="accTimeChart"  heading="Time Series Chart Options"  child-length="10">
 345
 346                 <div style="border:2px;border-style:solid;border-color:#808080;margin-bottom:9px">
 347                         <div style="margin-left:5px">
 348                         <div class="fn-ebz-container">
 349                                 <label class="fn-ebz-text-label">Render as</label><BR>
 350                                 <span><input  name="renderAs" type="radio" ng-model="reportRunJson.timeSeriesChartOptions.lineChartRenderer"  value="line"/>Line</span>
 351                                 <span><input name="orient" type="radio" ng-model="reportRunJson.timeSeriesChartOptions.lineChartRenderer" value="area"/>Area</span>
 352                         </div>
 353
 354                 <div class="fn-ebz-container" style="position:relative;margin:10px;">
 355                         <label class="fn-ebz-text-label">X Axis Label</label><BR>
 356                         <span><input type="checkbox" ng-model="reportRunJson.timeSeriesChartOptions.showXAxisLabel" att-checkbox data-ng-value="true"></span>
 357                 </div><BR>
 358
 359                 <div class="fn-ebz-container" style="position:relative;bottom:10px;">
 360                         <label class="fn-ebz-text-label">X Axis <br>Tickers</label><BR>
 361                         <span style="position:relative;top:10px;"><input type="checkbox" ng-model="reportRunJson.timeSeriesChartOptions.addXAxisTicker" att-checkbox data-ng-value="true"></span>
 362                 </div>
 363
 364                 <div class="fn-ebz-container" style="position:relative;margin:20px;">
 365                         <label class="fn-ebz-text-label">Is Time Axis?</label><BR>
 366                         <span><input  name="timeAxisChart" type="radio" ng-model="reportRunJson.timeSeriesChartOptions.nonTimeAxis"  data-ng-value="true"/>Yes</span>
 367                         <span><input name="timeAxisChart" type="radio" ng-model="reportRunJson.timeSeriesChartOptions.nonTimeAxis" data-ng-value="false"/>No</span>
 368                 </div>
 369
 370                 <div class="fn-ebz-container" style="position:relative;margin:10px;">
 371                         <label class="fn-ebz-text-label">Multi Series?</label><BR>
 372                         <span><input  name="mSeries" type="radio" ng-model="reportRunJson.timeSeriesChartOptions.multiSeries"  data-ng-value="true"/>Yes</span>
 373                         <span><input name="mSeries" type="radio" ng-model="reportRunJson.timeSeriesChartOptions.multiSeries" data-ng-value="false"/>No</span>
 374                 </div>
 375                  </div>
 376                 </div>
 377
 378          </accordion-group>
 379         </accordion>
 380
 381         </div>
 382
 383         <div ng-show="reportRunJson.chartTypeJSON.value=='FlexTimeChart'">
 384
 385
 386                 <accordion close-others="true" css="att-accordion--no-box">
 387                 <accordion-group id="accFlexTimeChart"  heading="Flex Time Series Chart Options"  child-length="10">
 388
 389                 <!-- <div class="fn-ebz-text-label"><b>Flex Time Series Chart Options</b></div><BR>  -->
 390                 <div style="border:2px;border-style:solid;border-color:#808080;margin-bottom:9px">
 391                         <div style="margin-left:5px">
 392                 <div class="fn-ebz-container">
 393                         <label class="fn-ebz-text-label">Zoom-In Window</label><BR>
 394                         <span><input type="text" name="zWindow" only-digits maxlength=3 ng-model="reportRunJson.flexTimeSeriesChartOptions.zoomIn"></span>
 395                 </div>
 396
 397                 <div class="fn-ebz-container" style="position:relative;margin:10px;">
 398                         <label class="fn-ebz-text-label">Time Axis Type</label><BR>
 399                         <span><input  name="timeAxisType" type="radio" ng-model="reportRunJson.flexTimeSeriesChartOptions.timeAxisType"  value="weekly"/>Weekly</span>
 400                         <span><input name="timeAxisType" type="radio" ng-model="reportRunJson.flexTimeSeriesChartOptions.timeAxisType" value="daily"/>Daily</span>
 401                         <span><input name="timeAxisType" type="radio" ng-model="reportRunJson.flexTimeSeriesChartOptions.timeAxisType" value="hourly"/>Hourly</span>
 402                         <span><input name="timeAxisType" type="radio" ng-model="reportRunJson.flexTimeSeriesChartOptions.timeAxisType" value="30min"/>30 Min</span>
 403                 </div>
 404           </div>
 405          </div>
 406                 </accordion-group>
 407         </accordion>
 408
 409         </div>
 410
 411
 412
 413
 414
 415
 416
 417         <!-- <div class="fn-ebz-text-label"><b>Common Options</b></div><BR>  -->
 418
 419         <accordion close-others="true" css="att-accordion--no-box">
 420         <accordion-group id="accCommonOptions"  heading="Common Options"  child-length="10">
 421
 422         <div style="border:2px;border-style:solid;border-color:#808080;margin-bottom:9px">
 423         <div style="margin-left:5px">
 424         <div class="fn-ebz-container">
 425                 <label class="fn-ebz-text-label">Legend Angle</label><BR>
 426                 <span><input name="langle" type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" value="up45"/>up 45&deg;</span>
 427                 <span><input name="langle" type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" value="up90"/>up 90&deg;</span>
 428             <span><input name="langle" type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" value="down45"/>down 45&deg;</span>
 429             <span><input name="langle" type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" value="down90"/>down 90&deg;</span>
 430             <span><input name="langle" type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" value="standard"/>Standard</span>
 431         </div>
 432
 433         <div class="fn-ebz-container" style="position:relative;margin:15px;">
 434                 <label class="fn-ebz-text-label">Legend Position</label><BR>
 435                 <span><input  name="lgPosition" type="radio" ng-model="reportRunJson.commonChartOptions.legendPosition"  value="top"/>Top</span>
 436                 <span><input name="lgPosition" type="radio" ng-model="reportRunJson.commonChartOptions.legendPosition" value="bottom"/>Bottom</span>
 437         </div><BR>
 438
 439         <div class="fn-ebz-container">
 440                 <label class="fn-ebz-text-label">Legend</label><BR>
 441                 <span><input name="lgd" type="radio" ng-model="reportRunJson.commonChartOptions.hideLegend" data-ng-value="false"/>Yes</span>
 442                 <span><input name="lgd" type="radio" ng-model="reportRunJson.commonChartOptions.hideLegend" data-ng-value="true"/>No</span>
 443         </div>
 444
 445         <div class="fn-ebz-container" style="position:relative;margin:10px;">
 446                 <label class="fn-ebz-text-label">Animation</label><BR>
 447                 <span><input name="anmtate"  type="radio" ng-model="reportRunJson.commonChartOptions.animateAnimatedChart" data-ng-value="true" />Yes</span>
 448                 <span><input name="anmtate"  type="radio" ng-model="reportRunJson.commonChartOptions.animateAnimatedChart" data-ng-value="false"/>No</span>
 449         </div><BR>
 450
 451         <div class="fn-ebz-container">
 452                 <label class="fn-ebz-text-label">Top Margin</label><BR>
 453                 <input type="text" name="reportRunJson.commonChartOptions.topMargin" only-digits maxlength=3 ng-model="reportRunJson.commonChartOptions.topMargin" style="width:210px"/>
 454         </div>
 455         <div class="fn-ebz-container">
 456                 <label class="fn-ebz-text-label">Bottom Margin</label><BR>
 457                 <input type="text" name="reportRunJson.commonChartOptions.bottomMargin" only-digits maxlength=3 ng-model="reportRunJson.commonChartOptions.bottomMargin"  style="width:210px"/>
 458         </div>
 459         <div class="fn-ebz-container">
 460                 <label class="fn-ebz-text-label">Left Margin</label><BR>
 461                 <input type="text" name="reportRunJson.commonChartOptions.leftMargin" only-digits maxlength=3 ng-model="reportRunJson.commonChartOptions.leftMargin" style="width:210px"/>
 462         </div>
 463         <div class="fn-ebz-container">
 464                 <label class="fn-ebz-text-label">Right Margin</label><BR>
 465                 <input type="text" name="reportRunJson.commonChartOptions.rightMargin" only-digits maxlength=3 ng-model="reportRunJson.commonChartOptions.rightMargin" style="width:210px">
 466           </div><BR>
 467          </div>
 468         </div>
 469  </accordion-group>
 470 </accordion>
 471         <br/><br/>
 472         <a href="javascript:void(0)" att-button btn-type="primary" att-accessibility-click="13,32" ng-click="saveChartData();">Save</a>
 473         <a href="report#/report_run/c_master={{reportRunJson.reportID}}&refresh=Y" att-button btn-type="primary" att-accessibility-click="13,32">Run</a>
 474 </div>
 475
 476 <div>
 477     <b2b-expanders class="mpc-expanders" is-open="additionalOptionOpen">
 478         <b2b-expander-heading>
 479             <div class="row">
 480                 <div class="span6">
 481                     <div class="heading-medium b2b-blue" ng-class=" { 'b2b-toggle-header-active': !additionalOptionOpen, 'b2b-toggle-header-inactive': additionalOptionOpen } ">Additional Options</div>
 482                     <p class="p-small">
 483                     </p>
 484                 </div>
 485                 <div style="position: absolute;right: 250px;" class="span1">
 486                         <i class="pull-right b2b-toggle-header-icon" b2b-expander-toggle b2b-accessibility-click="13,32" expand-icon="icon-primary-collapsed" collapse-icon="icon-primary-expanded" tabindex="0" aria-posinset="1" aria-setsize="2"></i>
 487                 </div>
 488             </div>
 489         </b2b-expander-heading>
 490         <b2b-expander-body>
 491             <div>
 492 <!--    <div style="border:2px;border-style:solid;border-color:#808080;margin-bottom:9px"> -->
 493 <!--    <div style="margin-left:0px">
 494
 495         <div class="fn-ebz-container">
 496                 <label class="fn-ebz-text-label">Primary Axis Label</label><BR>
 497                 <input type="text" name="prAxis" maxlength=50 ng-model="reportRunJson.primaryAxisLabel" style="width:210px"/>
 498         </div>
 499         <div class="fn-ebz-container" >
 500                 <label class="fn-ebz-text-label">Secondary Axis Label</label><BR>
 501                 <input type="text" name="secAxis" maxlength=75 ng-model="reportRunJson.secondaryAxisLabel"  style="width:210px"/>
 502         </div>
 503         <BR>
 504         <div class="fn-ebz-container" >
 505                 <label class="fn-ebz-text-label">Range Axis Minimum Range</label><BR>
 506                 <input type="text" name="rAxisMinRange" only-digits ng-model="reportRunJson.minRange" style="width:210px"/>
 507         </div>
 508         <div class="fn-ebz-container">
 509                 <label class="fn-ebz-text-label">Maximum Range</label><BR>
 510                 <input type="text" name="rAxisMaxRange" only-digits ng-model="reportRunJson.maxRange"  ng-maxLength="35" style="width:210px"/>
 511         </div><BR>
 512
 513          </div> -->
 514
 515 <div id="RangeTable">
 516 <table>
 517         <thead>
 518             <tr>
 519                 <th width="30%">Primary Axis Label</th>
 520                 <th  width="30%">Secondary Axis Label</th>
 521                 <th></th>
 522             </tr>
 523         </thead>
 524     <tbody>
 525         <tr>
 526             <td>
 527                 <input type="text" name="primaryAxisLabel" ng-model="reportRunJson.primaryAxisLabel" style="width:200px;">
 528             </td>
 529             <td>
 530                 <input type="text" name="secondaryAxisLabel" ng-model="reportRunJson.secondaryAxisLabel" style="width:200px;">
 531             </td>
 532         </tr>
 533     </tbody>
 534 </table>
 535 <table>
 536         <thead>
 537             <tr>
 538                 <th width="30%">Range Axis Minimum Range</th>
 539                 <th  width="30%">Maximum Range</th>
 540                 <th></th>
 541             </tr>
 542         </thead>
 543     <tbody>
 544         <tr>
 545             <td>
 546                 <input type="text" name="minRange" ng-model="reportRunJson.minRange" style="width:200px;">
 547             </td>
 548             <td>
 549                 <input type="text" name="maxRange" ng-model="reportRunJson.maxRange" style="width:200px;">
 550             </td>
 551         </tr>
 552     </tbody>
 553 </table>
 554 </div>
 555             </div>
 556         </b2b-expander-body>
 557     </b2b-expanders>
 558
 559     <b2b-expanders class="mpc-expanders" is-open="commonOptionOpen">
 560         <b2b-expander-heading>
 561             <div class="row">
 562                 <div class="span6">
 563                     <div class="heading-medium b2b-blue" ng-class=" { 'b2b-toggle-header-active': !commonOptionOpen, 'b2b-toggle-header-inactive': commonOptionOpen } ">Common Options</div>
 564                     <p class="p-small">
 565                     </p>
 566                 </div>
 567                 <div style="position: absolute;right: 250px;" class="span1">
 568                         <i class="pull-right b2b-toggle-header-icon" b2b-expander-toggle b2b-accessibility-click="13,32" expand-icon="icon-primary-collapsed" collapse-icon="icon-primary-expanded" tabindex="0" aria-posinset="1" aria-setsize="2"></i>
 569                 </div>
 570             </div>
 571         </b2b-expander-heading>
 572         <b2b-expander-body>
 573             <div >
 574                 <div>
 575                                         <div style="border:2px;border-style:solid;border-color:#808080;margin-bottom:9px">
 576                                                 <div style="margin-left:0px">
 577                                                         <table>
 578                                                         <thead>
 579                                                             <tr>
 580                                                                 <th>Legend Angle</th>
 581                                                                 <th>Legend Position</th>
 582                                                             </tr>
 583                                                         </thead>
 584                                                     <tbody>
 585                                                         <tr>
 586                                                                 <fieldset role="radiogroup" radio-group-accessibility>
 587                                                             <td>
 588                                                             <label for="optionsRadios1" class="radio">
 589                                                                 <input type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" id="optionsRadios1" name="optionsRadio1" value="up45">
 590                                                                 <i class="skin"></i>
 591                                                                 <span>up 45&deg;</span>
 592                                                             </label>
 593                                                             <label for="optionsRadios2" class="radio">
 594                                                                 <input type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" id="optionsRadios2" name="optionsRadio2" value="up90">
 595                                                                 <i class="skin"></i>
 596                                                                 <span>up 90&deg;</span>
 597                                                             </label>
 598                                                             <label for="optionsRadios3" class="radio">
 599                                                                 <input type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" id="optionsRadios3" name="optionsRadio3" value="down45">
 600                                                                 <i class="skin"></i>
 601                                                                 <span>down 45&deg;</span>
 602                                                             </label>
 603                                                             <label for="optionsRadios4444" class="radio">
 604                                                                 <input type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" id="optionsRadios4444" name="optionsRadio44" value="down90">
 605                                                                 <i class="skin"></i>
 606                                                                 <span>down 90&deg;</span>
 607                                                             </label>
 608                                                             <label for="optionsRadios5555" class="radio">
 609                                                                 <input type="radio" ng-model="reportRunJson.commonChartOptions.legendLabelAngle" id="optionsRadios5555" name="optionsRadio55" value="Standard">
 610                                                                 <i class="skin"></i>
 611                                                                 <span>Standard</span>
 612                                                             </label>
 613                                                             </td>
 614                                                             </fieldset>
 615
 616                                                             <fieldset role="radiogroup" radio-group-accessibility>
 617                                                             <td>
 618                                                             <label for="optionsRadiosTop" class="radio">
 619                                                                 <input type="radio" ng-model="reportRunJson.commonChartOptions.legendPosition" id="optionsRadiosTop" name="optionsRadioTop" value="Top">
 620                                                                 <i class="skin"></i>
 621                                                                 <span>Top</span>
 622                                                             </label>
 623                                                             <label for="optionsRadiosBottom" class="radio">
 624                                                                 <input type="radio" ng-model="reportRunJson.commonChartOptions.legendPosition" id="optionsRadiosBottom" name="optionsRadioBottom" value="Bottom">
 625                                                                 <i class="skin"></i>
 626                                                                 <span>Bottom</span>
 627                                                             </label>
 628                                                             </td>
 629                                                             </fieldset>
 630                                                         </tr>
 631                                                     </tbody>
 632                                                 </table>
 633
 634
 635                                                 <table>
 636                                                 <thead>
 637                                                     <tr>
 638                                                         <th width="20%">Legend</th>
 639                                                         <th width="20%">Animation</th>
 640                                                         <th></th>
 641                                                     </tr>
 642                                                 </thead>
 643                                             <tbody>
 644                                                 <tr>
 645                                                         <fieldset role="radiogroup" radio-group-accessibility>
 646                                                     <td>
 647                                                     <label for="optionsRadiosHideLegendFalse" class="radio">
 648                                                         <input type="radio" ng-model="reportRunJson.commonChartOptions.hideLegend" id="optionsRadiosHideLegendFalse" name="optionsRadiosHideLegendFalse" value="false">
 649                                                         <i class="skin"></i>
 650                                                         <span>Yes</span>
 651                                                     </label>
 652                                                     <label for="optionsRadiosHideLegendTrue" class="radio">
 653                                                         <input type="radio" ng-model="reportRunJson.commonChartOptions.hideLegend" id="optionsRadiosHideLegendTrue" name="optionsRadiosHideLegendTrue" value="true">
 654                                                         <i class="skin"></i>
 655                                                         <span>No</span>
 656                                                     </label>
 657                                                     </td>
 658                                                     </fieldset>
 659
 660                                                     <fieldset role="radiogroup" radio-group-accessibility>
 661                                                     <td>
 662                                                     <label for="optionsRadiosAnimateChartTrue" class="radio">
 663                                                         <input type="radio" ng-model="reportRunJson.commonChartOptions.animateAnimatedChart" id="optionsRadiosAnimateChartTrue" name="optionsRadiosAnimateChartTrue" value="true">
 664                                                         <i class="skin"></i>
 665                                                         <span>Yes</span>
 666                                                     </label>
 667                                                     <label for="optionsRadiosAnimateChartFalse" class="radio">
 668                                                         <input type="radio" ng-model="reportRunJson.commonChartOptions.animateAnimatedChart" id="optionsRadiosAnimateChartFalse" name="optionsRadiosAnimateChartFalse" value="false">
 669                                                         <i class="skin"></i>
 670                                                         <span>No</span>
 671                                                     </label>
 672                                                     </td>
 673                                                     </fieldset>
 674                                                     <td>
 675                                                     </td>
 676                                                 </tr>
 677                                             </tbody>
 678                                         </table>
 679
 680                                         <table>
 681                                                 <thead>
 682                                                     <tr>
 683                                                         <th width="25%">Top Margin</th>
 684                                                         <th width="25%">Bottom Margin</th>
 685                                                         <th width="25%">Left Margin</th>
 686                                                         <th width="25%">Right Margin</th>
 687                                                     </tr>
 688                                                 </thead>
 689                                             <tbody>
 690                                                 <tr>
 691                                                     <td>
 692                                                         <input type="text" name="topMargin" ng-model="reportRunJson.commonChartOptions.topMargin" style="width:200px;">
 693                                                     </td>
 694                                                     <td>
 695                                                         <input type="text" name="bottomMargin" ng-model="reportRunJson.commonChartOptions.bottomMargin" style="width:200px;">
 696                                                     </td>
 697                                                     <td>
 698                                                         <input type="text" name="leftMargin" ng-model="reportRunJson.commonChartOptions.leftMargin" style="width:200px;">
 699                                                     </td>
 700                                                     <td>
 701                                                         <input type="text" name="rightMargin" ng-model="reportRunJson.commonChartOptions.rightMargin" style="width:200px;">
 702                                                     </td>
 703                                                 </tr>
 704                                             </tbody>
 705                                         </table>
 706                                 </div>
 707             </div>
 708            </div>
 709         </b2b-expander-body>
 710     </b2b-expanders>
 711
 712 </div>
 713 </div>
 714         <div>
 715         <button type="submit" style="width: 90px; height:35px;margin-top:20px; margin-left:5px;" class="btn btn-alt btn-small" ng-click="saveChartData();">Save</button>
 716         <a href="report#/report_run/c_master={{reportRunJson.reportID}}&refresh=Y">
 717         <button type="submit" style="width: 90px; height:35px;margin-top:20px; margin-left:5px;" class="btn btn-alt btn-small">Run</button>
 718         </a>
 719         </div>