|
1 | 1 | (function() { |
2 | | - // This script is built on clipboard.js, cf: https://clipboardjs.com/ |
3 | | - // 1. find all code blocks defined under snippet class |
4 | 2 | var snippets = document.querySelectorAll('pre'); |
5 | 3 | [].forEach.call(snippets, function(snippet) { |
6 | 4 | if (snippet.closest('.snippet') !== null) { |
7 | | - snippet.firstChild.insertAdjacentHTML('beforebegin', '<button class="btn" data-clipboard-snippet><i class="far fa-copy"></i></button>'); |
| 5 | + snippet.firstChild.insertAdjacentHTML('beforebegin', '<button class="btn" data-clipboard-snippet><img class="clippy" height="20" src="/assets/clippy.svg" alt="Copy to clipboard"></button>'); |
8 | 6 | } |
9 | 7 | }); |
10 | 8 | var clipboardSnippets = new ClipboardJS('[data-clipboard-snippet]', { |
|
20 | 18 | showTooltip(e.trigger, fallbackMessage(e.action)); |
21 | 19 | }); |
22 | 20 |
|
23 | | - // 2. add event listener for all created copy button |
24 | 21 | var btns = document.querySelectorAll('.btn'); |
25 | 22 | for (var i = 0; i < btns.length; i++) { |
26 | 23 | btns[i].addEventListener('mouseleave', clearTooltip); |
27 | 24 | btns[i].addEventListener('blur', clearTooltip); |
28 | | - btns[i].addEventListener('mouseenter', showToolhint); |
| 25 | + btns[i].addEventListener('mouseenter', function(e) { |
| 26 | + showTooltip(e.currentTarget, "copy to clipboard") |
| 27 | + }, false); |
29 | 28 | } |
30 | 29 |
|
31 | 30 | function clearTooltip(e) { |
|
38 | 37 | elem.setAttribute('aria-label', msg); |
39 | 38 | } |
40 | 39 |
|
41 | | - function showToolhint(e) { |
42 | | - e.currentTarget.setAttribute('class', 'btn tooltipped tooltipped-s'); |
43 | | - e.currentTarget.setAttribute('aria-label', 'copy to clipboard'); |
44 | | - } |
45 | | - |
46 | 40 | function fallbackMessage(action) { |
47 | 41 | var actionMsg = ''; |
48 | 42 | var actionKey = (action === 'cut' ? 'X' : 'C'); |
|
0 commit comments