import re

script_replacement = """        <!-- Content rendering and dynamic tabs parsing -->
        <script>
            document.addEventListener("DOMContentLoaded", function() {
                var rawData = document.getElementById("postContentRaw").textContent;
                var parsedContainer = document.getElementById("postContentParsed");
                
                // Content is now HTML
                parsedContainer.innerHTML = rawData;
                
                // Parse dynamic tabs from HTML (migrated from Editor.js)
                var tabStarts = Array.from(parsedContainer.querySelectorAll('h3.dynamic-tab-start'));
                if (tabStarts.length > 0) {
                    var tabsGroup = [];
                    var wrapper = document.createElement('div');
                    wrapper.className = 'custom-tabs-wrapper training-course-tabs-wrapper';
                    
                    var navContainer = document.createElement('div');
                    navContainer.className = 'custom-tabs-nav-container';
                    var tabsContainer = document.createElement('div');
                    tabsContainer.className = 'tabs-container';
                    navContainer.appendChild(tabsContainer);
                    wrapper.appendChild(navContainer);
                    
                    var firstTabStart = tabStarts[0];
                    var parentNode = firstTabStart.parentNode;
                    
                    // Collect all elements into tabs
                    tabStarts.forEach(function(startEl, index) {
                        var tabTitle = startEl.textContent;
                        var btn = document.createElement('button');
                        btn.className = 'dao-tao-tab-btn custom-tab-btn' + (index === 0 ? ' active' : '');
                        btn.setAttribute('data-tab-idx', index);
                        btn.textContent = tabTitle;
                        tabsContainer.appendChild(btn);
                        
                        var panel = document.createElement('div');
                        panel.className = 'dao-tao-tab-panel custom-tab-panel';
                        panel.setAttribute('data-tab-idx', index);
                        panel.style.display = (index === 0) ? 'block' : 'none';
                        
                        var currentEl = startEl.nextElementSibling;
                        while (currentEl && !currentEl.classList.contains('dynamic-tab-start') && !currentEl.classList.contains('dynamic-tab-end')) {
                            var nextEl = currentEl.nextElementSibling;
                            panel.appendChild(currentEl);
                            currentEl = nextEl;
                        }
                        
                        // Remove the dynamic-tab-end if present
                        if (currentEl && currentEl.classList.contains('dynamic-tab-end')) {
                            currentEl.parentNode.removeChild(currentEl);
                        }
                        
                        wrapper.appendChild(panel);
                        startEl.parentNode.removeChild(startEl);
                    });
                    
                    parentNode.appendChild(wrapper);
                    
                    // Tab click listener
                    wrapper.addEventListener('click', function(e) {
                        if (e.target.classList.contains('custom-tab-btn')) {
                            var btn = e.target;
                            var idx = btn.getAttribute('data-tab-idx');
                            
                            wrapper.querySelectorAll('.custom-tab-btn').forEach(function(b) {
                                b.classList.remove('active');
                            });
                            btn.classList.add('active');
                            
                            wrapper.querySelectorAll('.custom-tab-panel').forEach(function(p) {
                                p.style.display = 'none';
                            });
                            var activePanel = wrapper.querySelector('.custom-tab-panel[data-tab-idx="' + idx + '"]');
                            if (activePanel) activePanel.style.display = 'block';
                        }
                    });
                }
            });
        </script>"""

file_path = 'src/main/resources/templates/dao-tao-detail.html'
with open(file_path, 'r') as f:
    content = f.read()

# Pattern matches from <!-- Tab Switching + Editor.js Parser Script --> to the end of the <script> tag before </div>
pattern = re.compile(r'<!-- Tab Switching \+ Editor\.js Parser Script -->.*?<\/script>', re.DOTALL)
new_content = pattern.sub(script_replacement, content)

with open(file_path, 'w') as f:
    f.write(new_content)

print(f"Updated {file_path}")