|
|
<!DOCTYPE html> |
|
|
<html lang="ru"> |
|
|
<head> |
|
|
<meta charset="UTF-8"> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
|
<title>GIPPO312 - игрушки оптом</title> |
|
|
<link rel="manifest" href="/manifest.json"> |
|
|
<link rel="stylesheet" href="style.css"> |
|
|
<link rel="apple-touch-icon" href="/icon.png"> |
|
|
<meta name="apple-mobile-web-app-capable" content="yes"> |
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="default"> |
|
|
<link rel="icon" type="image/png" sizes="192x192" href="/icon.png"> |
|
|
<link rel="icon" href="icon.png" type="image/png"> |
|
|
<meta name="google-site-verification" content="V6EqDTA9Oj9V1OfNbnBHj5RKrdcXlABD8tqfEFVUHJY" /> |
|
|
<meta name="description" content=" "> |
|
|
<style> |
|
|
body { |
|
|
display: flex; |
|
|
flex-direction: column; |
|
|
align-items: center; |
|
|
justify-content: center; |
|
|
min-height: 100vh; |
|
|
margin: 0; |
|
|
padding: 0; |
|
|
font-family: sans-serif; |
|
|
gap: 20px; |
|
|
} |
|
|
button { |
|
|
padding: 15px 30px; |
|
|
font-size: 18px; |
|
|
cursor: pointer; |
|
|
border-radius: 8px; |
|
|
border: 1px solid #ccc; |
|
|
background-color: #fff; |
|
|
box-shadow: 0 2px 5px rgba(0,0,0,0.1); |
|
|
} |
|
|
</style> |
|
|
</head> |
|
|
<body> |
|
|
|
|
|
<button id="openAppButton" onclick="window.open('https://ai.studio/apps/drive/1UEHu1-uSjCBFvuLW7wYsnHXPS0TDRuf3?fullscreenApplet=true', '_blank')">Открыть приложение</button> |
|
|
|
|
|
<button id="installButton" style="display: none;">Установить приложение</button> |
|
|
<button id="iosInstallPrompt" style="display: none;">Установить приложение</button> |
|
|
|
|
|
<div id="iosInstallModal" style="display: none;"> |
|
|
<div class="modal-content"> |
|
|
<h2>Установите приложение Gippo312</h2> |
|
|
<a href="#" id="openZoomModal"> |
|
|
<img src="https://huggingface.co/spaces/Morshen/alpha/resolve/main/pwa_ios.png" alt="Инструкция по установке PWA на iOS"> |
|
|
</a> |
|
|
<p>1. Нажмите кнопку "Поделиться" внизу Safari.</p> |
|
|
<p>2. Выберите "На экран «Домой»".</p> |
|
|
<p>3. Подтвердите установку.</p> |
|
|
<button id="closeIosModal">Закрыть</button> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div id="imageZoomModal" style="display: none;"> |
|
|
<span id="closeZoomModal">×</span> |
|
|
<img id="zoomedImage" src="" alt="Увеличенное изображение"> |
|
|
</div> |
|
|
|
|
|
<script> |
|
|
let deferredPrompt; |
|
|
const installButton = document.getElementById('installButton'); |
|
|
const iosInstallPrompt = document.getElementById('iosInstallPrompt'); |
|
|
const iosInstallModal = document.getElementById('iosInstallModal'); |
|
|
const closeIosModal = document.getElementById('closeIosModal'); |
|
|
const openZoomModal = document.getElementById('openZoomModal'); |
|
|
const imageZoomModal = document.getElementById('imageZoomModal'); |
|
|
const closeZoomModal = document.getElementById('closeZoomModal'); |
|
|
const zoomedImage = document.getElementById('zoomedImage'); |
|
|
|
|
|
function isIos() { |
|
|
return /iphone|ipad|ipod/i.test(navigator.userAgent); |
|
|
} |
|
|
|
|
|
function isInStandaloneMode() { |
|
|
return window.matchMedia('(display-mode: standalone)').matches || window.navigator.standalone; |
|
|
} |
|
|
|
|
|
window.addEventListener('beforeinstallprompt', (event) => { |
|
|
event.preventDefault(); |
|
|
deferredPrompt = event; |
|
|
installButton.style.display = 'block'; |
|
|
installButton.classList.add('pulse-animation'); |
|
|
|
|
|
installButton.addEventListener('click', async () => { |
|
|
deferredPrompt.prompt(); |
|
|
const { outcome } = await deferredPrompt.userChoice; |
|
|
if (outcome === 'accepted') { |
|
|
console.log('Пользователь принял запрос на установку'); |
|
|
} else { |
|
|
console.log('Пользователь отклонил запрос на установку'); |
|
|
} |
|
|
deferredPrompt = null; |
|
|
installButton.style.display = 'none'; |
|
|
installButton.classList.remove('pulse-animation'); |
|
|
}); |
|
|
}); |
|
|
|
|
|
if (isIos() && !isInStandaloneMode()) { |
|
|
iosInstallPrompt.style.display = 'block'; |
|
|
installButton.style.display = 'none'; |
|
|
iosInstallPrompt.classList.add('pulse-animation'); |
|
|
|
|
|
iosInstallPrompt.addEventListener('click', () => { |
|
|
iosInstallModal.style.display = 'block'; |
|
|
localStorage.setItem('iosInstallPromptShown', 'true'); |
|
|
}); |
|
|
|
|
|
closeIosModal.addEventListener('click', () => { |
|
|
iosInstallModal.style.display = 'none'; |
|
|
}); |
|
|
|
|
|
openZoomModal.addEventListener('click', (event) => { |
|
|
event.preventDefault(); |
|
|
zoomedImage.src = 'https://huggingface.co/spaces/Morshen/alpha/resolve/main/pwa_ios.png'; |
|
|
imageZoomModal.style.display = 'block'; |
|
|
}); |
|
|
|
|
|
closeZoomModal.addEventListener('click', () => { |
|
|
imageZoomModal.style.display = 'none'; |
|
|
}); |
|
|
} else { |
|
|
if (!isIos()) { |
|
|
installButton.style.display = deferredPrompt ? 'block' : 'none'; |
|
|
iosInstallPrompt.style.display = 'none'; |
|
|
if (deferredPrompt) { |
|
|
installButton.classList.add('pulse-animation'); |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
if (isIos() && !isInStandaloneMode() && localStorage.getItem('iosInstallPromptShown') === 'true') { |
|
|
setTimeout(() => { |
|
|
iosInstallModal.style.display = 'block'; |
|
|
}, 5000); |
|
|
} |
|
|
|
|
|
if ('serviceWorker' in navigator) { |
|
|
window.addEventListener('load', () => { |
|
|
navigator.serviceWorker.register('/service-worker.js') |
|
|
.then((registration) => { |
|
|
console.log('Сервисный рабочий процесс зарегистрирован:', registration); |
|
|
}) |
|
|
.catch((error) => { |
|
|
console.log('Ошибка регистрации сервисного рабочего процесса:', error); |
|
|
}); |
|
|
}); |
|
|
} |
|
|
|
|
|
window.addEventListener('error', (event) => { |
|
|
console.error('Произошла ошибка:', event.message, event.filename, event.lineno); |
|
|
}); |
|
|
</script> |
|
|
</body> |
|
|
</html> |
