{******************************
	the attributes panel
*******************************}
{assign var=control value="image"}
<div id="pre_control_image_{$id}_attributes" style="display: none;">
	<div class="title">
		{******* DELETE ELEMENT ********}
		<a href="#;"
			onclick="Controls.removeByID('pre_control_image_{$id}');return false;"
			class="icon-delete"
			tooltip="{$_LANG.DTM.tpl.tooltip.delete}"
			></a>
		{******* CLONE ELEMENT ********}
		<a href="#;"
			onclick="Controls.cloneById('pre_control_image_{$id}');return false;"
			class="icon-clone"
			tooltip="{$_LANG.DTM.tpl.tooltip.clone}"
			></a>

		{if $_LANG.DTM.tpl.controls.image.title_tooltip}
			<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.title_tooltip}" ></a>
		{/if}

		{$_LANG.DTM.tpl.controls.image.title}
	</div>

	<div style="clear: both;"></div>

	<table class="options wrappable">
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.src}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.src_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.src_tooltip}" ></a>
				{/if}

				{include file="controls/selector.file.tpl" name="src" filter="images" control=$control attributeSelector="pre_control_image_`$id`_attributes"}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.coordinates}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.coordinates_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.coordinates_tooltip}" ></a>
				{/if}

				{include file="controls/selector.coordinates.tpl" control=$control}
				{include file="controls/selector.repeatable.tpl" control=$control name="repeatable"}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.assignedGroup}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.assignedGroup_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.assignedGroup_tooltip}" ></a>
				{/if}
				{include file="controls/selector.group.tpl" control=$control name="assignedGroup"}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.dimensions}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.dimensions_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.dimensions_tooltip}" ></a>
				{/if}

				<input
					type="Wmm"
					class="attributes_dimensions"
					name="{$control}{$id}[Wmm]"
					id="Wmm"
					value=""
				/>{$_LANG.DTM.tpl.mm}
				/
				<input
					type="Hmm"
					class="attributes_dimensions"
					name="{$control}{$id}[Hmm]"
					id="Hmm"
					value=""
				/>{$_LANG.DTM.tpl.mm}

				{******** HIDDEN DIMENSIONS ************}
				<input
					type="W"
					name="{$control}{$id}[W]"
					id="W"
					value=""
					style="display: none;"
				/>
				<input
					type="H"
					name="{$control}{$id}[H]"
					id="H"
					value=""
					style="display: none;"
				/>
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.scaling}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.scaling_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.scaling_tooltip}" ></a>
				{/if}

				<input
					type="scaleX"
					name="{$control}{$id}[scaleX]"
					id="scaleX"
					value=""
					class="attributes_dimensions"
				/>%&nbsp;&nbsp;&nbsp;
				/
				<input
					type="scaleY"
					name="{$control}{$id}[scaleY]"
					id="scaleY"
					value=""
					class="attributes_dimensions"
				/>%&nbsp;
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.layer}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.layer_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.layer_tooltip}" ></a>
				{/if}

				{include file="controls/selector.layer.tpl" name="layer" control=$control}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.transparency}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.transparency_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.transparency_tooltip}" ></a>
				{/if}

				<input
					type="opacity"
					name="{$control}{$id}[opacity]"
					id="opacity"
					value=""
					class="attributes_opacity"
				/> %
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.conditionalVisibility}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.conditionalVisibility_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.conditionalVisibility_tooltip}" ></a>
				{/if}
				<input
					type="text"
					name="{$control}{$id}[conditionalVisibility]"
					id="conditionalVisibility"
					style="width:120px;"
					value="" />
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.borderColor}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.borderColor_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.borderColor_tooltip}" ></a>
				{/if}

				{include file="controls/selector.color.tpl" name="borderColor" control=$control}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.borderVisibility}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.borderVisibility_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.borderVisibility_tooltip}" ></a>
				{/if}

				{include file="controls/selector.4borders_linear.tpl" name="border" control=$control}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.url}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.image.url_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.url_tooltip}" ></a>
				{/if}
				<input
					type="text"
					name="{$control}{$id}[URL]"
					id="URL"
					style="width:90%;"
					value="" />
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.image.details}
			</td>
			<td style="text-align: left;">
				{if $_LANG.DTM.tpl.controls.image.details_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.image.details_tooltip}" ></a>
				{/if}

				<div
					id="objectStatus"
					style=""></div>
			</td>
		</tr>
	</table>
</div>