181 lines
13 KiB
HTML
181 lines
13 KiB
HTML
<!doctype html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
|
||
<title>Главная</title>
|
||
<link
|
||
rel="stylesheet"
|
||
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.5/dist/css/bootstrap.min.css"
|
||
integrity="sha384-SgOJa3DmI69IUzQ2PVdRZhwQ+dy64/BUtbMJw1MZ8t5HZApcHrRKUc4W0kG879m7"
|
||
crossorigin="anonymous"
|
||
/>
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" />
|
||
<link rel="stylesheet" crossorigin href="/assets/styleStreamingService-CUHvxLFI.css">
|
||
</head>
|
||
<body class="min-vh-100 d-flex flex-column m-0 p-0">
|
||
<header class="d-flex align-items-center justify-content-between position-sticky h-60 p-3">
|
||
<div class="header-logo d-flex align-items-center g-3">
|
||
<a href="pageMain.html"><img src="/assets/%D0%9A%D0%90%D0%99%D0%A4-Dbw7IVze.jpg" alt="Логотип" /></a>
|
||
<h1>НАЗВАНИЕ СЕРВИСА</h1>
|
||
</div>
|
||
<nav class="navbar d-flex align-items-center justify-content-center me-3 g-3 column-gap-2">
|
||
<a href="pageCategories.html">Категории</a>
|
||
<nav class="dropdown position-relative">
|
||
<span><a>Мой аккаунт ▾</a></span>
|
||
<nav class="features-menu">
|
||
<nav class="features-item"><a href="pageAccount.html">Настройки</a></nav>
|
||
<nav class="features-item"><a href="pageSubscriptions.html">Подписки</a></nav>
|
||
<nav class="features-item"><a href="pageSavedStreams.html">Сохраненные трансляции</a></nav>
|
||
</nav>
|
||
</nav>
|
||
</nav>
|
||
</header>
|
||
<div class="content flex-grow-1 p-3 px-4" id="content">
|
||
<p>Сейчас в эфире <i class="bi bi-cast"></i></p>
|
||
<form id="imageForm" class="mb-4">
|
||
<div class="photo-grid-container d-flex justify-content-center mb-2">
|
||
<div class="photo-grid d-flex align-items-center flex-wrap w-100">
|
||
<div class="photo-grid-item">
|
||
<input
|
||
type="checkbox"
|
||
name="images"
|
||
value="https://steamuserimages-a.akamaihd.net/ugc/2462990917964003785/9E09A87AE9B299BC1F0FC1CBA9F20DB16289442A/?imw=512&imh=298&ima=fit&impolicy=Letterbox&imcolor=%23000000&letterbox=true"
|
||
id="cs2"
|
||
/>
|
||
<label for="cs2"
|
||
><img
|
||
src="https://steamuserimages-a.akamaihd.net/ugc/2462990917964003785/9E09A87AE9B299BC1F0FC1CBA9F20DB16289442A/?imw=512&imh=298&ima=fit&impolicy=Letterbox&imcolor=%23000000&letterbox=true"
|
||
alt="cs2"
|
||
/></label>
|
||
</div>
|
||
<div class="photo-grid-item">
|
||
<input
|
||
type="checkbox"
|
||
name="images"
|
||
value="https://avatars.mds.yandex.net/i?id=7839e8d6f40309bdce67fac62990d108_sr-10636981-images-thumbs&n=13"
|
||
id="derzko"
|
||
/>
|
||
<label for="derzko"
|
||
><img
|
||
src="https://avatars.mds.yandex.net/i?id=7839e8d6f40309bdce67fac62990d108_sr-10636981-images-thumbs&n=13"
|
||
alt="derzko"
|
||
/></label>
|
||
</div>
|
||
<div class="photo-grid-item">
|
||
<input
|
||
type="checkbox"
|
||
name="images"
|
||
value="https://vkplay.ru/pre_0x736_resize/hotbox/content_files/news/2020/02/12/fe52b98a1367439ea2be293fcf48224a.jpg?quality=85"
|
||
id="stardew"
|
||
/>
|
||
<label for="stardew"
|
||
><img
|
||
src="https://vkplay.ru/pre_0x736_resize/hotbox/content_files/news/2020/02/12/fe52b98a1367439ea2be293fcf48224a.jpg?quality=85"
|
||
alt="stardew"
|
||
/></label>
|
||
</div>
|
||
<div class="photo-grid-item">
|
||
<input
|
||
type="checkbox"
|
||
name="images"
|
||
value="https://avatars.mds.yandex.net/i?id=c111e02e6999cca7c4a7aa47f00a2ab3c384b6dd-5884537-images-thumbs&n=13"
|
||
id="teddy"
|
||
/>
|
||
<label for="teddy"
|
||
><img
|
||
src="https://avatars.mds.yandex.net/i?id=c111e02e6999cca7c4a7aa47f00a2ab3c384b6dd-5884537-images-thumbs&n=13"
|
||
alt="teddy"
|
||
/></label>
|
||
</div>
|
||
<div class="photo-grid-item">
|
||
<input
|
||
type="checkbox"
|
||
name="images"
|
||
value="https://i.pinimg.com/736x/a8/f1/c0/a8f1c04546867fbcd5eccd41c115fb51.jpg"
|
||
id="lofi_girl"
|
||
/>
|
||
<label for="lofi_girl"
|
||
><img
|
||
src="https://i.pinimg.com/736x/a8/f1/c0/a8f1c04546867fbcd5eccd41c115fb51.jpg"
|
||
alt="lofi_girl"
|
||
/></label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<button type="submit" class="btn btn-primary">Смотреть позже</button>
|
||
</form>
|
||
<h3>Популярные каналы <i class="bi bi-patch-check-fill"></i></h3>
|
||
<ul>
|
||
<li>
|
||
<a href="pageAccount.html" target="_blank"
|
||
><em>ВЫ</em> самый популярный стример на данной платформе!!!</a
|
||
>
|
||
</li>
|
||
<li>какой-то стример 1</li>
|
||
<li>какой-то стример 2</li>
|
||
<li>ммм <b>МАРМОК</b></li>
|
||
</ul>
|
||
<h2>Смотреть позже <i class="bi bi-clock-fill"></i></h2>
|
||
<div class="photo-grid-container d-flex justify-content-center">
|
||
<div class="photo-grid d-flex align-items-center flex-wrap w-100" id="savedImagesGrid">
|
||
<div class="photo-grid-item">
|
||
<img
|
||
src="https://sun9-27.userapi.com/impf/c9811/u99622377/d_9475926f.jpg?quality=96&as=50x50,100x100&sign=a4fcc81d8c851f41a7f85dea825afc66&u=pHWjezk_9pOPyRtoH8161qsxD963pzSE2bk8P8vDAyE&cs=100x100"
|
||
alt="pusto"
|
||
/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="footer overflow-hidden flex-shrink-1 h-75 p-0 px-4">
|
||
<div class="footer-content d-flex justify-content-between align-items-center">
|
||
<div class="company-name flex-grow-1">RBCS CORP. <i class="bi bi-c-circle"></i></div>
|
||
<div class="footer-images d-flex gap-3 p-3">
|
||
<a href="https://vk.com/sheym_not_shame" target="_blank">
|
||
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEcUlEQVR4nO2aX2wURRzH71GNSigSd5BAYmIwMTFGjfHVvvhm5E80QV980KqRRExnripwtgLyYDCaaJACUSFYQVBfjOFBia31wEM6v7tem0Na6l1pKdw1pbQ0ba9jfnu0ureztzO7e3s+3Df5JZd2Ojefnd+/mW0kUldddYUm8lbiHqO5ZyOhsJNQOE4YP00oJEzDzwyO4e8MltywqiW9IvJ/UsOWzN1GtOc1g/FuQnmRMBBKRnnRoPw3g0ETzlEzgOXRxLLS04Vx5cU7mEGhQBhvDR3oXgbPEcov+wWwATEYNhjfVHUAEkvcYVB+KGgACVD76q3dt1cFYk0LLEefrjYEWYohOIPJI1AIzDCEQio0CLZkydVbUw2BuRNhEK8BhCi5Ge8OxM3CiAlXGAr7/WenGkOQf3dmk/dCx2C41gBkyfgI1i5tELPNqPniwWqUv6cFgeRBVOzA3YtCQav6Y+8km+jFQ4Ni548jFlv7TlL6pZsPWse+8fXfjgtkJ3KWsRv3XawQK9CkDoINoGSS9s6rolyP7uqTfuGRM3nLuLODU9JxT3zQLxYWrHO+ftQZ2mC8S6P4ybvYPT+N2kAa92Z8gRzoumYZNz1bFOtivZXipKhU8THNOU1CT+RsIC8cHPQM8tTejJidt27HV/G8e6yw5AZf2QoXXS7cJS8gD2xPib6Rm5YxkzNF8cj7aYXA560qIMedJngw1iuKZf58Kj2hDYKuEx+4YXsobx7LqmUwyr9RcC34tdIk/aPWpzgztyD1aRnIfVEQL315SWQLszaIT34eU4MogfziDkLhz0qTfPG7NThR0ZM5V5DrN4viyvU5IRNmQ2UIZqbgc75Bnv74gm0hoxOz4v53UxVBZMKY2NLhnGqJLxAX10I7n522LQrTqC5IYWpeNH+bM11OC4YquJZ5ZeMyERYsmbb9MKwFsqjOC5Ni3Y5ejR3hHYE0i6uiYAavTEfPFsRDrWkbSOLSlOj4oyDyN+Rxgqn4sd3yLsFT+jUv2BQme3JPv5iYnpcuCotc+YL33wroNW8nRcvJYenfZq7MqO1MM6z31aKUGzZ32FKoaBHkvw9i4OqMbdz3PeNu8VFUPsfr3JY889lfYmxyThsE7fHdfeKaxNU2O7Q9ZnxQ6FSCKIHAqzpZ5OG2tPju/Liti3UDQXv58JBtbGJoqsKOwCt6x1zzGlMvLTZ+lDGbPkyrqiBoPZJ03ijpqg3G8yto310RHWFm0AVZNKwLCIWHqQ9PjYpPT4+JpiNDjuPRlQ7H8xZ7vn1A5lY7IrpCcoNBzitM0GZQyK6Mpe6MeFGls0noIEzhDFIRhvIDtYYglO+L+BVeVzqd4cPZCd61NjZ4m2+QEkyqAS+Uw98JgMAusS2vFRjvChEkHvhrBaubQXsIEJ8H5k5u2awaqdmgkPWdnbzUGbyL9dIBSAI6j8Vupdc6EYRu3do3mfGj/XoaOrF30m47qi0zuzXDekJ5G17Z4JF06R8GzM/mz9oIhWcDz0Z11VVXpJL+Aemdmrez0du5AAAAAElFTkSuQmCC" alt="vk" />
|
||
</a>
|
||
<a href="https://t.me/sheymuh" target="_blank">
|
||
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAAEnklEQVR4nO2aS2wbRRjHfae8xOuOqnbXalMkJLiAhDggBOVQaBFSpCKOoCJVnAoSQoKm0AMSJw6gIh4ioliigXbGjqzmUSVxaF4YE+okjpO6TrBD0zpOZuxde/dDM7YTO3bWM/auzcF/6bvsrmf3N99jvp21y9VRRx21TF39m4+6vfSEgkmPgqhHwWRYxXSSGyJDxWM97Jr9OP2I6/+kw1dSD7oxeVdB9LqKiKliCkKGiKlgOq4gcurIpbsPtBVAReQzFZO08MPvDbWhYnKu5UAKoicVRJNNA+wyBdOEG9NuxwEO9sG9KiK9dgNUASHyg3sQ9jkCcejXzcdURKechlB3bJIVD/shMJlrIQQUjMzZBsPCSUF0uvUQdNsztoQZi9c2QgDPGUx+ahKCnmw3hFq0hqsZWyecKLG17IWhDJwJavDM1YyFV2iioXWmsNg59/BdPgrvzWgQuG2ACQWdCWr1QqxH2huF1dZ+gBeHM/D1Yg7WtdLj7+jYSNb694impLzCeic7H/6Ij8LpaQ3GymZ/t3QDuJfqjaVg8o4wCG8AbQB4yWL2NV2vgAqlDLFxEQ0IQbAFSKqLlZz9XD4PscQaBOejoOm57eMXYzlBEGIe+C39cF0Q9Qp9vRGAl4uzf1ffK3gA1jfSEFpYgj/no7BFMxXnPgrpwvdyY3K8flhh0iM64BNls28lmsnC/M04zIQj8FdkCWhWq7rmxGidRMflRj4WyQ9PvYGOXivMfspi9pnyeQPiyX/hj3CEQ8wuLkNW06uvM4FPiioIomByUQCEXKv148NeCh+GdJ6UIiqFEQNgdiMaAz23kxPlCqcFEx1v58mgiEdqNohfzFXPZC2RsjAq2dzyLZ7ke+mXeF4ShE41DMLaCH8iD1s56zAqB2C2EFsBw7D24tlZ3QkQUjO0SnbIS+H4aBY+D+s8yTWjOoxKFo3/A6ZpnUdM3YGsI6HlkRn02FC6CoDZrcRa/TgEAMMEeLJfrtQrQskuUX5Ldjm0XAGxsnYbRBXZNOW8gQXLL9s8kx34g7HkNkRfcBkGltaFQS6vSCY6pnAQkdccaVGe86dhugjy3cQSXBoYgx9nYkIg529IJjomhlCLUggvOi47S55gjINcCCxA38Aot68CEd7VWunNcelEHxOC4CCInJIFOT1SKL3fjMxyCM9AAF7xJXlFqtX9MrGjT/kzsh55WxiEvbzIvlg93b8FU+FF6B2e4BBHfcmKNWhhs9o1N4lkoiOaetx/536XjNherKxXvpyMw8+7IErGSuzVROXq7l2VS3QFkbMuWe3HcJ+K6KrMjZ71bcDz3juWi+mF6E5r8Onf4omuNLr5wMS2YGS9ImJv/Z6F94Mab0QlQN5wNSMFk++dgJHLDdLbFAT3yiDsK351aguEguj1rn64x2WH+CLZjk1sRMK2f6JT/BsPsR2MFoJM2P5ZoTzMWrKpjci3toWTJRCm3awc2g9AV5uuTrJiNZ23/HZsrSKaUhD5RHrVtlPs5mwbs5A/xBAHIAZrAFnv1FaAWmLtNXtXYLPL3uLYK2nZHwYG2TF+zkteZcWj5iAdddSRywn9B9E5uZlJrzFcAAAAAElFTkSuQmCC" alt="tg" />
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script>
|
||
document.getElementById("imageForm").addEventListener("submit", (event) => {
|
||
event.preventDefault();
|
||
|
||
const selectedImages = Array.from(document.querySelectorAll('input[name="images"]:checked')).map(
|
||
(checkbox) => checkbox.value
|
||
);
|
||
const savedImagesGrid = document.getElementById("savedImagesGrid");
|
||
|
||
const initialImageSrc =
|
||
"https://sun9-27.userapi.com/impf/c9811/u99622377/d_9475926f.jpg?quality=96&as=50x50,100x100&sign=a4fcc81d8c851f41a7f85dea825afc66&u=pHWjezk_9pOPyRtoH8161qsxD963pzSE2bk8P8vDAyE&cs=100x100";
|
||
|
||
const existingImage = Array.from(savedImagesGrid.children).find((item) => {
|
||
const imgElement = item.querySelector("img");
|
||
return imgElement && imgElement.src === initialImageSrc;
|
||
});
|
||
if (existingImage) {
|
||
savedImagesGrid.removeChild(existingImage);
|
||
}
|
||
|
||
selectedImages.forEach((image) => {
|
||
const imageExists = Array.from(savedImagesGrid.children).some((item) => {
|
||
const imgElement = item.querySelector("img");
|
||
return imgElement && imgElement.src === image;
|
||
});
|
||
|
||
if (!imageExists) {
|
||
const item = document.createElement("div");
|
||
item.className = "photo-grid-item";
|
||
item.innerHTML = `<img src="${image}" alt="сохраненное изображение"/>`;
|
||
savedImagesGrid.appendChild(item);
|
||
}
|
||
});
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|