
<div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
    <h3>Data definition</h3>
</div>
<div class="kis-modal-body">

    <div class="row-fluid">
        <div class="span6">
            <div class="kis-listener-grid" ui-grid="gridOptions"></div>
            <div class="pull-right">
                <div class="btn-group">
                    <a href="#" class="btn btn-icon btn-large" rel="tooltip" data-title="{{'ACTION.MOVE.UP' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveDataItemUp()"><i class="icon-arrow-up"></i></a>
                    <a href="#" class="btn btn-icon btn-large" rel="tooltip" data-title="{{'ACTION.MOVE.DOWN' | translate}}" data-placement="bottom" data-original-title="" title="" ng-click="moveDataItemDown()"><i class="icon-arrow-down"></i></a>
                </div>
                <div class="btn-group">
                    <a href="#" class="btn btn-icon btn-large" rel="tooltip" data-title="{{'ACTION.ADD' | translate:property}}" data-placement="bottom" data-original-title="" title="" ng-click="addNewDataItem()"><i class="icon-plus"></i></a>
                    <a href="#" class="btn btn-icon btn-large" rel="tooltip" data-title="{{'ACTION.REMOVE' | translate:property}}" data-placement="bottom" data-original-title="" title="" ng-click="removeDataItem()"><i class="icon-minus"></i></a>
                </div>
            </div>
        </div>

        <div class="span6">
            <div ng-show="selectedDataItems.length > 0">

                <table>
                    <tr>
                        <td class="form-property-label">Name</td>
                        <td><input type="text" ng-model="selectedDataItems[0].name" placeholder="Fill-in a name"></td>
                    </tr>
                    <tr>
                        <td class="form-property-label">Value</td>
                        <td><input type="text" ng-model="selectedDataItems[0].value" placeholder="Fill-in a value"></td>
                    </tr>
                </table>

            </div>
            <div ng-show="selectedDataItems.length == 0" class="muted no-property-selected">No data item selected</div>
        </div>
    </div>
</div>
<div class="modal-footer">
    <button ng-click="cancel()" class="btn btn-primary" translate>ACTION.CANCEL</button>
    <button ng-click="save()" class="btn btn-primary" translate>ACTION.SAVE</button>
</div>
