<!-- <!DOCTYPE html> -->
<html lang="en">
<head><script src="//archive.org/includes/analytics.js?v=cf34f82" type="text/javascript"></script>
<script type="text/javascript">window.addEventListener('DOMContentLoaded',function(){var v=archive_analytics.values;v.service='wb';v.server_name='wwwb-app100.us.archive.org';v.server_ms=1899;archive_analytics.send_pageview({});});</script><script type="text/javascript" src="/_static/js/playback.bundle.js?v=R56vIgLu" charset="utf-8"></script>
<script type="text/javascript" src="/_static/js/wombat.js?v=cRqOKCOw" charset="utf-8"></script>
<script type="text/javascript">
if (window._WBWombatInit) {
wbinfo = {}
wbinfo.url = "https://townofidiots.io/";
wbinfo.timestamp = "20200331165533";
wbinfo.request_ts = "20200331165533";
wbinfo.prefix = "https://web.archive.org/web/";
wbinfo.mod = "if_";
wbinfo.is_framed = false;
wbinfo.is_live = false;
wbinfo.coll = "web";
wbinfo.proxy_magic = "";
wbinfo.static_prefix = "/_static/";
wbinfo.enable_auto_fetch = true;
wbinfo.auto_fetch_worker_prefix = "https://web.archive.org/web/";
wbinfo.wombat_ts = "20200331165533";
wbinfo.wombat_sec = "1585673733";
wbinfo.wombat_scheme = "https";
wbinfo.wombat_host = "townofidiots.io";
wbinfo.ignore_prefixes = ["/__wb/",
"/_static/",
"/web/",
"http://analytics.archive.org/",
"https://analytics.archive.org/",
"//analytics.archive.org/",
"http://archive.org/",
"https://archive.org/",
"//archive.org/",
"http://faq.web.archive.org/",
"http://web.archive.org/",
"https://web.archive.org/"
];
wbinfo.wombat_opts = {};
window._WBWombatInit(wbinfo);
}
__wm.init("https://web.archive.org/web");
</script>
<link rel="stylesheet" type="text/css" href="/_static/css/banner-styles.css?v=_99BHQfY" />
<link rel="stylesheet" type="text/css" href="/_static/css/iconochive.css?v=qtvMKcIJ" />
<!-- End Wayback Rewrite JS Include -->

<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="FREE Mafia Social Deduction Game">
<meta name="keywords" content="Free Town of Salem,Town of Idiots,townofidiots,Town of Idiot,townofidiot,Town of Salem,town of salem free,town of salem alternatives,Mafia,Werewolf,Mafia game,Werewolf game,tos,free mafia game">
<meta name="author" content="">
<!-- <link rel="icon" href="{{url_for('static', filename='favicon.ico')}}"> -->
<link rel="shortcut icon" type="image/x-icon" href="https://web.archive.org/web/20200331165533im_/https://www.townofidiots.io/static/favicon.ico"/>
<title>Town of Idiots - FREE Mafia Social Deduction Game</title>
<meta name="og:title" property="og:title" content="Town of Idiots - FREE Mafia Social Deduction Game">
<meta name="og:description" property="og:description" content="FREE Mafia Social Deduction Game">

<!--https://stackoverflow.com/questions/45367658/how-to-enable-zoom-in-meta-tag-->
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- BEGIN WAYBACK TOOLBAR INSERT -->
<style type="text/css">
body {
margin-top:0 !important;
padding-top:0 !important;
/*min-width:800px !important;*/
}
</style>
<div id="wm-ipp-base" lang="en" style="display:none;direction:ltr;">
<div id="wm-ipp" style="position:fixed;left:0;top:0;right:0;">
<div id="wm-ipp-inside">
<div style="position:relative;">
<div id="wm-logo" style="float:left;width:130px;padding-top:10px;">
<a href="/web/" title="Wayback Machine home page"><img src="/_static/images/toolbar/wayback-toolbar-logo.png" alt="Wayback Machine" width="110" height="39" border="0" /></a>
</div>
<div class="r" style="float:right;">
<div id="wm-btns" style="text-align:right;height:25px;">
<div id="wm-save-snapshot-success">success</div>
<div id="wm-save-snapshot-fail">fail</div>
<a id="wm-save-snapshot-open" href="#"
title="Share via My Web Archive" >
<span class="iconochive-web"></span>
</a>
<a href="https://archive.org/account/login.php"
title="Sign In"
id="wm-sign-in"
>
<span class="iconochive-person"></span>
</a>
<span id="wm-save-snapshot-in-progress" class="iconochive-web"></span>
<a href="http://faq.web.archive.org/" title="Get some help using the Wayback Machine" style="top:-6px;"><span class="iconochive-question" style="color:rgb(87,186,244);font-size:160%;"></span></a>
<a id="wm-tb-close" href="#close" onclick="__wm.h(event);return false;" style="top:-2px;" title="Close the toolbar"><span class="iconochive-remove-circle" style="color:#888888;font-size:240%;"></span></a>
</div>
<div id="wm-share">
<a href="/web/20200331165533/http://web.archive.org/screenshot/https://townofidiots.io/"
id="wm-screenshot"
title="screenshot">
<span class="wm-icon-screen-shot"></span>
</a>
<a id="wm-share-facebook" href="#" data-url="https://web.archive.org/web/20200331165533/https://townofidiots.io/" title="Share on Facebook" style="margin-right:5px;" target="_blank"><span class="iconochive-facebook" style="color:#3b5998;font-size:160%;"></span></a>
<a id="wm-share-twitter" href="#" data-url="https://web.archive.org/web/20200331165533/https://townofidiots.io/" title="Share on Twitter" style="margin-right:5px;" target="_blank"><span class="iconochive-twitter" style="color:#1dcaff;font-size:160%;"></span></a>
</div>
</div>
<table class="c" style="">
<tbody>
<tr>
<td class="u" colspan="2">
<form target="_top" method="get" action="/web/submit" name="wmtb" id="wmtb"><input type="text" name="url" id="wmtbURL" value="https://townofidiots.io/" onfocus="this.focus();this.select();" /><input type="hidden" name="type" value="replay" /><input type="hidden" name="date" value="20200331165533" /><input type="submit" value="Go" /></form>
</td>
<td class="n" rowspan="2" style="width:110px;">
<table>
<tbody>
<!-- NEXT/PREV MONTH NAV AND MONTH INDICATOR -->
<tr class="m">
<td class="b" nowrap="nowrap"><a href="https://web.archive.org/web/20200213135016/https://townofidiots.io/" title="13 Feb 2020"><strong>Feb</strong></a></td>
<td class="c" id="displayMonthEl" title="You are here: 16:55:33 Mar 31, 2020">MAR</td>
<td class="f" nowrap="nowrap">Apr</td>
</tr>
<!-- NEXT/PREV CAPTURE NAV AND DAY OF MONTH INDICATOR -->
<tr class="d">
<td class="b" nowrap="nowrap"><a href="https://web.archive.org/web/20200313132211/https://townofidiots.io/" title="13:22:11 Mar 13, 2020"><img src="/_static/images/toolbar/wm_tb_prv_on.png" alt="Previous capture" width="14" height="16" border="0" /></a></td>
<td class="c" id="displayDayEl" style="width:34px;font-size:24px;white-space:nowrap;" title="You are here: 16:55:33 Mar 31, 2020">31</td>
<td class="f" nowrap="nowrap"><img src="/_static/images/toolbar/wm_tb_nxt_off.png" alt="Next capture" width="14" height="16" border="0" /></td>
</tr>
<!-- NEXT/PREV YEAR NAV AND YEAR INDICATOR -->
<tr class="y">
<td class="b" nowrap="nowrap">2019</td>
<td class="c" id="displayYearEl" title="You are here: 16:55:33 Mar 31, 2020">2020</td>
<td class="f" nowrap="nowrap">2021</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td class="s">
<div id="wm-nav-captures">
<a class="t" href="/web/20200331165533*/https://townofidiots.io/" title="See a list of every capture for this URL">13 captures</a>
<div class="r" title="Timespan for captures of this URL">20 Dec 2019 - 31 Mar 2020</div>
</div>
</td>
<td class="k">
<a href="" id="wm-graph-anchor">
<div id="wm-ipp-sparkline" title="Explore captures for this URL" style="position: relative">
<canvas id="wm-sparkline-canvas" width="625" height="27" border="0"></canvas>
</div>
</a>
</td>
</tr>
</tbody>
</table>
<div style="position:absolute;bottom:0;right:2px;text-align:right;">
<a id="wm-expand" class="wm-btn wm-closed" href="#expand" onclick="__wm.ex(event);return false;"><span id="wm-expand-icon" class="iconochive-down-solid"></span> <span style="font-size:80%">About this capture</span></a>
</div>
</div>
<div id="wm-capinfo" style="border-top:1px solid #777;display:none; overflow: hidden">
<div id="wm-capinfo-collected-by">
<div style="background-color:#666;color:#fff;font-weight:bold;text-align:center">COLLECTED BY</div>
<div style="padding:3px;position:relative" id="wm-collected-by-content">
<div style="display:inline-block;vertical-align:top;width:50%;">
<span class="c-logo" style="background-image:url(https://archive.org/services/img/webwidecrawl);"></span>
Organization: <a style="color:#33f;" href="https://archive.org/details/webwidecrawl" target="_new"><span class="wm-title">Internet Archive</span></a>
<div style="max-height:75px;overflow:hidden;position:relative;">
<div style="position:absolute;top:0;left:0;width:100%;height:75px;background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,0) 90%,rgba(255,255,255,255) 100%);"></div>
The Internet Archive discovers and captures web pages through many different web crawls.

At any given time several distinct crawls are running, some for months, and some every day or longer.

