<template name="createCombinedFlex">
	<header class="primary-background-color">
		<div>
			<h4>{{_ "Channels"}}</h4>
		</div>
	</header>
	<div class="content primary-background-color">
		<div class="wrapper">
			<h4>{{_ "Create_new" }}</h4>
			<div class="input-line no-icon">
				<label for="channel-name">{{_ "Name"}}</label>
				<input type="text" id="channel-name" class="required" dir="auto" placeholder="{{_ 'Enter_name_here'}}">
			</div>
			<div class="input-line toggle">
				<label for="channel-type">{{_ "Private"}}</label>
				<div class="input checkbox toggle">
					<input type="checkbox" id="channel-type" {{privateSwitchDisabled}} {{privateSwitchChecked}}>
					<label class="color-tertiary-font-color" for="channel-type"></label>
				</div>
			</div>
			<div class="input-line toggle">
				<label for="channel-ro">{{_ "Read_only_channel"}}</label>
				<div class="input checkbox toggle">
					<input type="checkbox" id="channel-ro">
					<label class="color-tertiary-font-color" for="channel-ro"></label>
				</div>
			</div>
			<div class="input-line no-icon">
				<label class="color-tertiary-font-color" for="channel-members">{{_ "Select_users"}}</label>
				{{> inputAutocomplete settings=autocompleteSettings id="channel-members" class="search" placeholder=(_ "Search_by_username") autocomplete="off"}}
				<ul class="selected-users">
					{{#each selectedUsers}}
						<li class="background-transparent-darker">{{.}} <i class="icon-cancel remove-room-member"></i></li>
					{{/each}}
				</ul>
			</div>
			{{#if error.fields}}
				<div class="input-error">
					<strong>{{_ "Oops!"}}</strong>
					{{#each error.fields}}
						<p>{{_ "The_field_is_required" .}}</p>
					{{/each}}
				</div>
			{{/if}}
			{{#if error.invalid}}
				<div class="input-error">
					<strong>{{_ "Oops!"}}</strong>
					{{{_ "Invalid_room_name" roomName}}}
				</div>
			{{/if}}
			{{#if error.duplicate}}
				<div class="input-error">
					<strong>{{_ "Oops!"}}</strong>
					{{{_ "Duplicate_channel_name" roomName}}}
				</div>
			{{/if}}
			{{#if error.archivedduplicate}}
				<div class="input-error">
					<strong>{{_ "Oops!"}}</strong>
					{{{_ "Duplicate_archived_channel_name" roomName}}}
				</div>
			{{/if}}
			<div class="input-submit">
				<button class="button primary save-channel">{{_ "Create" }}</button>
				<button class="button cancel-channel">{{_ "Cancel" }}</button>
			</div>
		</div>
	</div>
</template>
