{"id":27147252,"url":"https://github.com/vidigal-code/bpt-pro-deepl","last_synced_at":"2025-04-08T11:06:16.576Z","repository":{"id":281714217,"uuid":"945706145","full_name":"Vidigal-code/BPT-Pro-Deepl","owner":"Vidigal-code","description":"A browser extension for translating selected text using the DeepL API. Select text on any webpage to get instant translations in your preferred language.","archived":false,"fork":false,"pushed_at":"2025-03-17T20:11:48.000Z","size":3566,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-03-17T21:25:41.535Z","etag":null,"topics":["browser-extension","css","deepl","html5","javascript"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","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/Vidigal-code.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"License.mit","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}},"created_at":"2025-03-10T01:58:19.000Z","updated_at":"2025-03-17T20:11:52.000Z","dependencies_parsed_at":"2025-03-14T07:00:32.314Z","dependency_job_id":null,"html_url":"https://github.com/Vidigal-code/BPT-Pro-Deepl","commit_stats":null,"previous_names":["vidigal-code/bpt-pro-deepl"],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidigal-code%2FBPT-Pro-Deepl","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidigal-code%2FBPT-Pro-Deepl/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidigal-code%2FBPT-Pro-Deepl/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Vidigal-code%2FBPT-Pro-Deepl/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Vidigal-code","download_url":"https://codeload.github.com/Vidigal-code/BPT-Pro-Deepl/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247829493,"owners_count":21002995,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":["browser-extension","css","deepl","html5","javascript"],"created_at":"2025-04-08T11:06:15.994Z","updated_at":"2025-04-08T11:06:16.569Z","avatar_url":"https://github.com/Vidigal-code.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# BPT-Pro-Deepl\n\n**BPT-Pro-Deepl** is an advanced text translation tool that utilizes the powerful DeepL translation API to\nprovide high-quality translations. This project allows users to configure the API URL, set the desired target language,\nand quickly translate selected text on web pages with ease.\n\n## Example\n\n![GIF Example](https://github.com/Vidigal-code/BPT-Pro-Deepl/blob/main/example/example-1.gif?raw=true)\n\n## Features\n\n- **API Configuration**: Configure the DeepL API URL and API key for seamless translation services.\n- **Multiple Language Support**: Translate text into a wide variety of languages supported by DeepL, including English,\n  German, Spanish, French, Dutch, Italian, Polish, Russian, Portuguese, and more.\n- **Popup Display**: Translations are displayed in an elegant popup window right after selecting text on a webpage.\n- **User-Friendly Interface**: The extension provides an intuitive interface to manage settings and customize the\n  translation experience for users.\n\n## Installation\n\n### Steps to Install\n\n1. **Download or Clone the Repository**:\n    - You can either download the ZIP file of the repository or clone the repository using Git:\n\n   ```bash\n   git clone https://github.com/Vidigal-code/BPT-Pro-Deepl.git\n   ```\n\n2. **Load the Extension in Chrome or Edge**:\n\n   ![Tutorial 1](https://github.com/Vidigal-code/BPT-Pro-Deepl/blob/main/example/tutorial-3.png?raw=true)\n\n    - Open your browser and go to the extensions page (`chrome://extensions` for Chrome or `edge://extensions` for\n      Edge).\n    - Enable **Developer Mode** (toggle in the top-right corner).\n\n   ![Tutorial 1](https://github.com/Vidigal-code/BPT-Pro-Deepl/blob/main/example/tutorial-0.png?raw=true)\n\n    - Click on **Load Unpacked** and select the folder where you downloaded or cloned the repository.\n\n   ![Tutorial 1](https://github.com/Vidigal-code/BPT-Pro-Deepl/blob/main/example/tutorial-1.png?raw=true)\n\n4. **Configure the Extension**:\n    - Click on the extension icon in the browser toolbar.\n    - Enter the DeepL API URL and API key for the translation service.\n    - Select the target language for translation.\n    - API Test URL: [DeepL API Test](https://www.deepl.com/pro#developer)\n    - API Test Key: Obtain it by signing up on [DeepL Pro](https://www.deepl.com/pro).\n\n   ![Tutorial 1](https://github.com/Vidigal-code/BPT-Pro-Deepl/blob/main/example/example-2.png?raw=true)\n\n### Start Using\n\nOnce configured, simply highlight text on any webpage, and the translation will appear in a popup.\n\n## Usage\n\n1. **Select Text**: Highlight the text on a webpage.\n2. **Translation Popup**: The translation of the selected text will appear in a popup.\n3. **Close Popup**: Click the \"X\" button on the popup to close it.\n4. **Configure Settings**: If necessary, change the API URL, API key, or target language via the settings page.\n5. **Plugin Status**: Ensure the plugin is activated.\n\n## Example Code\n\n```javascript\nasync function translateText(text, targetLanguage, apiUrl, apiKey) {\n    const response = await fetch(apiUrl, {\n        method: 'POST',\n        headers: {\n            'Authorization': `DeepL-Auth-Key ${apiKey}`,\n            'Content-Type': 'application/json',\n        },\n        body: JSON.stringify({\n            text: [text],\n            target_lang: targetLanguage.toUpperCase(),\n        }),\n    });\n\n    if (!response.ok) {\n        const errorData = await response.text();\n        throw new Error(`API Error (${response.status}): ${errorData}`);\n    }\n\n    const data = await response.json();\n    return data.translations[0]?.text || '';\n}\n```\n\n\nTo implement the keyboard shortcuts you mentioned in your code (`Alt + A` to activate the plugin, `Alt + K` to deactivate the plugin, `Alt + G` to toggle the plugin status, and `Alt + T` to test or open the test connection menu), you can modify the existing `setupKeyboardShortcuts` function. Here’s the updated version of the code with these specific shortcuts added:\n\n```javascript\n/**\n * Sets up keyboard shortcuts to activate/deactivate the plugin, test connection, and toggle the plugin status.\n */\nsetupKeyboardShortcuts() {\n    document.addEventListener('keydown', (event) =\u003e {\n        if (event.altKey) {\n            switch (event.key.toUpperCase()) {\n                case 'A': // Alt + A to activate the plugin\n                    this.togglePluginStatus(true);\n                    break;\n                case 'K': // Alt + K to deactivate the plugin\n                    this.togglePluginStatus(false);\n                    break;\n                case 'G': // Alt + G to toggle the plugin status (activate if deactivated, deactivate if active)\n                    event.preventDefault();\n                    this.togglePluginStatus();\n                    break;\n                case 'T': // Alt + T to open the test connection menu\n                    event.preventDefault();\n                    const apiTestPopup = new ApiTestPopup();\n                    apiTestPopup.createApiTestListPopup();\n                    break;\n                default:\n                    break;\n            }\n        }\n    });\n}\n```\n\n### Explanation of the Key Shortcuts:\n1. **Alt + A**: Activates the plugin (calls `togglePluginStatus(true)`).\n2. **Alt + K**: Deactivates the plugin (calls `togglePluginStatus(false)`).\n3. **Alt + G**: Toggles the plugin status. If it is active, it will deactivate it; if it is inactive, it will activate it (calls `togglePluginStatus()`).\n4. **Alt + T**: Opens the test connection menu by calling the `ApiTestPopup` constructor and its `createApiTestListPopup` method.\n\nThis will allow users to control the plugin's activation and deactivation with keyboard shortcuts, providing a more seamless user experience. Make sure that the `togglePluginStatus` function and `ApiTestPopup` class are properly implemented in your project for this to work correctly.\n\n## Technologies Used\n\n- **HTML**: Used to create the extension’s settings page and popup.\n- **CSS**: Used to style and create a responsive interface for the extension.\n- **JavaScript**: Handles the logic for translating selected text and manages the interactions between the extension and\n  the browser.\n- **Chrome/Edge Extension APIs**: Manages the browser’s communication with the extension, stores settings, and handles\n  popup interactions.\n\n# License\n\nThis project is licensed under the **MIT License**.\n\nSee the [LICENSE](https://github.com/Vidigal-code/BPT-Pro-Deepl/blob/main/License.mit) file for more details.\n\n---\n\n## Credits\n\n- **Creator**: Kauan Vidigal\n- **Translation API**: [DeepL](https://www.deepl.com/)\n- **Contributions**: Contributions are welcome! Feel free to fork the repository, open an issue, or submit a pull\n  request for improvements or new features.\n\n## Links\n\n- [DeepL API Documentation](https://www.deepl.com/docs-api)\n- [DeepL API GitHub](https://github.com/DeepLcom/deepl-node)\n\n---\n\nFeel free to modify and enhance this project to suit your needs!\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvidigal-code%2Fbpt-pro-deepl","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvidigal-code%2Fbpt-pro-deepl","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvidigal-code%2Fbpt-pro-deepl/lists"}