View the web archive through the <a href="http://archive.org/web/web.php">Wayback Machine</a>.
</div>
</div>
<div style="display:inline-block;vertical-align:top;width:49%;">
<span class="c-logo" style="background-image:url(https://archive.org/services/img/liveweb)"></span>
<div>Collection: <a style="color:#33f;" href="https://archive.org/details/liveweb" target="_new"><span class="wm-title">Live Web Proxy Crawls</span></a></div>
<div style="max-height:75px;overflow:hidden;position:relative;">
<div style="position:absolute;top:0;left:0;width:100%;height:75px;background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,0) 90%,rgba(255,255,255,255) 100%);"></div>
Content crawled via the <a href="http://archive.org/web/web.php">Wayback Machine</a> Live Proxy mostly by the Save Page Now feature on web.archive.org.
<br /><br />
Liveweb proxy is a component of Internet Archive’s wayback machine project. The liveweb proxy captures the content of a web page in real time, archives it into a ARC or WARC file and returns the ARC/WARC record back to the wayback machine to process. The recorded ARC/WARC file becomes part of the wayback machine in due course of time.
<br /><br />
</div>
</div>
</div>
</div>
<div id="wm-capinfo-timestamps">
<div style="background-color:#666;color:#fff;font-weight:bold;text-align:center" title="Timestamps for the elements of this page">TIMESTAMPS</div>
<div>
<div id="wm-capresources" style="margin:0 5px 5px 5px;max-height:250px;overflow-y:scroll !important"></div>
<div id="wm-capresources-loading" style="text-align:left;margin:0 20px 5px 5px;display:none"><img src="/_static/images/loading.gif" alt="loading" /></div>
</div>
</div>
</div></div></div></div><div id="donato" style="position:relative;width:100%;">
<div id="donato-base">
<iframe id="donato-if" src="https://archive.org/includes/donate.php?as_page=1&amp;transpiled=0&amp;referer=https%3A//web.archive.org/web/20200331165533/https%3A//townofidiots.io/"
scrolling="no" frameborder="0" style="width:100%; height:100%">
</iframe>
</div>
</div><script type="text/javascript">
__wm.bt(625,27,25,2,"web","https://townofidiots.io/","20200331165533",1996,"/_static/",["/_static/css/banner-styles.css?v=_99BHQfY","/_static/css/iconochive.css?v=qtvMKcIJ"]);
</script>
<!-- END WAYBACK TOOLBAR INSERT --><audio id="beep" src="https://www.townofidiots.io/static/mp3/beep.mp3" preload="auto"></audio>

<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/es5-shim.js"></script>
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/es6-shim.js"></script>

<!-- <link href="//d3h5jhobc20ump.cloudfront.net/d5eb184df1ac43d713f3d09f38fd5a56.css" rel="stylesheet" type="text/css"> -->
<!-- <link href="{{url_for('static', filename='css/bitly.css')}}" rel="stylesheet"> -->

<!-- Bootstrap core CSS -->
<!--<link href="{{url_for('static', filename='css/bootstrap.min.css')}}" rel="stylesheet">-->

<!-- Custom styles for this template -->
<!-- <link href="{{url_for('static', filename='css/custom.min.css')}}" rel="stylesheet"> -->
<!-- <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/socket.io/1.3.6/socket.io.min.js"></script>-->
<!-- <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/socket.io-client@2/dist/socket.io.js"></script>-->


<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/socket.io.js"></script>

<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/tts.2.7.min.js"></script>


<!-- <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.min.css" type="text/css" media="screen" /> -->
<link href="https://web.archive.org/web/20200331165533cs_/https://www.townofidiots.io/static/css/jquery-ui.min.css" rel="stylesheet">
<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>-->

<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/jquery.min.js"></script>

<!--<script src="https://code.jquery.com/ui/1.12.0-rc.2/jquery-ui.min.js" integrity="sha256-55Jz3pBCF8z9jBO1qQ7cIf0L+neuPTD1u7Ytzrp2dqo=" crossorigin="anonymous"></script>-->
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/jquery-ui.min.js"></script>


<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<style>
.hidden {
display: none;
}

.mylist {
width: 15em;
float:left;
}

.topcorner{
position:absolute;
/*top:25;*/
right:0;
bottom: 0;
}

.timeFont {
font-size:400%;
font-weight: bold;
color:#ff0000
}

.bigFont {
font-size:calc(16px + 1vw);
font-weight: bold;
/* color: black;
*/ }
.mediumFont {
font-size:calc(16px + 1vw);
/*font-weight: bold;*/
/* color: black;
*/ }

.tooltip_1 {
position: relative;
/*display: inline-block;*/
/*border-bottom: 1px dotted black;*/
}

.tooltip_1 .tooltiptext_1 {
visibility: hidden;
width: 500px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
border: 1px solid #000000;
word-wrap: break-word;

/* Position the tooltip */
position: absolute;
z-index: 1;
}

.tooltip_1:hover .tooltiptext_1 {
visibility: visible;
}

body {margin:0;padding:0;}

canvas {
padding-left: 0;
padding-right: 0;
margin-left: auto;
margin-right: auto;
/*display: block;*/
/*width: 800px;*/
}

#topbar {
position: absolute;
float: none;
/* width: 100%;
height: 100%;*/
}

#wrapper {
overflow: auto;
/*background: #00B2EE;*/
/*background: #FFCC4D;*/
/*background: aqua;*/
background: #00FFFF;
/* background-repeat: no-repeat;
background-size: cover;*/
top: 10%;
left: 0;
position: absolute;
width: 100%;
height: 100%;
}

.first {
/*background: green;*/
/*background: aqua;*/
background: #00FFFF;
position: absolute;
width: 100%;
height: 10%;
}

#bg {
position: fixed;
background-color: black;
height: 100%;
width: 100%;
margin: 0;
padding:0;
opacity: 0;
z-index: 0;
/* display:none;
*/}

#above_tabs {
width: 80%;
left: 80%;
top: 30%;
/*font-size: 100%;*/
position: absolute;
}

.grecaptcha-badge {
z-index: 10;
}


/*https://stackoverflow.com/a/41458897*/
/* Custom, iPhone Retina */
@media only screen and (min-width : 0px) {
#lobby_title {
height: 40px;
width: 100%;
}
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
#lobby_title {
height: 50px;
width: 100%;
}
}

@media only screen and (min-width : 624px) {
#lobby_title {
height: 60px;
width: 100%;
}
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
#lobby_title {
height: 70px;
width: 100%;
}
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
#lobby_title {
height: 100%;
}
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {

}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {
}

</style>

<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<!--<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.css" type="text/css" media="screen" />-->
<!-- <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.min.css" type="text/css" media="screen" />
-->
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> -->
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/jscolor.1.0.min.js"></script>

<!--<script src="{{url_for('static', filename='js/jquery.min.js')}}"></script>-->
<!--<script src="{{url_for('static', filename='js/bootstrap.min.js')}}"></script>--><!--
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> -->

<!--Clipboard JavaScript-->
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/clipboard.min.js"></script>
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/custom.min.js"></script>
<!--<script src="{{url_for('static', filename='js/jquery.tubular.1.0.js')}}"></script> -->
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/jquery.tubular.1.0.min.js"></script>
<!-- <script src="{{url_for('static', filename='js/jquery.cookie.min.js')}}"></script> -->

<!--jQuery UI CSS-->
<!--jQuery and jQuery UI with jQuery Chat-->
<!-- <script src="https://code.jquery.com/ui/1.12.0-rc.2/jquery-ui.min.js" integrity="sha256-55Jz3pBCF8z9jBO1qQ7cIf0L+neuPTD1u7Ytzrp2dqo=" crossorigin="anonymous"></script>
--><!--<link href="{{url_for('static', filename='css/jquery.ui.chatbox.css')}}" rel="stylesheet">-->



<!--<script src="{{url_for('static', filename='js/Winwheel.js')}}"></script>-->
<!--<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>-->

<!-- <script src="https://www.google.com/recaptcha/api.js?render=6LdL3dgUAAAAAABrACphbBswqblO9wO5mfMtmo7G"></script> -->
<!-- <script src="https://www.google.com/recaptcha/api.js?onload=onloadCallback&render=explicit" async defer></script> -->
<!-- <script src="https://hcaptcha.com/1/api.js?onload=onloadCallback&render=explicit" async defer></script> -->
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/gt.js"></script>


<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/swearjar.14.7.min.js"></script>
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/profanity_filter.9.5.min.js"></script>
<link href="https://web.archive.org/web/20200331165533cs_/https://www.townofidiots.io/static/css/jquery.ui.chatbox.min.css" rel="stylesheet">
<script src="https://web.archive.org/web/20200331165533js_/https://www.townofidiots.io/static/js/jquery.ui.chatbox.5.7.min.js"></script>

<script>

window.page = "lobby";

function readCookie_custom(name) {
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ') c = c.substring(1,c.length);
// if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length);
// if (c.indexOf(nameEQ) == 0) return unescape(c.substring(nameEQ.length,c.length));
if (c.indexOf(nameEQ) == 0) return decodeURIComponent(c.substring(nameEQ.length,c.length));
}
return null;
}

function setCookie_custom(c_name, value, exdays) {
var exdate = new Date();
exdate.setDate(exdate.getDate() + exdays);
// var c_value = escape(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
var c_value = encodeURIComponent(value) + ((exdays == null) ? "" : "; expires=" + exdate.toUTCString());
document.cookie = c_name + "=" + c_value;
}

function deleteCookie_custom(name) {
document.cookie = name +'=; Path=/; Expires=Thu, 01 Jan 1970 00:00:01 GMT;';
}

//https://stackoverflow.com/questions/13586999/color-difference-similarity-between-two-values-with-js
//https://stackoverflow.com/a/52453462
function deltaE(rgbA, rgbB) {
if(rgbA == null || rgbB == null) {
return 100;
}
let labA = rgb2lab(rgbA);
let labB = rgb2lab(rgbB);
let deltaL = labA[0] - labB[0];
let deltaA = labA[1] - labB[1];
let deltaB = labA[2] - labB[2];
let c1 = Math.sqrt(labA[1] * labA[1] + labA[2] * labA[2]);
let c2 = Math.sqrt(labB[1] * labB[1] + labB[2] * labB[2]);
let deltaC = c1 - c2;
let deltaH = deltaA * deltaA + deltaB * deltaB - deltaC * deltaC;
deltaH = deltaH < 0 ? 0 : Math.sqrt(deltaH);
let sc = 1.0 + 0.045 * c1;
let sh = 1.0 + 0.015 * c1;
let deltaLKlsl = deltaL / (1.0);
let deltaCkcsc = deltaC / (sc);
let deltaHkhsh = deltaH / (sh);
let i = deltaLKlsl * deltaLKlsl + deltaCkcsc * deltaCkcsc + deltaHkhsh * deltaHkhsh;
return i < 0 ? 0 : Math.sqrt(i);
}

