[% WRAPPER _conf_frame.tt %]
<script src="[% url_prefix %]vendor/linedtextarea-e619e09/jquery-linedtextarea.js" type="text/javascript" charset="utf-8"></script>

<form action="conf.cgi" method="POST" id="saveform" class="w-full h-full">
  <input type="hidden" name="sub" value="objects">
  <input type="hidden" name="action" value="savefile">
  <input type="hidden" name="file" value="[% file_link | html %]">
  <input type="hidden" name="content" value="" id='filecontent'>
  <input type="hidden" name="CSRFtoken" value="[% get_user_token(c) %]">
  [% IF show_object && back == "edit" %]
  <input type="hidden" name="data.id" value="[% object.get_id() %]">
  [% END %]
  <input type="hidden" name="line" value="" id="fileline">
  [% IF c.req.parameters.exists('backlink') %]
  <input type="hidden" name="backlink" value="[% c.req.parameters.backlink | html %]">
  [% END %]
  [% file_locked = ""; PROCESS _conf_ondemand_file_edit.tt file=file form="saveform" %]
  [% readonly = 0;
  IF file.readonly; readonly = 1; END;
  IF file_locked; readonly = 1; END;
  %]
  <div class="card w-full h-full flexcol flex-nowrap gap-0 overflow-hidden">
    <div class="head justify-between">
      <a href="[% IF c.req.parameters.exists('backlink') %][% c.req.parameters.backlink | html %][% ELSIF show_object && back == "edit" %]conf.cgi?sub=objects&amp;data.id=[% object.get_id() %][% ELSE %]conf.cgi?sub=objects&amp;action=browser#[% file_link | uri %][% END %]" onclick="return confirm_discard_changes()" class="button header-button rounded w-[70px]" title="Go back">
        <i class="uil uil-angle-double-left"></i>Back
      </a>
      <h3>
        <span id="filename" class="js-copy-to-clipboard">[% file_link | html %]</span>
        [% IF file.readonly %]<span class="textHINT"> (read-only)</span>[% END %]
        [% IF file_locked %] <br><a href="[% uri_with(c, unlock => 1) %]"><span class="textHINT"> File is currently locked by [% file_locked.user %]. Edit Anyway? (Last changed: [% date_format(c, file_locked.time) %]) </span></a>[% END %]
      </h3>
      <div>
        [% UNLESS readonly %]<a class="button w-40 green" href='#' onClick="save_file(this); return false;"><i class="uil uil-save"></i> save</a>[% END %]
      </div>
    </div>
    <div class="w-full h-full flex overflow-hidden">
      <textarea id="texteditor" name="texteditor" class="w-full h-full" wrap="off"[% IF readonly %] readonly[% END %] style="line-height: 15px; white-space: pre;">[% escape_html(file_content) %]</textarea>
      <script>
        var editor;
        var original_value;
        window.onload = function() {
            editor = document.getElementById('texteditor');

            // save original value decoded
            original_value = editor.value;

            jQuery("#texteditor").linedtextarea(
            {selectedLine: [% line %]}
            );
            set_current_line([% line %]);
        };

        /* intercept when there are unsaved changes */
        function confirm_discard_changes() {
            form = document.getElementById('saveform');
            if(has_changed() && !form.needs_reload) {
                return confirm("File has been changed. Really discard changes?");
            }
            return true;
        }

        function get_current_line() {
            return(editor.value.substr(0, getCaret(editor)).split("\n").length);
        }

        function set_current_line(line) {
            var visibleLines = Math.round(editor.clientHeight / Number(editor.style.lineHeight.replace("px", "")));
            var pos = editor.value.split("\n").slice(0, line+Math.round(visibleLines/2)).join("\n").length + 1;
            var texteditor = jQuery(editor);
            var text = texteditor.val();
            var textBeforePosition = text.substr(0, pos);
            texteditor.blur();
            texteditor.val(textBeforePosition);
            texteditor.focus();
            texteditor.val(text);

            pos = editor.value.split("\n").slice(0, line-1).join("\n").length + 1;
            editor.selectionStart = pos;
            editor.selectionEnd   = pos;
        }

        function has_changed() {
            if(editor.value != original_value) {
                return true;
            }
            return false;
        }

        function save_file(btn) {
            form = document.getElementById('saveform');
            document.getElementById('filecontent').value = editor.value;
            [%+ IF show_object && back == "edit" +%]
            document.getElementById('fileline').value    = get_current_line();
            [%+ END +%]

            setBtnSpinner(btn);
            form.submit();
        }
      </script>
    </div>
  </div>
</form>

[% END %]
