<link rel="stylesheet" href="includes/js/bootstrap-select-1.12.4/dist/css/bootstrap-select.min.css">
<script src="includes/js/bootstrap-select-1.12.4/dist/js/bootstrap-select.min.js"></script>
<link rel="stylesheet" href="includes/js/bootstrap-select-1.12.4/dist/css/bootstrap-select.min.css">
<script src="includes/js/bootstrap-select-1.12.4/dist/js/bootstrap-select.min.js"></script>
<script src="includes/js/bootstrap-select-1.12.4/dist/js/i18n/defaults-[% if $user->language_type == "de" %]de_DE[% else %]en_US[% /if %].min.js"></script>
<script>
    $('.selectpicker').selectpicker();
    var noneSelectedText = '--[% $user->gettext('Bitte wählen') %]--';
</script>
<link rel="stylesheet" href="includes/js/sceditor-2.1.2/minified/themes/default.min.css" type="text/css" media="all" />
<script type="text/javascript" src="includes/js/sceditor-2.1.2/minified/jquery.sceditor.bbcode.min.js"></script>
<script type="text/javascript" src="includes/js/sceditor-2.1.2/languages/[% $user->language_type %].js"></script>
<script type="text/javascript" src="includes/js/sceditor-2.1.2/development/plugins/hmfunctions.js"></script>
<!-- SCEditor -->
<style>
    .sceditor-button-insertSnippet div { background: url('images/project.png'); }
    .sceditor-button-addSnippet div { background: url('images/project_add.png'); }
    .sceditor-button-showSnippetlist div { background: url('images/content.png'); }
    .ui-multiselect-menu {min-width: 225px !important;}

    .close.withoutHeader {
        margin-right: -30px;
        margin-top: -31px;
        font-size: 2em;
    }
</style>
<style>
    .sceditor-button-insertSnippet div { background: url('images/project.png') !important; }
    .sceditor-button-addSnippet div { background: url('images/project_add.png') !important; }
    .sceditor-button-showSnippetlist div { background: url('images/content.png') !important; }
    .sceditor-container html{height: 100% !important;}
    p{
        margin-bottom:0px;
    }
</style>
<form action="[% $action %]" method="POST" name="activity" id="activityForm"  class="form-horizontal form-label-left">
    <input type="hidden" name="aid" value="[% $aid %]" />
    <input type="hidden" name="fid" value="[% $fid %]" />
    <input type="hidden" name="action" value="store" />

    <script language="JavaScript" src="modules/workflow/javascript/validation_forms.js" type="text/JavaScript"></script>
    <div class="row">
        [% foreach from=$form.fields item=field key=FieldID name=fieldlist %]
            [% if $field.ContainerID > 0 %]
                [% if !$Tools->FCS_InArray($field.ContainerID, $containerID) %]
                    [% $containerID[] = $field.ContainerID %]
                    <div class="col-12">
                    <div class="card panel-info shadow-sm rounded">
                        <div class="card-header">
                            <span class="fcs-card-title">[% $field.container %]</span>
                        </div>
                        <div class="card-body" id="container_[% $field.ContainerID %]_body">
                            <div class="row" id="container_[% $field.ContainerID %]_row">
                                 <div class="col-[% if !$field.columnwidth %]12[% else %][% $field.columnwidth %][% /if %]">
                            [% include file=$modulePath|cat:"/view_activityInstanceFormField.tpl" field=$field FieldID=$FieldID initialCall=1 %]
                                 </div>
                            </div>
                        </div>
                    </div>
                    </div>
                [% else %]
                    <script>
                        $("#container_[% $field.ContainerID %]_row").append(`<div class="col-[% if !$field.columnwidth %]12[% else %][% $field.columnwidth %][% /if %]">[% include file=$modulePath|cat:'/view_activityInstanceFormField.tpl' field=$field FieldID=$FieldID initialCall=1 %]</div>`);
                    </script>
                [% /if %]
            [% else %]
                <div class="col-[% if !$field.columnwidth %]12[% else %][% $field.columnwidth %][% /if %]">
                    [% include file=$modulePath|cat:"/view_activityInstanceFormField.tpl" field=$field FieldID=$FieldID initialCall=1 %]
                </div>

            [% /if %]
        [% /foreach %]
        <div>
            <div class="">
                [% if $aid > 0 && $editable  %]
                    <div id="SubmitMessage"></div>
                    <div class="btn-group text-center">
                        <input type="button" class="btn btn-outline-primary" id="IntermediateSaving" value="[% $user->gettext('Zwischenspeichern') %]"/>
                        <input type="reset" class="btn btn-outline-secondary" onclick="resetForm();" value="[% $user->gettext('Zur&uuml;cksetzen') %]" />
                    </div>
                [% /if %]
            </div>
        </div>
    </div>
