# --
# AdminDynamicFieldDropdown.dtl - provides HTML form for AdminDynamicFieldsDropdown
# Copyright (C) 2001-2012 OTRS AG, http://otrs.org/
# --
# $Id: AdminDynamicFieldDropdown.dtl,v 1.19 2012/11/20 15:08:08 mh Exp $
# --
# This software comes with ABSOLUTELY NO WARRANTY. For details, see
# the enclosed file COPYING for license information (AGPL). If you
# did not receive this file, see http://www.gnu.org/licenses/agpl.txt.
# --

<div class="MainBox ARIARoleMain LayoutFixedSidebar SidebarFirst">
    <h1>$Text{"Dynamic Fields"} - $Text{"$Data{"ObjectTypeName"}"}: $Text{"$Data{"Mode"}"} $Text{"$Data{"FieldTypeName"}"} $Text{"Field"}</h1>

    <div class="Clear"></div>

    <div class="SidebarColumn">
        <div class="WidgetSimple">
            <div class="Header">
                <h2>$Text{"Actions"}</h2>
            </div>
            <div class="Content">
                <ul class="ActionList">
                    <li>
                        <a href="$Env{"Baselink"}Action=AdminDynamicField" class="CallForAction"><span>$Text{"Go back to overview"}</span></a>
                    </li>
                </ul>
            </div>
        </div>
    </div>

    <div class="ContentColumn">
        <form action="$Env{"CGIHandle"}" method="post" class="Validate PreventMultipleSubmits">
            <input type="hidden" name="Action" value="AdminDynamicFieldDropdown" />
            <input type="hidden" name="Subaction" value="$QData{"Mode"}Action" />
            <input type="hidden" name="ObjectType" value="$QData{"ObjectType"}" />
            <input type="hidden" name="FieldType" value="$QData{"FieldType"}" />
            <input type="hidden" name="ID" value="$QData{"ID"}" />

            <div class="WidgetSimple">
                <div class="Header">
                    <h2>$Text{"General"}</h2>
                </div>
                <div class="Content">
                    <div class="LayoutGrid ColumnsWithSpacing">
                        <div class="Size1of2">
                            <fieldset class="TableLike">
                                <label class="Mandatory" for="Name"><span class="Marker">*</span> $Text{"Name"}:</label>
                                <div class="Field">
                                    <input id="Name" class="W50pc $QData{"NameServerError"} $QData{"ShowWarning"}  Validate_Alphanumeric" type="text" maxlength="200" value="$QData{"Name"}" name="Name" $QData{"ReadonlyInternalField"} />
                                    <div id="NameError" class="TooltipErrorMessage"><p>$Text{"This field is required, and the value should be alphabetic and numeric characters only."}</p></div>
                                    <div id="NameServerError" class="TooltipErrorMessage"><p>$Text{"$Data{"NameServerErrorMessage"}"}</p></div>
                                    <p class="FieldExplanation">$Text{"Must be unique and only accept alphabetic and numeric characters."}</p>
                                    <p class="Warning Hidden">$Text{"Changing this value will require manual changes in the system."}</p>
                                </div>
                                <div class="Clear"></div>

                                <label class="Mandatory" for="Label"><span class="Marker">*</span> $Text{"Label"}:</label>
                                <div class="Field">
                                    <input id="Label" class="W50pc $QData{"LabelServerError"} Validate_Required" type="text" maxlength="200" value="$QData{"Label"}" name="Label"/>
                                    <div id="LabelError" class="TooltipErrorMessage"><p>$Text{"This field is required."}</p></div>
                                    <div id="LabelServerError" class="TooltipErrorMessage"><p>$Text{"$Data{"LabelServerErrorMessage"}"}</p></div>
                                    <p class="FieldExplanation">$Text{"This is the name to be shown on the screens where the field is active."}</p>
                                </div>
                                <div class="Clear"></div>

                                <label class="Mandatory" for="FieldOrder"><span class="Marker">*</span> $Text{"Field order"}:</label>
                                <div class="Field">
                                    $Data{"DynamicFieldOrderSrtg"}
                                    <div id="FieldOrderError" class="TooltipErrorMessage"><p>$Text{"This field is required and must be numeric."}</p></div>
                                    <div id="FieldOrderServerError" class="TooltipErrorMessage"><p>$Text{"$Data{"FieldOrderServerErrorMessage"}"}</p></div>
                                    <p class="FieldExplanation">$Text{"This is the order in which this field will be shown on the screens where is active."}</p>
                                </div>
                                <div class="Clear"></div>
                            </fieldset>
                        </div>
                        <div class="Size1of2">
                            <fieldset class="TableLike">
                                <label for="ValidID">$Text{"Validity"}:</label>
                                <div class="Field">
                                    $Data{"ValidityStrg"}
                                </div>
                                <div class="Clear"></div>

                                <div class="SpacingTop"></div>
                                <label for="FieldTypeName">$Text{"Field type"}:</label>
                                <div class="Field">
                                    <input id="FieldTypeName" readonly="readonly" class="W50pc" type="text" maxlength="200" value="$QData{"FieldTypeName"}" name="FieldTypeName"/>
                                    <div class="Clear"></div>
                                </div>

                                <div class="SpacingTop"></div>
                                <label for="ObjectTypeName">$Text{"Object type"}:</label>
                                <div class="Field">
                                    <input id="ObjectTypeName" readonly="readonly" class="W50pc" type="text" maxlength="200" value="$QData{"ObjectTypeName"}" name="ObjectTypeName"/>
                                    <div class="Clear"></div>
                                </div>

