<template name="channelSettings">
	<div class="content">
		<div class="list-view channel-settings">
			<div class="title">
				<h2>{{_ "Room_Info"}}</h2>
			</div>
			<form>
				<ul class="list clearfix">
					{{#let room=getRoom}}
						{{#each toArray settings}}

							{{#if $value.canView room}}
								{{#let value=(valueOf room $key)}}
									<li class="{{$value.type}}">
										<label>{{_ $value.label}}</label>
										<div class="setting-block">
											{{#if $eq $value.type 'text'}}
												{{#if editing $key}}
													{{#if $value.canEdit room}}
														<input type="text" name="{{$key}}" value="{{value}}" class="content-background-color editing" />
													{{/if}}
												{{else}}
													<span class='current-setting' data-edit="{{#if $value.canEdit room}}{{$key}}{{else}}false{{/if}}">{{value}}</span>
												{{/if}}
											{{/if}}

											{{#if $eq $value.type 'markdown'}}
												{{#if editing $key}}
													{{#if $value.canEdit room}}
														<input type="text" name="{{$key}}" value="{{unscape value}}" class="content-background-color editing" />
													{{/if}}
												{{else}}
													<span class='current-setting' data-edit="{{#if $value.canEdit room}}{{$key}}{{else}}false{{/if}}">{{{RocketChatMarkdown value}}}</span>
												{{/if}}
											{{/if}}

											{{#if $eq $value.type 'select'}}
												{{#each toArray $value.options}}
													<div class="input radio">
														<input type="radio" id="{{$key}}" name="{{../$key}}" value="{{$key}}" checked="{{$eq value $key}}" disabled="{{isDisabled $key room}}" />
														<label for="{{$key}}">{{_ $value}}</label>
													</div>
												{{/each}}
											{{/if}}

											{{#if $eq $value.type 'boolean'}}
												<div class="input checkbox toggle">
													<input type="checkbox" id="{{$key}}" name="{{$key}}" value="{{value}}" checked="{{$eq value true}}" disabled="{{isDisabled $key room}}" />
													<label for="{{$key}}"></label>
												</div>
												{{#if $value.canEdit room}}
													{{#if $value.processing.get}}
														{{> loading}}
													{{/if}}
												{{/if}}
											{{/if}}

											{{#unless $value.isToggle}}
												{{#if $value.canEdit room}}
													{{#if editing $key}}
														<div class="buttons secondary-background-color">
															<button type="button" class="button cancel">
																<i class="icon-cancel"></i>
															</button>
															<button type="button" class="button primary save">
																<i class="icon-ok success-color"></i>
															</button>
														</div>
													{{else}}
														<button type="button" class="button edit">
															<i class="icon-pencil" data-edit="{{$key}}"></i>
														</button>
													{{/if}}
												{{/if}}
											{{/unless}}
										</div>
									</li>
									{{# if has $value 'message' }}
										{{#let message=($value.message room)}}
											{{#if message}}
												<li>
													<div class="alert alert-warning pending-background pending-border">
														{{_ message}}
													</div>
												</li>
											{{/if}}
										{{/let}}
									{{/if}}
								{{/let}}
							{{/if}}
						{{/each}}
					{{/let}}

					{{#each channelSettings}}
						{{> Template.dynamic template=template data=data}}
					{{/each}}
				</ul>
			</form>
			{{#if canDeleteRoom}}
				<nav>
					<button class="button danger delete" title="{{_ 'Delete'}}"><i class="icon-trash"></i></button>
				</nav>
			{{/if}}
		</div>
	</div>
</template>
