www-POC/app/static/templates/config.html

<div class="modal fade" id="deleteAllModal">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">Are you sure?</h4>
            </div>
            <div class="modal-body">
				<h1>Are you sure?</h1>
				<p>Are you absolutely certain that you want to delete all the tag data in the database?</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">No</button>
                <button type="button" class="btn btn-primary" ng-click="deleteAllTagData();" data-dismiss="modal">Yes</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->


<div ng-if="loading" class="container">
	<div class="row">
		<div class="col-md-12 well" style="text-align:center;">
			<h1>Loading Config...</h1>
			<img class="img-responsive" src="/images/loading.gif"  style="margin:0 auto;"/>
		</div>
	</div>
</div>

<div ng-if="!loading">
	<div ng-if="error" class="container">
		<div class="row">
			<div class="col-md=12">
				<h1>Error Caught!</h1>
				<pre>{{message}}</pre>
				<button ng-click="loadDashboard()" class="btn btn-large btn-danger"><i class="fa fa-refresh"></i> Reload Dashboard</button>
			</div>
		</div>
	</div>

	<div ng-if="!error" class="container">
		<div class="row well">
			<div class="col-md-12">
				<h1 ng-if="!loggerLoading">Logger Status:
					<span ng-if="loggerRunning" class="label label-success">Running</span>
					<span ng-if="!loggerRunning" class="label label-danger">Not Running</span>
				</h1>
				<h1 ng-if="loggerLoading">
					<span class="label label-warning">Checking Logger Status...</span>
				</h1>
				<button class="btn btn-primary btn-large" ng-click="checkLogger()">Check Logger</button> <button class="btn btn-warning btn-large" ng-click="restartLogger()">Restart Logger</button>
			</div>
		</div>

		<div class="row">
			<div class="col-md-12">
				<button data-toggle="modal" data-target="#deleteAllModal" class="btn btn-large btn-danger"><i class="fa fa-trash-o"></i> Delete All Stored Data</button>
                <a href="/#/backup_restore" class="btn btn-large btn-warning"><i class="fa fa-lock"></i> Backup & Restore Configuration</a>
			</div>
		</div>


		<div class="row">
			<div class="col-md-6">
				<h1>Devices</h1>
				<!-- <button ng-click="getDevices()" class="btn btn-large btn-success"><i class="fa fa-refresh"></i> Reload Devices</button> -->
				<table class="table">
					<thead>
						<tr>
							<!-- <th>ID</th> -->
							<th>Address</th>
							<th>Type</th>
							<!-- <th></th> -->
							<th></th>
						</tr>
					</thead>

					<tbody>
						<tr ng-repeat="device in devices">
							<!-- <td>{{device._id}}</td> -->
							<td>{{device.address}}</td>
							<td>{{device.device_type.device_type}}</td>
							<!-- <td><i class="fa fa-pencil"></i></td> -->
							<td><i class="fa fa-times" ng-click="deleteDevice(device._id)"></i></td>
						</tr>
					</tbody>
				</table>
			</div>

			<div class="col-md-6">
				<h1>Configuration Parameters</h1>
				<!-- <button ng-click="loadConfig()" class="btn btn-large btn-success"><i class="fa fa-refresh"></i> Reload Config</button> -->
				<table class="table">
					<thead>
						<tr>
							<th>Parameter</th>
							<th>Value</th>
							<!-- <th></th> -->
							<th></th>
						</tr>
					</thead>

					<tbody>
						<tr ng-repeat="param in config">
							<td>{{param.parameter}}</td>
							<td>{{param.val}}</td>
							<!-- <td><i class="fa fa-pencil"></i></td> -->
							<td><i class="fa fa-times" ng-click="deleteParameter(param._id)"></i></td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
		<div class="row">
			<div class="col-md-6">
				<h2>New Device</h2>
				<form>
					<div class="form-group">
						<label for="ip_address">IP Address</label>
						<input type="text" class="form-control" id="ip_address" ng-model="newDevice.address" placeholder="###.###.###.###">
					</div>

					<div class="form-group">
						<label for="device_type">Device Type</label>
						<select ng-model="newDevice.device_type" ng-options="t as t.device_type for t in device_types track by t._id" class="form-control" id="device_type"></select>
					</div>

					<button class="btn btn-primary" ng-click="addDevice(newDevice)">Add Device</button>
				</form>
			</div>

			<div class="col-md-6">
				<h2>New Parameter</h2>
				<form>
					<div class="form-group">
						<label for="pSelected">Parameter</label>
						<select class="form-control" id="pSelected" ng-model="newParam.pSelected">
							<option value="ip_address">PLC IP Address</option>
							<option value="scan_rate">Scan Rate</option>
							<option value="other">Other</option>
						</select>
					</div>

					<div class="form-group" ng-if="newParam.pSelected=='other'">
						<label for="pEntry">Parameter Entry</label>
						<input type="text" class="form-control" id="val" ng-model="newParam.pEntry" placeholder="Parameter Name">
					</div>

					<div class="form-group">
						<label for="val">Value</label>
						<input type="text" class="form-control" id="val" ng-model="newParam.val" placeholder="Parameter Value">
					</div>

					<button class="btn btn-primary" ng-click="addParameter()">Set Parameter</button>
				</form>
			</div>
		</div>
	</div>
</div>