{% call macros.panel("info", "Database preferences") %}

<div class="form-group">
	<label>Which database back end would you like to use?</label>
	<br/>
	 <select class="btn btn-primary dropdown-toggle" name="db_flavor" id="database">
		{% for dbflavor in ["sqlite", "postgresql", "mysql"] %}
			<option value="{{ dbflavor }}" >{{ dbflavor }}</option>
		{% endfor %}
	</select>
	<div class="form-group" id="external_db" style="display: none">
		<p>Set external database parameters for <b>Admin UI</b></p>
		<label>DB User</label>
		<input class="form-control" type="text" name="db_user" placeholder="Username" id="db_user">
		<label>Db Password</label>
		<input class="form-control" type="password" name="db_pw" placeholder="Password" id="db_pw">
		<label>Db URL (for using a different port use the notation host:port )</label>
		<input class="form-control" type="text" name="db_url" placeholder="URL" id="db_url">
		<label>Db Name</label>
		<input class="form-control" type="text" name="db_name" placeholder="Database Name" id="db_name">
		<br/>
		<div class="form-group" id="db_flavor_rc_sel" style="display: none">
			<label>Which database back end would you like to use for roundcube?</label>
			<br/>
			<select class="btn btn-primary dropdown-toggle" name=db_flavor_rc id="database_rc">
				{% for dbflavor_rc in ["sqlite", "postgresql", "mysql"] %}
					<option value="{{ dbflavor_rc }}" >{{ dbflavor_rc }}</option>
				{% endfor %}
			</select>
			<div class="form-group" id="roundcube_external_db" style="display: none">
				<p>Set external database parameters for <b>Roundcube</b></p>
				<label>DB User</label>
				<input class="form-control" type="text" name="roundcube_db_user" placeholder="Username" id="roundcube_db_user">
				<label>DB Password</label>
				<input class="form-control" type="password" name="roundcube_db_pw" placeholder="Password" id="roundcube_db_pw">
				<label>DB URL (for using a different port use the notation host:port )</label>
				<input class="form-control" type="text" name="roundcube_db_url" placeholder="URL" id="roundcube_db_url">
				<label>DB Name</label>
				<input class="form-control" type="text" name="roundcube_db_name" placeholder="Database Name" id="roundcube_db_name">
			</div>
		</div>
	</div>
</div>

{% endcall %}