Library to copy data attribute in clipboard

HTTP enthusiasts

Result

<html>
    
    <body>
        
        <ul>
        <?php
        $dir    = './';
        $files = scandir($dir);
        $exceptions = [
            '.',
            '..',
            'index.php',
            'index.txt',
            '.htaccess',
        ];
        
        
        
        foreach ($files as $file) {
            if (in_array($file, $exceptions)) {
                continue;
            }
            $code = sprintf('<a href="https://corona-tracking.info/protected/%s" rel="noopener" target="_blank">Model</a>', urlencode($file));
            printf('<li><button class="clipboard" data-clipboard="%s">Copy code</button> for file %s</li>', htmlspecialchars($code, ENT_QUOTES), $file);
        }
        ?>
        </ul>
        <script>
            console.log('ok');
            function fallbackCopyTextToClipboard(text) {
              var textArea = document.createElement("textarea");
              textArea.value = text;
              
              // Avoid scrolling to bottom
              textArea.style.top = "0";
              textArea.style.left = "0";
              textArea.style.position = "fixed";
            
              document.body.appendChild(textArea);
              textArea.focus();
              textArea.select();
            
              try {
                var successful = document.execCommand('copy');
                var msg = successful ? 'successful' : 'unsuccessful';
                console.log('Fallback: Copying text command was ' + msg);
              } catch (err) {
                console.error('Fallback: Oops, unable to copy', err);
              }
            
              document.body.removeChild(textArea);
            }
            function copyTextToClipboard(text) {
              if (!navigator.clipboard) {
                fallbackCopyTextToClipboard(text);
                return;
              }
              navigator.clipboard.writeText(text).then(function() {
                console.log('Async: Copying to clipboard was successful!');
              }, function(err) {
                console.error('Async: Could not copy text: ', err);
              });
            }
            
            
            var slides = document.getElementsByClassName("clipboard");
            for (var i = 0; i < slides.length; i++) {
                slides.item(i).addEventListener('click', function(event) {
                  copyTextToClipboard(this.dataset.clipboard);
                });
            }
        </script>
    </body>
</html>