function rgb2lab(rgb){
let r = rgb[0] / 255, g = rgb[1] / 255, b = rgb[2] / 255, x, y, z;
r = (r > 0.04045) ? Math.pow((r + 0.055) / 1.055, 2.4) : r / 12.92;
g = (g > 0.04045) ? Math.pow((g + 0.055) / 1.055, 2.4) : g / 12.92;
b = (b > 0.04045) ? Math.pow((b + 0.055) / 1.055, 2.4) : b / 12.92;
x = (r * 0.4124 + g * 0.3576 + b * 0.1805) / 0.95047;
y = (r * 0.2126 + g * 0.7152 + b * 0.0722) / 1.00000;
z = (r * 0.0193 + g * 0.1192 + b * 0.9505) / 1.08883;
x = (x > 0.008856) ? Math.pow(x, 1/3) : (7.787 * x) + 16/116;
y = (y > 0.008856) ? Math.pow(y, 1/3) : (7.787 * y) + 16/116;
z = (z > 0.008856) ? Math.pow(z, 1/3) : (7.787 * z) + 16/116;
return [(116 * y) - 16, 500 * (x - y), 200 * (y - z)]
}

//https://stackoverflow.com/questions/5623838/rgb-to-hex-and-hex-to-rgb
function hexToRgb(hex) {
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ?
[parseInt(result[1], 16),parseInt(result[2], 16),parseInt(result[3], 16)] : null;
}

// //https://stackoverflow.com/questions/36212722/how-to-prevent-pull-down-to-refresh-of-mobile-chrome
// var touchStartHandler,
// touchMoveHandler,
// touchPoint;

// // Only needed for touch events on chrome.
// if ((window.chrome || navigator.userAgent.match("CriOS"))
// && "ontouchstart" in document.documentElement) {

// touchStartHandler = function() {
// // Only need to handle single-touch cases
// touchPoint = event.touches.length === 1 ? event.touches[0].clientY : null;
// };

// touchMoveHandler = function(event) {
// var newTouchPoint;

// // Only need to handle single-touch cases
// if (event.touches.length !== 1) {
// touchPoint = null;

// return;
// }

// // We only need to defaultPrevent when scrolling up
// newTouchPoint = event.touches[0].clientY;
// if (newTouchPoint > touchPoint) {
// event.preventDefault();
// }
// touchPoint = newTouchPoint;
// };

// document.addEventListener("touchstart", touchStartHandler, {
// passive: false
// });

// document.addEventListener("touchmove", touchMoveHandler, {
// passive: false
// });
// }




$( document ).ready(function() {
//https://stackoverflow.com/questions/29008194/disabling-androids-chrome-pull-down-to-refresh-feature
//https://stackoverflow.com/a/42535170
$(window).scroll(function() {
if ($(document).scrollTop() >= 1) {
$("html").css({
"touch-action": "auto"}
);
} else {
$("html").css({
"touch-action": "pan-down"
});
}
});
});


var tts_on = true;
var tts_volume = 0.5;
// var profanity_filter_on = true;

function tts_test() {
tts.cancel();
// tts.speak("Town of Idiots is the best game in the world! My Kangaroo needs to suck on your grandmother's tits for tasty milk", $("#tts_accents :selected").val(), {volume: tts_volume});
tts.speak("Town of Idiots is the best game in the world!", $("#tts_accents :selected").val(), {volume: tts_volume});
// tts.speak("Join the Town of Idiots discord for cute girls you thirsty horny boys", $("#tts_accents :selected").val(), {volume: tts_volume});
}

function tts_handleClick(cb) {
tts_on = cb.checked;
setCookie_custom('tts_on', tts_on.toString(), 10000);
}

var music_on = true;
var music_volume = 0.5;
function music_handleClick(cb) {
// var volumeRange = document.getElementById("musicVolumeRange");
var audio_elements = document.getElementsByTagName('audio');
if(cb.checked) {
for(var i = 0; i < audio_elements.length; i++) {
audio_elements[i].volume = music_volume;
}
} else {
for(var i = 0; i < audio_elements.length; i++) {
audio_elements[i].volume = 0;
}
}
music_on = cb.checked;
setCookie_custom('music_on', cb.checked.toString(), 10000);
}

function profanity_filter_handleClick(cb) {
profanity_filter_on = cb.checked;
setCookie_custom('profanity_filter_on', cb.checked.toString(), 10000);

setTimeout(function() {
if(profanity_filter_on) {
profanity_filter_set_on();
} else {
profanity_filter_set_off();
}
}, 0);
}

function profanity_filter_set_on() {
// $('.message_id').each(function(i, obj) {
// var obj_text = $(obj).text();

// $(obj).data("old_value", obj_text);
// $(obj).text(noSwearing.replace_bad_words(obj_text, '*'));
// });
// $('.message').each(function(i, obj) {
// var obj_text = $(obj).text();

// $(obj).data("old_value", obj_text);
// $(obj).text(noSwearing.replace_bad_words(obj_text, '*'));
// });
$('.message_id').each(function(i, obj) {
var filtered_text = $(obj).data("filtered_text");
if(filtered_text != null && filtered_text != "") {
//only if se it if there is bad words
if($(obj).data("original_text").includes("<span>")) {
//like for deas names <span> color red for (dead), use html
$(obj).html($(obj).data("original_text"));
} else {
$(obj).text($(obj).data("original_text"));
}
}
});
$('.message').each(function(i, obj) {
var filtered_text = $(obj).data("filtered_text");
if(filtered_text != null && filtered_text != "") {
//only if se it if there is bad words
$(obj).text(filtered_text);
}
});
}

function profanity_filter_set_off() {
// $('.message_id').each(function(i, obj) {
// var obj_value = $(obj).data("old_value");
// $(obj).text(obj_value);

// //make empty
// // $(obj).value("");
// });
// $('.message').each(function(i, obj) {
// var obj_value = $(obj).data("old_value",);
// $(obj).text(obj_value);

// //make empty
// // $(obj).value("");
// });
$('.message_id').each(function(i, obj) {
var filtered_text = $(obj).data("filtered_text");
if(filtered_text != null && filtered_text != "") {
//only if se it if there is bad words
$(obj).text($(obj).data("original_text"));
}
});
$('.message').each(function(i, obj) {
var filtered_text = $(obj).data("filtered_text");
if(filtered_text != null && filtered_text != "") {
//only if se it if there is bad words
$(obj).text($(obj).data("original_text"));
}
});
}


//https://awik.io/determine-color-bright-dark-using-javascript/
function lightOrDark(color) {

// Variables for red, green, blue values
var r, g, b, hsp;
// Check the format of the color, HEX or RGB?
if (color.match(/^rgb/)) {

// If HEX --> store the red, green, blue values in separate variables
color = color.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+(?:\.\d+)?))?\)$/);
r = color[1];
g = color[2];
b = color[3];
}
else {
// If RGB --> Convert it to HEX: http://gist.github.com/983661
color = +("0x" + color.slice(1).replace(
color.length < 5 && /./g, '$&$&'));

r = color >> 16;
g = color >> 8 & 255;
b = color & 255;
}
// HSP (Highly Sensitive Poo) equation from http://alienryderflex.com/hsp.html
hsp = Math.sqrt(
0.299 * (r * r) +
0.587 * (g * g) +
0.114 * (b * b)
);

// Using the HSP value, determine whether the color is light or dark
if (hsp>127.5) {

return 'light';
}
else {

return 'dark';
}
}

//https://stackoverflow.com/questions/48732774/jscolor-update-background-colours-after-loading-values-in-javascript
function HEX_rgb (hex){
var a = 'rgb(' + parseInt(hex.substring(0,2), 16) + ", " + parseInt(hex.substring(2,4), 16) + ", " + parseInt(hex.substring(4,6), 16) + ')';
return a;
}

if(readCookie_custom("profanity_filter_on") != null) {
profanity_filter_on = (readCookie_custom("profanity_filter_on") == 'true');
// $("#profanity_filter_checkbox").attr('checked', profanity_filter_on);
}
// if(profanity_filter_on) {
// profanity_filter_set_on();
// } else {
// profanity_filter_set_off();
// }

if(readCookie_custom("tts_on") != null) {
tts_on = (readCookie_custom("tts_on") == 'true');
//$("#tts_checkbox").attr('checked', tts_on);
}

if(readCookie_custom("tts_volume") != null) {
tts_volume = parseFloat(readCookie_custom("tts_volume"));
//$("#ttsVolumeRange").val(readCookie_custom("tts_volume"));
}

if(readCookie_custom("music_on") != null) {
music_on = (readCookie_custom("music_on") == 'true');
//$("#music_checkbox").attr('checked', music_on);
if(!music_on) {
var audio_elements = document.getElementsByTagName('audio');
for(var i = 0; i < audio_elements.length; i++) {
audio_elements[i].volume = 0;
}
}
}

if(readCookie_custom("music_volume") != null) {
music_volume = parseFloat(readCookie_custom("music_volume"));
//$("#musicVolumeRange").val(readCookie_custom("music_volume"));
}

// var background_color = 'aqua';
var background_color = '#00FFFF';
var background_color_light_or_dark = 'light';
// var first_background_color = 'aqua';
var first_background_color = '#00FFFF';
var first_background_color_light_or_dark = 'light';

var title_color = "#FF0000"; //red
var color_similarity_threshold = 35;

