hastic-grafana-app/src/datasource/partials/config.html

<div class="gf-form-group">
  <h3 class="page-heading">HTTP</h3>
  <div class="gf-form-group">
    <div class="gf-form-inline">
      <div class="gf-form max-width-30">
        <span class="gf-form-label width-10">Hastic Server URL</span>
        <input
          class="gf-form-input" type="text"
          placeholder="http://localhost:8000"
          ng-model='ctrl.current.url'
          min-length="0"
          ng-pattern="/^(ftp|http|https):\/\/(\w+:{0,1}\w*@)?(\S+)(:[0-9]+)?(\/|\/([\w#!:.?+=&%@!\-\/]))?$/"
          required
          ng-blur="ctrl.normalizeUrl()"
        />
        <info-popover mode="right-absolute">
          <p>Specify a complete Hastic Server HTTP URL (for example http://your_hastic_server:8000)</p>
          <span ng-show="ctrl.current.access === 'direct'">
            Your access method is <em>Browser</em>, this means the URL
            needs to be accessible from the browser.
          </span>
          <span ng-show="ctrl.current.access === 'proxy'">
            Your access method is <em>Server</em>, this means the URL
            needs to be accessible from the grafana backend/server.
          </span>
        </info-popover>
      </div>
    </div>

    <div class="gf-form-inline">
      <div class="gf-form max-width-30">
        <span class="gf-form-label width-10">Access</span>
        <div class="gf-form-select-wrapper max-width-24">
          <select
            class="gf-form-input"
            ng-model="ctrl.current.access"
            ng-options="f.key as f.value for f in ctrl.ACCESS_OPTIONS"
          ></select>
        </div>
      </div>
      <div class="gf-form">
        <label class="gf-form-label query-keyword pointer" ng-click="ctrl.toggleAccessHelp()">
          Help&nbsp;
          <i class="fa fa-caret-down" ng-show="ctrl.showAccessHelp"></i>
          <i class="fa fa-caret-right" ng-hide="ctrl.showAccessHelp">&nbsp;</i>
        </label>
      </div>
    </div>

    <div class="grafana-info-box m-t-2" ng-show="ctrl.showAccessHelp">
      <p>
        Access mode controls how requests to the data source will be handled.
        <strong><i>Server</i></strong> access mode should be the preferred way if nothing else stated.
      </p>
      <div class="alert-title">Server access mode (Default):</div>
      <p>
        All requests will be made from the browser to Grafana backend/server which in turn will
        forward the requests to the data source and by that circumvent possible 
        Cross-Origin Resource Sharing (CORS) requirements.
        The URL needs to be accessible from the grafana backend/server if you select this access mode.
      </p>
      <div class="alert-title">Browser access mode:</div>
      <p>
        All requests will be made from the browser directly to the data source and may be subject to
        Cross-Origin Resource Sharing (CORS) requirements. The URL needs to be accessible from the browser
        if you select this access mode.
      </p>
    </div>

    <div class="gf-form-inline" ng-if="ctrl.current.access=='proxy'">
      <div class="gf-form">
        <span class="gf-form-label width-10">Whitelisted Cookies</span>
        <bootstrap-tagsinput 
          ng-model="ctrl.current.jsonData.keepCookies"
          width-class="width-20" tagclass="label label-tag"
          placeholder="Add Name"
        ></bootstrap-tagsinput>
        <info-popover mode="right-absolute">
          Grafana Proxy deletes forwarded cookies by default. Specify cookies by name
          that should be forwarded to the data source.
        </info-popover>
      </div>
    </div>
  </div>
</div>