stlTexturizer/archived-stlTexturizer
1
0
Fork 0
mirror of https://github.com/CNCKitchen/stlTexturizer.git synced 2026-04-07 22:11:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: add license popup with terms and conditions, including UI integration and translations

Browse Source
This commit is contained in:
CNCKitchen
2026-03-20 18:05:44 +01:00
parent 30b3e3a257
commit 60e6ee9201
5 changed files with 158 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+17
View File
@@ -334,9 +334,26 @@
<button id="export-btn" class="export-btn" disabled data-i18n="ui.exportStl">Export STL</button>
</section>
<button id="license-link" class="license-link" data-i18n="license.btn">License &amp; Terms</button>
</aside>
</main>
<!-- License popup -->
<div id="license-overlay" class="license-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="license-title">
<div class="license-modal">
<button id="license-close" class="license-close-btn" aria-label="Close">&#215;</button>
<h2 id="license-title" data-i18n="license.title">License &amp; Terms</h2>
<ul class="license-list">
<li data-i18n-html="license.item1">This tool is <strong>open-source</strong> — <a href="https://github.com/CNCKitchen/stlTexturizer" target="_blank" rel="noopener">view &amp; contribute on GitHub</a>.</li>
<li data-i18n-html="license.item2">Free to use for any purpose, including <strong>commercial work</strong> (e.g., texturing STLs for clients or products).</li>
<li data-i18n-html="license.item3">Attribution is <strong>appreciated</strong> but <strong>not required</strong> when using this tool as-is.</li>
<li data-i18n-html="license.item4">You may <strong>not</strong> sell or commercially redistribute this tool itself.</li>
<li data-i18n-html="license.item5">Forks or derivative works must credit <strong>CNC Kitchen</strong> by name and link to <a href="https://cnckitchen.store" target="_blank" rel="noopener">cnckitchen.store</a>.</li>
</ul>
</div>
</div>
<!-- Sponsor popup -->
<div id="sponsor-overlay" class="sponsor-overlay hidden" role="dialog" aria-modal="true" aria-labelledby="sponsor-title">
<div class="sponsor-modal">
js/i18n.js
+18
View File
@@ -124,6 +124,15 @@ export const TRANSLATIONS = {
'progress.done': 'Done!',
'progress.processing': 'Processing\u2026',
// License popup
'license.btn': 'License & Terms',
'license.title': 'License & Terms',
'license.item1': 'This tool is <strong>open-source</strong> \u2014 <a href="https://github.com/CNCKitchen/stlTexturizer" target="_blank" rel="noopener">view &amp; contribute on GitHub</a>.',
'license.item2': 'Free to use for any purpose, including <strong>commercial work</strong> (e.g., texturing STLs for clients or products).',
'license.item3': 'Attribution is <strong>appreciated</strong> but <strong>not required</strong> when using this tool as-is.',
'license.item4': 'You may <strong>not</strong> sell or commercially redistribute this tool itself.',
'license.item5': 'Forks or derivative works must credit <strong>CNC Kitchen</strong> by name and link to <a href="https://cnckitchen.store" target="_blank" rel="noopener">cnckitchen.store</a>.',
// Sponsor modal
'sponsor.title': 'Thanks for using CNC Kitchen STL Texturizer!',
'sponsor.body': 'This tool is provided <strong>completely free</strong> by CNC Kitchen.<br>While your STL is being processed, why not check out the store that helps us keep making cool stuff for you?',
@@ -262,6 +271,15 @@ export const TRANSLATIONS = {
'progress.done': 'Fertig!',
'progress.processing': 'Verarbeitung\u2026',
// License popup
'license.btn': 'Lizenz & Nutzung',
'license.title': 'Lizenz & Nutzungsbedingungen',
'license.item1': 'Dieses Tool ist <strong>Open Source</strong> \u2014 <a href="https://github.com/CNCKitchen/stlTexturizer" target="_blank" rel="noopener">auf GitHub ansehen &amp; beitragen</a>.',
'license.item2': 'Kostenlos nutzbar f\u00fcr jeden Zweck, auch f\u00fcr <strong>kommerzielle Arbeit</strong> (z.B. Texturierung von STLs f\u00fcr Kunden oder Produkte).',
'license.item3': 'Namensnennung wird <strong>gesch\u00e4tzt</strong>, ist aber bei der Nutzung dieses Tools <strong>nicht erforderlich</strong>.',
'license.item4': 'Das Tool selbst darf <strong>nicht</strong> verkauft oder kommerziell weitervertrieben werden.',
'license.item5': 'Forks oder abgeleitete Werke m\u00fcssen <strong>CNC Kitchen</strong> namentlich nennen und auf <a href="https://cnckitchen.store" target="_blank" rel="noopener">cnckitchen.store</a> verlinken.',
// Sponsor modal
'sponsor.title': 'Danke f\u00fcr die Nutzung des CNC Kitchen STL Texturizers!',
'sponsor.body': 'Dieses Tool wird von CNC Kitchen <strong>komplett kostenlos</strong> bereitgestellt.<br>W\u00e4hrend dein STL verarbeitet wird, schau doch mal im Shop vorbei, der uns hilft, coole Sachen f\u00fcr dich zu machen!',
js/main.js
+15 -2
View File
@@ -131,6 +131,11 @@ const exclModeIncludeBtn = document.getElementById('excl-mode-include');
const exclSectionHeading = document.getElementById('excl-section-heading');
const exclHint = document.getElementById('excl-hint');
// ── License panel DOM refs ────────────────────────────────────────────────────
const licenseLink = document.getElementById('license-link');
const licenseOverlay = document.getElementById('license-overlay');
const licenseClose = document.getElementById('license-close');
// ── Scale slider log helpers ──────────────────────────────────────────────────
// Slider stores 0–1000; actual scale spans 0.05–10 on a log axis.
// Middle position 500 → scale ~0.71 (log midpoint between 0.05 and 10).
@@ -332,6 +337,13 @@ function wireEvents() {
toggleDisplacementPreview(dispPreviewToggle.checked);
});
// ── License ──
licenseLink.addEventListener('click', () => licenseOverlay.classList.remove('hidden'));
licenseClose.addEventListener('click', () => licenseOverlay.classList.add('hidden'));
licenseOverlay.addEventListener('click', (e) => {
if (e.target === licenseOverlay) licenseOverlay.classList.add('hidden');
});
// ── Export ──
exportBtn.addEventListener('click', () => {
if (sessionStorage.getItem('stlt-no-sponsor') === '1') {
@@ -469,8 +481,9 @@ function wireEvents() {
});
document.addEventListener('keydown', (e) => {
if (e.key === 'Escape' && exclusionTool) {
setExclusionTool(null);
if (e.key === 'Escape') {
if (exclusionTool) setExclusionTool(null);
licenseOverlay.classList.add('hidden');
}
});
}
style.css
+108
View File
@@ -835,4 +835,112 @@ input[type="number"].val:focus { outline: none; border-color: var(--accent); }
.sponsor-close-btn:hover {
background: var(--border);
border-color: var(--accent);
}
/* ── License link (sidebar) ──────────────────────────────────────────────── */
.license-link {
display: block;
width: 100%;
padding: 12px 0;
background: none;
border: none;
color: var(--text-muted);
font-size: 0.82rem;
text-align: center;
cursor: pointer;
text-decoration: underline;
text-decoration-color: transparent;
transition: color 0.15s, text-decoration-color 0.15s;
}
.license-link:hover {
color: var(--accent);
text-decoration-color: var(--accent);
}
/* ── License popup overlay ───────────────────────────────────────────────── */
.license-overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.6);
display: flex;
align-items: center;
justify-content: center;
z-index: 9999;
backdrop-filter: blur(3px);
}
.license-overlay.hidden { display: none; }
.license-modal {
position: relative;
background: var(--surface);
border: 1px solid var(--border);
border-radius: 12px;
padding: 28px 32px;
max-width: 460px;
width: calc(100% - 40px);
display: flex;
flex-direction: column;
gap: 14px;
box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.license-modal h2 {
font-size: 15px;
font-weight: 700;
color: var(--text);
text-transform: none;
letter-spacing: 0;
margin: 0;
}
.license-list {
margin: 0;
padding-left: 1.2em;
display: flex;
flex-direction: column;
gap: 8px;
}
.license-list li {
font-size: 13px;
color: var(--text-muted);
line-height: 1.6;
}
.license-list li strong {
color: var(--text);
}
.license-list li a {
color: var(--accent);
text-decoration: none;
}
.license-list li a:hover {
text-decoration: underline;
}
.license-close-btn {
position: absolute;
top: 14px;
right: 14px;
width: 26px;
height: 26px;
padding: 0;
background: var(--surface2);
border: 1px solid var(--border);
border-radius: 50%;
color: var(--text-muted);
font-size: 15px;
line-height: 1;
cursor: pointer;
transition: background 0.15s, border-color 0.15s, color 0.15s;
}
.license-close-btn:hover {
background: var(--border);
border-color: var(--accent);
color: var(--text);
}
textures/wood.jpg
BIN
View File
Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 175 KiB

After

Width:  |  Height:  |  Size: 60 KiB