-
Notifications
You must be signed in to change notification settings - Fork 0
/
cm-360.html
152 lines (134 loc) · 6.54 KB
/
cm-360.html
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
142
143
144
145
146
147
148
149
150
151
152
<!DOCTYPE html>
<html>
<head>
<title>Overwatch cm/360</title>
<link rel="shortcut icon" type="image/x-icon" href="images/favicon.ico">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css" />
<!-- Bootstrap 4 CDN -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm"
crossorigin="anonymous">
<video autoplay muted loop id="backgroundHanamuraVideo">
<source src="images/hanamura_animation.mp4" type="video/mp4">
</video>
</head>
<body class="calculators">
<div id="header" class="header">
<div class="container">
<div class="logo">
<h1>
<img src="images/ow-calc-logo-with-tagline.png" WIDTH=350 HEIGHT=auto>
</h1>
</div>
<div class="nav">
<div class="button-box col-lg-12">
<ul>
<li>
<a href="equalizer.html" class="btn btn-primary btn-lg outline">sens equalizer</a>
</li>
<li>
<a href="index.html" class="btn btn-primary btn-lg outline">Home</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- end header -->
<div class="container">
</div>
<div class="container">
<div class="row">
<div class="col-md-6 offset-md-3">
<!-- offset-md-3 centers app-->
<h1 class="display-4 text-center mb-3">cm/360° converter</h1>
<br>
<br>
<form>
<div class="form-group">
<input id="mDPI_id" type="number" class="form-control form-control-lg" name="TextBox1" placeholder="Enter your mouse DPI ...">
</div>
<div class="form-group">
<input id="ingameSens_id" type="number" class="form-control form-control-lg" name="TextBox2" placeholder="Enter your in-game sensitivity ...">
</div>
</form>
<br>
<div class="display-4 text-center mb-3">
<!-- centers the output button -->
<input type="button" name="clickbtn" class="btn btn-primary btn-lg outline" value="Compute cm/360°" onclick="cmResult()">
</div>
<br>
<br>
<div id="output_id">
<div class="input-group">
<input id="cm360Result_id" type="number" class="form-control form-control-lg" name="TextBox3" value="cm/360°">
<!--<span class="input-group-addon">cm/360°</span> -->
<!-- add CSS -->
</div>
</div>
<br>
</div>
</div>
</div>
<div class="container">
<!-- start accordion -->
<div class="col-md-6 offset-md-3">
<button class="accordion">Uses for this Application</button>
<div class="accordion-content">
<p>
Like many FPS games, Overwatch uses its own native sensitivity settings along with a users mouse DPI to allow a character
to produce movement.
</p>
<p>
Sensitivity varies heavily based on the game, so it is necessary to standardize an input method to achieve some form of normality.
This can be accomplished by understanding how many centimeters of mouse movement it takes to move your
character in one 360 degree rotation.
</p>
</div>
<button class="accordion">Where to find your mouse DPI and in-game sens</button>
<div class="accordion-content">
<p>
Your mouse DPI can be found in whichever software configured your mouse, and the in-game sensitivity can be found on the
"Options" screen within Overwatch. After you click on the blue "Compute cm/360°" button, the application
will calculate the cm/360° needed to complete a full character rotation.
</p>
</div>
<button class="accordion">Understanding your cm/360° Result</button>
<div class="accordion-content">
<p>
A valid way to interpret your own cm/360° result from this program is to compare it to the settings from professional Overwatch
players. A spreadsheet is available
<a href="http://on-winning.com/overwatch-pro-sensitivity-settings-setups-monitor-mouse-keyboard-headset/">here</a>. As the cm/360° is universal, the output can be understood despite varying hardware/software
setups, and is a valid way to interpret sensitivity settings with other players.
</p>
<p>
Personally, I play on 1000 DPI with 6.5 in-game sens, which equates to 21.31 cm/360°. This means that I have to move my mouse
21.31 cm for my in-game character to achieve one full 360 degree rotation. These settings are very similar
to
<a href="http://liquipedia.net/overwatch/Saebyeolbe">Saebyolbe's</a> (professional player for team
<a href="http://liquipedia.net/overwatch/New_York_Excelsior">New York Excelsior</a>), even though he plays at 810 DPI and 7.93 in-game sens! For reference, this is
a very high sensitivity, most players are around the mid 30's range.
</p>
</div>
</div>
<!-- end Accordions-->
</div>
<br>
<br>
<br>
<footer>
<div class="social-media-icons">
<a href='https://github.com/adhaase/' target="_blank">
<i class="fa fa-github" title="GitHub"></i>
</a>
<a href='mailto:adhaase@umich.edu/' target="_blank">
<i class="fa fa-envelope-square" title="email: adhaase@umich.edu"></i>
</a>
<a href='http://adhaase.github.io/' target="_blank">
<i class="fa fa-globe" title="Website"></i>
</a>
</div>
</footer>
<script src="main.js"></script>
</body>
</html>