<inp2:adm_SetPopupSize width="600" height="500"/>

<inp2:m_include t="incs/header"/>
<inp2:m_RenderElement name="combined_header" prefix="adm" section="in-portal:root" title_preset="column_picker"/>

<!-- 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() {
							set_hidden_field('picked_str',select_to_string('picked_columns'))
							set_hidden_field('hidden_str',select_to_string('available_columns'))
							submit_event('adm','OnSaveColumns');
						}
					) );

					a_toolbar.AddButton( new ToolBarButton('cancel', '<inp2:m_phrase label="la_ToolTip_Cancel" escape="1"/>', function() {
								submit_event('adm','OnClosePopup');
							}
					 	) );

					a_toolbar.AddButton( new ToolBarSeparator('sep2') );

					a_toolbar.AddButton( new ToolBarButton('move_up', '<inp2:m_phrase label="la_ToolTip_MoveUp" escape="1"/>::<inp2:m_phrase label="la_ShortToolTip_MoveUp" escape="1"/>', function() {
								move_options_up('picked_columns', 1)
							}
					 ) );

					a_toolbar.AddButton( new ToolBarButton('move_down', '<inp2:m_phrase label="la_ToolTip_MoveDown" escape="1"/>::<inp2:m_phrase label="la_ShortToolTip_MoveDown" escape="1"/>', function() {
								move_options_down('picked_columns', 1)
							}
					 ) );

					a_toolbar.Render();
			</script>

		</td>
	</tr>
</tbody>
</table>

<div id="scroll_container">
	<table width="100%" border="0" cellspacing="0" cellpadding="4">
		<tr>
			<td>
				<table style="width: 500px; margin: 5px auto;" >
					<tr>
						<td>
							<strong><inp2:m_phrase label="la_PickedColumns"/></strong>
						</td>
						<td>&nbsp;</td>
						<td>
							<strong><inp2:m_phrase label="la_AvailableColumns"/></strong>
						</td>
					</tr>
					<tr>
						<td style="text-align: left">
							<inp2:m_DefineElement name="a_column">
								<option value="<inp2:m_param name="_Id"/>"><inp2:m_param name="_Name"/></option>
							</inp2:m_DefineElement>

							<select id="picked_columns" multiple="multiple" size="20" style="width: 230px">
								<inp2:adm_PrintColumns render_as="a_column"/>
							</select>
							<br/><br/>
						</td>
						<td style="text-align: center; width: 40px;">
							<img style="cursor: pointer; border: 0px" src="img/icons/icon_left.gif" onclick="move_selected('available_columns', 'picked_columns');"/><br/>
							<img style="cursor: pointer; border: 0px" src="img/icons/icon_right.gif" onclick="move_selected('picked_columns', 'available_columns'); select_sort('available_columns');"/><br/>
						</td>
						<td style="text-align: left">
							<select id="available_columns" multiple="multiple" size="20" style="width: 230px">
								<inp2:adm_PrintColumns hidden="1" render_as="a_column"/>
							</select>
							<br/><br/>
						</td>
					</tr>
				</table>
			</td>
			<td>&nbsp;</td>
		</tr>
	</table>
</div>

<input type="hidden" name="main_prefix" value="<inp2:m_get var='main_prefix'/>"/>

<inp2:m_include t="incs/footer"/>