- Replace requirements.txt with inline script dependencies in server.py - Add package.json with npm scripts for run-all.ts integration - Update CI workflow to install uv via astral-sh/setup-uv@v5 - Update Docker commands to install uv for e2e tests - Add Playwright golden screenshot for qr-server - Update README with uv installation and usage instructions
68 lines
1.8 KiB
HTML
68 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<meta name="color-scheme" content="light dark">
|
|
<style>
|
|
html, body {
|
|
margin: 0;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
background: transparent;
|
|
}
|
|
body {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
height: 340px;
|
|
width: 340px;
|
|
}
|
|
img {
|
|
width: 300px;
|
|
height: 300px;
|
|
border-radius: 8px;
|
|
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="qr"></div>
|
|
<script type="module">
|
|
import { App } from "https://unpkg.com/@modelcontextprotocol/ext-apps@0.4.0/app-with-deps";
|
|
|
|
const app = new App({ name: "QR Widget", version: "1.0.0" });
|
|
|
|
app.ontoolresult = ({ content }) => {
|
|
const img = content?.find(c => c.type === 'image');
|
|
if (img) {
|
|
const qrDiv = document.getElementById('qr');
|
|
qrDiv.innerHTML = '';
|
|
|
|
const allowedTypes = ['image/png', 'image/jpeg', 'image/gif'];
|
|
const mimeType = allowedTypes.includes(img.mimeType) ? img.mimeType : 'image/png';
|
|
|
|
const image = document.createElement('img');
|
|
image.src = `data:${mimeType};base64,${img.data}`;
|
|
image.alt = "QR Code";
|
|
qrDiv.appendChild(image);
|
|
}
|
|
};
|
|
|
|
function handleHostContextChanged(ctx) {
|
|
if (ctx.safeAreaInsets) {
|
|
document.body.style.paddingTop = `${ctx.safeAreaInsets.top}px`;
|
|
document.body.style.paddingRight = `${ctx.safeAreaInsets.right}px`;
|
|
document.body.style.paddingBottom = `${ctx.safeAreaInsets.bottom}px`;
|
|
document.body.style.paddingLeft = `${ctx.safeAreaInsets.left}px`;
|
|
}
|
|
}
|
|
|
|
app.onhostcontextchanged = handleHostContextChanged;
|
|
|
|
await app.connect();
|
|
const ctx = app.getHostContext();
|
|
if (ctx) {
|
|
handleHostContextChanged(ctx);
|
|
}
|
|
</script>
|
|
</body>
|
|
</html>
|