Skip to content

Commit

Permalink
Merge pull request #11 from internetarchive/clip
Browse files Browse the repository at this point in the history
Copy to clipboard
  • Loading branch information
ibnesayeed authored Jul 29, 2022
2 parents 5d9ed39 + 993b0fe commit 9c0a0f4
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 2 deletions.
6 changes: 6 additions & 0 deletions webcomponent/cdxsummary.js
Original file line number Diff line number Diff line change
Expand Up @@ -308,6 +308,12 @@ ${this.sampleCapturesList()}
margin: var(--cdxsummary-main-margin);
padding: var(--cdxsummary-main-padding, 5px);
}
#container > *:first-child {
margin-top: 0;
}
#container > *:last-child, .samples ul {
margin-bottom: 0;
}
pre, code {
font-family: var(--cdxsummary-mono-font-family, monospace);
}
Expand Down
24 changes: 23 additions & 1 deletion webcomponent/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,23 @@
overflow: auto;
white-space: pre-wrap;
}
#code-out {
pointer-events: none;
}
#code-out::before {
content: '🗎 COPY';
float: right;
background: #333;
border: 1px dotted #fff;
border-radius: 3px;
font-size: 1em;
line-height: 1em;
margin-left: -20px;
padding: 2px 2px 0;
cursor: pointer;
opacity: 0.5;
pointer-events: all;
}
#summary-container {
height: 100vh;
overflow: auto;
Expand Down Expand Up @@ -89,7 +106,7 @@
const s = a => `<br>&nbsp;&nbsp;--cdxsummary-${a}${'&nbsp;'.repeat(m+1-a.length)}:&nbsp;`;
const d = a => `<datalist id="${a}-list">${lists[a].map(i => `<option value="${i}">`).join('')}</datalist>`;
const stl = lists["vars"].filter(a => q.has(a)).map(i => ` --cdxsummary-${i}: ${r(i)};`).join('\n');
const elm = `${stl ? ['<style>', 'cdx-summary {', stl, '}', '</style>', '', ''].join('\n') : ''}<cdx-summary ${lists["attr"].filter(a => q.has(a)).map(i => `${i}="${g(i)}"`).join(' ')}></cdx-summary>`;
const elm = `${stl ? ['<style>', 'cdx-summary {', stl, '}', '</style>', '', ''].join('\n') : ''}<${['cdx-summary'].concat(lists["attr"].filter(a => q.has(a)).map(i => `${i}="${g(i)}"`)).join(' ')}></cdx-summary>`;
const visf = `
<form id="cdxsummary">
&lt;cdx-summary
Expand Down Expand Up @@ -172,6 +189,11 @@
document.getElementById('form-container').innerHTML = visf;
document.getElementById('code-out').innerText = elm;
document.getElementById('summary-container').innerHTML = elm;
document.getElementById('code-out').addEventListener('click', e => {
navigator.clipboard.writeText(e.target.innerText);
e.target.style.opacity = 0.2;
setTimeout(() => e.target.style.opacity = 1, 500);
});
};
</script>
</head>
Expand Down
2 changes: 1 addition & 1 deletion webcomponent/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@internetarchive/cdxsummary",
"version": "0.4.0",
"version": "0.4.1",
"description": "A Web Component to render CDX Summary JSON files",
"main": "cdxsummary.js",
"module": "cdxsummary.js",
Expand Down

0 comments on commit 9c0a0f4

Please sign in to comment.