</form>
<a href="index.php?module=ticket&class=snippets" id="showSnippetlist" class="dialog_ticketlist" style="display:none;">SnippetList</a>
<a href="#addSnippet" id="showAddSnippet" class="dialog_medium" style="display:none;">Add Snippet</a>

<div id="addSnippet" style="display:none;">
    <div class="card panel-info shadow-sm rounded">
        <div class="card-header">
            <h3 class="fcs-card-title">[% $user->gettext('Textbaustein zufügen') %]</h3>
        </div>
        <div class="card-body">
            <form action="index.php?module=ticket&class=snippets&event=add"  id="addSnippetForm"  method="POST" class="form-horizontal form-label-left">
                <div class="form-group row mb-3">
                    <label class="col-lg-4 control-label">[% $user->gettext('Titel') %]</label>
                    <div class="col-lg-8">
                        <input type="text" name="title" maxlength="100" class="form-control" required="required" placeholder="[% $user->gettext('Titel des Textbausteines') %]"/>
                    </div>
                </div>
                <div class="form-group row mb-3">
                    <label class="col-lg-4 control-label">Text</label>
                    <div class="col-lg-8">
                        <textarea name="snippet" required="required" style="width:100%;height: 20em;"></textarea>
                    </div>
                </div>
                [% if $user->hasRight(224) %]
                    <div class="form-group row mb-3">
                        <label class="col-lg-4 control-label" for="public">[% $user->gettext('Öffentlich') %]</label>
                        <div class="col-lg-8">
                            <input type="checkbox" name="public" value="1">
                        </div>
                    </div>
                [% /if %]
                <input type="submit" onclick="" class="btn btn-outline-primary" value="[% $user->gettext('Speichern') %]" />
            </form>
        </div>
    </div>
</div>
<script type="text/javascript" src="includes/js/jquery-ui-timepicker-addon.js"></script>
<link rel="stylesheet" type="text/css" href="styles/[% $CSSTEMPLATE %]/css/jquery-ui-timepicker-addon.css" media="screen" />