$(document).ready(function() {

if(readCookie_custom("background_color") != null) {
if(hexToRgb(readCookie_custom("background_color")) == null) {
deleteCookie_custom("background_color");
} else {
background_color = readCookie_custom("background_color");
background_color_light_or_dark = lightOrDark(background_color);
first_background_color = background_color;
first_background_color_light_or_dark = background_color_light_or_dark;

//if night, don't change
// if($("#wrapper").css("background-color") != 'rgb(0, 0, 0)') {
$("#wrapper").css("background-color", background_color);
$(".first").css("background-color", background_color);

// setCookie_custom("background_color", valueSelected, 10000);

if(background_color_light_or_dark == "dark") {
$("#wrapper").css('color', 'white');
$("#lobby_title").css('color', "yellow");
$("#lobby_title_description").css('color', "yellow");
} else {
$("#wrapper").css('color', 'black');
if(deltaE(hexToRgb(background_color), hexToRgb(title_color)) > color_similarity_threshold) {
$("#lobby_title").css('color', "red");
$("#lobby_title_description").css('color', "red");
} else {
//close to red, change to yellow
$("#lobby_title").css('color', "yellow");
$("#lobby_title_description").css('color', "yellow");
}
}
// }


$("#bgcolor").val(background_color.replace("#", ""));
// $(this)[0].color.fromString(background_color.replace("#", "").toLowerCase());
document.getElementById('bgcolor').jscolor.valueElement.style.backgroundColor = HEX_rgb(background_color.replace("#", "").toLowerCase());
document.getElementById('bgcolor').jscolor.valueElement.style.color = (background_color_light_or_dark == 'light')?'black':'white';

$("#first_bgcolor").val(background_color.replace("#", ""));
document.getElementById('first_bgcolor').jscolor.valueElement.style.backgroundColor = HEX_rgb(background_color.replace("#", "").toLowerCase());
document.getElementById('first_bgcolor').jscolor.valueElement.style.color = (background_color_light_or_dark == 'light')?'black':'white';
}
}

if(readCookie_custom("first_background_color") != null) {
if(hexToRgb(readCookie_custom("first_background_color")) == null) {
deleteCookie_custom("first_background_color");
} else {
first_background_color = readCookie_custom("first_background_color");
first_background_color_light_or_dark = lightOrDark(first_background_color);

//if night, don't change
// if($("#wrapper").css("background-color") != 'rgb(0, 0, 0)') {
// $("#wrapper").css("background-color", valueSelected);
$(".first").css("background-color", first_background_color);

// setCookie_custom("first_background_color", valueSelected, 10000);

if(first_background_color_light_or_dark == "dark") {
// $("#wrapper").css('color', 'white');
$("#lobby_title").css('color', "yellow");
// $("#lobby_title_description").css('color', "yellow");
} else {
// $("#wrapper").css('color', 'black');

// $("#lobby_title").css('color', "red");
if(deltaE(hexToRgb(first_background_color), hexToRgb(title_color)) > color_similarity_threshold) {
$("#lobby_title").css('color', "red");
} else {
//similar
$("#lobby_title").css('color', "yellow");
}

// $("#lobby_title_description").css('color', "red");
}


$("#first_bgcolor").val(first_background_color.replace("#", ""));
// $(this)[0].color.fromString(background_color.replace("#", "").toLowerCase());
document.getElementById('first_bgcolor').jscolor.valueElement.style.backgroundColor = HEX_rgb(first_background_color.replace("#", "").toLowerCase());
document.getElementById('first_bgcolor').jscolor.valueElement.style.color = (first_background_color_light_or_dark == 'light')?'black':'white';
}
}



if(readCookie_custom("profanity_filter_on") != null) {
// profanity_filter_on = (readCookie_custom("profanity_filter_on") == 'true');
$("#profanity_filter_checkbox").attr('checked', profanity_filter_on);
}
if(profanity_filter_on) {
profanity_filter_set_on();
} else {
profanity_filter_set_off();
}

if(readCookie_custom("tts_on") != null) {
//tts_on = (readCookie_custom("tts_on") == 'true');
$("#tts_checkbox").attr('checked', tts_on);
}

if(readCookie_custom("tts_volume") != null) {
//tts_volume = parseFloat(readCookie_custom("tts_volume"));
$("#ttsVolumeRange").val(parseFloat(readCookie_custom("tts_volume")) * 100);
}

if(readCookie_custom("music_on") != null) {
//music_on = (readCookie_custom("music_on") == 'true');
$("#music_checkbox").attr('checked', music_on);
}

if(readCookie_custom("music_volume") != null) {
//music_volume = parseFloat(readCookie_custom("music_volume"));
$("#musicVolumeRange").val(parseFloat(readCookie_custom("music_volume")) * 100);
}


$("#ttsVolumeRange").on("input change", function() {
var volumeRange = document.getElementById("ttsVolumeRange");
tts_volume = volumeRange.value/100;
setCookie_custom('tts_volume', tts_volume.toString(), 10000);
});

$("#musicVolumeRange").on("input change", function() {
var volumeRange = document.getElementById("musicVolumeRange");
var audio_elements = document.getElementsByTagName('audio');
var newVolume = volumeRange.value/100;
music_volume = newVolume;

if(music_on) {
for(var i = 0; i < audio_elements.length; i++) {
// var newVolume = volumeRange.value/100;
audio_elements[i].volume = newVolume;
// music_volume = newVolume;
}
}

setCookie_custom("music_volume", music_volume.toString(), 10000);
});

$("#wrapper").css("background-color", background_color);

$('#bgcolor').on('change', function (e) {
var optionSelected = $("option:selected", this);
// var valueSelected = '#' + this.value;
var valueSelected = this.value;

if(valueSelected.includes('#')) {
//don't do anything
} else {
valueSelected = '#' + this.value;
}

if(hexToRgb(valueSelected) == null) {
return;
}

background_color = valueSelected;
background_color_light_or_dark = lightOrDark(background_color);

//if night, don't change
// if($("#wrapper").css("background-color") != 'rgb(0, 0, 0)') {
$("#wrapper").css("background-color", valueSelected);
$(".first").css("background-color", valueSelected);

setCookie_custom("background_color", valueSelected, 10000);

if(background_color_light_or_dark == "dark") {
$("#wrapper").css('color', 'white');
$("#lobby_title").css('color', "yellow");
$("#lobby_title_description").css('color', "yellow");
} else {
$("#wrapper").css('color', 'black');
if(deltaE(hexToRgb(background_color), hexToRgb(title_color)) > color_similarity_threshold) {
$("#lobby_title").css('color', "red");
$("#lobby_title_description").css('color', "red");
} else {
//<= 10, means close to red, so set to yellow
$("#lobby_title").css('color', "yellow");
$("#lobby_title_description").css('color', "yellow");
}
}
// }

$("#first_bgcolor").val(background_color.replace("#", ""));
document.getElementById('first_bgcolor').jscolor.valueElement.style.backgroundColor = HEX_rgb(background_color.replace("#", "").toLowerCase());
document.getElementById('first_bgcolor').jscolor.valueElement.style.color = (background_color_light_or_dark == 'light')?'black':'white';
});

$('#first_bgcolor').on('change', function (e) {
var optionSelected = $("option:selected", this);
// var valueSelected = '#' + this.value;
var valueSelected = this.value;

if(valueSelected.includes('#')) {
//don't do anything
} else {
valueSelected = '#' + this.value;
}

if(hexToRgb(valueSelected) == null) {
return;
}

first_background_color = valueSelected;
first_background_color_light_or_dark = lightOrDark(first_background_color);

//if night, don't change
// if($("#wrapper").css("background-color") != 'rgb(0, 0, 0)') {
// $("#wrapper").css("background-color", valueSelected);
$(".first").css("background-color", valueSelected);

setCookie_custom("first_background_color", valueSelected, 10000);

if(first_background_color_light_or_dark == "dark") {
// $("#wrapper").css('color', 'white');
$("#lobby_title").css('color', "yellow");
// $("#lobby_title_description").css('color', "yellow");
} else {
// $("#wrapper").css('color', 'black');

// $("#lobby_title").css('color', "red");

// $("#lobby_title_description").css('color', "red");
if(deltaE(hexToRgb(first_background_color), hexToRgb(title_color)) > color_similarity_threshold) {
$("#lobby_title").css('color', "red");
// $("#lobby_title_description").css('color', "red");
} else {
//<= 10, means close to red, so set to yellow
$("#lobby_title").css('color', "yellow");
// $("#lobby_title_description").css('color', "yellow");
}
}
// }
});
});
</script>

</head>

<body>

<div id="bg">
</div>


<div class="first">
<!-- <form action="/changeName" method="post" name="changeName" id="changeName"> -->

<!-- <b>Change your name</b>
<input type="text" id="name" name="name" value="" maxlength="20">
<input id="submit" type="submit" name="submit" value="Change name"></input>
</form> -->

<!-- <span style="color: red; height: 100%; position: absolute;" id="lobby_title">TOWN OF IDIOTS .io</span> -->
<span style="color: red; float: left;" id="lobby_title">TOWN OF IDIOTS .io</span>
<!-- <div style="height: 100%; float: left;"><span style=color: red; position:absolute;bottom: 0;left: 0;white-space: pre-wrap;" id="lobby_title_description"> Town of Idiots is a browser-based game that challenges players on their ability to convincingly lie as well as detect when other players are lying. The game ranges from 17 to 17 players. These players are randomly divided into alignments – Town, Mafia, and Neutrals. If you are a Town member (the good guys) you must track down the Mafia and other villains before they kill you. The catch? You don’t know who is a Town member and who is a villain. If you are an evil role, such as the Devil, you secretly murder town members in the veil of night and try to avoid getting caught</span></div> -->

<!-- how mafia isn't supposed to be played -->
<!-- <div class="topcorner timeFont" id="time">60</div>
-->

</div>

<div id="wrapper">
<div style="float: left">
<!-- <canvas id='roles_wheel' width='500%' height='500%'>
Canvas not supported, use another browser.
</canvas> -->
<!-- <div> -->
<span style="color: red;white-space: pre-wrap;" id="lobby_title_description">Town of Idiots is a free browser-based Mafia social deduction game that challenges players on their ability to convincingly lie as well as detect when other players are lying. The game ranges from 17 to 17 players. These players are randomly divided into alignments – Town, Mafia, and Neutrals. If you are a Town member (the good guys) you must track down the Mafia and other villains before they kill you. The catch? You don’t know who is a Town member and who is a villain. If you are an evil role, such as the Devil, you secretly murder town members in the veil of night and try to avoid getting caught.</span>
<div>
<span class="bigFont" style="white-space: pre;">Number of Required Users: </span><span class="bigFont" id="num_users_required">17</span>
<!-- <span style="float:right; margin-right: 10px"><span class="bigFont" style="white-space: pre;">Current Active Games: </span><span class="bigFont" id="num_users_required">?</span></span><br> -->

<!-- <div style="float:right;">
<span style="float:right; margin-right: 10px"><span class="bigFont" style="white-space: pre;">Current Active Games: </span><span class="bigFont" id="num_active_games">?</span></span><br>

