Spaces:
Running
Running
<html lang="en-us"> | |
<head> | |
<meta charset="utf-8"> | |
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> | |
<title>Huggy</title> | |
<link rel="shortcut icon" href="TemplateData/favicon.ico"> | |
<link rel="stylesheet" href="TemplateData/style.css"> | |
<style> | |
div#discordButton button{ | |
position: absolute; | |
left: 0px; | |
} | |
</style> | |
<!-- Bootstrap CSS --> | |
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> | |
</head> | |
<body class="dark"> | |
<!-- Modal --> | |
<div class="modal fade" id="infoModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> | |
<div class="modal-dialog" role="document"> | |
<div class="modal-content"> | |
<div class="modal-header"> | |
<img class="modal-title" id="exampleModalLabel" src="./TemplateData/logo.png" alt="logo" style="max-height:200px" class="img-fluid"/> | |
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> | |
<span aria-hidden="true">×</span> | |
</button> | |
</div> | |
<div class="modal-body"> | |
<h3> What is Huggy πΆ? </h3> | |
<p> Huggy is a dog that <b>learned how to catch the stick with deep reinforcement learning</b> - throw the stick to see how he has learned!</p> | |
<p> If you like the game, don't forget to click on the like π button.</p> | |
<p> Do you want to learn more about Deep RL? π€ | |
We launched a <b>free class from beginner to expert!</b> | |
π <a href="https://forms.gle/iCCam61Q1Hbj4ogV7" target="_blank">Start here</a> </p> | |
</div> | |
<div class="modal-footer"> | |
<button type="button" class="btn btn-success" data-dismiss="modal">Let me play!</button> | |
</div> | |
</div> | |
</div> | |
</div> | |
<!-- Modal -- | |
<div class="modal fade" id="infoModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"> | |
<div class="modal-dialog" role="document"> | |
<div class="modal-content"> | |
<div class="modal-header"> | |
<img class="modal-title" id="exampleModalLabel" src="./TemplateData/logo.png" alt="logo" style="max-height:200px" class="img-fluid"/> | |
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> | |
<span aria-hidden="true">×</span> | |
</button> | |
</div> | |
<div class="modal-body"> | |
<h1> Huggy does not work on Space for now here's the new link πΆ: <a href="https://singularite.itch.io/huggy" target="_blank">>https://singularite.itch.io/huggy</a> </h1> | |
<h3> Huggy does not work on Space for now here's the new link πΆ: <a href="https://singularite.itch.io/huggy" target="_blank">>https://singularite.itch.io/huggy</a> </h3> | |
<p> Huggy is a dog that <b>learned how to catch the stick with deep reinforcement learning</b> - throw the stick to see how he has learned!</p> | |
<p> If you like the game, don't forget to click on the like π button.</p> | |
<p> Do you want to learn more about Deep RL? π€ | |
We launched a <b>free class from beginner to expert!</b> | |
π <a href="https://forms.gle/iCCam61Q1Hbj4ogV7" target="_blank">Start here</a> </p> | |
</div> | |
<div class="modal-footer"> | |
<button type="button" class="btn btn-success" data-dismiss="modal">Let me play!</button> | |
</div> | |
</div> | |
</div> | |
</div>--> | |
<div id="unity-container" class="unity-desktop"> | |
<canvas id="unity-canvas"></canvas> | |
</div> | |
<div id="loading-cover" style="display:none;"> | |
<div id="unity-loading-bar"> | |
<div id="unity-logo"><img src="logo.png"></div> | |
<div id="unity-progress-bar-empty" style="display: none;"> | |
<div id="unity-progress-bar-full"></div> | |
</div> | |
<div class="spinner"></div> | |
</div> | |
</div> | |
<div id="unity-fullscreen-button" style="display: none;"></div> | |
<script> | |
const hideFullScreenButton = ""; | |
const buildUrl = "Build"; | |
const loaderUrl = buildUrl + "/Huggy.loader.js"; | |
const config = { | |
dataUrl: buildUrl + "/Huggy.data.unityweb", | |
frameworkUrl: buildUrl + "/Huggy.framework.js.unityweb", | |
codeUrl: buildUrl + "/Huggy.wasm.unityweb", | |
streamingAssetsUrl: "StreamingAssets", | |
companyName: "Hugging Face", | |
productName: "Huggy", | |
productVersion: "0.1", | |
}; | |
const container = document.querySelector("#unity-container"); | |
const canvas = document.querySelector("#unity-canvas"); | |
const loadingCover = document.querySelector("#loading-cover"); | |
const progressBarEmpty = document.querySelector("#unity-progress-bar-empty"); | |
const progressBarFull = document.querySelector("#unity-progress-bar-full"); | |
const fullscreenButton = document.querySelector("#unity-fullscreen-button"); | |
const spinner = document.querySelector('.spinner'); | |
const canFullscreen = (function() { | |
for (const key of [ | |
'exitFullscreen', | |
'webkitExitFullscreen', | |
'webkitCancelFullScreen', | |
'mozCancelFullScreen', | |
'msExitFullscreen', | |
]) { | |
if (key in document) { | |
return true; | |
} | |
} | |
return false; | |
}()); | |
if (/iPhone|iPad|iPod|Android/i.test(navigator.userAgent)) { | |
container.className = "unity-mobile"; | |
config.devicePixelRatio = 1; | |
} | |
loadingCover.style.display = ""; | |
const script = document.createElement("script"); | |
script.src = loaderUrl; | |
script.onload = () => { | |
createUnityInstance(canvas, config, (progress) => { | |
spinner.style.display = "none"; | |
progressBarEmpty.style.display = ""; | |
progressBarFull.style.width = `${100 * progress}%`; | |
}).then((unityInstance) => { | |
loadingCover.style.display = "none"; | |
if (canFullscreen) { | |
if (!hideFullScreenButton) { | |
fullscreenButton.style.display = ""; | |
} | |
fullscreenButton.onclick = () => { | |
unityInstance.SetFullscreen(1); | |
}; | |
} | |
}).catch((message) => { | |
alert(message); | |
}); | |
}; | |
document.body.appendChild(script); | |
</script> | |
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script> | |
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF" crossorigin="anonymous"></script> | |
<script> | |
$(document).ready(function(){ | |
$("#infoModal").modal('show'); | |
}); | |
</script> | |
</body> | |
</html> | |