
<h5 class="section-heading text-center">Add annotation</h5>

<form name="ctrl.form" class="text-center">
	<div style="display: inline-block">
		<div class="gf-form">
			<span class="gf-form-label width-7">Title</span>
			<input type="text" ng-model="ctrl.event.title" class="gf-form-input max-width-20" required>
		</div>
		<!-- single event -->
		<div ng-if="!ctrl.event.isRegion">
      <div class="gf-form">
        <span class="gf-form-label width-7">Time</span>
        <input type="text" ng-model="ctrl.event.time" class="gf-form-input max-width-20" input-datetime required ng-change="ctrl.timeChanged()">
      </div>
    </div>
    <!-- region event -->
    <div ng-if="ctrl.event.isRegion">
      <div class="gf-form">
        <span class="gf-form-label width-7">Start</span>
        <input type="text" ng-model="ctrl.event.time" class="gf-form-input max-width-20" input-datetime required ng-change="ctrl.timeChanged()">
      </div>
      <div class="gf-form">
        <span class="gf-form-label width-7">End</span>
        <input type="text" ng-model="ctrl.event.timeEnd" class="gf-form-input max-width-20" input-datetime required ng-change="ctrl.timeChanged()">
      </div>
    </div>
    <div class="gf-form gf-form--v-stretch">
      <span class="gf-form-label width-7">Description</span>
      <textarea class="gf-form-input width-20" rows="3" ng-model="ctrl.event.text"  placeholder="Event description"></textarea>
    </div>

    <div class="gf-form-button-row">
      <button type="submit" class="btn gf-form-btn btn-success" ng-click="ctrl.save()">Save</button>
			<a class="btn-text" ng-click="ctrl.close();">Cancel</a>
    </div>
  </div>
</form>