<div><span class="mediumFont" style="white-space: pre;font-weight: bold;"><u>PATCH NOTES 2.4</u></span></div>
<div><span class="" style="white-space: pre;"> 1. TTS now notifies when game starts</span></div>
<div><span class="" style="white-space: pre;"> 2. Framer can't kill when all mafia are dead bug fixed</span></div>
<div><span class="" style="white-space: pre;"> 3. Healing target dying to bodyguard bug fixed</span></div>
<div><span class="" style="white-space: pre;"> 4. Print bug where bodyguard is healed but says killed fixed</span></div>
<div><span class="" style="white-space: pre;"> 5. Name length UI bug fixed</span></div>
<div><span class="" style="white-space: pre;"> 6. Fixed a bug bodyguard wasn't showing killer's death note</span></div>
<div><span class="" style="white-space: pre;"> 7. (dead) in dead names is now highlighted in red</span></div>
<div><span class="" style="white-space: pre;"> 8. Client side redirection to game in wheel phase</span></div>
<div><span class="" style="white-space: pre;"> 9. Name character limit is now 20</span></div>
</div> -->
</div>
<!-- <div><span class="bigFont" style="white-space: pre;">Current Number of Users: </span><span class="bigFont" id="current_num_users">{{current_num_users}}</span></div> -->
<div><span class="bigFont" style="white-space: pre;">Current Number of Users: </span><span class="bigFont" id="current_num_users">?</span></div>
<div><span class="bigFont" style="white-space: pre;">Current Active Games: </span><span class="bigFont" id="num_active_games">?</span></div>
<!-- <div><span class="bigFont" style="color: red;"><a href="https://www.discord.gg/JERmPGy" target="_blank">JOIN THE DISCORD!</a></span></div> -->
<div><span class="mediumFont" style="color: red;"><a href="https://web.archive.org/web/20200331165533/https://discord.gg/qsb2z3k" target="_blank">JOIN THE DISCORD!</a></span></div>
<div><span class="mediumFont" style="color: red;"><a href="https://web.archive.org/web/20200331165533/https://docs.google.com/document/d/15I0R1J8JVRm8J8YEa5cDcPhlXDXDF2_PHemELmEXq54/edit?usp=drivesdk" target="_blank">Role descriptions</a></span></div>
<!-- <input id="tts_checkbox" type="checkbox" name="tts_on" value="true" onclick='tts_handleClick(this);' checked><span style="white-space: pre;" >Text to Speech on/off (if TTS isn't working, use Chrome)</span><br> -->
<input id="tts_checkbox" type="checkbox" name="tts_on" value="true" onclick="tts_handleClick(this);" checked><span style="white-space: pre;">Text to Speech on/off</span><br>
<span style="white-space: pre;">TTS Accent: </span><select id="tts_accents"></select> <button onclick="tts_test()" id="tts_test_button" style="display:none;">Test</button><br>
<span style="white-space: pre;"> TTS volume level: </span><input type="range" min="1" max="100" value="50" class="slider" id="ttsVolumeRange"><br>
<input id="music_checkbox" type="checkbox" name="music_on" value="true" onclick="music_handleClick(this);" checked>Music on/off<br>
<span style="white-space: pre;"> Music volume level: </span><input type="range" min="1" max="100" value="50" class="slider" id="musicVolumeRange"><br>
<span style="white-space: pre;"> Background color: </span><input style="width:100px;" class="jscolor {width:243, height:150, position:'right',
borderColor:'#FFF', insetColor:'#FFF', backgroundColor:'#666'}" id="bgcolor" name="bgcolor" value="00ffff"/><br>
<span style="white-space: pre;"> Top bar background color: </span><input style="width:100px;" class="jscolor {width:243, height:150, position:'right',
borderColor:'#FFF', insetColor:'#FFF', backgroundColor:'#666'}" id="first_bgcolor" name="bgcolor" value="00ffff"/><br>
<!-- <input id="profanity_filter_checkbox" type="checkbox" name="profanity_filter_on" value="true" onclick='profanity_filter_handleClick(this);' checked>Profanity filter on/off<br><br> -->
<input id="profanity_filter_checkbox" type="checkbox" name="profanity_filter_on" value="true" onclick="profanity_filter_handleClick(this);">Profanity filter on/off<br><br>
<div><span class="mediumFont" style="white-space: pre;"> /w name message = whisper by name</span></div>
<div><span class="mediumFont" style="white-space: pre;"> /w number message = whisper by number</span></div>
<div><span class="mediumFont" style="white-space: pre;"> /i name = ignore/unignore by name</span></div>
<div><span class="mediumFont" style="white-space: pre;"> /i number = ignore/unignore by number</span></div>
<div><span class="mediumFont" style="white-space: pre;"> /ilist = list of users ignored</span></div>
<div><span class="mediumFont" style="white-space: pre;"> /n name = change name in role wheel phase</span></div><br><br>

<!-- <div><span class="mediumFont" style="white-space: pre;font-weight: bold;"><u>PATCH NOTES 1.5</u></span></div>
<div><span class="" style="white-space: pre;"> 1. Profanity filter is off by default now</span></div>
<div><span class="" style="white-space: pre;"> 2. Bug fixed where you could see people's roles</span></div>
<div><span class="" style="white-space: pre;"> 3. Fixed a bug with relation to background color change</span></div>
<div><span class="" style="white-space: pre;"> 4. Now can select the accent for TTS</span></div> -->

</div>
<!-- div style="height: 100%">wefwefwefwef</div> -->
<!-- <div style="bottom: 35;left: 35;position:fixed">This site is protected by reCAPTCHA and the Google -->

<!-- <div style="bottom: 0;position:fixed">This site is protected by reCAPTCHA and the Google
<a href="https://policies.google.com/privacy">Privacy Policy</a> and
<a href="https://policies.google.com/terms">Terms of Service</a> apply.
</div> -->

</div>

<div id="chat_div"></div>


<script>



function buildSelect(select_element, options, default_selected_item) {
// assume options = { value1 : 'Name 1', value2 : 'Name 2', ... }
// default = 'value1'

// var $select = $('<select></select>');
var $select = $(select_element);
var $option;

for (var val in options) {
$option = $('<option value="' + val + '">' + options[val] + '</option>');
if (val == default_selected_item) {
$option.attr('selected', 'selected');
}
$select.append($option);
}

return $select;
}

var ttsAccent = "UK English Male";
var has_ttsAccent = false;

tts.OnVoiceReady = function() {
$( document ).ready(function() {
var available_voices = tts.getVoices();
var available_system_voices = [];
for(var b = 0; b < available_voices.length; b++) {
if(tts.doesSystemHaveVoice(available_voices[b].name)) {
available_system_voices.push(available_voices[b]);
}
}
var tts_accents_select_options = {}
if((available_system_voices != null) && (available_system_voices.length > 0)) {
for(var i = 0; i < available_system_voices.length; i++) {
if(available_system_voices[i].name == ttsAccent) {
has_ttsAccent = true;
// break;
}

tts_accents_select_options[available_system_voices[i].name] = available_system_voices[i].name;
// console.log(tts.doesSystemHaveVoice(available_voices[i].name));
}
if(!has_ttsAccent) {
//set to first one
ttsAccent = available_system_voices[0].name;
}
}

if(available_system_voices.length == 0) {
buildSelect($('#tts_accents'), {"No TTS Available, use another browser": "No TTS Available, use another browser"}, "No TTS Available, use another browser");
} else {
buildSelect($('#tts_accents'), tts_accents_select_options, ttsAccent);
$('#tts_test_button').show();
}

$('#tts_accents')
.change(function () {
// var str = "";
$( "#tts_accents option:selected" ).each(function() {
// str += $( this ).text() + " ";
setCookie_custom('tts_accent', $(this).text(), 10000);
ttsAccent = $(this).text();
});
});

if(readCookie_custom("tts_accent") != null) {
var read_cookie_tts_accent = readCookie_custom("tts_accent");
//https://stackoverflow.com/questions/78932/how-do-i-programmatically-set-the-value-of-a-select-box-element-using-javascript
if($("#tts_accents option[value='" + read_cookie_tts_accent + "']").length > 0) {
//set selected value to read_cookie_tts_accent
$('#tts_accents').val(read_cookie_tts_accent);
ttsAccent = readCookie_custom("tts_accent");
} else {
deleteCookie_custom(read_cookie_tts_accent);
}
}
});
};





var checkExist = setInterval(function() {
if ($(".ui-widget-header.ui-corner-top.ui-chatbox-titlebar.ui-dialog-header").length) {

// alert($( ".ui-widget-header.ui-corner-top.ui-chatbox-titlebar.ui-dialog-header" ).length);
$( ".ui-widget-header.ui-corner-top.ui-chatbox-titlebar.ui-dialog-header" ).click(function() {
// alert('hi');
if ($('.ui-widget-content.ui-chatbox-content').css('display') != 'none') {
$(this).stop(true, true);
}
});
console.log("Exists!");
clearInterval(checkExist);
}
}, 100); // check every 100ms

// });

// $("#changeName").submit(function(e) {
// //alis2=2424525&bobby=242424
// var url = "/changeName"; // the script where you handle the form input.
// var data1 = $("#changeName").serialize() + '&login_session=' + "{{cookie}}"
// // alert(data1);
// $.ajax({
// type: "POST",
// url: url,
// data: data1, // serializes the form's elements.
// dataType: "json",
// success: function(data)
// {
// // var obj = jQuery.parseJSON(data);
// // alert(JSON.stringify(data));
// // setTimeout(function () {
// // window.location.href = "/"; //will redirect to your blog page (an ex: blog.html)
// // }, 2000); //will call the function after 2 secs.
// }
// });

// e.preventDefault(); // avoid to execute the actual submit of the form.
// });



// var ttsAccent = "UK English Male";
// tts.setDefaultVoice("US English Female");
// tts.setDefaultVoice("UK English Male");

function send_chatbox_message(id, message, post_id_via_text, post_message_via_text) {
if(window.chatboxInitialized != null) {
$("#chat_div").chatbox("option", "boxManager").addMsg(id, message, post_id_via_text, post_message_via_text);
}
}

function isPlaying(audelem) {
return !audelem.paused;
}

function getRootUrl() {
var defaultPorts = {"http:":80,"https:":443};

return window.location.protocol + "//" + window.location.hostname
+ (((window.location.port)
&& (window.location.port != defaultPorts[window.location.protocol]))
? (":"+window.location.port) : "");
}


