Transfer-Station/POCloud/HTML Templates/Totals.html

<div class="row">
    <div class="col-md-12" style="text-align:center">
        <h1>Flow Totals</h1>
    </div>
    <div class="col-xs-6 text-center">
        <h2>Flow Today</h2>
        <div class="gauge-box">
            <div data-labelheight="10"
            style="height: 170px; background: transparent; margin: 0 auto;"
            id="gauge-flow_total_today"
            data-chart="solidgauge"
            data-nodename="transferstation.flow_total_today"
            data-units="BBL"
            data-min="0"
            data-max="100000"
            data-decimalplaces="2"
            data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
            data-valuefontsize="18px">
            </div>
            <div class- "timestamp-box">
                <a href="#" data-channelId="<%= channels["transferstation.flow_total_today"].channelId %>" class="data-table" title="Download Channel History">
                    <i class="fa fa-download"></i>
                </a>
            </div>
            <span data-timeupdate="flow_total_today">
                <%= channels["transferstation.flow_total_today"].timestamp %>
            </span>
        </div>
    </div>

    <div class="col-xs-6 text-center">
        <h2>Flow Yesterday</h2>
        <div class="gauge-box">
            <div data-labelheight="10"
            style="height: 170px; background: transparent; margin: 0 auto;"
            id="gauge-flow_total_yesterday"
            data-chart="solidgauge"
            data-nodename="transferstation.flow_total_yesterday"
            data-units="BBL"
            data-min="0"
            data-max="100000"
            data-decimalplaces="2"
            data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
            data-valuefontsize="18px">
            </div>
            <div class- "timestamp-box">
                <a href="#" data-channelId="<%= channels["transferstation.flow_total_yesterday"].channelId %>" class="data-table" title="Download Channel History">
                    <i class="fa fa-download"></i>
                </a>
            </div>
            <span data-timeupdate="flow_total_yesterday">
                <%= channels["transferstation.flow_total_yesterday"].timestamp %>
            </span>
        </div>
    </div>

    <div class='col-xs-12'>
        <div style="height:300px"
            id="chart-flow_total_yesterday"
            data-chart="chart"
            data-nodename1="transferstation.flow_total_yesterday"
            data-datalabel1="Flow Total (Yesterday)"
            data-daysofhistory="7"
            data-chartlabel="Flow Total"
            data-ylabel=""
            data-xlabel="Date"
            data-units=" BBL"></div>
    </div>

</div>

<hr />

<div class="row">
    <div class="col-md-12" style="text-align:center">
        <h1>Energy Totals</h1>
    </div>
    <div class="col-xs-6 text-center">
        <h2>Energy Today</h2>
        <div class="gauge-box">
            <div data-labelheight="10"
            style="height: 170px; background: transparent; margin: 0 auto;"
            id="gauge-energy_total_today"
            data-chart="solidgauge"
            data-nodename="transferstation.energy_total_today"
            data-units="kWh"
            data-min="0"
            data-max="100000"
            data-decimalplaces="2"
            data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
            data-valuefontsize="18px">
            </div>
            <div class- "timestamp-box">
                <a href="#" data-channelId="<%= channels["transferstation.energy_total_today"].channelId %>" class="data-table" title="Download Channel History">
                    <i class="fa fa-download"></i>
                </a>
            </div>
            <span data-timeupdate="energy_total_today">
                <%= channels["transferstation.energy_total_today"].timestamp %>
            </span>
        </div>
    </div>

    <div class="col-xs-6 text-center">
        <h2>Energy Yesterday</h2>
        <div class="gauge-box">
            <div data-labelheight="10"
            style="height: 170px; background: transparent; margin: 0 auto;"
            id="gauge-energy_total_yesterday"
            data-chart="solidgauge"
            data-nodename="transferstation.energy_total_yesterday"
            data-units="kWh"
            data-min="0"
            data-max="100000"
            data-decimalplaces="2"
            data-colors="0.1:#DF5353,0.5:#DDDF0D,0.9:#55BF3B"
            data-valuefontsize="18px">
            </div>
            <div class- "timestamp-box">
                <a href="#" data-channelId="<%= channels["transferstation.energy_total_yesterday"].channelId %>" class="data-table" title="Download Channel History">
                    <i class="fa fa-download"></i>
                </a>
            </div>
            <span data-timeupdate="energy_total_yesterday">
                <%= channels["transferstation.energy_total_yesterday"].timestamp %>
            </span>
        </div>
    </div>

    <div class='col-xs-12'>
        <div style="height:300px"
            id="chart-flow_total_today"
            data-chart="chart"
            data-nodename1="transferstation.energy_total_yesterday"
            data-datalabel1="Energy Total (Yesterday)"
            data-daysofhistory="7"
            data-chartlabel="Energy Total"
            data-ylabel=""
            data-xlabel="Date"
            data-units=" kWh"></div>
    </div>

</div>