<div class="row marketing">
    <div class="col-md-3"></div>
    <div class="col-md-6 col-sm-12">
        <select class="wide-control form-control default" data-ng-model="selected.wdisplay"
            data-ng-options="wdisplays.indexOf(e) as e for e in wdisplays" data-ng-change="updateGraph()">
            <option value=""> Select Outputs </option>
        </select>
    </div>
    <div class="col-md-3"></div>
</div>

<div class="row marketing">
    <div class="col-md-2"></div>
    <div class="col-md-8 col-sm-12">
        <div id="graph1" style="width:100%"></div>
    </div>
    <div class="col-md-2"></div>
</div>

<div class="row marketing">
    <div class="col-md-6">
        <select class="wide-control form-control default" data-ng-model="selected.family"
            data-ng-options="a.family for a in wavedb" required>
            <option value=""> Wavelet Family </option>
        </select>
    </div>
    <div class="col-md-6">
        <select class="wide-control form-control default" data-ng-model="selected.wavelet"
            data-ng-options="b.wavelet for b in selected.family.wavelets" data-ng-change="getMaxIter()" required>
        <option value=""> Wavelet </option>
    </select>
    </div>
    <div class="col-md-6">
        <select class="wide-control form-control default" data-ng-model="selected.method"
            data-ng-options="c.method for c in methods" required>
        <option value=""> Wavelet Methods </option>
    </select>
    </div>
    <div class="col-md-6">
        <select class="wide-control form-control default" data-ng-model="selected.level"
            data-ng-options="d for d in levels" required>
        <option value=""> Decomposition Levels </option>
    </select>
    </div>
    <div class="col-md-6">
        <button class="btn btn-primary btn-block" data-ng-click="waveTest()">
               <span class="glyphicon glyphicon-share-alt pull-left" data-position="left"></span>GO</button>
    </div>
    <div class="col-md-6">
        <button class="btn btn-primary btn-block" id="reportButton" data-ng-click="viewReport()" disabled>
               <span class="glyphicon glyphicon-share-alt pull-left" data-position="left"></span>View Report</button>
    </div>
    <script type="text/ng-template" id="myModalContent.html">
        <div class="modal-header">
            <h3 class="modal-title" style="font-family:Lucida Console;color:black;font-size:large">Wavelet Transform Output</h3>
        </div>
        <div class="modal-body" style="font-family:Lucida Console;color:blue;font-size:small">
            <p>Method : {{method}} ({{ext}})</p>
            <p>Wavelet : {{wname}}</p>
            <p>Wavelet Filters :</p>
            <p>LPD : [<span data-ng-repeat="lp1 in lpd track by $index">{{lp1}} {{$last ? '' : ', '}}</span>]</p>
            <p>HPD : [<span data-ng-repeat="hp1 in hpd track by $index">{{hp1}} {{$last ? '' : ', '}}</span>]</p>
            <p>LPR : [<span data-ng-repeat="lp2 in lpr track by $index">{{lp2}} {{$last ? '' : ', '}}</span>]</p>
            <p>HPR : [<span data-ng-repeat="hp2 in hpr track by $index">{{hp2}} {{$last ? '' : ', '}}</span>]</p>
            <p>Decomposition Levels : {{J}}</p>
            <p>APPX{{J}} : [<span data-ng-repeat="a1 in appx track by $index">{{a1}} {{$last ? '' : ', '}}</span>]</p>
            <div data-ng-repeat="detail in details">
                <p>DET : [<span data-ng-repeat="a2 in detail track by $index">{{a2}} {{$last ? '' : ', '}}</span>]</p>
            </div>
        </div>
        <div class="modal-footer">
            <!--button class="btn btn-primary" type="button" ng-click="ok()" disabled>OK</button-->
            <button class="btn btn-warning" type="button" ng-click="cancel()">Cancel</button>
        </div>
    </script>
</div>
