mirror of
https://gitlab.com/skysthelimit.dev/selenite.git
synced 2025-06-15 18:12:08 -05:00
416 lines
16 KiB
HTML
416 lines
16 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en-us">
|
||
|
||
<head>
|
||
<script src="/js/all.js"></script>
|
||
<script>
|
||
alert("if ur seeing this outside of the ui test, i pushed wip code to the main repo :skull: make a bug report\nanyways rn the game is fucked by a piracy check which i gotta remove")
|
||
</script>
|
||
<meta charset="utf-8">
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||
<title>Hole.io</title>
|
||
<meta name="description" content="Absorb everyone into your black hole in the new game - Hole.io! Play for free online." />
|
||
<meta name="keywords" content="Hole.io, holeio" />
|
||
<meta name="viewport" content="width=device-width,initial-scale=1">
|
||
<meta property="og:image" content="images/hole-share.jpg">
|
||
<meta name="twitter:card" content="summary_large_image">
|
||
<meta name="twitter:site" content="https://hole-io.com">
|
||
<meta name="twitter:title" content="Hole.io">
|
||
<meta name="twitter:description" content="Absorb everyone into your black hole in the new game - Hole.io! Play for free online.">
|
||
<meta name="twitter:image:src" content="https://hole-io.com/images/hole-share.jpg">
|
||
<link rel="shortcut icon" href="favicon.png">
|
||
<link rel="stylesheet" href="TemplateData/style64.css?v236">
|
||
<link rel="stylesheet" href="libs/tingle.min.css">
|
||
<script type="text/javascript"> var CONFIG = {}; CONFIG.BuildPath = "/b/96"</script>
|
||
<script src="ads.js?v1"></script>
|
||
<script src="TemplateData/UnityProgress64.js"></script>
|
||
<script src="b/96/gameWebGL.js" async></script>
|
||
</head>
|
||
|
||
<body>
|
||
<div class="webgl-content">
|
||
<canvas id="gameContainer"></canvas>
|
||
<div id="bg"></div>
|
||
<div id="loadingBox">
|
||
<div id="loadingInfo">Loading...</div><div id="loadingPercent"></div>
|
||
<div id="bgBar"></div>
|
||
<div id="progressBar"></div>
|
||
<img id="spinner" class="rotate" src="TemplateData/loading_rotate_white.png"/>
|
||
</div>
|
||
<div id="ads">
|
||
<div id="hole-io-com_300x250"> </div>
|
||
</div>
|
||
<div id="links">
|
||
<ul>
|
||
<li><a onclick="showAboutGameModal();" href="#popup-about">About Game</a></li>
|
||
<li><a href="https://kevin.games/discord/?game=hole" target="_blank">Discord</a></li>
|
||
<li><a href="https://hole-io.com/faq/" target="_blank">Faq</a></li>
|
||
<li><a href="https://hole-io.com/privacy/" target="_blank">Privacy</a></li>
|
||
<li><a href="https://hole-io.com/partners/" target="_blank">Partners</a></li>
|
||
<li><a href="https://kevin.games/?referer=hole-io.com" target="_blank">More Games</a></li></li>
|
||
</ul>
|
||
</div>
|
||
<div id="leaderboard">
|
||
<div id="fullBoardScore">
|
||
<h2 class="leaderboardHeading">Today's top scores:</h2>
|
||
<table id="scoreBoard" cellpadding="0" cellspacing="0">
|
||
<tbody id="boardScore">
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<div id="fullBoardKills">
|
||
<h2 class="leaderboardHeading">Today's top killers:</h2>
|
||
<table id="killBoard" cellpadding="0" cellspacing="0">
|
||
<tbody id="boardKills">
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<div id="switchBoard">
|
||
<a id="switchLeaderbBtn" onclick="window.switchLeaderboard();" href="#">Switch</a>
|
||
</div>
|
||
</div>
|
||
<div id="ideaBlock">
|
||
<div id="ideaLink">
|
||
<a href="https://forms.gle/ixQYUBHzvBHALS4Z9" target="blank">Make Hole.io better!</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="banner">
|
||
</div>
|
||
|
||
<div id="popup-about">
|
||
<h1>Hole.io</h1>
|
||
<p>Control your black hole, eating up everything on your way. The bigger you get, the larger structures you are able to suck in. Keep an eye on the opponents’ size, too. They can eat you.</p>
|
||
<h2>Hole.io play online</h2>
|
||
<p>Absorb everyone into your black hole in the new game - Hole.io</p>
|
||
<p>Control your round hole and consume everything on your path: cars, houses, people! Engage in battles with other
|
||
holes in the same city. Grow bigger and more powerful but beware of other players & their holes may be bigger than
|
||
yours and pull you in.</p>
|
||
<p>This game literally sucks you in! Try to become the biggest in the city.</p>
|
||
<p><img style="float: center; margin-right: 10px; margin-top: 3px;" width="150" src="images/hole-io.png" alt="Hole.io" /></p>
|
||
</div>
|
||
|
||
<div id="popup-howtoplay">
|
||
<h2>How play Hole.io</h2>
|
||
<p>The gameplay is very easy to get into: all you need to do is move the hole around and let various objects drop into it and disappear into the unknown. The trick is to only go under the objects that can fit inside: start with consuming pedestrians, poles and bushes, move on to cars and ultimately to large buildings. You can also eat other black holes if they are smaller than you.</p>
|
||
<p>The game takes place in a city area, so the map is comprised of office buildings, apartment complexes, parking lots, roads parks and many other areas usually associated with urban environment. The surroundings are instantly familiar to anyone who has ever seen a big city, so they are pretty easy to navigate. The best game strategy is to plan your way around the areas in advance: think of the most efficient route that will give you enough smaller objects in the beginning and will eventually introduce something bigger and bigger to chew on.</p>
|
||
<p>Each round only takes a couple of minutes, so don’t get discouraged if you don’t win right away: once you’ve familiarized yourself with the level and the mechanics you will become the master of Hole.io in no-time!</p>
|
||
</div>
|
||
|
||
<div id="popup-tipsandtricks">
|
||
<h2>Hole.io Tips & Tricks</h2>
|
||
<p>In this rather unique combination of arcade and puzzle there are lots of little things you can do to outsmart the competition and best every single one of your opponents. Here’s a basic list of effective moves and helpful tips.</p>
|
||
<p>Since the main mechanic is physics-based it is important to adjust your movement when trying to consume an object. Let’s say you want to eat some traffic lights: sometimes sliding under a vertical pole makes it fall in an unwanted direction and ultimately drop flat on the floor horizontally, thus preventing you from being able to eat it. To prevent that from happening you might want to slow down just a bit or move slightly backwards once the pole start moving in an unwanted direction.</p>
|
||
<p>It is possible to get larger objects and buildings fall in even if your hole is not big enough: simply place yourself under one of the edges of the object for it to start leaning into the singularity and then move slowly towards its other end gradually consuming the rest.</p>
|
||
<p>It may be more important to swallow more smaller stuff than fewer big structures. It is common to feel inclined to try and consume huge buildings once the hole gets big enough, however it is a bit of a risk because it’s possible to underestimate the size of an object. If it won’t fit inside, you will end up wasting your time. Instead spend some time adjusting to your new size by going for smaller prey.</p>
|
||
<p>If you have been having trouble making it to the top of the score board and besting other players, these tips will hopefully help you overcome some of the major difficulties. Ultimately, we tend to produce best results after entering that focused meditative flow state of mind, but you need to become really comfortable and familiar with the game in order to achieve it. Good luck becoming the best at Hole.io!</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="rl1"><a href="#popup-howtoplay" onclick="showHowToPlayModal();">How to play</a></div>
|
||
<div id="rl2"><a href="#popup-tipsandtricks" onclick="showTipsAndTricksModal();">Tips & tricks</a></div>
|
||
|
||
<div id="preroll"></div>
|
||
|
||
<script type="text/javascript">
|
||
window.player_id = 1948950085;
|
||
|
||
function inIframe () {
|
||
try {
|
||
return window.self !== window.top;
|
||
} catch (e) {
|
||
return true;
|
||
}
|
||
} var ResizeCompleted = 0;
|
||
function resize() {
|
||
//if( inIframe && (ResizeCompleted == 1) ) return;
|
||
var gc = document.getElementById("gameContainer");
|
||
var h = document.documentElement.clientHeight - 3;
|
||
gc.style.height = h + "px";
|
||
gc.style.position = "relative";
|
||
if( inIframe() )
|
||
{
|
||
var ldr = document.getElementById('leaderboard');
|
||
ldr.style.right = '15px';
|
||
ldr.style.width = '220px';
|
||
//var lnks = document.getElementById('links');
|
||
//lnks.style.right='10px';
|
||
console.log('resize in iframe');
|
||
}
|
||
//ResizeCompleted = 1;
|
||
}
|
||
resize();
|
||
window.onresize = function () {
|
||
//resize();
|
||
};
|
||
function PageIsLoaded()
|
||
{
|
||
console.log('PageIsLoaded start');
|
||
var aipW = document.documentElement.clientWidth+20;
|
||
var aipH = document.documentElement.clientHeight-29;
|
||
aiptag.cmd.player.push(function() {
|
||
try
|
||
{
|
||
adplayer = new aipPlayer({
|
||
AD_WIDTH: aipW,
|
||
AD_HEIGHT: aipH,
|
||
AD_FULLSCREEN: false,
|
||
AD_CENTERPLAYER: false,
|
||
LOADING_TEXT: 'loading advertisement',
|
||
DESCRIPTION_URL: 'https://hole-io.com/info.php',
|
||
PREROLL_ELEM: function(){return document.getElementById('preroll')},
|
||
AIP_COMPLETE: function () {
|
||
/*******************
|
||
***** WARNING *****
|
||
*******************
|
||
Please do not remove the PREROLL_ELEM
|
||
from the page, it will be hidden automaticly.
|
||
If you do want to remove it use the AIP_REMOVE callback.
|
||
*/
|
||
$("#preroll").hide();
|
||
document.activeElement.blur();
|
||
document.body.focus();
|
||
window.sendMessageToUnity("{\"eventName\": \"adsComplete\",\"data\": {\"allow\": \"true\"}}");
|
||
//alert("Ad Completed");
|
||
},
|
||
AIP_REMOVE: function () {
|
||
// Here it's save to remove the PREROLL_ELEM from the page.
|
||
// But it's not necessary.
|
||
}
|
||
});
|
||
} catch(err3)
|
||
{
|
||
console.log("Error preroll " + e.name + ":" + e.message);
|
||
}
|
||
});
|
||
console.log('PageIsLoaded end');
|
||
}
|
||
var aiptag = aiptag || {};
|
||
aiptag.cmd = aiptag.cmd || [];
|
||
aiptag.cmd.display = aiptag.cmd.display || []; aiptag.cmd.player = aiptag.cmd.player || [];
|
||
// Settings
|
||
aiptag.consented = true; // GDPR setting, please set this value to false if an EU user has declined or not yet accepted marketing cookies, for users outside the EU please use true and for users accepted the GDPR also use true
|
||
aiptag.gdprShowConsentTool = true;
|
||
document.addEventListener("DOMContentLoaded", PageIsLoaded);
|
||
</script>
|
||
<script>
|
||
window.HasAdBlock = false;
|
||
window.adBlockFunction = function(){
|
||
window.HasAdBlock = true;
|
||
}
|
||
</script>
|
||
<script src="libs/jquery-3.3.1.min.js"></script>
|
||
<script src="libs/tingle.min.js"></script>
|
||
<script>
|
||
window.gameLoaded = function () {
|
||
window.sendMessageToUnity("{\"eventName\": \"setBundlesPath\",\"data\": {\"path\": \"" + CONFIG.BuildPath +"\"}}");
|
||
$("#ads").show();
|
||
console.log("getting ads");
|
||
try
|
||
{
|
||
aiptag.cmd.display.push(function() { try{ console.log('adinplay push start'); aipDisplayTag.display('hole-io-com_300x250'); console.log('adinplay push end'); } catch(err2) { console.log('adinplay err'); } });
|
||
} catch(err) {
|
||
console.log("Error " + e.name + ":" + e.message);
|
||
}
|
||
console.log("got ads.");
|
||
}
|
||
|
||
window.onGamePlayPressed = function () {
|
||
$("#ads").hide();
|
||
$("#shares").hide();
|
||
$("#links").hide();
|
||
$("#leaderboard").hide();
|
||
$("#ideaBlock").hide();
|
||
$("#banner").hide();
|
||
$("#rl1").hide();
|
||
$("#rl2").hide();
|
||
gtag('event', 'GAplay');
|
||
$("#preroll").show();
|
||
if( typeof adplayer ==='undefined' )
|
||
{
|
||
$("#preroll").hide();
|
||
document.activeElement.blur();
|
||
document.body.focus();
|
||
window.sendMessageToUnity("{\"eventName\": \"adsComplete\",\"data\": {\"allow\": \"true\"}}");
|
||
} else {
|
||
aiptag.cmd.player.push(function() { adplayer.startPreRoll(); });
|
||
}
|
||
}
|
||
|
||
|
||
window.gameStart = function () {
|
||
}
|
||
|
||
window.gameOverParent = function () {
|
||
$("#shares").show();
|
||
$("#links").show();
|
||
$("#leaderboard").show();
|
||
$("#ideaBlock").show();
|
||
$("#banner").show();
|
||
$("#rl1").show();
|
||
$("#rl2").show();
|
||
GameAdsRenew("banner");
|
||
gtag('event', 'GAgameOver');
|
||
aiptag.cmd.display.push(function() { aipDisplayTag.display('hole-io-com_300x250'); });
|
||
}
|
||
|
||
window.mapsOpen = function(){
|
||
$("#ads").hide();
|
||
$("#shares").hide();
|
||
$("#links").hide();
|
||
$("#leaderboard").hide();
|
||
$("#ideaBlock").hide();
|
||
$("#banner").hide();
|
||
$("#rl1").hide();
|
||
$("#rl2").hide();
|
||
}
|
||
|
||
window.mapsClose = function(){
|
||
$("#shares").show();
|
||
$("#links").show();
|
||
$("#leaderboard").show();
|
||
$("#ideaBlock").show();
|
||
$("#banner").show();
|
||
$("#rl1").show();
|
||
$("#rl2").show();
|
||
}
|
||
|
||
function showAboutGameModal() {
|
||
var modal = new tingle.modal({
|
||
footer: false,
|
||
stickyFooter: false,
|
||
closeMethods: ['overlay', 'button', 'escape'],
|
||
closeLabel: "Close",
|
||
cssClass: ['custom-class-1', 'custom-class-2'],
|
||
onOpen: function () {
|
||
console.log('modal open');
|
||
},
|
||
onClose: function () {
|
||
console.log('modal closed');
|
||
},
|
||
beforeClose: function () {
|
||
return true;
|
||
}
|
||
});
|
||
modal.setContent($("#popup-about").html());
|
||
modal.open();
|
||
}
|
||
function showHowToPlayModal() {
|
||
var modal = new tingle.modal({
|
||
footer: false,
|
||
stickyFooter: false,
|
||
closeMethods: ['overlay', 'button', 'escape'],
|
||
closeLabel: "Close",
|
||
cssClass: ['custom-class-1', 'custom-class-2'],
|
||
onOpen: function () {
|
||
console.log('modal open');
|
||
},
|
||
onClose: function () {
|
||
console.log('modal closed');
|
||
},
|
||
beforeClose: function () {
|
||
return true;
|
||
}
|
||
});
|
||
modal.setContent($("#popup-howtoplay").html());
|
||
modal.open();
|
||
}
|
||
|
||
function showTipsAndTricksModal() {
|
||
var modal = new tingle.modal({
|
||
footer: false,
|
||
stickyFooter: false,
|
||
closeMethods: ['overlay', 'button', 'escape'],
|
||
closeLabel: "Close",
|
||
cssClass: ['custom-class-1', 'custom-class-2'],
|
||
onOpen: function () {
|
||
console.log('modal open');
|
||
},
|
||
onClose: function () {
|
||
console.log('modal closed');
|
||
},
|
||
beforeClose: function () {
|
||
return true;
|
||
}
|
||
});
|
||
modal.setContent($("#popup-tipsandtricks").html());
|
||
modal.open();
|
||
}
|
||
|
||
window.switchBoard = 'Score';
|
||
|
||
window.updateLeaderboards = function () {
|
||
if (window.switchBoard === 'Score') {
|
||
$("#fullBoardKills").hide();
|
||
$("#fullBoardScore").show();
|
||
$("#switchLeaderbBtn").html("Switch to kills");
|
||
} else if (window.switchBoard === 'Kills') {
|
||
$("#fullBoardKills").show();
|
||
$("#fullBoardScore").hide();
|
||
$("#switchLeaderbBtn").html("Switch to score");
|
||
}
|
||
}
|
||
|
||
window.switchLeaderboard = function () {
|
||
if (window.switchBoard === 'Score') {
|
||
window.switchBoard = 'Kills';
|
||
} else if (window.switchBoard === 'Kills') {
|
||
window.switchBoard = 'Score';
|
||
}
|
||
window.updateLeaderboards();
|
||
}
|
||
|
||
window.checkGameOverScreenOn = function () {
|
||
return false;
|
||
}
|
||
|
||
window.makeLeaderBoard = function (id, ar, colName, fontSize) {
|
||
console.log('makeLeaderboard - '.concat(id));
|
||
var table = document.getElementById(id);
|
||
if (table === null)
|
||
return;
|
||
table.innerHTML = "";
|
||
table.innerHTML += '<th><tr style="background-color: #959595; font-size: 22px; height: 30px "><td>' + "Rank" +
|
||
'</td><td style="width:50%;">' + "Name" + '</td><td style="font-size: ' + fontSize + 'px;" valign="middle">' + colName + '</td></tr></th>'
|
||
let counterIncrement = 1;
|
||
var top10 = ar.slice(0,10);
|
||
top10.forEach(function (e) {
|
||
var userName = e.userName;
|
||
if( userName.length > 11 ) userName = userName.substring(0,11);
|
||
table.innerHTML += '<tr><td>' + counterIncrement + '</td><td style="width:50%; height: 30px">' + userName +
|
||
'</td><td>' + e.leaderboardValue + '</td></tr>';
|
||
counterIncrement++;
|
||
})
|
||
}
|
||
|
||
window.sendToApi = function () {
|
||
return;
|
||
}
|
||
|
||
window.fetchApi = function () {
|
||
console.log('received from api');
|
||
fetch('https://topgamedata.com/json/hole_kills_1.json')
|
||
.then(function (response) {
|
||
return response.json();
|
||
})
|
||
.then(function (myJson) {
|
||
console.log("kills:");
|
||
window.makeLeaderBoard('boardKills', myJson, 'Kills', '22');
|
||
});
|
||
fetch('https://topgamedata.com/json/hole_score_1.json')
|
||
.then(function (response) {
|
||
return response.json();
|
||
})
|
||
.then(function (myJson) {
|
||
console.log("score:");
|
||
window.makeLeaderBoard('boardScore', myJson, 'Score', '22');
|
||
});
|
||
|
||
}
|
||
|
||
window.updateLeaderboards();
|
||
window.fetchApi();
|
||
|
||
</script>
|
||
</body>
|
||
</html> |