

<div class="container-fluid">

    <div class="row " >
        
        <div class="col text-truncate">
            <h2>
                <i class="bi bi-pencil"></i> {{ file_name }}
            </h2>
        </div>
        <div class="col text-end">
            <h2>
                <a href="javascript:void(0)" id="save_button" title="Save file"><i class="bi bi-floppy"></i></a>
                &nbsp;&nbsp;
                <a href="javascript:void(0)" id="cancel_button" title="Cancel"><i class="bi bi-x-circle"></i></a>
            </h2>
        </div>
        
    </div>
    
    <div class="row " >
        <div id="editor1"></div>
    </div>

</div>




<script src="/__assets/codemirror/cm6.bundle-20250710.min.js" crossorigin="anonymous"></script>


<script>
    
    

if (typeof window.$$ != 'function') {
    window.$$ = (arg0, arg1) => {
        if (arg0 && arg1) {
            return arg0.querySelectorAll(arg1);
        }

        if (arg0 && !arg1) {
            return document.querySelectorAll(arg0);
        }
    };
}

if (typeof window.$ != 'function') {
    window.$ = (arg0, arg1) => {
        if (arg0 && arg1) {
            return arg0.querySelector(arg1);
        }

        if (arg0 && !arg1) {
            return document.querySelector(arg0);
        }
    };
}


// --------------------------------------------------------------------------------------------------------------------------------------
    
    
    
    (() => {
        
        let decodeHtmlEntities = (str) => { 
            const textarea = document.createElement('textarea'); 
            textarea.innerHTML = str; 
            return textarea.value; 
        };
        
        
        
        let val = decodeHtmlEntities(`{{ file_data }}`);
        
        const view = cm6.createEditorView(undefined, document.getElementById("editor1"));
        const initialState = cm6.createEditorState(val);
        view.setState(initialState);

        
        
        let full_path = `{{full_path}}`;
        
        
        
        
        
        const save_button = $('#save_button');
        if (save_button) {
            save_button.addEventListener('click', (ev) => {
                
                let body = view.state.doc.toString();
                
                let formData = new FormData();
                formData.append('full_path', full_path);
                formData.append('body', body);
                formData.append('save_as_source', '1');

                fetch('/api/file/edit', {
                    method: 'POST',
                    body: formData,
                })
                    .then((r) => r.json())
                    .then((js) => {
                        if (js.code == '200') {
                            
                            let arr = full_path.split('/');
                            arr.pop();
                            
                            let result_url = arr.join('/')
                            if( result_url.length == 0 ){
                                result_url = '/';
                            }
                            
                            location.href = result_url;
                            
                        } else {
                            if (js.msg) {
                                alert(js.msg);
                            }
                        }
                    })
                    .catch((err) => {
                        console.error(err);
                    });
                    
            });
        }
        
        
        
        
        
        const cancel_button = $('#cancel_button');
        if (cancel_button) {
            cancel_button.addEventListener('click', (ev) => {
                
                let arr = full_path.split('/');
                arr.pop();
                
                let result_url = arr.join('/')
                if( result_url.length == 0 ){
                    result_url = '/';
                }
                
                location.href = result_url;
                    
            });
        }
        
        
    
    })();
    
</script>
