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

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

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

	<table style="width:310px;" class="wrappable">
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.text}
			</td>
			<td>
				<div id="grippieMainContainer" style="padding: 0;margin: 0;">
					<div id="grippieContainer_text_" style="padding: 0;margin: 0;">
						{if $_LANG.DTM.tpl.controls.text.text_tooltip}
							<a
								href="#"
								class="icon-infoBlue help"
								tooltip="
									<div style='width:250px;'>
									{$_LANG.DTM.tpl.controls.text.text_tooltip}<br/>
									- {$_LANG.DTM.tpl.controls.text.text_tooltip1}<br/>
									- {$_LANG.DTM.tpl.controls.text.text_tooltip2}<br/>
									- {$_LANG.DTM.tpl.controls.text.text_tooltip3}</div>" ></a>
						{/if}

						<a href="#" class="icon-add" onclick="textShowAdvancedOptions(this); return false;" ></a>

						<textarea
							rows="4"
							cols="25"
							name="{$control}{$id}[text]"
							wrap="off"
							id="text"
						>{$data.text}</textarea>
					</div>
					<div id="grippie_text_"></div>
				</div>
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.coordinates}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.coordinates_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.coordinates_tooltip}" ></a>
				{/if}
				{include file="controls/selector.coordinates.tpl" control=$control data=$data}
				{include file="controls/selector.fixed.tpl" control=$control data=$data pre='pre'}
				{include file="controls/selector.block.tpl" control=$control data=$data}
				{include file="controls/selector.repeatable.tpl" control=$control name="repeatable" data=$data}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.assignedGroup}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.assignedGroup_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.assignedGroup_tooltip}" ></a>
				{/if}
				{include file="controls/selector.group.tpl" control=$control name="assignedGroup"}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.color}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.color_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.color_tooltip}" ></a>
				{/if}
				{include file="controls/selector.color.tpl" name="color" control=$control}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.dimensions}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.dimensions_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.dimensions_tooltip}" ></a>
				{/if}
				<input
					type="Wmm"
					class="attributes_dimensions"
					name="{$control}{$id}[Wmm]"
					id="Wmm"
					value="{$data.Wmm}"
				/>{$_LANG.DTM.tpl.mm}
				/
				<input
					type="Hmm"
					class="attributes_dimensions"
					name="{$control}{$id}[Hmm]"
					id="Hmm"
					value="{$data.Hmm}"
				/>{$_LANG.DTM.tpl.mm}

				{******** HIDDEN COORDINATES ************}
				<input
					type="W"
					name="{$control}{$id}[W]"
					id="W"
					value="{$data.W}"
					style="display: none;"
				/>
				<input
					type="H"
					name="{$control}{$id}[H]"
					id="H"
					value="{$data.H}"
					style="display: none;"
				/>
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.letterSpacing}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.letterSpacing_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.letterSpacing_tooltip}" ></a>
				{/if}
				<input
					type="letterSpacing"
					class="attributes_dimensions"
					name="{$control}{$id}[letterSpacing]"
					id="letterSpacing"
					value="{$data.letterSpacing}"
				/>{$_LANG.DTM.tpl.mm}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.layer}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.layer_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.layer_tooltip}" ></a>
				{/if}
				{include file="controls/selector.layer.tpl" name="layer" control=$control data=$data}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.backgroundColor}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.backgroundColor_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.backgroundColor_tooltip}" ></a>
				{/if}
				{include file="controls/selector.color.tpl" name="backgroundColor" control=$control data=$data}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.fontFamily}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.fontFamily_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.fontFamily_tooltip}" ></a>
				{/if}
				{include file="controls/selector.fontFamily.tpl" name="fontFamily" control=$control data=$data}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.fontSize}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.fontSize_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.fontSize_tooltip}" ></a>
				{/if}
				{include file="controls/selector.fontSize.tpl" name="fontSize" control=$control data=$data}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.align}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.align_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.align_tooltip}" ></a>
				{/if}
				{include file="controls/selector.alignment.tpl" name="align" control=$control data=$data}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.textStyle}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.textStyle_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.textStyle_tooltip}" ></a>
				{/if}
				{include file="controls/selector.textStyle.tpl" name="style" control=$control nameStyle='inline' data=$data}
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.conditionalVisibility}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.conditionalVisibility_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.conditionalVisibility_tooltip}" ></a>
				{/if}
				<input
					type="text"
					name="{$control}{$id}[conditionalVisibility]"
					id="conditionalVisibility"
					style="width:120px;"
					value="{$data.conditionalVisibility}" />
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.transparency}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.transparency_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.transparency_tooltip}" ></a>
				{/if}
				<input
					type="opacity"
					name="{$control}{$id}[opacity]"
					id="opacity"
					value="{$data.opacity}"
					class="attributes_opacity"
				/> %
			</td>
		</tr>
		<tr>
			<td>
				{$_LANG.DTM.tpl.controls.text.textRotation}
			</td>
			<td>
				{if $_LANG.DTM.tpl.controls.text.textRotation_tooltip}
					<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.textRotation_tooltip}" ></a>
				{/if}
				<select
					name="{$control}{$id}[textRotation]"
					id="textRotation">
					{foreach from=$CFG.DTM.module.textRotation key=key item=angle}
						<option
							value="{$key}"
							{if $data.textRotation==$key}
								selected="selected"
							{/if}
							>{$_LANG.DTM.tpl.textRotation[$key]|default:$angle}</option>
					{/foreach}
				</select>
			</td>
		</tr>
	</table>

	<fieldset style="width:310px;" class="default">
		<legend
			onclick="toggleContainer(this);"
			>{$_LANG.DTM.tpl.controls.text.margin_padding} <img src="{$smarty.const.SMARTY_BLANKGIF}" alt="" align="absmiddle" class="imgIcon icon-expand-10" /></legend>
		<table style="display: none; width:265px;" class="wrappable">
			<tr>
				<td>
					{$_LANG.DTM.tpl.controls.text.padding}
				</td>
				<td>
					{if $_LANG.DTM.tpl.controls.text.padding_tooltip}
						<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.margin_tooltip}" ></a>
					{/if}
					<table style="width:265px;" cellpadding="0" cellspacing="0" class="wrappable">
						<tr>
							<td>
								{$_LANG.DTM.tpl.top}
							</td>
							<td>
								<input
									type="padding_top"
									name="{$control}{$id}[padding_top]"
									id="padding_top"
									value="{$data.padding_top}"
									class="attributes_padding"
								/>
							</td>
						</tr>
						<tr>
							<td>
								{$_LANG.DTM.tpl.bottom}
							</td>
							<td>
								<input
									type="padding_bottom"
									name="{$control}{$id}[padding_bottom]"
									id="padding_bottom"
									value="{$data.padding_bottom}"
									class="attributes_padding"
								/>
							</td>
						</tr>
						<tr>
							<td>
								{$_LANG.DTM.tpl.left}
							</td>
							<td>
								<input
									type="padding_left"
									name="{$control}{$id}[padding_left]"
									id="padding_left"
									value="{$data.padding_left}"
									class="attributes_padding"
								/>
							</td>
						</tr>
						<tr>
							<td>
								{$_LANG.DTM.tpl.right}
							</td>
							<td>
								<input
									type="padding_right"
									name="{$control}{$id}[padding_right]"
									id="padding_right"
									value="{$data.padding_right}"
									class="attributes_padding"
								/>
							</td>
						</tr>
					</table>
				</td>
			</tr>
			<tr>
				<td>
					{$_LANG.DTM.tpl.controls.text.margin}
				</td>
				<td>
					{if $_LANG.DTM.tpl.controls.text.margin_tooltip}
						<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.margin_tooltip}" ></a>
					{/if}
					<table cellmargin="0" cellspacing="0" style="width:265px;" class="wrappable">
						<tr>
							<td>
								{$_LANG.DTM.tpl.top}
							</td>
							<td>
								<input
									type="margin_top"
									name="{$control}{$id}[margin_top]"
									id="margin_top"
									value="{$data.margin_top}"
									class="attributes_padding"
								/>
							</td>
						</tr>
						<tr>
							<td>
								{$_LANG.DTM.tpl.bottom}
							</td>
							<td>
								<input
									type="margin_bottom"
									name="{$control}{$id}[margin_bottom]"
									id="margin_bottom"
									value="{$data.margin_bottom}"
									class="attributes_padding"
								/>
							</td>
						</tr>
						<tr>
							<td>
								{$_LANG.DTM.tpl.left}
							</td>
							<td>
								<input
									type="margin_left"
									name="{$control}{$id}[margin_left]"
									id="margin_left"
									value="{$data.margin_left}"
									class="attributes_padding"
								/>
							</td>
						</tr>
						<tr>
							<td>
								{$_LANG.DTM.tpl.right}
							</td>
							<td>
								<input
									type="margin_right"
									name="{$control}{$id}[margin_right]"
									id="margin_right"
									value="{$data.margin_right}"
									class="attributes_padding"
								/>
							</td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
	</fieldset>

	<fieldset style="width:310px;" class="default">
		<legend
			onclick="toggleContainer(this);"
			>{$_LANG.DTM.tpl.controls.text.border} <img src="{$smarty.const.SMARTY_BLANKGIF}" alt="" align="absmiddle" class="imgIcon icon-expand-10" /></legend>
			{if $_LANG.DTM.tpl.controls.text.border_tooltip}
				<a href="#" class="icon-infoBlue help" tooltip="{$_LANG.DTM.tpl.controls.text.border_tooltip}" ></a>
			{/if}
			<table style="display: none; width:265px;" class="wrappable">
				<tr>
					<td>
						{$_LANG.DTM.tpl.controls.text.borderColor}
					</td>
					<td>
						{include file="controls/selector.color.tpl" name="borderColor" control=$control data=$data}
					</td>
				</tr>
				<tr>
					<td>
						{$_LANG.DTM.tpl.controls.text.borderVisibility}
					</td>
					<td>
						{include file="controls/selector.4borders_linear.tpl" name="border" control=$control}
					</td>
				</tr>
			</table>
	</fieldset>
</div>