☰

Toolkit

Boite à outil d'internet

  1. // ==UserScript==
  2. // @name         Toolkit
  3. // @namespace    http://tampermonkey.net/
  4. // @version      0.1
  5. // @description  Boite à outil d'internet
  6. // @author       Hikachhu
  7. // @match        https://*/*
  8. // @icon         https://www.google.com/s2/favicons?sz=64&domain=rentry.org
  9. // @grant        none
  10. // @license MIT
  11. // ==/UserScript==
  12.  
  13. // Styles communs
  14. let buttonStyle = `
  15.     width: 100%;
  16.     padding: 10px;
  17.     margin-bottom: 10px;
  18.     color: #212121;
  19.     background-color: #ffffff;
  20.     border: none;
  21.     border-radius: 5px;
  22.     cursor: pointer;
  23.     text-align: center;
  24.     transition: background-color 0.3s;
  25. `;
  26.  
  27. // Crée un nouveau toolkit ou une console
  28. function createToolkit(side) {
  29.     let toolkit = document.createElement('div');
  30.     toolkit.style.position = 'fixed';
  31.     toolkit.style.bottom = '0';
  32.     toolkit.style[side] = '0';
  33.     toolkit.style.width = '200px';
  34.     toolkit.style.height = 'auto';
  35.     toolkit.style.backgroundColor = '#212121';
  36.     toolkit.style.padding = '10px';
  37.     toolkit.style.boxSizing = 'border-box';
  38.     toolkit.style.zIndex = '10000';
  39.     toolkit.style.overflow = 'auto';
  40.     toolkit.style.textAlign = side === 'left' ? 'left' : 'right';
  41.     toolkit.style.borderRadius = side === 'left' ? '0px 10px 0px 0px' : '10px 0px 0px 0px';
  42.     toolkit.style.color = '#ffffff';
  43.     return toolkit;
  44. }
  45.  
  46. // Crée un bouton pour réduire/agrandir un toolkit
  47. function createToggleButton(toolkit, side) {
  48.     let toggleButton = document.createElement('button');
  49.     toggleButton.textContent = 'Réduire';
  50.     toggleButton.style = buttonStyle;
  51.     toggleButton.onmouseover = function() { this.style.backgroundColor = '#dddddd'; };
  52.     toggleButton.onmouseout = function() { this.style.backgroundColor = '#ffffff'; };
  53.     toggleButton.onclick = function() {
  54.         if (toggleButton.textContent === 'Réduire') {
  55.             for (let i = 1; i < toolkit.children.length; i++) {
  56.                 toolkit.children[i].style.display = 'none';
  57.             }
  58.             toggleButton.textContent = 'Agrandir';
  59.             toolkit.style.width = 'auto';
  60.         } else {
  61.             for (let i = 1; i < toolkit.children.length; i++) {
  62.                 toolkit.children[i].style.display = 'block';
  63.             }
  64.             toggleButton.textContent = 'Réduire';
  65.             toolkit.style.width = '200px';
  66.         }
  67.     };
  68.     toolkit.appendChild(toggleButton);
  69. }
  70.  
  71. // Crée un bouton qui exécute une certaine action lorsque vous cliquez dessus
  72. function createActionButton(text, action) {
  73.     let button = document.createElement('button');
  74.     button.textContent = text;
  75.     button.style = buttonStyle;
  76.     button.onmouseover = function() { this.style.backgroundColor = '#dddddd'; };
  77.     button.onmouseout = function() { this.style.backgroundColor = '#ffffff'; };
  78.     button.onclick = action;
  79.     return button;
  80. }
  81.  
  82. // Ajoute du texte à la console
  83. function addToConsole(consoleToolkit, text) {
  84.     let p = document.createElement('p');
  85.     p.textContent = text;
  86.     p.style.margin = '0';
  87.     p.style.padding = '10px 0';
  88.     p.style.borderTop = '1px solid #ffffff';
  89.     consoleToolkit.appendChild(p);
  90. }
  91.  
  92. // Créer le toolkit et la console
  93. let toolkit = createToolkit('right');
  94. let consoleToolkit = createToolkit('left');
  95. document.body.appendChild(toolkit);
  96. document.body.appendChild(consoleToolkit);
  97.  
  98. // Créer les boutons pour réduire/agrandir
  99. createToggleButton(toolkit, 'right');
  100. createToggleButton(consoleToolkit, 'left');
  101.  
  102. // Créer les boutons d'action
  103. let bgButton = createActionButton('Changer couleur d\'arrière-plan', function() {
  104.     document.body.style.backgroundColor = 'purple';
  105. });
  106. toolkit.appendChild(bgButton);
  107.  
  108. let urlButton = createActionButton('Afficher URL actuelle', function() {
  109.     addToConsole(consoleToolkit, 'URL actuelle : ' + window.location.href);
  110. });
  111. toolkit.appendChild(urlButton);
  112. // Crée un bouton qui découpe l'URL actuelle et l'affiche dans la console
  113. let dissectUrlButton = createActionButton('Découper URL', function() {
  114.     let url = new URL(window.location.href);
  115.  
  116.     // Ajoute l'URL complète à la console
  117.     addToConsole(consoleToolkit, 'URL complète : ' + url.href);
  118.  
  119.     // Ajoute chaque composant de l'URL à la console
  120.     addToConsole(consoleToolkit, 'Protocole : ' + url.protocol);
  121.     addToConsole(consoleToolkit, 'Domaine : ' + url.hostname);
  122.     addToConsole(consoleToolkit, 'Chemin : ' + url.pathname);
  123.     addToConsole(consoleToolkit, 'Fragment : ' + url.hash);
  124.  
  125.     // Ajoute chaque paramètre de la chaîne de requête à la console
  126.     for (let [key, value] of url.searchParams) {
  127.         addToConsole(consoleToolkit, `Paramètre : ${key}, Valeur : ${value}, Longueur : ${value.length}`);
  128.     }
  129. });
  130. toolkit.appendChild(dissectUrlButton);
  131.