<!-- dtl:block:InternalField -->
                                <div class="SpacingTop"></div>
                                <label for="InternalField">$Text{"Internal field"}:</label>
                                <div class="Field">
                                    <input id="InternalField" readonly="readonly" class="W50pc" type="text" maxlength="1" value="$QData{"InternalField"}" name="InternalField"/>
                                    <p class="FieldExplanation">
                                        $Text{"This field is protected and can't be deleted."}
                                    </p>
                                    <div class="Clear"></div>
                                </div>
<!-- dtl:block:InternalField -->
                            </fieldset>
                        </div>
                    </div>
                </div>
            </div>
            <div class="WidgetSimple">
                <div class="Header">
                    <h2>$Text{"$Data{"FieldTypeName"}"} $Text{"Field Settings"}</h2>
                </div>
                <div class="Content">
                    <fieldset class="TableLike">
                        <label>$Text{"Possible values"}:</label>
                        <div class="Field ValueInsert">
                            <input type="hidden" name="ValueCounter" value="$QData{"ValueCounter"}" id="ValueCounter" class="ValueCounter" />
                            <div class="Spacing"></div>
<!-- dtl:block:ValueRow -->
                            <div class="ValueRow">
                                <label class="Mandatory" for="Key_$QData{"ValueCounter"}"><span class="Marker">*</span>$Text{"Key"}:</label>
                                <input name="Key_$QData{"ValueCounter"}" id="Key_$QData{"ValueCounter"}" class="DefaultValueKeyItem Validate_Required W20pc $QData{"KeyError"}" type="text" maxlength="100" value="$QData{"Key"}"/>
                                <div id="Key_$QData{"ValueCounter"}Error" class="TooltipErrorMessage"><p>$Text{"This field is required."}</p></div>
                                <div id="Key_$QData{"ValueCounter"}ServerError" class="TooltipErrorMessage"><p>$Text{"$Data{"KeyErrorStrg"}"}</p></div>

                                <label class="Mandatory" for="Value_$QData{"ValueCounter"}"><span class="Marker">*</span>$Text{"Value"}:</label>
                                <input name="Value_$QData{"ValueCounter"}" id="Value_$QData{"ValueCounter"}" class="DefaultValueItem Validate_Required W20pc $QData{"ValueError"}" type="text" maxlength="100" value="$QData{"Value"}"/>
                                <div id="Value_$QData{"ValueCounter"}Error" class="TooltipErrorMessage"><p>$Text{"This field is required."}</p></div>
                                <div id="Value_$QData{"ValueCounter"}ServerError" class="TooltipErrorMessage"><p>$Text{"This field is required."}</p></div>

                                <button type="button" id="RemoveValue_$QData{"ValueCounter"}" class="Remove ValueRemove" value="Remove value">$Text{"Remove value"}</button>
                                <div class="SpacingTopMini" ></div>
                            </div>
