theopenbar/interface

<br>
<div class="table-responsive">
    <table class="table table-bordered">
        <thead>
            <tr>
                <td><b>Type</b></td>
                <td><b>Subtype</b></td>
                <td><b>Brand</b></td>
                <td><b>Description</b></td>
                <!--
                <td><b>Amount</b></td>
                <td><b>Barcode</b></td>
                -->
                <td></td>
            </tr>
        </thead>
        <tbody>
            <tr>

                <td>
                    <select class="form-control" ng-model="liquid.type" ng-change="getSubtypes()">
                        <option ng-repeat="type in liquidSelection.types | orderBy:'type'" value="{{type.type}}">{{type.type}}</option>
                    </select>
                </td>
                <td>
                    <select class="form-control" ng-model="liquid.subtype" ng-change="getBrands()">
                        <option ng-repeat="subtype in liquidSelection.subtypes | orderBy:'subtype'" value="{{subtype.subtype}}">{{subtype.subtype}}</option>
                    </select>
                </td>
                <td><input class="form-control" list="type-brands" ng-model="liquid.brand"/></td>
                <td><input class="form-control" type='text' ng-model="liquid.description"></input></td>
                <!--
                <td>
                    list of possible amounts
                    <select class="form-control" ng-model="liquid.amount">
                        <option value="1.69">1.69oz / 50mL</option>
                        <option value="6.76">6.76oz / 200mL</option>
                        <option value="12.7">12.7oz / 375mL</option>
                        <option value="16.9">16.9oz / 500mL</option>
                        <option value="25.4">25.4oz / 750mL (fifth)</option>
                        <option value="33.8">33.8oz / 1000mL</option>
                        <option value="40.0">40.0oz / 1183mL</option>
                        <option value="59.2">59.2oz / 1750mL (handle)</option>
                        <option value="67.6">67.6oz / 2000mL</option>
                        <option value="101.4">101.4oz / 3000mL</option>
                    </select>
                </td>
                <td><input class="form-control" type='text' ng-model="liquid.barcode"></input></td>
                -->
                <td><button class="btn btn-success" ng-click="saveLiquid()">save</button></td>

            </tr>
        </tbody>
    </table>
</div>

<div ng-show="messageError">
    <div class="alert alert-danger alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close" ng-click="messageError=null">
            <span aria-hidden="true">&times;</span>
        </button>

        {{messageError}}
    </div>
</div>

<div ng-show="messageSuccess">
    <div class="alert alert-success alert-dismissible" role="alert">
        <button type="button" class="close" data-dismiss="alert" aria-label="Close" ng-click="messageSuccess=null">
            <span aria-hidden="true">&times;</span>
        </button>

        {{messageSuccess}}
    </div>
</div>

<!-- list of Types cooresponding to the selected Brand-->
<datalist id="type-brands">
    <select>
        <!-- Yo, dawg. I heard you like types. -->
        <option ng-repeat="brand in liquidSelection.brands" value="{{brand.brand}}"></option>
    </select>
</datalist>