<script>



    var $l_ToggleWYSIWYG = '[% $user->gettext('WYSIWYG-Editor aktivieren') %]';
    var $l_ToggleWYSIWYGDeactivate = '[% $user->gettext('WYSIWYG-Editor deaktivieren') %]';

    var ErrorMessages = new Array();
    ErrorMessages[101] = "[% $user->gettext('Es wurde kein Eintrag selektiert.') %]";
    ErrorMessages[102] = "[% $user->gettext('Es wurden nicht alle Einträge selektiert.') %]";
    ErrorMessages[201] = "[% $user->gettext('Keine g&uuml;ltige Zahl.') %]";
    ErrorMessages[202] = "[% $user->gettext('Keine Gleitkommazahl.') %]";
    ErrorMessages[301] = "[% $user->gettext('Ung&uuml;ltiges Datumsformat.') %]";
    ErrorMessages[302] = "[% $user->gettext('Ung&uuml;ltiges Datumsformat.') %]";
    ErrorMessages[303] = "[% $user->gettext('Ung&uuml;ltiges Zeitformat.') %]";
    ErrorMessages[304] = "[% $user->gettext('Keine Jahreszahl.') %]";
    ErrorMessages[404] = "[% $user->gettext('Feld muss ausgef&uuml;llt werden.') %]";
    ErrorMessages[405] = "[% $user->gettext('Das Feld darf nur aus Buchstaben und Zahlen bestehen.') %]";
    ErrorMessages[406] = "[% $user->gettext('Nur Grossbuchstaben erlaubt') %]";
    ErrorMessages[407] = "[% $user->gettext('Nur Kleinbuchstaben erlaubt.') %]";
    ErrorMessages[408] = "[% $user->gettext('Keine g&uuml;ltige URL.') %]";
    ErrorMessages[409] = "[% $user->gettext('Keine g&uuml;ltige eMail.') %]";

    [% foreach from=$form.fields item=field %]
        [% if $field.type != "seperator" && $field.type != "notice" %]
    fields.push(new field("[% $field.type %]", "[% $field.name %]", "[% $field.required %]", "[% $field.eval %]"));

    [% if isset($field.Subform) && $Tools->FCS_Count($field.Subform) %]
        [% foreach from=$field.Subform item=subfield1 %]
        [% foreach from=$subfield1 item=subfield %]
            [% if $subfield.type != "seperator" && $subfield.type != "notice" %]
                fields.push(new field("[% $subfield.type %]", "[% $subfield.name %]", "[% $subfield.required %]", "[% $subfield.eval %]"));
            [% /if %]
        [% /foreach %]
            [% /foreach %]
    [% /if %]
        [% /if %]
    [% /foreach %]


    $(".datepicker").datepicker();
    $(".datetimepicker").datetimepicker({
        currentText: 'Jetzt',
        closeText: 'OK',
        timeText: 'Zeit',
        hourText: 'Stunde'
    });


    $(".multiple").selectpicker({liveSearch: true});


    var checkInputFieldsChecked = function () {
        try {
            $('.SubformField').hide();
            checkInputFieldsSelected();
            $("input:checked").each(function (e) {
                var name2 = $(this).attr("name");
                    var value2 = $(this).val().replace(' ', '');
                if (name2 != 'undefined') {
                    name2 = name2.replace('[]', '').replace(' ', '');
                    value3 = value2.replaceAll(/\s/g, "").replaceAll('(', '\\(').replaceAll(')', '\\)').replaceAll('.', '\\.').replaceAll('/', '\\/').replaceAll('&', '\\&');
                    var classname = "" + name2 + "_" + value3;
                    clearName = classname.replace(/\W/g, "");
                    // $("#SubFormUnderOption_" + name + "_" + value).html(html);
                    $("#SubFormUnderOption_"+name2+"_"+value3).append( $("." + clearName));
                    $("." + clearName).show();
                }
            })

        } catch (e) {
            console.log("Exception: ", e);
        }
    };

    var checkInputFieldsSelected = function () {
        try {
            var name = $(this).attr("name");
            if (name != 'undefined') {
                name = name.replace(/\W/g, "");

                $(".SFForField_" + name).hide();

                $("select").each(function (e) {
                    var name = $(this).attr("name");
                    if (name != 'undefined') {
                        console.log("Name of field: " + name);
                        name = name.replace('[]', '').replace(' ', '');
                        var value = $(this).val().replace(/\s/g, "");
                        var classname = "" + name + "_" + value;

                        clearName = classname.replace(/\W/g, "");

                        $("." + clearName).show();
                    }
                })
            }
        } catch (e) {

            return false;
        }
    };

    checkInputFieldsChecked();
    checkInputFieldsSelected();

    $("input[type=checkbox], input[type=radio]").on("click", checkInputFieldsChecked);
    $("select").on("change", checkInputFieldsSelected);
    $('.AdressSelection').select2({theme: 'bootstrap-5'});

    function getStyle(className) {
        var rules = "";
        var classes = document.styleSheets[0].rules || document.styleSheets[0].cssRules;
        for (var x = 0; x < classes.length; x++) {
            if (classes[x].selectorText == className) {
                if (classes[x].cssText) {
                    rules = classes[x].cssText;
                } else {
                    rules = classes[x].style.cssText;
                }
                //(classes[x].cssText) ? alert(classes[x].cssText) : alert(classes[x].style.cssText);
            }
        }
        return rules.replace(className, '');
    }

    $("#addSnippetForm").submit(function (event) {
        // Das eigentliche Absenden verhindern
        event.preventDefault();

        // Das sendende Formular und die Metadaten bestimmen
        var form = $(this); // Dieser Zeiger $(this) oder $("form"), falls die ID form im HTML exisitiert, klappt übrigens auch ohne jQuery ;)
        var action = form.attr("action"), // attr() kann enweder den aktuellen Inhalt des gennanten Attributs auslesen, oder setzt ein neuen Wert, falls ein zweiter Parameter gegeben ist
                method = form.attr("method"),
                data = form.serialize(); // baut die Daten zu einem String nach dem Muster vorname=max&nachname=Müller&alter=42 ... zusammen

        // Der eigentliche AJAX Aufruf
        $.ajax({
            url: action,
            type: method,
            data: data
        }).done(function (data) {
            // Bei Erfolg
            //alert("Erfolgreich:" + data);
            form.find('input:text, input:password, input:file, select, textarea').val('');
            $("#addSnippetForm").trigger("reset");
            $.fancybox.close();
        }).fail(function () {
            // Bei Fehler
            alert("Fehler!");
        }).always(function () {
            // Immer
            //alert("Beendet!");
        });
    });

    $(".dialog_medium").fancybox({
        maxWidth: 1000,
        maxHeight: 1000,
        closeClick: false
    });

    $(".wf_assets").select2({theme: 'bootstrap-5',
        theme: "bootstrap",
        language: ts_lang,
        minimumInputLength: 3,
        ajax: {
            url: "index.php?module=ticket&event=getDeviceJSON&tid=" + TicketID,
            dataType: 'json',
            delay: 250,
            data: function (params) {
                return {
                    q: params.term, // search term
                    page: params.page
                };
            },
            processResults: function (data) {
                //console.log(data);
                return {
                    results: data.results
                };
            }
        }
    })


    $('#IntermediateSaving').on('click', function (e){
        $('#activityForm [required]').addClass('addRequired');
        $('#activityForm [required]').removeAttr('required');
        $('#activityForm').submit();
        $('.addRequired').attr('required', 'required').removeClass('addRequired');

    noty();

    })

