{#
 # ---------------------------------------------------------------------
 #
 # GLPI - Gestionnaire Libre de Parc Informatique
 #
 # http://glpi-project.org
 #
 # @copyright 2015-2023 Teclib' and contributors.
 # @copyright 2003-2014 by the INDEPNET Development Team.
 # @licence   https://www.gnu.org/licenses/gpl-3.0.html
 #
 # ---------------------------------------------------------------------
 #
 # LICENSE
 #
 # This file is part of GLPI.
 #
 # This program is free software: you can redistribute it and/or modify
 # it under the terms of the GNU General Public License as published by
 # the Free Software Foundation, either version 3 of the License, or
 # (at your option) any later version.
 #
 # This program is distributed in the hope that it will be useful,
 # but WITHOUT ANY WARRANTY; without even the implied warranty of
 # MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 # GNU General Public License for more details.
 #
 # You should have received a copy of the GNU General Public License
 # along with this program.  If not, see <https://www.gnu.org/licenses/>.
 #
 # ---------------------------------------------------------------------
 #}

{% set timeline_btns_cls = left_regular_cls %}
{% set form_btns_cls     = is_expanded ? right_expanded_cls : "col-lg" %}
{% set timeline_btn_layout = session('glpitimeline_action_btn_layout') %}
{% set switch_btn_cls    = "fa-caret-left" %}
{% if is_expanded %}
    {% set timeline_btns_cls = left_expanded_cls %}
    {% set form_btns_cls     = right_expanded_cls %}
    {% set switch_btn_cls    = "fa-caret-right" %}
{% endif %}

<div class="mx-n2 mb-n2 itil-footer itil-footer p-0 border-top" id="itil-footer">
   <div class="buttons-bar d-flex py-2">
      <div class="col {{ timeline_btns_cls }} ps-3 timeline-buttons d-flex">
         {% if not item.isNewItem() %}
            {% set main_actions_itemtypes = timeline_itemtypes|filter((v, k) => v.hide_in_menu is not defined or v.hide_in_menu != true) %}

            {% set default_action_data = main_actions_itemtypes|first %}
            {% set default_action = main_actions_itemtypes|keys|first %}
            {% if item.isNotSolved() and default_action_data != false %}
               {% if main_actions_itemtypes|length > 1 %}
                  {% set btn_class = timeline_btn_layout == constant('Config::TIMELINE_ACTION_BTN_SPLITTED') ? "" : "btn-group" %}
                  <div class="{{ btn_class }} me-2 main-actions" style="{{ load_kb_sol > 0 ? 'display:none;' : '' }}">
               {% else %}
                  {# Don't use d-inline-flex class as it add an '!important' tag that mess with our javascript that will hide this div #}
                  <div class="main-actions" style="display:inline-flex">
               {% endif %}
                  <button
                     class="btn btn-primary answer-action mb-2 {{ default_action != "answer" ? "action-" ~ default_action : "" }}"
                     data-bs-toggle="collapse"
                     data-bs-target="#new-{{ default_action_data.class }}-block"
                  >
                     <i class="{{ default_action_data.icon }}"></i>
                     <span>{{ default_action_data.label }}</span>
                  </button>

                  {% if main_actions_itemtypes|length > 1 %}
                     {% if timeline_btn_layout == constant('Config::TIMELINE_ACTION_BTN_SPLITTED') %}
                        {% for action, timeline_itemtype in main_actions_itemtypes %}
                        {% if loop.index0 > 0 %}
                              <button class="ms-2 mb-2 btn btn-primary answer-action action-{{ action }}" data-bs-toggle="collapse" data-bs-target="#new-{{ timeline_itemtype.class }}-block">
                                 <i class="{{ timeline_itemtype.icon }}"></i>
                                 <span>{{ timeline_itemtype.short_label }}</span>
                              </button>
                              {% endif %}
                        {% endfor %}
                     {% else %}
                        <button
                           type="button"
                           class="btn btn-primary dropdown-toggle dropdown-toggle-split mb-2 {{ default_action != "answer" ? "action-" ~ default_action : "" }}"
                           data-bs-toggle="dropdown"
                           aria-expanded="false"
                        >
                           <span class="visually-hidden">{{ __('View other actions') }}</span>
                        </button>
                        <ul class="dropdown-menu">
                              {% for action, timeline_itemtype in main_actions_itemtypes %}
                                 {% if loop.index0 > 0 %}
                                 <li><a class="dropdown-item action-{{ action }} answer-action" href="#"
                                    data-bs-toggle="collapse" data-bs-target="#new-{{ timeline_itemtype.class }}-block">
                                    <i class="{{ timeline_itemtype.icon }}"></i>
                                    <span>{{ timeline_itemtype.label }}</span>
                                 </a></li>
                                 {% endif %}
                              {% endfor %}
                        </ul>
                     {% endif %}
                  {% endif %}
               </div>
            {% endif %}

            <ul class="legacy-timeline-actions">
               {{ legacy_timeline_actions|default('')|raw }}
            </ul>
            {{ include('components/itilobject/timeline/filter_timeline.html.twig') }}
         {% endif %}
     </div>

      <div class="form-buttons {{ form_btns_cls }} d-flex justify-content-between ms-auto ms-lg-0 my-n2 py-2 pe-3 card-footer border-top-0 position-relative">
         <span class="d-none d-lg-block ms-n3"
               data-bs-toggle="tooltip" data-bs-placement="top" title="{{ __('Toggle panels width') }}">
            <button type="button" class="switch-panel-width btn btn-icon btn-ghost-secondary px-0">
               <i class="fas {{ switch_btn_cls }}"></i>
            </button>
            <button type="button" class="collapse-panel btn btn-icon btn-ghost-secondary px-0 mr-1">
               <i class="fas fa-caret-right"></i>
            </button>
         </span>

         <span>
         {% if item.isNewItem() %}
            <button class="btn btn-primary" type="submit" name="add" form="itil-form"
                  title="{{ _x('button', 'Add') }}">
               <i class="fas fa-plus"></i>
               <span class="d-none d-lg-block">{{ _x('button', 'Add') }}</span>
            </button>
         {% else %}

            <div class="btn-group" role="group">
               {% if item.canDeleteItem() %}
                  {% if item.isDeleted() %}
                     <button class="btn btn-outline-secondary" type="submit" name="restore" form="itil-form"
                           title="{{ _x('button', 'Restore') }}">
                        <i class="fas fa-trash-restore-alt"></i>
                        <span class="d-none d-lg-block">{{ _x('button', 'Restore') }}</span>
                     </button>

                     <button class="btn btn-outline-danger" type="submit" name="purge" form="itil-form"
                           title="{{ _x('button', 'Delete permanently') }}"
                           onclick="return confirm('{{ __('Confirm the final deletion?') }}');">
                        <i class="ti ti-trash"></i>
                        <span class="d-none d-lg-block">{{ _x('button', 'Delete permanently') }}</span>
                     </button>
                  {% else %}
                     <button class="btn btn-outline-danger" type="submit" name="delete" form="itil-form"
                           title="{{ _x('button', 'Put in trashbin') }}"
                           data-bs-toggle="tooltip" data-bs-placement="top">
                        <i class="ti ti-trash"></i>
                     </button>
                  {% endif %}
               {% endif %}

               {% if canupdate %}
                  {{ include('components/form/single-action.html.twig', {
                     'onlyicon': true
                  }) }}
               {% endif %}

               {% set is_locked = params['locked'] is defined and params['locked'] %}
               {% set display_save_btn = not is_locked and (canupdate or can_requester or canpriority or canassign or canassigntome) %}
               {% if display_save_btn %}
                  <button class="btn btn-primary" type="submit" name="update" form="itil-form"
                        title="{{ _x('button', 'Save') }}">
                     <i class="far fa-save"></i>
                     <span class="d-none d-xl-block">{{ _x('button', 'Save') }}</span>
                  </button>
               {% endif %}
            </div>

         {% endif %}
         </span>
      </div>
   </div>
</div>

{% set openfollowup = (_get['_openfollowup'] ?? false) %}
{% set is_timeline_reversed = user_pref('timeline_order') == constant('CommonITILObject::TIMELINE_ORDER_REVERSE') %}

<script type="text/javascript">

(function(){
    {#
     # Form is displayed using bootstrap `data-bs-toggle="collapse"` that is available before full page load.
     # Therefore, `.answer-action` event listener have to be registered ASAP and should not be wrapped into a `$()` call.
     # We use a `(function(){})();` autocall wrapper to not expose globally the variables define in current script.
     #}
   var scrollToTimelineStart = function() {
        // scroll body to ensure we are at bottom (useful for responsive display)
        $('html, body').animate({
        scrollTop: {{ is_timeline_reversed ? "-" : "" }}$(document).height()
        }, 0, function(){
            // scroll timeline with animation
            var timeline = $("#itil-object-container .itil-left-side");
            timeline.animate({
                scrollTop: {{ is_timeline_reversed ? "-" : "" }}timeline.prop('scrollHeight')
            }, 'slow');
        });
   };

   $(document).on("click", "#itil-footer .answer-action", function() {
      scrollToTimelineStart();
      {% if timeline_btn_layout == constant('Config::TIMELINE_ACTION_BTN_MERGED') %}
         // hide answer button after clicking on it only for merge btn
         $(this).closest(".main-actions").hide();
      {% endif %}
   });

   $(function() {
      // when close button of new answer block is clicked, show again the new answer button
      {% if timeline_btn_layout == constant('Config::TIMELINE_ACTION_BTN_MERGED') %}
         $(document).on("click", "#new-itilobject-form .close-itil-answer", function() {
            $("#itil-footer .main-actions").show();
         });
      {% endif %}

      {% if openfollowup %}
         // trigger for reopen, show followup form in timeline
         var myCollapse = document.getElementById('new-ITILFollowup-block')
         var bsCollapse = new bootstrap.Collapse(myCollapse);
         bsCollapse.show();

         scrollToTimelineStart();
      {% endif %}
   });
})();

</script>