function retry(e,t){var n=0,i=!1,r=window.setInterval(function(){e()&&(window.clearInterval(r),t(i)),50<n++&&(window.clearInterval(r),t(i=!0))},10)}function isIE10OrLater(e){var t=e.toLowerCase();if(0===t.indexOf("msie")&&0===t.indexOf("trident"))return!1;var n=/(?:msie|rv:)\s?([\d\.]+)/.exec(t);if(n&&10<=parseInt(n[1],10))return!0;var i=/edge/.exec(t);return!(!i||"edge"!=i[0])}function detectPrivateMode(e){var t;if(window.webkitRequestFileSystem)window.webkitRequestFileSystem(window.TEMPORARY,1,function(){t=!1},function(e){console.log(e),t=!0});else if(window.indexedDB&&/Firefox/.test(window.navigator.userAgent)){var n;try{n=window.indexedDB.open("test")}catch(e){t=!0}void 0===t&&retry(function(){return"done"===n.readyState},function(e){e||(t=!n.result)})}else if(isIE10OrLater(window.navigator.userAgent)){t=!1;try{window.indexedDB||(t=!0)}catch(e){t=!0}}else if(window.localStorage&&/Safari/.test(window.navigator.userAgent)){if(window.safariIncognito)t=!0;else{try{window.openDatabase(null,null,null,null)}catch(e){t=!0}try{window.localStorage.setItem("test",1)}catch(e){t=!0}}void 0===t&&(t=!1,window.localStorage.removeItem("test"))}retry(function(){return void 0!==t},function(){e(t)})}

var current_domain = getRootUrl();

var global_login_session = "";
var socket;
var already_in_lobby = false;
var ignored_set = new Set();

// var recaptcha_site_key = 'hjio3jh-wrghaio4-wji2o4j2g-w4hb2o4';

//read ignored set from cookie
ignored_list_string = readCookie_custom('ignored_list');
if(ignored_list_string != null) {
ignored_list = ignored_list_string.split(",");
for(var j = 0; j < ignored_list.length; j++) {
// console.log(ignored_list[j]);
ignored_set.add(ignored_list[j]);
}
}

var captcha_solved = false;

var serialize = function(obj) {
var str = [];
for (var p in obj)
if (obj.hasOwnProperty(p)) {
str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
}
return str.join("&");
}

function postCaptchaTextAndGetCaptchaViaAjax() {
send_chatbox_message("", '<span id="recaptcha_box" style="color:red">CAPTCHA LOADING...</span>', true, false);
send_chatbox_message("", '<span id= "solve_captcha_above_text"> Solve the Captcha above to enter the lobby</span>', true, false);

$.ajax({
url: "https://web.archive.org/web/20200331165533/https://captcha.townofidiots.io/pc-geetest/register?t=" + (new Date()).getTime(),
type: "get",
dataType: "json",
success: function (data) {
initGeetest({
gt: data.gt,
challenge: data.challenge,
product: "embed",
lang: "en",
offline: !data.success,
new_captcha: data.new_captcha
}, function (captchaObj) {
captchaObj.appendTo("#recaptcha_box");

$("#recaptcha_box").text("");

captchaObj.onSuccess(function() {
var result = captchaObj.getValidate();
captchaSuccess(result);
});
});
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
$('#recaptcha_box').text("Unable to obtain Captcha");
$('#solve_captcha_above_text').parent().parent().remove();

send_chatbox_message('', 'Please reload the page.', true, true);
if(tts_on) {
tts.speak("Please reload the page", ttsAccent, {volume: tts_volume});
}
}
});
}

var debug_mode = false;

