SlotMachinePage/script.js at master · ULUG/SlotMachinePage · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
var NUMBER_CHANGE_SPEED = 5
var SLOW_DOWN_INTERVAL = 1000

var numberGroup1 = ""
var numberGroup2 = ""
var numberGroup3 = ""
var numberGroupTemporary = ""

var maxRandomNumber = 999

var animationInterval = 0
var marginOfNumberFrame = 0
var isSpinning = false

var spinningIntervalTimer

var htmlRightArea
var htmlNumberLayer
var htmlMaxNumberInputBox
var htmlCandyDialog
var htmlNumberFrame


function onloadBody(){
	htmlRightArea = document.getElementById("rightArea")
	htmlNumberLayer = document.getElementById("numberLayer")
	htmlMaxNumberInputBox = document.getElementById("maxNumberInputBox")
	htmlCandyDialog = document.getElementById("candyDialog")

	numberGroupTemporary += "<img src='./imgs/0.png' class='number'>"
	numberGroupTemporary += "<img src='./imgs/0.png' class='number'>"
	numberGroupTemporary += "<img src='./imgs/0.png' class='number'>"

	numberGroup1 = numberGroup2 = numberGroup3 = numberGroupTemporary

	generateNumberFrame()
}


function onclickMouth(){
	htmlCandyDialog.style.display = "block"
}


function onclickCandy(){
	if(htmlMaxNumberInputBox.value){
		maxRandomNumber = parseInt(htmlMaxNumberInputBox.value)
		htmlCandyDialog.style.display="none"
	} else {
		alert("Please Input Number");
	}
}


function onclickHandle(){
	if(isSpinning == false){
		isSpinning = true

		animationInterval = 1
		spinningIntervalTimer = setInterval("spin()", animationInterval)
		setTimeout("slowdown()", SLOW_DOWN_INTERVAL)

		htmlRightArea.style.backgroundImage="url('./imgs/handdown.png')"
	}
}


function spin(){
	marginOfNumberFrame -= NUMBER_CHANGE_SPEED

	if(marginOfNumberFrame < -125 + NUMBER_CHANGE_SPEED){
		marginOfNumberFrame = 0

		generateNumber()

		numberGroup1 = numberGroup2
		numberGroup2 = numberGroup3
		numberGroup3 = numberGroupTemporary

		generateNumberFrame()
	}

	htmlNumberFrame.style.marginTop = marginOfNumberFrame
}


function generateNumber(){
	var tmpNum = Math.floor(Math.random() * maxRandomNumber)
	tmpNum++

	var number1 = Math.floor(tmpNum / 100)
	var number2 = Math.floor((tmpNum - (number1 * 100)) / 10)
	var number3 = tmpNum % 10

	numberGroupTemporary = "<img src='./imgs/" + number1 + ".png' class='number'>"
	numberGroupTemporary += "<img src='./imgs/" + number2 + ".png' class='number'>"
	numberGroupTemporary += "<img src='./imgs/" + number3 + ".png' class='number'>"
}


function generateNumberFrame(){
	var result = ""
	result += "<div id='numberFrame'>"
	result += numberGroup1
	result += numberGroup2
	result += numberGroup3
	result += "</div>"

	htmlNumberLayer.innerHTML = result
	htmlNumberFrame = document.getElementById("numberFrame")
}


function slowdown(){
	if(animationInterval < 750){
		animationInterval *= 2
		clearInterval(spinningIntervalTimer)
		spinningIntervalTimer = setInterval("spin()", animationInterval)
		setTimeout("slowdown()", 750 - animationInterval)
	} else {
		clearInterval(spinningIntervalTimer)

		if(marginOfNumberFrame > -62){
			marginOfNumberFrame = 0
		} else {
			marginOfNumberFrame = -125
		}

		htmlNumberFrame.style.marginTop = marginOfNumberFrame
		htmlRightArea.style.backgroundImage="url('./imgs/handup.png')"
		isSpinning = false
	}
}