<!-- dtl:block:ValueRow -->
<!-- dtl:block:ValueTemplate -->
                            <div class="ValueTemplate Hidden">
                                <label class="Mandatory" for="Key"><span class="Marker">*</span>$Text{"Key"}:</label>
                                <input name="Key_$QData{"ValueCounter"}" id="Key" class="DefaultValueKeyItem W20pc" type="text" maxlength="100" value="$QData{"Key"}"/>
                                <div id="KeyError" class="TooltipErrorMessage"><p>$Text{"$Data{"KeyErrorStrg"}"}</p></div>
                                <div id="KeyServerError" class="TooltipErrorMessage"><p>$Text{"This field is required."}</p></div>

                                <label class="Mandatory" for="Value"><span class="Marker">*</span>$Text{"Value"}:</label>
                                <input name="Value_$QData{"ValueCounter"}" id="Value" class="DefaultValueItem W20pc" type="text" maxlength="100" value="$QData{"Value"}"/>
                                <div id="ValueError" class="TooltipErrorMessage"><p>$Text{"This field is required."}</p></div>
                                <div id="ValueServerError" class="TooltipErrorMessage"><p>$Text{"This field is required."}</p></div>

                                <button type="button" id="RemoveValue_$QData{"ValueCounter"}" class="Remove ValueRemove" value="Remove value">$Text{"Remove value"}</button>
                                <div class="SpacingTopMini" ></div>
                            </div>
<!-- dtl:block:ValueTemplate -->
                            <input type="hidden" name="DeletedValue" value="$QData{"DeletedString"}" id="DeletedValue" class="DeletedValue" />
                        </div>
                        <div class="Clear"></div>

                        <label for="AddValue">$Text{"Add value"}:</label>
                        <div class="Field">
                            <button id="AddValue" class="Add" type="button" value="Add Value">$Text{"Add Value"}</button>
                        </div>
                        <div class="Clear"></div>

                        <div class="SpacingTop"></div>
                        <label for="DefaultValue">$Text{"Default value"}:</label>
                        <div class="Field">
                            $Data{"DefaultValueStrg"}
                            <p class="FieldExplanation">$Text{"This is the default value for this field."}</p>
                        </div>
                        <div class="Clear"></div>

                        <div class="SpacingTop"></div>
                        <label for="DefaultValue">$Text{"Add empty value"}:</label>
                        <div class="Field">
                            $Data{"PossibleNoneStrg"}
                            <p class="FieldExplanation">$Text{"Activate this option to create an empty selectable value."}</p>
                        </div>
                        <div class="Clear"></div>

                        <label for="TranslatableValues">$Text{"Translatable values"}:</label>
                        <div class="Field">
                            $Data{"TranslatableValuesStrg"}
                            <p class="FieldExplanation">$Text{"If you activate this option the values will be translated to the user defined language."}</p>
                            <p class="FieldExplanation"><strong>$Text{"Note"}: </strong>$Text{"You need to add the translations manually into the language translation files."}</p>
                        </div>
                        <div class="Clear"></div>
                        <label for="Link">$Text{"Show link"}:</label>
                        <div class="Field">
                            <input id="Link" class="W50pc" type="text" maxlength="500" value="$QData{"Link"}" name="Link"/>
                            <p class="FieldExplanation">
                                $Text{"Here you can specify an optional HTTP link for the field value in Overviews and Zoom screens."}
                                <br/>
                                $Text{"Example"}: http://some.example.com/handle?query=<span>$</span>LQData{"Field1"}
                            </p>
                        </div>
                        <div class="Clear"></div>
                    </fieldset>
                </div>
            </div>
            <fieldset class="TableLike">
                <div class="Field SpacingTop">
                    <button type="submit" class="Primary" value="$Text{"Save"}">$Text{"Save"}</button>
                    $Text{"or"}
                    <a href="$Env{"Baselink"}Action=AdminDynamicField">$Text{"Cancel"}</a>
                </div>
                <div class="Clear"></div>
            </fieldset>
        </form>
    </div>
</div>
<!--dtl:js_on_document_complete-->
<script type="text/javascript">//<![CDATA[
$('.ShowWarning').bind('change keyup', function (Event) {
    $('p.Warning').removeClass('Hidden');
});

//bind click function to add button
$('#AddValue').bind('click', function () {
    Core.Agent.Admin.DynamicFieldDropdown.AddValue(
        $(this).closest('fieldset').find('.ValueInsert')
    );
    return false;
});

//bind click function to remove button
$('.ValueRemove').bind('click', function () {
    Core.Agent.Admin.DynamicFieldDropdown.RemoveValue($(this).attr('id'));
    return false;
});

$('.DefaultValueKeyItem,.DefaultValueItem').bind('keyup', function () {
    Core.Agent.Admin.DynamicFieldDropdown.RecreateDefaultValueList();
});

Core.Agent.Admin.DynamicField.ValidationInit();
//]]></script>
<!--dtl:js_on_document_complete-->