var captchaSuccess = function(result) {
captcha_solved = true;

if(socket != null && socket.connected) {
//dc previous socket
// socket.disconnect();
return;
}

//hide recaptch box
// $('#recaptcha_box').hide();
$('#recaptcha_box').parent().parent().remove();
$('#solve_captcha_above_text').parent().parent().remove();

send_chatbox_message("", "<span id='connecting_to_server_text' style='color:red'>Connecting to Server...</span>", true, false);

if(debug_mode) {
socket = io.connect({transports: ['websocket', 'polling'], 'connect timeout': 5000, query: "has_captcha=true", reconnection: false});
} else {
socket = io.connect({transports: ['websocket', 'polling'], 'connect timeout': 5000, query: serialize({has_captcha: "true",
geetest_challenge: result.geetest_challenge,
geetest_validate: result.geetest_validate,
geetest_seccode: result.geetest_seccode}), reconnection: false});
}

var wheel_phase = false;


// //https://stackoverflow.com/questions/8588689/node-js-socket-io-client-connect-failed-connect-error-event
// socket.on('connect_failed', function() {
// //reload page
// window.location = '';
// })
socket.on('disconnect', function() {

if(wheel_phase) {
return;
}

// //reload page
$("#current_num_users").text('?');
// send_chatbox_message('', 'Server Disconnected', true, true);
if(already_in_lobby) {
return;
}

$("#connecting_to_server_text").parent().parent().remove();


// window.location = current_domain;
// send_chatbox_message('', 'Connection Disconnected. Please reload the page.', true, true);





// send_chatbox_message('', 'Connection Disconnected.', true, true);
// send_chatbox_message('', 'Reconnecting...', true, true);
// // socket.disconnect();
// grecaptcha_fun();

// send_chatbox_message('', 'Connection Disconnected. Please reload the page.', true, true);
send_chatbox_message('', 'Connection Disconnected', true, true);

// tts.speak("Please reload the page", ttsAccent);
if(tts_on) {
tts.speak("Connection Disconnected", ttsAccent, {volume: tts_volume});
}

if(debug_mode == false) {
postCaptchaTextAndGetCaptchaViaAjax();
}

})

// socket.on('restart:', function() {
// // //reload page
// // $("#current_num_users").text('?');
// // send_chatbox_message('', 'Server Disconnected', true, true);
// if(already_in_lobby) {
// return;
// }

// // window.location = current_domain;
// send_chatbox_message('', 'Connection Disconnected. Please reload the page.', true, true);
// socket.disconnect();
// })

socket.on('error', function() {
//if handshake failed, disconnect won't be called because connection never established, but this will be called
//reload page

$("#connecting_to_server_text").parent().parent().remove();

// send_chatbox_message('', 'Connection Error. Please reload the page. If you keep getting issues, Server may be undergoing maintenance, so check back later.', true, true);
send_chatbox_message('', 'Connection Error', true, true);

// tts.speak("Please reload the page", ttsAccent);
if(tts_on) {
tts.speak("Connection Error", ttsAccent, {volume: tts_volume});
}

socket.disconnect();

if(debug_mode == false) {
postCaptchaTextAndGetCaptchaViaAjax();
}

})

// //they changed the event name. use
// //https://stackoverflow.com/a/36198338/10243401
// //https://github.com/socketio/socket.io-client/blob/master/lib/socket.js#L27
socket.on('connect_error', function() {

//reload page
// window.location = '';
// $("#current_num_users").text('?');
// send_chatbox_message('', 'lolzboi', true, true);

// grecaptcha_fun();

$("#connecting_to_server_text").parent().parent().remove();

send_chatbox_message('', 'Connect Error', true, true);
send_chatbox_message('', 'Please reload the page.', true, true);
if(tts_on) {
tts.speak("Please reload the page", ttsAccent, {volume: tts_volume});
}

socket.disconnect();

})
// socket.on('reconnect_error', function() {
// //reload page
// window.location = '';
// })
// socket.on('connect_timeout', function() {
// //reload page
// window.location = '';
// })

//https://github.com/socketio/socket.io/issues/1677
//https://github.com/socketio/socket.io-client/blob/master/docs/API.md#with-query-option
// socket.on('reconnect_attempt', () => {
// socket.io.opts.query = {
// token: 'fgh' FIGURE THIS OUT??????
// }
// });

socket.on('connect', function() {
current_cookie = readCookie_custom('login_session');
if(current_cookie == null) {
// socket.emit('on_connect', {login_session: "{{cookie}}"});
// socket.emit('check_redirect', {login_session: "{{cookie}}"});
socket.emit('join_lobby', {});
} else {
socket.emit('join_lobby', {login_session: current_cookie});
}

});


//moved 'connect' DOWN!
// socket.on('connect', function() {
// socket.emit('on_connect', {login_session: "{{cookie}}"});
// // socket.emit('join', {data: "I wanna join!"});

// // socket.emit('get_current_lobby_num_users', {login_session: '{{cookie}}', lobby_id: '{{lobby_id}}'});
// })


// socket.on('game_start', function(data) {
// alert('2 ppl joined game starts now!');
// });

// var string_game_id = 'chatroom: ' + {{game_id}};
// window.has_disconnected = false;

window.onbeforeunload = function () {

// socket.emit('disconnect_from_lobby', {login_session: "{{cookie}}"});
socket.disconnect();

// while (!window.has_disconnected) {
// //make ajax call in here to check back end if person already disconnected.
// }

return undefined;
}

socket.on('server_message', function(data) {
send_chatbox_message(data.id, data.message, true, true);
// $("#chat_div").chatbox("option", "boxManager").addMsg(data.id, data.message);
});

socket.on('already_in_lobby', function(data) {
already_in_lobby = true;
socket.disconnect();
document.body.innerHTML = 'Already in lobby';
});

// socket.on('current_num_users: {{lobby_id}}', function(data) {
socket.on('current_num_users', function(data) {
$("#current_num_users").text(data.current_num_users);

// tts.speak("town of idiots is better than town of salem");
// tts.speak("hello world", "UK English Male");
});

socket.on('num_active_games', function(data) {
$("#num_active_games").text(data.num_active_games);
// tts.speak("town of idiots is better than town of salem");
// tts.speak("hello world", "UK English Male");
});

// socket.on('current_num_users_personal: {{cookie}}{{lobby_id}}', function(data) {
// $("#current_num_users").text(data.current_num_users);

// tts.speak("town of idiots is better than town of salem");
// tts.speak("hello world", "UK English Male");
// });
// socket.on('countDown: {{lobby_id}}', function(data) {
// $('#time').text(data.countDown);
// var nameSelectionElement = document.getElementById('nameselection');
// if(!isPlaying(nameSelectionElement)) {
// nameSelectionElement.play();
// }
// });

// socket.on('personal: {{cookie}}{{lobby_id}}', function(data) {
// // console.log(data.countDown);
// // $('#time').text(data.countDown);
// // alert(data.message);
// // alert("hola");
// send_chatbox_message(data.id, data.message, true, true);
// // tts.speak(data.message);
// // $("#chat_div").chatbox("option", "boxManager").addMsg(data.id, data.message);
// });

// socket.on('chatroom: {{lobby_id}}', function(data) {
// // console.log(data.countDown);
// // $('#time').text(data.countDown);
// // alert(data.message);
// // alert("hola");
// send_chatbox_message(data.id, data.message, true, true);
// // tts.speak(data.message);
// // $("#chat_div").chatbox("option", "boxManager").addMsg(data.id, data.message);
// });

socket.on('on_lobby_join', function(data) {
$("#connecting_to_server_text").parent().parent().remove();
});

//USING ROOMS
socket.on('lobby_chat', function(data) {

// console.log(swearjar.censor(data.message, false));

// console.log("no swearing: " + noSwearing.replace_bad_words(data.message, '*'));

// var new_lobby_message_id = data.id;
// var new_lobby_message = data.message;

// // if(profanity_filter_on) {
// // //clean up
// // new_lobby_message_id = noSwearing.replace_bad_words(new_lobby_message_id, '*');
// // new_lobby_message = noSwearing.replace_bad_words(new_lobby_message, '*')
// // }

// console.log(noSwearing.replace_bad_words(data.message, '*'));
if(data.id != null && data.id != "") {
if(ignored_set.has(data.id)) {
//just ignore
return;
} else {
send_chatbox_message(data.id, data.message, true, true);
}
} else {
send_chatbox_message(data.id, data.message, true, true);
}

if('welcome_msg' in data) {
if(tts_on) {
tts.speak(data.message, ttsAccent, {volume: tts_volume});
}
}
// tts.speak("testing testing testing", ttsAccent);
// console.log(tts.doesSystemHaveVoice(ttsAccent));
});
// socket.on('redirect_to_lobby: {{cookie}}{{lobby_id}}', function(data) {
// // alert("TREEEES");
// //when redirecting dont let them

// window.onbeforeunload = function () {
// }

// window.onunload = function() {
// }

// window.location = '';
// // window.location = data.url + '?game_id=' + data.game_id;
// });

// socket.on('redirect_to_lobby_cookie: {{cookie}}', function(data) {
// // alert("TREEEES");
// //when redirecting dont let them

// window.onbeforeunload = function () {
// }

// window.onunload = function() {
// }

// window.location = '';
// // window.location = data.url + '?game_id=' + data.game_id;
// });

window.addEventListener('message', function(e) {
if (e.data.cookie == global_login_session) {
document.open();
document.write('<html lang="en"><head><title>Town of Idiots - FREE Mafia Social Deduction Game</title></head><body><iframe id="game_iframe" style="position: fixed;top: 0px;bottom: 0px;right: 0px;width: 100%;border: none;margin: 0;padding: 0;overflow: hidden;z-index: 0;height: 100%;"></iframe></body>');
document.close();

var myIFrame = document.getElementById('game_iframe');
//https://stackoverflow.com/a/998241
var ifrm = myIFrame.contentWindow || myIFrame.contentDocument.document || myIFrame.contentDocument;
ifrm.document.open();
ifrm.document.write(e.data.html);
ifrm.document.close();
}
}, false);


// var global_login_session;
socket.on('get_login_session', function(data) {
// $("#current_num_users").text('gay');
if(data.login_session != global_login_session) {
//server reset, so reset ignored set
ignored_set = new Set();
deleteCookie_custom("ignored_list");
}

global_login_session = data.login_session;

//set cookie
// document.cookie = "login_session=" + data.login_session "; expires=Thu, 18 Dec 2013 12:00:00 UTC; path=/";
//10000 days expiration
setCookie_custom('login_session', data.login_session, 10000);
});

//called every 24 hours when names reset
socket.on('reset_ignore_list', function(data) {
//server reset, so reset ignored set
ignored_set = new Set();
deleteCookie_custom("ignored_list");
});

var elapsed_time_text_interval = null;

socket.on('game_started', function(data) {
if(tts_on) {
tts.speak("Game has started", ttsAccent, {volume: tts_volume});
} else if(music_on) {
var beepElement = document.getElementById('beep');
beepElement.play();
}

send_chatbox_message("", "Game initializing...", true, true);
send_chatbox_message("", '<span id="elapsed_time_text">Elapsed Time: <span style="color:red"><span id="elapsed_time">0</span>s</span></span>', true, false);

var elapsed_time = 0;

elapsed_time_text_interval = setInterval(function(){
elapsed_time++;
$('#elapsed_time').text(elapsed_time);
}, 1000);

});

var wheel_html_string = "";

socket.on('wheel', function(data) {
wheel_html_string = data.wheel;
});

socket.on('wheel_enter', function(data) {

if(wheel_html_string == "") {
socket.disconnect();
window.location = current_domain;
return;
}

wheel_phase = true;

socket.disconnect();

// if(tts_on) {
// tts.speak("Game has started, Waiting for everyone to connect...", ttsAccent, {volume: tts_volume});
// }

// window.addEventListener('message', function(e) {
// if (e.data.cookie == global_login_session) {
// document.open();
// document.write(e.data.html);
// document.close();

// var myIFrame = document.getElementById('game_iframe');
// //https://stackoverflow.com/a/998241
// var ifrm = myIFrame.contentWindow || myIFrame.contentDocument.document || myIFrame.contentDocument;
// ifrm.document.open();
// ifrm.document.write(e.data.iframe_html);
// ifrm.document.close();
// }
// }, false);
document.open();
// document.write(game_html_string);
document.write('<html lang="en"><head><title>Town of Idiots - FREE Mafia Social Deduction Game</title></head><body><script>window.addEventListener(\'message\', function(e) {if (e.data.cookie == "' + global_login_session + '") {document.open();document.write(\'<html lang="en"><head><title>Town of Idiots - FREE Mafia Social Deduction Game</title></head><body><iframe id="game_iframe" style="position: fixed;top: 0px;bottom: 0px;right: 0px;width: 100%;border: none;margin: 0;padding: 0;overflow: hidden;z-index: 0;height: 100%;"></iframe></body>\');document.close();var myIFrame = document.getElementById(\'game_iframe\');var ifrm = myIFrame.contentWindow || myIFrame.contentDocument.document || myIFrame.contentDocument;ifrm.document.open();ifrm.document.write(e.data.iframe_html);ifrm.document.close();}}, false);<\/script><iframe id="game_iframe" style="position: fixed;top: 0px;bottom: 0px;right: 0px;width: 100%;border: none;margin: 0;padding: 0;overflow: hidden;z-index: 0;height: 100%;"></iframe></body>');
document.close();

var myIFrame = document.getElementById('game_iframe');
//https://stackoverflow.com/a/998241
var ifrm = myIFrame.contentWindow || myIFrame.contentDocument.document || myIFrame.contentDocument;
ifrm.document.open();
ifrm.document.write(wheel_html_string);
ifrm.document.close();
// });
});

// // socket.on('redirect: {{cookie}}{{lobby_id}}', function(data) {
// socket.on('redirect_to_game', function(data) {

// tts.speak("Game has started", ttsAccent);

// // socket.on('redirect_to_game', function(data) {
// // alert("TREEEES");
// //when redirecting dont let them

// // if('is_checking' in data) {
// // socket.emit('connected', {login_session: "{{cookie}}", lobby_id: '{{lobby_id}}'});
// // } else {
// window.onbeforeunload = function () {
// }

// window.onunload = function() {
// }

// // $("#bg").css('z-index', 5);
// // $("#bg").animate({ opacity: 1 }, 4000).promise().done(function() {
// // window.location = data.url + '?game_id=' + data.game_id + '&login_session=' + global_login_session;
// // });
// // window.location = data.url + '?game_id=' + data.game_id + '&login_session=' + global_login_session;
// // if(data.debug_mode) {
// if(debug_mode) {
// window.location = data.url + '?login_session=' + global_login_session;
// } else {
// //login_session sent via cookies
// if(global_login_session == readCookie_custom('login_session')) {
// window.location = data.url;
// } else {
// socket.emit('disconnect_from_game', {login_session: global_login_session});

// document.body.innerHTML = 'You have left this game, rejoined lobby';
// }
// }

// // window.location = data.url + '?game_id=' + data.game_id + '&login_session=' + global_login_session;

// // }

// // window.location = data.url + '?game_id=' + data.game_id;
// });



};
// }

if(debug_mode) {
// verifyCallback("debug_mode");
captchaSuccess("debug_mode");
}

// var onloadCallback = function() {
// var recaptcha_box_set_up_interval = setInterval(recaptcha_box_set_up, 100);
// function recaptcha_box_set_up() {
// if($('#recaptcha_box').length > 0) {
// // grecaptcha.render('recaptcha_box', {
// hcaptcha.render('recaptcha_box', {
// 'sitekey' : recaptcha_site_key,
// 'callback' : verifyCallback
// });
// clearInterval(recaptcha_box_set_up_interval);
// }
// }
// }


// detectPrivateMode(
// function(isPrivateMode) {
// if(isPrivateMode) {
// document.body.innerHTML = 'Private Mode Detected';
// } else {



// var currentGameState = 'chatroom';

//bind this to a button
// var socket = io.connect('');
// var socket = io.connect({transports: ['websocket'], 'connect timeout': 5000});
//https://github.com/socketio/socket.io-client/issues/883

// var grecaptcha_fun = function(){

// grecaptcha.ready(function() {
// grecaptcha.execute(recaptcha_site_key, {action: 'lobby'}).then(function(token_1) {

// console.log(token)

// var socket = io.connect({transports: ['websocket', 'polling'], 'connect timeout': 5000});
// var socket = io.connect({transports: ['polling', 'websocket'], 'connect timeout': 5000, query: "captcha_token=" + token });


// });
// });


// join_game = function() {
// socket.emit('join', {data: "I wanna join!"});
// }


// socket.emit('connected', {login_session: "{{cookie}}"});

// }

// grecaptcha_fun();


