mirror of
https://github.com/alexandrev/xslt-lab.git
synced 2026-09-17 18:53:15 +00:00
alexandrev-tibco
155 lines
5.0 KiB
HTML
155 lines
5.0 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<title>XSLT Playground — Free Online XSLT Tester & Editor</title>
|
|
<meta
|
|
name="description"
|
|
content="Run and test XSLT instantly in your browser. Supports XSLT 1.0, 2.0 and 3.0 via Saxon. No install, no signup — results in seconds."
|
|
/>
|
|
<meta
|
|
name="keywords"
|
|
content="xslt online, xslt editor, xslt tester, xslt validator, xsl editor, xsl tester, xslt playground, xslt 3.0, xslt 2.0, online xslt editor, xslt transformation online, xml transformation, saxon xslt"
|
|
/>
|
|
<meta property="og:title" content="XSLT Playground — Free Online XSLT Tester & Editor" />
|
|
<meta
|
|
property="og:description"
|
|
content="Run and test XSLT instantly in your browser. Supports XSLT 1.0, 2.0 and 3.0 via Saxon. No install, no signup — results in seconds."
|
|
/>
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:url" content="https://xsltplayground.com/" />
|
|
<meta property="og:image" content="/logo.svg" />
|
|
<link rel="canonical" href="https://xsltplayground.com/" />
|
|
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
|
|
<script type="application/ld+json">
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "WebApplication",
|
|
"name": "XSLT Playground",
|
|
"alternateName": "XSLT Lab",
|
|
"url": "https://xsltplayground.com/",
|
|
"description": "Free online XSLT editor, tester and validator. Run XSLT 1.0, 2.0 and 3.0 transformations instantly in your browser using Saxon processor. No installation required.",
|
|
"applicationCategory": "DeveloperApplication",
|
|
"operatingSystem": "Any",
|
|
"offers": {
|
|
"@type": "Offer",
|
|
"price": "0",
|
|
"priceCurrency": "USD"
|
|
},
|
|
"featureList": [
|
|
"XSLT 1.0, 2.0 and 3.0 support",
|
|
"Saxon-powered backend",
|
|
"Real-time XML transformation",
|
|
"XSLT validator with detailed error messages",
|
|
"Multiple workspaces",
|
|
"Execution trace and debugging",
|
|
"Multiple XML inputs and parameters",
|
|
"Import/Export workspaces as JSON"
|
|
]
|
|
}
|
|
</script>
|
|
<style>
|
|
body {
|
|
margin: 0;
|
|
font-family: Arial, sans-serif;
|
|
background: #f5f5f5;
|
|
color: #21426c;
|
|
}
|
|
.app-shell {
|
|
min-height: 100vh;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 1rem;
|
|
padding: 1.25rem;
|
|
}
|
|
.shell-top {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 0.75rem;
|
|
}
|
|
.shell-logo {
|
|
width: 32px;
|
|
height: 32px;
|
|
}
|
|
.shell-title {
|
|
font-weight: 700;
|
|
font-size: 1.1rem;
|
|
margin: 0;
|
|
}
|
|
.shell-subtitle {
|
|
font-size: 0.9rem;
|
|
color: #536084;
|
|
}
|
|
.shell-grid {
|
|
display: grid;
|
|
gap: 0.75rem;
|
|
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
|
}
|
|
.shell-pane,
|
|
.shell-bar {
|
|
border-radius: 12px;
|
|
background: linear-gradient(90deg, #eef3ff, #f8fbff, #eef3ff);
|
|
background-size: 200% 100%;
|
|
animation: shell-shimmer 1.6s ease-in-out infinite;
|
|
min-height: 160px;
|
|
}
|
|
.shell-bar {
|
|
min-height: 48px;
|
|
}
|
|
@keyframes shell-shimmer {
|
|
0% { background-position: 200% 0; }
|
|
100% { background-position: -200% 0; }
|
|
}
|
|
</style>
|
|
<script type="module" src="/env.js"></script>
|
|
<script>
|
|
const loadAdsense = () => {
|
|
const client = window.env && window.env.VITE_ADSENSE_CLIENT;
|
|
if (!client) return;
|
|
const s = document.createElement("script");
|
|
s.async = true;
|
|
s.src =
|
|
"https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=" +
|
|
client;
|
|
s.crossOrigin = "anonymous";
|
|
document.head.appendChild(s);
|
|
};
|
|
|
|
const scheduleAdsense = () => {
|
|
if ("requestIdleCallback" in window) {
|
|
window.requestIdleCallback(loadAdsense, { timeout: 2500 });
|
|
} else {
|
|
window.setTimeout(loadAdsense, 1500);
|
|
}
|
|
};
|
|
|
|
if (document.readyState === "complete") {
|
|
scheduleAdsense();
|
|
} else {
|
|
window.addEventListener("load", scheduleAdsense, { once: true });
|
|
}
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div id="root">
|
|
<div class="app-shell" role="status" aria-live="polite">
|
|
<div class="shell-top">
|
|
<img src="/logo.svg" alt="XSLT Playground logo" class="shell-logo" />
|
|
<div>
|
|
<h1 class="shell-title">XSLT Playground</h1>
|
|
<div class="shell-subtitle">Loading the editor...</div>
|
|
</div>
|
|
</div>
|
|
<div class="shell-grid">
|
|
<div class="shell-pane"></div>
|
|
<div class="shell-pane"></div>
|
|
</div>
|
|
<div class="shell-bar"></div>
|
|
</div>
|
|
</div>
|
|
<script type="module" src="/src/main.jsx"></script>
|
|
|
|
</body>
|
|
</html>
|