<div class="modal" tabindex="-1" role="dialog">
	<div class="modal-dialog">
		<div class="modal-content">
			<div class="modal-header" ng-show="title">
				<button type="button" class="close" ng-click="$hide()">&times;</button>
				<h4 class="modal-title">{{title}}</h4>
			</div>

			<form name="addVariableForm" role="form" novalidate>
				<div class="modal-body" >
					<div class="form-group">
						<div class="margin-bottom-md">
							<label for="variable-name">Variable:</label>
							<input  class="form-control" id="variable-name" type="text" name="variableName" placeholder="Enter Name" ng-model="newVar.name" ng-maxlength="32" auto-focus required>
							<p class="help-block" ng-show="addVariableForm.variableName.$error.required && addVariableForm.variableName.$dirty">A valid variable name is required.</p>
							<p class="help-block" ng-show="addVariableForm.variableName.$error.maxlength && addVariableForm.variableName.$dirty">The variable name cannot be longer than 32 characters.</p>
						</div>

						<div ng-if="0 == newVar.type">
							<div class="radio">
								<div class="row">
									<div class="col-xs-5">
										<label>
											<input type="radio" name="true" ng-model="newVar.value" value="1" class="ng-pristine ng-valid" required> True
										</label>
									</div>
									<div class="col-xs-5">
										<label>
											<input type="radio" name="false" ng-model="newVar.value" value="0" class="ng-pristine ng-valid" required> False
										</label>
									</div>
								</div>
							</div>
						</div>

						<div ng-if="1 == newVar.type">
							<label for="var-string-value">Value: </label>
							<input class="form-control" id="var-string-value" type="text" name="varStringValue" placeholder="Enter string" ng-model="newVar.value" ng-maxlength="256" required>
							<p class="help-block" ng-show="addVariableForm.varStringValue.$error.required && addVariableForm.varStringValue.$dirty">A valid value is required.</p>
							<p class="help-block" ng-show="addVariableForm.varStringValue.$error.maxlength && addVariableForm.varStringValue.$dirty">The value cannot be longer than 256 
						</div>

						<div ng-if="2 == newVar.type">
							<label for="var-int-value">Value: </label>
							<input class="form-control" id="var-int-value" type="number" name="varIntValue" placeholder="Enter numeric value" ng-model="newVar.value" min="-2147483648" max="2147483647" ng-maxlength="11" required>
							<p class="help-block" ng-show="addVariableForm.varIntValue.$error.required && addVariableForm.varIntValue.$dirty">A valid value is required.</p>
							<p class="help-block" ng-show="addVariableForm.varIntValue.$error.maxlength && addVariableForm.varIntValue.$dirty">The value cannot be longer than 11 characters.</p>
						</div>

					</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-primary" ng-disabled="addVariableForm.$invalid" ng-click="addVariable()">Set</button>
					<button type="button" class="btn btn-danger" ng-click="$hide()">Cancel</button>
				</div>
			</form>
		</div>
	</div>
</div>
