Slot of Unit

by Sure Sure

HTML

<!DOCTYPE HTML>
<body>
  <div class="layerTransparent">
    <div class="display">
      <br>
      <p1>Road to Bingo!</p1>
      <br><br>
      &nbsp;&nbsp;&nbsp;
      <img id="image"src="">
      <input type="text" id="display" value=" ">
      <br><br><br>
      <button type="button" id="start">START</button>
      <br><br><br><br><br><br><br><br>
      <br><br><br><br><br><br><br><br>
      <p2>Results</p2>
      <br>
      <textarea name="result" id="result"></textarea>
      <br><br><br>
      <button type="button" id="reset">RESET</button>
      <br><br><br>
      <p3>2016@sure_rtd all rights reserved</p3>
      <br><br><br><br><br>
    </div>
  </div>
</body>

CSS

body{
	background-image : url(https://4.bp.blogspot.com/-t_923UbmKwc/VvPgubfSgSI/AAAAAAAAKVk/2jwBbj9brMIfLisDwTh9PeUznfjJQ3TWg/s1600/rtdpcwp_02.jpg);
background-size:contain
}
div{
	font-family:Helvetica,Arial, Roboto, "Droid Sans", "游ゴシック", YuGothic,"ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN", "メイリオ",Meiryo, sans-serif;
}
.layerTransparent{
	background-color:rgba(255,255,255,0.5);
}
.display {
	text-align:center;
}
p1 {
	text-align:center;
	font-size:50px;
	font-weight: bold;
	letter-spacing: -5px;
	color: #090;
	text-shadow:
	3px 3px 1px #EFE,
	-3px 3px 1px #EFE,
	3px -3px 1px #EFE,
	-3px -3px 1px #EFE;
}
img{
    height:100px;
    width:100px; 
}
input {
width:300px;
  background-color:transparent;
	border: 0px;
	font-size:50px;
	vertical-align:top;
	text-align:left;
	font-weight: bold;
	letter-spacing: -5px;
	color: #e22;
	text-shadow:
	3px 3px 1px #FEE,
	-3px 3px 1px #FEE,
	3px -3px 1px #FEE,
	-3px -3px 1px #FEE;
}
p2 {
	text-align:center;
	font-size:20px;
	font-weight: bold;
	letter-spacing: -3px;
	color: #111;
	text-shadow:
	1px 1px 1px #eee,
	-1px 1px 1px #eee,
	1px -1px 1px #eee,
	-1px -1px 1px #eee;
}
textarea {
	border: 0px;
	text-align:left;
	font-size:10px;
	font-weight: bold;
	letter-spacing: -1px;
	color: #111;
	background-color:#fffdfb;
	overflow: scloll;
	-webkit-overflow-scrolling: touch;
    width:100px;
    height:1000px;
}
p3 {
	text-align:center;
	font-size:15px;
	color: #111;
}
button {
    border:0px;
	width:100px;
	height:30px;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	padding:8px 0 10px;
	color:#fff;
	background-color:#ff8c00;
	border-radius:5px;
}

JavaScript

/*****************************************************/
//共通変数設定
/*****************************************************/
var startButton = document.getElementById('start');
var resetButton = document.getElementById('reset');
var displayArea = document.getElementById('display');
var imageArea = document.getElementById('image');
var resultArea = document.getElementById('result');
var slotTime = null;
var result = [];
var slotNumber = 0;
var nMax = 82;
var nMin = 0;
var statusFlg = 'stop';

var units = [
'グレン',
'リヴィオ',
'サヤ',
'エルフィ',
'アレン',
'カイン',
'マリア',
'ルカ',
'フェンリス',
'クトゥール',
'アルトリウス',
'ゼロシキ',
'イザナギ',
'ゼッターマン',
'ASmk-2',
'アヌビス',
'グリムドア',
'リヴァイア',
'まゆ',
'クロノ',
'ヴェルベット',
'イデア',
'ル・フェイ',
'ユーリカ',
'よりしろ',
'さくら',
'かすみ',
'つばき',
'あやめ',
'ぼたん',
'にじょう',
'ななお',
'ひめじ',
'わかまつ',
'まつえ',
'はるな',
'いせ',
'みかさ',
'ながと',
'せっつ',
'あかぎ',
'かが',
'ちとせ',
'りゅうじょう',
'しなの',
'ザイフリート',
'ブリュンヒルデ',
'あまぎ',
'マクスウェル',
'ヤマト',
'ヴァルザーク',
'カルマ',
'イザベラ',
'ディオーネ',
'ナタル',
'シェルクス',
'ノア',
'ヴァルトルス',
'ネフティリア',
'フラウ',
'あまてらす',
'マチルダ',
'アリス',
'シモーヌ',
'ドン・ポルタ',
'ヴァルク',
'ヒルダ',
'りんどう',
'アリア',
'ジョニー',
'ファウスト',
'シェルツ',
'ロキ',
'ヴィーラ',
'ジャクリーン',
'ホムラ',
'ジカイ',
'キヌガサ',
'ヒミコ',
'コトワリ',
'アルテミス',
'デウス',
'ジ・オース'
];

var imgUrl =...