

<div class="gf-form-group">
	<h3 class="page-heading">Http settings</h3>

	<div class="gf-form-inline">
		<div class="gf-form max-width-30">
			<span class="gf-form-label width-7">Url</span>
			<input class="gf-form-input" type="text"
						 ng-model='current.url' placeholder="{{suggestUrl}}"
						 bs-typeahead="getSuggestUrls"  min-length="0"
						 ng-pattern="/^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/" required></input>
			<info-popover mode="right-absolute">
				<p>Specify a complete HTTP url (for example http://your_server:8080)</p>
				<span ng-show="current.access === 'direct'">
					Your access method is <em>Direct</em>, this means the url
					needs to be accessable from the browser.
				</span>
				<span ng-show="current.access === 'proxy'">
					Your access method is currently <em>Proxy</em>, this means the url
					needs to be accessable from the grafana backend.
				</span>
			</info-popover>
		</div>
	</div>

	<div class="gf-form-inline">
		<div class="gf-form max-width-30">
			<span class="gf-form-label width-7">Access</span>
			<div class="gf-form-select-wrapper gf-form-select-wrapper--has-help-icon max-width-24">
				<select class="gf-form-input" ng-model="current.access" ng-options="f for f in ['direct', 'proxy']"></select>
				<info-popover mode="right-absolute">
					Direct = url is used directly from browser<br>
					Proxy = Grafana backend will proxy the request
				</info-popover>
			</div>
		</div>
	</div>

	<div class="gf-form-inline">
		<div class="gf-form">
			<label class="gf-form-label width-7">Http Auth</label>
		</div>
		<gf-form-switch class="gf-form"
									label="Basic Auth"
				 checked="current.basicAuth" switch-class="max-width-6">
		</gf-form-switch>
		<gf-form-switch class="gf-form"
									label="With Credentials"
				 checked="current.withCredentials" switch-class="max-width-6">
		</gf-form-switch>
	</div>

	<div class="gf-form" ng-if="current.basicAuth">
		<span class="gf-form-label width-7">
			User
		</span>
		<input class="gf-form-input max-width-21" type="text"  ng-model='current.basicAuthUser' placeholder="user" required></input>
	</div>

	<div class="gf-form" ng-if="current.basicAuth">
		<span class="gf-form-label width-7">
			Password
		</span>
		<input class="gf-form-input max-width-21" type="password" ng-model='current.basicAuthPassword' placeholder="password" required></input>
	</div>
</div>