/*
document ready.
*/
$(document).ready(function()
{

$("#lobby_title").click(function(){
//reload
window.location = '';
});

// var window_width = 800;
// if($(window).width() < 808) {
// window_width = $(window).width() - 8;
// }

function create_chatbox(width, height) {
$("#chat_div").chatbox(
{
/*
unique id for chat box
*/
id: "chat_div",
/*
Title for the chat box
*/
title : "Chatbox",
/*
messageSend as name suggest,
this will called when message sent.
and for demo we have appended sent message to our log div.
*/
// offset: 400,
// width: 800,
width: width, // width of the chatbox
height: height,
// width: min_width,

messageSent : function(id, user, msg)
{

var ignore_regex = /^\/i (.+)/;
var match_1 = ignore_regex.exec(msg);

//you know person was trying to change name
if(match_1 != null) {
if(ignored_set.has(match_1[1])) {
//unignore
ignored_set.delete(match_1[1]);
send_chatbox_message("", match_1[1] + " has been unignored", true, true);
} else {
ignored_set.add(match_1[1]);
send_chatbox_message("", match_1[1] + " has been ignored", true, true);
}

var strArray = [];

// for(str of ignored_set){
var it = ignored_set.values();
for(var i=0; i<ignored_set.size; i++) {
strArray.push(it.next().value);
}

setCookie_custom('ignored_list', strArray.join(","), 10000);
return;
} else {
ignore_regex = /^\/ignore (.+)/;
var match_2 = ignore_regex.exec(msg);

//you know person was trying to change name
if(match_2 != null) {
if(ignored_set.has(match_2[1])) {
//unignore
ignored_set.delete(match_2[1]);
send_chatbox_message("", match_2[1] + " has been unignored", true, true);
} else {
ignored_set.add(match_2[1]);
send_chatbox_message("", match_2[1] + " has been ignored", true, true);
}

var strArray = [];

// for(str of ignored_set){
// strArray.push(str);
// }
var it = ignored_set.values();
for(var i=0; i<ignored_set.size; i++) {
strArray.push(it.next().value);
}
setCookie_custom('ignored_list', strArray.join(","), 10000);
return;
} else {
var ignore_list_regex = /^\/ilist/;
var match_3 = ignore_list_regex.exec(msg);
if(match_3 != null) {
var strArray = [];

// for(str of ignored_set){
// strArray.push(str);
// }
var it = ignored_set.values();
for(var i=0; i<ignored_set.size; i++) {
strArray.push(it.next().value);
}

send_chatbox_message("", "Ignore list: " + strArray.join(", "), true, true);
return;
} else {
ignore_list_regex = /^\/ignorelist/;
var match_4 = ignore_list_regex.exec(msg);
if(match_4 != null) {
var strArray = [];

// for(str of ignored_set){
// strArray.push(str);
// }
var it = ignored_set.values();
for(var i=0; i<ignored_set.size; i++) {
strArray.push(it.next().value);
}

send_chatbox_message("", "Ignore list: " + strArray.join(", "), true, true);
return;
} else {
var whisper_regex = /^\/w\s+\S+\s+\S+/;
var match_5 = whisper_regex.exec(msg);
if(match_5 != null) {

send_chatbox_message("", "Hey idiot! You can only whisper in game! You can ignore here though. Try that?", true, true);
return;
} else {
whisper_regex = /^\/whisper\s+\S+\s+\S+/;
var match_6 = whisper_regex.exec(msg);
if(match_6 != null) {

send_chatbox_message("", "Hey idiot! You can only whisper in game! You can ignore here though. Try that?", true, true);
return;
} else {
var name_change_regex = /^\/n (.+)/;
var match_7 = name_change_regex.exec(msg);
if(match_7 != null) {

send_chatbox_message("", "Hey idiot! You can only change name in role wheel phase!", true, true);
return;
} else {
name_change_regex = /^\/name (.+)/;
var match_8 = name_change_regex.exec(msg);
if(match_8 != null) {

send_chatbox_message("", "Hey idiot! You can only change name in role wheel phase!", true, true);
return;
}
}
}
}
}
}
}
}

// // grecaptcha.ready(function() {
// grecaptcha.execute('6Lco_sgUAAAAAGIIxv2CFj7KblqRRq9RcTQeVeZi', {action: 'lobby_message'}).then(function(token_2) {
// // $("#log").append(id + " said: " + msg + "<br/>");
// // var data1 = "message=" + encodeURIComponent(msg) + '&login_session=' + "{{cookie}}";
// var data1 = "message=" + encodeURIComponent(msg) + '&login_session=' + global_login_session + '&captcha_token=' + token_2;
// // $.ajax({
// // type: "POST",
// // url: "/lobbyMessages",
// // data: data1,
// // // contentType: "application/x-www-form-urlencoded",
// // dataType: "json",
// // // success: function(data)
// // // {
// // // }
// // });
// socket.emit('lobbyMessages', data1);
// });
// // });

if(captcha_solved) {
var data1 = "message=" + encodeURIComponent(msg) + '&login_session=' + global_login_session;
socket.emit('lobbyMessages', data1);
} else {
send_chatbox_message("", "Solve the Captcha above first to enter the lobby Idiot!", true, true);
}


}
});
}

// box = $("#chat_div").chatbox(

// $("#chat_div").chatbox(
// {
// /*
// unique id for chat box
// */
// id: "chat_div",
// /*
// Title for the chat box
// */
// title : "Chatbox",
// /*
// messageSend as name suggest,
// this will called when message sent.
// and for demo we have appended sent message to our log div.
// */
// // offset: 400,

// width: 800, // width of the chatbox
// // width: min_width,

// messageSent : function(id, user, msg)
// {
// // $("#log").append(id + " said: " + msg + "<br/>");
// // var data1 = "message=" + encodeURIComponent(msg) + '&login_session=' + "{{cookie}}";
// var data1 = "message=" + encodeURIComponent(msg) + '&login_session=' + global_login_session;
// // $.ajax({
// // type: "POST",
// // url: "/lobbyMessages",
// // data: data1,
// // // contentType: "application/x-www-form-urlencoded",
// // dataType: "json",
// // // success: function(data)
// // // {
// // // }
// // });
// socket.emit('lobbyMessages', data1);
// }
// });

// create_chatbox(800);


// }
// });
var fontSize = parseInt($("#lobby_title").height() - 10)+"px";
$("#lobby_title").css('font-size', fontSize);
$('#lobby_title').bind('resize', function() {
var fontSize = parseInt($("#lobby_title").height())+"px";
$('#lobby_title').css('font-size', fontSize);
});

var max_chatbox_width = 800;
var max_chatbox_height = 240;

if($(window).width() < max_chatbox_width) {
// console.log("width: " + $(window).width());
// console.log("height: " + window.innerHeight);
// $('.ui-chatbox').width($(window).width());
if(window.innerHeight < max_chatbox_height + 80) {
create_chatbox($(window).width() - 10, window.innerHeight - 100);
} else {
create_chatbox($(window).width() - 10, max_chatbox_height);
}
} else {
// create_chatbox(max_chatbox_width);
if(window.innerHeight < max_chatbox_height + 80) {
create_chatbox(max_chatbox_width, window.innerHeight - 100);
} else {
create_chatbox(max_chatbox_width, max_chatbox_height);
}
}

$(window).on('resize', function() {
// var win = $(this); //this = window
// // if (win.height() >= 820) { /* ... */ }
// if (win.width() < max_chatbox_width) {
// // $('.ui-chatbox').width(win.width());
// create_chatbox(win.width() - 10);

// // $('.ui-chatbox-titlebar').width(win.width());
// // $('.ui-chatbox-log').width(win.width());
// // $('.ui-chatbox-input').width(win.width() - 8);
// // $('.ui-chatbox-input-box').css("width", win.width() - 18);
// } else {
// if((win.width() - max_chatbox_width) < 10) {
// create_chatbox(max_chatbox_width - 10);
// } else {
// create_chatbox(max_chatbox_width);
// }
// }

if($(window).width() < max_chatbox_width) {
// console.log("width: " + $(window).width());
// console.log("height: " + window.innerHeight);
// $('.ui-chatbox').width($(window).width());
if(window.innerHeight < max_chatbox_height + 80) {
create_chatbox($(window).width() - 10, window.innerHeight - 100);
} else {
create_chatbox($(window).width() - 10, max_chatbox_height);
}
} else {
// create_chatbox(max_chatbox_width);
if(window.innerHeight < max_chatbox_height + 80) {
create_chatbox(max_chatbox_width, window.innerHeight - 100);
} else {
create_chatbox(max_chatbox_width, max_chatbox_height);
}
}
});


// send_chatbox_message("", "Connecting to Server...", true, true);
// send_chatbox_message("", '<span id="recaptcha_box" style="color:red">CAPTCHA LOADING...</span>', true, false);
// send_chatbox_message("", '<span id= "solve_captcha_above_text"> Solve the Captcha above to enter the lobby</span>', true, false);


if(debug_mode == false) {
postCaptchaTextAndGetCaptchaViaAjax();
}

});

// alert($( ".ui-widget-header.ui-corner-top.ui-chatbox-titlebar.ui-dialog-header" ).length);
// $( ".ui-widget-header.ui-corner-top.ui-chatbox-titlebar.ui-dialog-header" ).click(function() {
// alert("hi");
// if ($('.ui-widget-content.ui-chatbox-content').css('display') != 'none') {
// $(this).stop(true, true);
// }
// });




// }

// // grecaptcha_fun();

// }
// );

</script>

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://web.archive.org/web/20200331165533js_/https://www.googletagmanager.com/gtag/js?id=UA-154927506-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());

gtag('config', 'UA-154927506-1');
</script>


</body>
</html>
<!--
FILE ARCHIVED ON 16:55:33 Mar 31, 2020 AND RETRIEVED FROM THE
INTERNET ARCHIVE ON 18:18:18 Jul 19, 2020.
JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.

ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
SECTION 108(a)(3)).
-->
<!--
playback timings (ms):
exclusion.robots: 0.332
PetaboxLoader3.datanode: 476.683 (4)
esindex: 0.014
LoadShardBlock: 264.612 (3)
RedisCDXSource: 11.309
CDXLines.iter: 13.955 (3)
exclusion.robots.policy: 0.317
load_resource: 1590.478
captures_list: 293.487
PetaboxLoader3.resolve: 1356.104 (2)
-->