<inp2:adm_SetPopupSize width="750" height="400"/>

<inp2:m_include t="incs/header"/>
<inp2:m_RenderElement name="combined_header" prefix="css" section="in-portal:configure_styles" title_preset="base_style_edit"/>

<!-- ToolBar -->
<table class="toolbar" height="30" cellspacing="0" cellpadding="0" width="100%" border="0">
<tbody>
	<tr>
  	<td>
  		<script type="text/javascript">
				a_toolbar = new ToolBar();
				a_toolbar.AddButton( new ToolBarButton('select', '<inp2:m_phrase label="la_ToolTip_Save" escape="1"/>', function() {
							submit_event('selectors','<inp2:selectors_SaveEvent/>');
						}
					) );
				a_toolbar.AddButton( new ToolBarButton('cancel', '<inp2:m_phrase label="la_ToolTip_Cancel" escape="1"/>', function() {
							submit_event('selectors','OnCancel');
						}
				 ) );

				a_toolbar.Render();

				function ValidateRequired()
				{
					var $fields = new Array('<inp2:selectors_InputName field="Name"/>',
											'<inp2:selectors_InputName field="SelectorName"/>');
					var $ret = true;
					var $i = 0;
					var $value = '';
					while($i < $fields.length)
					{
						$value = document.getElementById( $fields[$i] ).value;
						$value = $value.replace(' ','');
						if($value.length == 0)
						{
							$ret = false;
							break;
						}
						$i++;
					}
					return $ret;
				}

				function editStyle()
				{
					if( ValidateRequired() )
					{
						openSelector('selectors', '<inp2:m_t t="stylesheets/style_editor" pass="all" no_amp="1" js_escape="1"/>', '', '850x460', 'OnOpenStyleEditor');
					}
					else
					{
						alert( RemoveTranslationLink('<inp2:m_phrase name="la_RequiredWarning"/>') );
					}
				}
			</script>
		</td>
	</tr>
</tbody>
</table>

<inp2:selectors_SaveWarning name="grid_save_warning"/>
<inp2:selectors_ErrorWarning name="form_error_warning"/>

<div id="scroll_container">
	<table class="edit-form">
		<inp2:m_RenderElement name="subsection" prefix="selectors" fields="SelectorId,SelectorName,Name,Description,AdvancedCSS" title="la_section_General"/>
			<inp2:m_RenderElement name="inp_edit_hidden" prefix="selectors" field="StylesheetId"/>
			<input type="hidden" name="<inp2:selectors_InputName field="Type"/>" value="1">

			<inp2:m_RenderElement name="inp_id_label" prefix="selectors" field="SelectorId" title="la_fld_SelectorId"/>
			<inp2:m_RenderElement name="inp_edit_box" prefix="selectors" field="SelectorName" title="la_fld_SelectorName" size="40"/>
			<inp2:m_RenderElement name="inp_edit_box" prefix="selectors" field="Name" title="la_fld_Name" size="40"/>
			<inp2:m_RenderElement name="inp_edit_textarea" prefix="selectors" field="Description" title="la_fld_Description" rows="10" cols="40"/>
			<inp2:m_RenderElement name="inp_edit_textarea" prefix="selectors" field="AdvancedCSS" title="la_fld_AdvancedCSS" rows="10" cols="40"/>

			<tr class="<inp2:m_odd_even odd='edit-form-odd' even='edit-form-even'/>">
				<inp2:m_inc param="tab_index" by="1"/>
				<td class="label-cell">
					<inp2:m_phrase name="la_fld_SelectorData"/>:<br>
					<a href="javascript:editStyle();"><img src="img/icons/icon24_link_editor.gif" style="cursor:hand" border="0"></a>
				</td>
				<td class="control-mid">&nbsp;</td>
				<td class="control-cell">
					<table width="100%">
						<tr>
							<td><inp2:m_phrase name="la_StyleDefinition"/>:</td>
							<td>
								<inp2:selectors_PrintStyle field="SelectorData"/>
							</td>
							<td><inp2:m_phrase name="la_StylePreview"/>:</td>
							<td style="<inp2:selectors_PrintStyle field="SelectorData" inline="inline"/>">
								<inp2:m_phrase name="la_SampleText"/>
							</td>
						</tr>
					</table>
				</td>
			</tr>
			<inp2:m_RenderElement name="inp_edit_filler"/>
	</table>
</div>
<input type="hidden" name="main_prefix" id="main_prefix" value="selectors">
<inp2:m_include t="incs/footer"/>