<div class="popup" style="display: none;">
	<div class="mask" data-bind="click: cancelPopup"></div>
	<div class="popup_panel">
		<span class="close" data-bind="click: cancelPopup"></span>
		
		<div class="popup_heading" data-bind="i18n: {'key': '%MODULENAME%/HEADING_GENERATE_NEW_KEY'}"></div>

		<div class="list-block">
			<ul>
				<li data-bind="visible: emails().length > 0">
					<div class="item-content">
						<div class="item-inner">
							<div class="item-title label" data-bind="i18n: {'key': 'COREWEBCLIENT/LABEL_EMAIL'}"></div>
							<div class="item-input">
								<select data-bind="options: emails, value: selectedEmail"></select>
							</div>
						</div>
					</div>
				</li>
				<li data-bind="visible: emails().length > 0">
					<div class="item-content">
						<div class="item-inner">
							<div class="item-title label" data-bind="i18n: {'key': 'COREWEBCLIENT/LABEL_PASSWORD'}"></div>
							<div class="item-input">
								<input autocomplete="new-password" type="password" data-bind="value: password" />
							</div>
						</div>
					</div>
				</li>
				<li data-bind="visible: emails().length > 0">
					<div class="item-content">
						<div class="item-inner">
							<div class="item-title label" data-bind="i18n: {'key': '%MODULENAME%/LABEL_KEY_LENGTH'}"></div>
							<div class="item-input">
								<select data-bind="value: selectedKeyLength, options: keyLengthOptions"></select>
							</div>
						</div>
					</div>
				</li>
				<li data-bind="visible: emails().length === 0">
					<div class="item-content">
						<div class="item-inner" data-bind="text: keysExistText"></div>
					</div>
				</li>
			</ul>
		</div>
		
		<div class="content-block">
			<p>
				<a href="#" class="button button-raised"
				   data-bind="visible: !process(), i18n: {'key': '%MODULENAME%/ACTION_GENERATE'},
				   css: {'disabled': emails().length === 0},
				   click: generate"
				></a>
			</p>
			<p>
				<a href="#" class="button button-raised disabled"
				   data-bind="visible: process, i18n: {'key': '%MODULENAME%/ACTION_GENERATE_IN_PROGRESS'}"
				></a>
			</p>
			<p>
				<a href="#" class="button button-raised"
				   data-bind="visible: !process(), i18n: {'key': 'COREWEBCLIENT/ACTION_CANCEL'},
				   click: cancelPopup"
				></a>
			</p>
		</div>
	</div>
	<span class="helper"></span>
</div>
