<pre class="language-js"><code class="language-js">
	<span class="token keyword">function</span> <span class="token function">init</span><span class="token punctuation">(</span><span class="token parameter">i<span class="token punctuation">,</span> block</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
		<span class="token comment">// Insert the copy button inside the highlight block</span>
		<span class="token keyword">var</span> btnHtml <span class="token operator">=</span> <span class="token string">'&lt;button class="action-item btn-clipboard" title="Copy to clipboard"&gt;&lt;i data-feather="copy"&gt;&lt;/i&gt;&lt;/button&gt;'</span>
		<span class="token function">$</span><span class="token punctuation">(</span>block<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">before</span><span class="token punctuation">(</span>btnHtml<span class="token punctuation">)</span>
		<span class="token function">$</span><span class="token punctuation">(</span><span class="token string">'.btn-clipboard'</span><span class="token punctuation">)</span>
			<span class="token punctuation">.</span><span class="token function">tooltip</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
			<span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">'mouseleave'</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
				<span class="token comment">// Explicitly hide tooltip, since after clicking it remains</span>
				<span class="token comment">// focused (as it's a button), so tooltip would otherwise</span>
				<span class="token comment">// remain visible until focus is moved away</span>
				<span class="token function">$</span><span class="token punctuation">(</span><span class="token keyword">this</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">tooltip</span><span class="token punctuation">(</span><span class="token string">'hide'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
			<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>

		<span class="token comment">// Component code copy/paste</span>
		<span class="token keyword">var</span> clipboard <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">ClipboardJS</span><span class="token punctuation">(</span><span class="token string">'.btn-clipboard'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
			<span class="token function-variable function">target</span><span class="token operator">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">trigger</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
				<span class="token keyword">return</span> trigger<span class="token punctuation">.</span>nextElementSibling
			<span class="token punctuation">}</span>
		<span class="token punctuation">}</span><span class="token punctuation">)</span>

		clipboard<span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">'success'</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">e</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
			<span class="token function">$</span><span class="token punctuation">(</span>e<span class="token punctuation">.</span>trigger<span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">'title'</span><span class="token punctuation">,</span> <span class="token string">'Copied!'</span><span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">tooltip</span><span class="token punctuation">(</span><span class="token string">'_fixTitle'</span><span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">tooltip</span><span class="token punctuation">(</span><span class="token string">'show'</span><span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">'title'</span><span class="token punctuation">,</span> <span class="token string">'Copy to clipboard'</span><span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">tooltip</span><span class="token punctuation">(</span><span class="token string">'_fixTitle'</span><span class="token punctuation">)</span>

			e<span class="token punctuation">.</span><span class="token function">clearSelection</span><span class="token punctuation">(</span><span class="token punctuation">)</span>
		<span class="token punctuation">}</span><span class="token punctuation">)</span>

		clipboard<span class="token punctuation">.</span><span class="token function">on</span><span class="token punctuation">(</span><span class="token string">'error'</span><span class="token punctuation">,</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">e</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
			<span class="token keyword">var</span> modifierKey <span class="token operator">=</span> <span class="token regex"><span class="token regex-delimiter">/</span><span class="token regex-source language-regex">Mac</span><span class="token regex-delimiter">/</span><span class="token regex-flags">i</span></span><span class="token punctuation">.</span><span class="token function">test</span><span class="token punctuation">(</span>navigator<span class="token punctuation">.</span>userAgent<span class="token punctuation">)</span> <span class="token operator">?</span> <span class="token string">'\u2318'</span> <span class="token operator">:</span> <span class="token string">'Ctrl-'</span>
			<span class="token keyword">var</span> fallbackMsg <span class="token operator">=</span> <span class="token string">'Press '</span> <span class="token operator">+</span> modifierKey <span class="token operator">+</span> <span class="token string">'C to copy'</span>

			<span class="token function">$</span><span class="token punctuation">(</span>e<span class="token punctuation">.</span>trigger<span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">'title'</span><span class="token punctuation">,</span> fallbackMsg<span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">tooltip</span><span class="token punctuation">(</span><span class="token string">'_fixTitle'</span><span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">tooltip</span><span class="token punctuation">(</span><span class="token string">'show'</span><span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">attr</span><span class="token punctuation">(</span><span class="token string">'title'</span><span class="token punctuation">,</span> <span class="token string">'Copy to clipboard'</span><span class="token punctuation">)</span>
				<span class="token punctuation">.</span><span class="token function">tooltip</span><span class="token punctuation">(</span><span class="token string">'_fixTitle'</span><span class="token punctuation">)</span>
		<span class="token punctuation">}</span><span class="token punctuation">)</span>

		<span class="token comment">// Initialize highlight.js plugin</span>
		hljs<span class="token punctuation">.</span><span class="token function">highlightBlock</span><span class="token punctuation">(</span>block<span class="token punctuation">)</span><span class="token punctuation">;</span>
	<span class="token punctuation">}</span></code></pre><p><br><br></p>