</script>
 <script  src="includes/js/quill2.0.3/hm_quill_wf.js"></script>

<script>
    $(".openInBigIFrameModal").on("click", function (e) {
        console.log("Ha");
        e.preventDefault();
        url = $(this).attr('href');

        $("#myBigIFrameModal").modal("show");
    });

    $(document).ready(function () {
        $(".contactSelect").select2({theme: 'bootstrap-5',
            language: ts_lang,
            ajax: {
                url: "index.php?module=contact&event=getJsonContacts",
                dataType: 'json',
                delay: 250,
                data: function (params) {
                    return {
                        q: params.term, // search term
                        page: params.page
                    };
                },
                processResults: function (data) {
                    return {
                        results: data.items
                    };
                }
            },
            escapeMarkup: function (markup) {
                return markup;
            }
        });

        $('.userSelect').select2({
            theme: 'bootstrap-5',
            language: ts_lang,
        ajax: {
            url: 'index.php?module=user&event=getAllUsersJSON&WithUsername=1',
            processResults: function (data) {
                return {
                    results: data.items
                };
            }
        }
    });

    })

    /**
 * res
 */
function resetForm() {

    $('.ql-editor').html('');

}
</script>
[% if $aid > 0 %]
</form>
</body>
</html>
[% /if %]

[% if $TicketIsClosed %]
<script>
$(document).ready(function(){
// Disable normal text controls
document.querySelectorAll('input, textarea, select, [contenteditable="true"]').forEach(el => {
  if (el.hasAttribute('contenteditable')) {
    el.setAttribute('contenteditable', 'false');
  } else {
    el.disabled = true;
  }
});
});
</script>
[% /if %]

