fix: update settings
This commit is contained in:
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg>
|
||||
|
Before Width: | Height: | Size: 762 B |
@@ -0,0 +1,8 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" style="display:none">
|
||||
<symbol id="icon-github" viewBox="0 0 24 24">
|
||||
<path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/>
|
||||
</symbol>
|
||||
<symbol id="icon-twitch" viewBox="0 0 24 24">
|
||||
<path d="M11.571 4.714h1.715v5.143H11.57zm4.715 0H18v5.143h-1.714zM6 0L1.714 4.286v15.428h5.143V24l4.286-4.286h3.428L22.286 12V0zm14.571 11.143l-3.428 3.428h-3.429l-3 3v-3H6.857V1.714h13.714z"/>
|
||||
</symbol>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path d="M11.571 4.714h1.715v5.143H11.57zm4.715 0H18v5.143h-1.714zM6 0L1.714 4.286v15.428h5.143V24l4.286-4.286h3.428L22.286 12V0zm14.571 11.143l-3.428 3.428h-3.429l-3 3v-3H6.857V1.714h13.714z"/></svg>
|
||||
|
Before Width: | Height: | Size: 281 B |
+24
-7
@@ -13,25 +13,42 @@
|
||||
<div class="screen-subtitle">Введите имя канала для игры</div>
|
||||
<input type="text" id="channel-input" placeholder="Ku6ep_XBOCTuK" autofocus />
|
||||
<div id="settings-panel">
|
||||
<label class="settings-label"><input type="checkbox" id="opt-auto-restart" checked> Автоперезапуск после поражения</label>
|
||||
<div class="settings-row">
|
||||
<label class="settings-label">
|
||||
<input type="checkbox" id="opt-single-play" /> Скрывать игру после поражения
|
||||
</label>
|
||||
<button type="button" class="hint-toggle">?</button>
|
||||
</div>
|
||||
<div class="settings-hints hidden">
|
||||
<div class="settings-hint">С включенной галочкой игра скроется после одной партии.</div>
|
||||
<div class="settings-hint">
|
||||
В OBS для этого источника нужно включить «Отключать источник, когда он не виден»
|
||||
</div>
|
||||
<div class="settings-hint">Чтобы запустить игру заново, скройте и снова покажите источник.</div>
|
||||
<div class="settings-hint">Можно автоматизировать через Streamer.bot.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-row">
|
||||
<button id="open-btn" class="btn-primary">ОТКРЫТЬ В БРАУЗЕРЕ</button>
|
||||
<button id="copy-btn" class="btn-primary">СКОПИРОВАТЬ ССЫЛКУ</button>
|
||||
</div>
|
||||
<button id="copy-btn">СКОПИРОВАТЬ ССЫЛКУ</button>
|
||||
<div id="game-link"></div>
|
||||
<div class="obs-note">
|
||||
Вставь ссылку в OBS как источник браузера<br />
|
||||
Желательно высоту побольше
|
||||
Открой ссылку в браузере<br />
|
||||
Или вставь ссылку в OBS как источник браузера<br />
|
||||
Желательно высоту побольше<br />
|
||||
</div>
|
||||
<div class="links-row">
|
||||
<a href="https://github.com/Ku6epXBOCTuK/shooting-word-html" target="_blank" class="page-link">
|
||||
<svg class="link-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg>
|
||||
<svg class="link-icon"><use href="img/sprite.svg#icon-github" /></svg>
|
||||
GitHub
|
||||
</a>
|
||||
<a href="https://github.com/Ku6epXBOCTuK/shooting-word-html/issues" target="_blank" class="page-link">
|
||||
<svg class="link-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z"/></svg>
|
||||
<svg class="link-icon"><use href="img/sprite.svg#icon-github" /></svg>
|
||||
Увидели ошибку? Пиши сюда
|
||||
</a>
|
||||
<a href="https://www.twitch.tv/ku6ep_xboctuk" target="_blank" class="page-link">
|
||||
<svg class="link-icon" viewBox="0 0 24 24" fill="currentColor"><path d="M11.571 4.714h1.715v5.143H11.57zm4.715 0H18v5.143h-1.714zM6 0L1.714 4.286v15.428h5.143V24l4.286-4.286h3.428L22.286 12V0zm14.571 11.143l-3.428 3.428h-3.429l-3 3v-3H6.857V1.714h13.714z"/></svg>
|
||||
<svg class="link-icon"><use href="img/sprite.svg#icon-twitch" /></svg>
|
||||
Twitch
|
||||
</a>
|
||||
</div>
|
||||
|
||||
+2
-2
@@ -25,7 +25,7 @@ let playerStats = {};
|
||||
|
||||
const params = new URLSearchParams(location.search);
|
||||
const settings = {
|
||||
autoRestart: params.get("autoRestart") !== "0",
|
||||
singlePlay: params.get("singlePlay") === "1",
|
||||
};
|
||||
|
||||
function initKeyboardBridge() {
|
||||
@@ -183,7 +183,7 @@ function gameOver() {
|
||||
document.getElementById("ui-overlay").classList.add("hidden");
|
||||
document.getElementById("input-chat").classList.add("hidden");
|
||||
gameLoopStarted = false;
|
||||
if (settings.autoRestart) {
|
||||
if (!settings.singlePlay) {
|
||||
recalc();
|
||||
runIntro();
|
||||
} else {
|
||||
|
||||
+30
-6
@@ -1,19 +1,43 @@
|
||||
const input = document.getElementById("channel-input");
|
||||
const copyBtn = document.getElementById("copy-btn");
|
||||
const openBtn = document.getElementById("open-btn");
|
||||
const linkEl = document.getElementById("game-link");
|
||||
const autoRestartEl = document.getElementById("opt-auto-restart");
|
||||
const singlePlayEl = document.getElementById("opt-single-play");
|
||||
|
||||
function buildUrl() {
|
||||
const name = input.value.trim().toLowerCase() || "Ku6ep_XBOCTuK";
|
||||
const single = singlePlayEl.checked ? "1" : "0";
|
||||
return `${location.origin}${location.pathname.replace(/\/[^/]*$/, "/")}game?channel=${encodeURIComponent(name)}&singlePlay=${single}`;
|
||||
}
|
||||
|
||||
function updateLink() {
|
||||
linkEl.textContent = buildUrl();
|
||||
linkEl.className = "";
|
||||
}
|
||||
|
||||
function copyLink() {
|
||||
const name = input.value.trim().toLowerCase() || "Ku6ep_XBOCTuK";
|
||||
const autoRestart = autoRestartEl.checked ? "1" : "0";
|
||||
const url = `${location.origin}${location.pathname.replace(/\/[^/]*$/, "/")}game.html?channel=${encodeURIComponent(name)}&autoRestart=${autoRestart}`;
|
||||
navigator.clipboard.writeText(url).then(() => {
|
||||
navigator.clipboard.writeText(buildUrl()).then(() => {
|
||||
linkEl.textContent = "СКОПИРОВАНО!";
|
||||
linkEl.className = "copied";
|
||||
setTimeout(updateLink, 1500);
|
||||
});
|
||||
}
|
||||
|
||||
copyBtn.addEventListener("click", copyLink);
|
||||
function openLink() {
|
||||
window.open(buildUrl(), "_blank");
|
||||
}
|
||||
|
||||
input.addEventListener("input", updateLink);
|
||||
singlePlayEl.addEventListener("change", updateLink);
|
||||
input.addEventListener("keydown", (e) => {
|
||||
if (e.key === "Enter") copyLink();
|
||||
});
|
||||
|
||||
copyBtn.addEventListener("click", copyLink);
|
||||
openBtn.addEventListener("click", openLink);
|
||||
|
||||
updateLink();
|
||||
|
||||
document.querySelector(".hint-toggle").addEventListener("click", () => {
|
||||
document.querySelector(".settings-hints").classList.toggle("hidden");
|
||||
});
|
||||
|
||||
+3
-2
@@ -1,6 +1,7 @@
|
||||
{
|
||||
"cleanUrls": true,
|
||||
"cleanUrls": false,
|
||||
"rewrites": [
|
||||
{ "source": "/game", "destination": "/game.html" }
|
||||
{ "source": "/game", "destination": "/game.html" },
|
||||
{ "source": "/", "destination": "/index.html" }
|
||||
]
|
||||
}
|
||||
@@ -65,6 +65,12 @@ body {
|
||||
text-shadow: 0 0 8px #00ff41;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
.ui-text:nth-child(2) {
|
||||
text-align: center;
|
||||
}
|
||||
.ui-text:nth-child(3) {
|
||||
text-align: right;
|
||||
}
|
||||
#input-display {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
@@ -283,6 +289,10 @@ body {
|
||||
gap: 10px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.settings-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.settings-label {
|
||||
color: #00cc33;
|
||||
font-size: 28px;
|
||||
@@ -296,6 +306,39 @@ body {
|
||||
.settings-label:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
.hint-toggle {
|
||||
background: transparent;
|
||||
border: 2px solid #00aa33;
|
||||
color: #00aa33;
|
||||
font-size: 18px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
text-shadow: 0 0 6px #00aa33;
|
||||
transition: all 0.15s;
|
||||
margin-left: 8px;
|
||||
}
|
||||
.hint-toggle:hover {
|
||||
border-color: #00ff41;
|
||||
color: #00ff41;
|
||||
text-shadow: 0 0 10px #00ff41;
|
||||
}
|
||||
.settings-hints {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
align-items: center;
|
||||
margin-top: 12px;
|
||||
}
|
||||
.settings-hint {
|
||||
color: #00aa33;
|
||||
font-size: 18px;
|
||||
text-shadow: none;
|
||||
line-height: 1.5;
|
||||
max-width: 500px;
|
||||
text-align: center;
|
||||
}
|
||||
.settings-label input[type="checkbox"] {
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
@@ -303,7 +346,12 @@ body {
|
||||
cursor: pointer;
|
||||
margin-right: 12px;
|
||||
}
|
||||
#channel-form button {
|
||||
.btn-row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 12px;
|
||||
}
|
||||
.btn-primary {
|
||||
background: transparent;
|
||||
border: 2px solid #00ff41;
|
||||
color: #00ff41;
|
||||
@@ -315,7 +363,7 @@ body {
|
||||
transition: all 0.15s;
|
||||
min-width: 260px;
|
||||
}
|
||||
#channel-form button:hover {
|
||||
.btn-primary:hover {
|
||||
background: rgba(0, 255, 65, 0.1);
|
||||
box-shadow: 0 0 30px rgba(0, 255, 65, 0.4);
|
||||
}
|
||||
@@ -340,7 +388,9 @@ body {
|
||||
}
|
||||
.links-row {
|
||||
display: flex;
|
||||
gap: 40px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 20px 40px;
|
||||
margin-top: 16px;
|
||||
}
|
||||
.page-link {
|
||||
@@ -357,8 +407,8 @@ body {
|
||||
.link-icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
fill: currentColor;
|
||||
flex-shrink: 0;
|
||||
color: #00ff41;
|
||||
}
|
||||
.page-link:hover {
|
||||
opacity: 1;
|
||||
|
||||
Reference in New Issue
Block a user