{"id":21831670,"url":"https://github.com/w45p85/tbx_to_html","last_synced_at":"2026-04-18T01:37:07.472Z","repository":{"id":240966522,"uuid":"718076547","full_name":"W45P85/TBX_to_HTML","owner":"W45P85","description":"Converter for TBX-Files to HTML-Files","archived":false,"fork":false,"pushed_at":"2024-06-11T14:39:08.000Z","size":61005,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-27T05:26:05.830Z","etag":null,"topics":["converter","executable","gui","html","python3","smc","tbx","tkinter"],"latest_commit_sha":null,"homepage":"","language":"Tcl","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/W45P85.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2023-11-13T10:26:47.000Z","updated_at":"2024-08-11T09:19:28.000Z","dependencies_parsed_at":"2025-07-12T19:33:21.789Z","dependency_job_id":null,"html_url":"https://github.com/W45P85/TBX_to_HTML","commit_stats":null,"previous_names":["w45p85/tbx_to_html"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/W45P85/TBX_to_HTML","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/W45P85%2FTBX_to_HTML","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/W45P85%2FTBX_to_HTML/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/W45P85%2FTBX_to_HTML/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/W45P85%2FTBX_to_HTML/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/W45P85","download_url":"https://codeload.github.com/W45P85/TBX_to_HTML/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/W45P85%2FTBX_to_HTML/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":31953515,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-04-18T00:39:45.007Z","status":"ssl_error","status_checked_at":"2026-04-18T00:39:20.671Z","response_time":62,"last_error":"SSL_read: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["converter","executable","gui","html","python3","smc","tbx","tkinter"],"created_at":"2024-11-27T19:13:39.048Z","updated_at":"2026-04-18T01:37:07.441Z","avatar_url":"https://github.com/W45P85.png","language":"Tcl","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\u003cpre\u003e\n  _____  ____ __  __  _           _   _  _____  __  __  _     \n |_   _|| __ )\\ \\/ / | |_  ___   | | | ||_   _||  \\/  || |    \n   | |  |  _ \\ \\  /  | __|/ _ \\  | |_| |  | |  | |\\/| || |    \n   | |  | |_) |/  \\  | |_| (_) | |  _  |  | |  | |  | || |___ \n   |_|  |____//_/\\_\\  \\__|\\___/  |_| |_|  |_|  |_|  |_||_____|\n                                                              \n\u003cbr\u003e\nWelcome to the TBX to HTML Converter! 🎉 This handy tool takes your TBX files\nand transforms them into beautiful, readable HTML files. Whether you're a terminology\nenthusiast or just someone who loves well-organized data, this tool is here to make your\nlife easier.\n\u003c/pre\u003e\n\u003c/div\u003e\n\n\u003e Note: This tool has been tested using a terminology export from the tool SMC (Smart Media Creator) by ECS (Expert Communication Solutions).\n\n\n## Overview\n**TBX to HTML** converts TBX files into readable HTML files. It analyzes the TBX file and allows you to select the desired columns for conversion.\n\n\n## Installation\nNo installation is required. Simply download the folder **TBX_to_HTML_compiled** and open the file **TBX_to_HTML.exe** or use the single file **TBX_to_HTML (single file).exe** to start the tool.\n\u003e ⚠️ **Warning:** I am not licensed by Microsoft, so you might encounter an warning message related to licensing.\n\n\n## Usage\n1. open the program:\n2. select a TBX file:\n\n\u003cimg src=\"img/Programm%20öffnet%20sich.PNG\"\u003e\n\n- Click on the \"Select file\" button.\n- Select the desired TBX file from your file system and confirm the selection with \"Open\".\n\n3. column selection:\n\n\u003cimg src=\"img/alle_auswählen.PNG\" width=\"250\"\u003e\n\n- After selecting the file, a window opens to select the columns to be displayed in the HTML document.\n- You can select the columns by activating the corresponding checkboxes.\n- Alternatively, you can also use the \"Select all\" option to select all available columns at once (recommended).\n- Click on \"Next\" to continue.\n\n4. conversion:\n\n\u003cimg src=\"img/Dateiname%20der%20HTML.PNG\"\u003e\n\n\n- After the column selection, the TBX file is converted into an HTML document.\n- After successful conversion, the HTML is saved in the same directory as the original TBX file. The file is called \"terminology_YYYY-MM-DD\", whereby the current day is taken as the date.\n\n5. close the program:\n       Once the conversion is complete, you can close the program by clicking on red the \"Close\" button.\n\n\n## How This Tool Works\nThis tool  is a Python program that facilitates the conversion of a TBX (TermBase eXchange) file to an HTML format. The program also includes features for previewing and selecting specific columns from the TBX file. The code is divided into two parts, each responsible for different functionalities. Here is a detailed explanation of how the script works:\n\n\n### Part 1: GUI Setup and TBX File Processing\n#### Importing Libraries\n\n```python\n   import tkinter as tk\n   from tkinter import filedialog\n   import xml.etree.ElementTree as ET\n   from datetime import datetime\n```\nThe script imports necessary libraries for GUI creation (tkinter), file handling (filedialog), XML parsing (ElementTree), and date/time operations (datetime).\n\n#### ScrollableFrame Class\n\n```python\n   class ScrollableFrame(tk.Frame):\n    # Klasse für ein scrollbares Frame in der Gui\n    def __init__(self, master, **kwargs):\n        tk.Frame.__init__(self, master, **kwargs)\n        ...\n```\nThis class creates a scrollable frame in the GUI that allows the user to navigate through multiple checkboxes for column selection and easily add new columns if necessary.\n\n#### Function to Convert TBX to HTML\n\n```python\n   def convert_tbx_to_html(tbx_file_path, html_file_path, selected_columns):\n    ...\n```\nThis function parses the TBX file and converts its content to an HTML file, including only the selected columns. It constructs an HTML structure with tables and other HTML elements.\n\n#### Function to Preview Columns\n\n```python\n   def preview_columns(file_path, selected_columns):\n    ...\n```\nThis function reads the TBX file to identify and preview available columns. It returns a list of columns present in the file.\n\n#### Function to Choose File\n\n```python\n   def choose_file():\n    ...\n```\nThis function displays a GUI window with checkboxes for each column, allowing the user to select which columns to include in the HTML conversion.\n\n#### GUI Main Window\n\n```python\n   root = tk.Tk()\n   root.title(\"Termfinder by User Assistance\")\n   root.geometry(\"500x150\")\n   ...\n   root.mainloop()\n```\nThis section sets up the main GUI window with buttons to choose a file and close the program. It also includes a label for informational text.\n\n\n### Part 2: JavaScript for Enhanced HTML Functionality\nThe generated HTML file includes embedded JavaScript to provide interactive features such as filtering, toggling between languages, tooltips, and converting URLs to links.\n\n#### Autocomplete Suggestions\n\n```js\n   var autocompleteInput = document.getElementById('searchInput');\n   if (suggestions.length \u003e 0) {\n      autocompleteInput.placeholder = suggestions[0].substring(filter.length);\n   } else {\n      autocompleteInput.placeholder = '';\n   }\n```\nThis section of the code dynamically updates the placeholder text in the input field based on the user's input. It shows autocomplete suggestions by displaying the first suggestion that matches the input, helping users to quickly find relevant terms.\n\n#### Window Onload Event\n\n```js\n   window.onload = function() {\n    filterTable();\n    toggleTable();\n    addTooltipsFromTable();\n    convertUrlsToLinks();\n}\n```\nThe window.onload event ensures that certain functions are executed only after the entire webpage has finished loading. This includes filtering the table, toggling the table language, adding tooltips, and converting URLs into clickable links.\n\n#### Filter Table Function\n\n```js\n   function filterTable() {\n    var selectedLanguage = document.getElementById(\"languageSelect\").value.toUpperCase();\n    var selectedFilter = document.getElementById(\"filterSelect\").value.toUpperCase();\n    var table = document.getElementById(\"termTable\");\n    var rows = table.getElementsByTagName(\"tr\");\n    ...\n```\nThe filterTable function filters the table rows based on the selected language and filter criteria. It retrieves the selected values from dropdowns and compares them with the table data, showing only the rows that match the criteria and hiding the others.\n\n#### Toggle Table Function\n\n```js\n   function toggleTable() {\n    var germanTable = document.getElementById('german-table');\n    var englishTable = document.getElementById('english-table');\n    ...\n```\nThe toggleTable function switches between displaying the German and English versions of the table. It checks the state of a checkbox and toggles the visibility of the respective tables accordingly, allowing users to view the information in their preferred language.\n\n#### Tooltips Function\n\n```js\n   function addTooltipsFromTable() {\n    var tooltipTable = [\n        [\"Hauptbenennung\", \"Main term designation\", \"This is the main term designation.\"],\n        ...\n    ];\n    ...\n```\nThe addTooltipsFromTable function adds tooltips to table cells based on predefined terms. It searches for specific terms in the table and, if found, attaches a tooltip to the cell to provide additional context or explanation, enhancing user understanding.\n\n#### Convert URLs to Links\n\n```js\nfunction convertUrlsToLinks() {\n    var table = document.getElementById(\"termTable\");\n\n    if (table) {\n        for (var i = 0; i \u003c table.rows.length; i++) {\n            for (var j = 0; j \u003c table.rows[i].cells.length; j++) {\n                var cellContent = table.rows[i].cells[j].innerHTML;\n    ...\n```\nThe convertUrlsToLinks function scans the table for any cells containing URLs and converts these URLs into clickable links. This function also handles special cases where URLs are followed by \"(translation)\" text, ensuring the content is properly formatted and interactive. **That was a customer requirement! If there are no (\"translation\") strings in the cells, the part can be deleted.**\n\nSteps:\n1. The convertUrlsToLinks function is defined.\n2. It retrieves the HTML table with the ID \"termTable\" using document.getElementById.\n3. If the table is found, it iterates over each row in the table.\n4. For each row, it iterates over each cell in the row.\n5. It retrieves the content of the current cell using cells[j].innerHTML.\n6. It uses a regular expression to match URLs in the cell content.\n7. If a URL match is found and the cell does not contain the text \"(übersetzung)\", it creates a new link element (\u003ca\u003e) and sets its href, textContent, and target attributes.\n8. It extracts the remaining text after the URL and creates a text node for it.\n9. If there is content before the URL, it creates a text node for it as well.\n10. It clears the cell content and appends the text nodes and the link element.\n11. If the cell content contains the text \"(translation)\", it splits the content at \"(translation)\" and creates a new link element for the part before it.\n12. It creates a text node for the part after \"(translation)\" and sets the cell content to the link element and the text node.\n13. If the table is not found, it logs an error message to the console.\n\n\n#### Table Header \"sticky\"\n\n```js\ndocument.addEventListener('DOMContentLoaded', function() {\n            var tableHeaders = document.querySelectorAll('#termTable th');\n            tableHeaders.forEach(function(th) {\n                th.style.position = 'sticky';\n                th.style.top = '0';\n                th.style.zIndex = '1000';\n            });\n        });\n```\n\n1. **document.addEventListener('DOMContentLoaded', function() {...});**: This binds a function to the 'DOMContentLoaded' event of the document. This function is executed when the entire HTML document has been fully loaded and parsed.\n\n2. **var tableHeaders = document.querySelectorAll('#termTable th');**: This selects all 'th' elements that are within an element with the ID 'termTable'. 'querySelectorAll' returns a NodeList containing all matching elements.\n\n3. **tableHeaders.forEach(function(th) {...});**: This iterates through each element in the 'tableHeaders' NodeList and executes a function for each element.\n\n4. **th.style.position = 'sticky';**: Sets the CSS position of the current 'th' element to 'sticky', which causes it to stick to the screen when scrolling.\n\n5. **th.style.top = '0';**: Sets the distance of the current 'th' element from the top to '0', which ensures that it always remains at the top of the screen when it is stuck.\n\n6. **th.style.zIndex = '1000';**: Sets the stacking order of the current 'th' element to '1000', which ensures that it is displayed above other elements when it is pinned.\n\n#### colorize the status of the term with colorizeTerms() function\n\n```js\nfunction colorizeTerms() {\n        const table = document.getElementById('termtable');\n        const rows = table.getElementsByTagName('tr');\n    ...\n```\nThe colorizeTerms() function searches an HTML table for specific terms and colors the corresponding cells based on the term found. The terms to be searched for are 'preferredTerm', 'deprecatedTerm' and 'admittedTerm', and each category is highlighted with a specific background and font color.\n\n### HTML Structure\nThe generated HTML includes two tables (German and English) with relevant term data. It also includes interactive elements like a checkbox to toggle between languages, and dropdowns for filtering terms based on language and other criteria. The script ensures the HTML output is dynamic and user-friendly.\n\n\n## Support\nIf you have questions or problems, contact me here on GitHub. :)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fw45p85%2Ftbx_to_html","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fw45p85%2Ftbx_to_html","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fw45p85%2Ftbx_to_html/lists"}