-
Notifications
You must be signed in to change notification settings - Fork 1
/
Copy pathbearing_rolling_life.html
158 lines (115 loc) · 5.89 KB
/
bearing_rolling_life.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
153
154
155
156
157
158
<!DOCTYPE html>
<html>
<head>
<title>Rolling Bearing Life</title>
<link rel="shortcut icon" type="image/png" href="../favicon.png" />
<link rel="apple-touch-icon-precomposed" href="../apple-touch-icon-60x60.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="../apple-touch-icon-76x76.png">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="../apple-touch-icon-152x152.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="../apple-touch-icon-120x120.png">
<meta content="width=device-width, minimum-scale=1, maximum-scale=1" name="viewport">
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css" />
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="script/mdj.math.library.js"></script>
<script type="text/javascript" src="script/bearing_rolling_life.js"></script>
<script type="text/javascript">$(document).bind("mobileinit", function () {$.mobile.ajaxEnabled = false;});</script>
<script type="text/javascript" src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
<!-- ##########################
##### LIFE PAGE #####
########################## -->
<div data-role="page" id="life_page">
<script type="text/javascript">
LoadNavPanel("#life_page");
$(document).on('pageinit', '#life_page', function () {calcBearing();});
$(document).on('change', ".user_values, .calculated_values, #ring, #type, #reliability, #applicationFactor, #variable", function(){calcBearing();});
$(".calculated_values").prop("readonly",true);
</script>
<!-- ##### PANEL ##### -->
<div data-role="panel" id="navpanel" class="navpanel" data-display="reveal" data-position="left">
<ul data-role="listview" id="navigation_links" data-theme="f">
</ul>
</div> <!-- Panel -->
<!-- ##### HEADER ##### -->
<div data-role="header" data-position="fixed" data-theme="b">
<a href="#navpanel" data-role="button" data-icon="bars" data-iconpos="notext">Navigation</a>
<h1>Rolling Bearing Life</h1>
</div><!-- /header -->
<!-- ##### CONTENT ##### -->
<div role="main" class="ui-content">
<div data-role="controlgroup" data-type="horizontal">
<select id="variable" data-mini="true">
<option value="Calculate_null" disabled>Calculate for:</option>
<option value="lifetime">Lifetime</option>
<option value="bearingRating">Bearing Rating</option>
<option value="load">Load</option>
<option value="rpm">Rotations Per Min</option>
</select>
<label for="type">Bearing Type:</label>
<select id="type" data-mini="true">
<option value="type_null" disabled>Bearing Type:</option>
<option value="3">Ball Bearing</option>
<option value="3.3333333">Roller Bearing</option>
</select>
</div>
<label for="c"><i>C</i> Dynamic Rating, lbf:</label>
<input class="user_values" type="number" data-clear-btn="true" id="c" value="7050" min="1" step="100"/>
<label for="c0"><i>C<sub>0</sub></i> Static Rating, lbf:</label>
<input class="user_values" type="number" data-clear-btn="true" id="c0" value="10000" min="1" step="100"/>
<label for="load">Bearing Load, lbf:</label>
<input class="user_values" type="number" id="load" value="5000" min="1" step="25"/>
<label for="s0"><i>S<sub>0</sub></i> Factor:</label>
<input class="calculated_values" type="number" data-clear-btn="true" id="s0" min="0" step="0.25" />
<label for="cx"><i>C<sub>x</sub></i> Rated Hours:</label>
<input class="user_values" type="number" data-clear-btn="true" id="cx" value="1000000" min="0" />
<label for="rpm">RPM:</label>
<input class="user_values" type="number" data-clear-btn="true" id="rpm" value="250" min="0"/>
<div class="ui-grid-a">
<div class="ui-block-a">
<label for="hours">Operating Hours:</label>
<input class="calculated_values" type="number" data-clear-btn="true" id="hours" min="0" />
</div>
<div class="ui-block-b">
<label for="revs">Revolutions:</label>
<input class="calculated_values" type="number" data-clear-btn="true" id="revs" min="0" />
</div>
</div>
<div data-role="collapsible-set" data-theme="a">
<div data-role="collapsible" data-collapsed="true" data-theme="a">
<h3>Advanced</h3>
<div data-role="controlgroup" data-type="horizontal">
<label for="ring">Rotating Ring:</label>
<select id="ring" data-mini="true">
<option value="rot_null" disabled>Rotation:</option>
<option value="1">Inner Ring Rotates</option>
<option value="1.2">Outer Ring Rotates</option>
</select>
<label class="label" for="reliability" class="select">Reliability:</label>
<select id="reliability" data-mini="true">
<option value="reli_null" disabled>Reliability:</option>
<option value="1">90%</option>
<option value="0.62">95%</option>
<option value="0.53">96%</option>
<option value="0.44">97%</option>
<option value="0.33">98%</option>
<option value="0.21">99%</option>
</select>
</div>
<label for="applicationFactor">Application Factor:</label>
<input class="user_values" type="number" id="applicationFactor" value="1.0" step="0.1" min="0.5" max="2.0" data-inline="true"/>
</div> <!-- collapsible -->
</div> <!-- collapsible set -->
</div> <!-- Content -->
<!-- ##### FOOTER ##### -->
<div data-role="footer" data-position="fixed" data-theme="b">
<div data-role="controlgroup" data-type="horizontal" align="center">
<a href="https://formulae.scenic-shop.com/components/bearing_rolling_life/" data-role="button" id="formula" data-icon="gear">Formulas</a>
<a href="#diagram" data-role="button" id="bearing_diagram" data-rel="dialog" data-icon="info" disabled style=color:#b2b2b2;>Diagram</a>
<a href="disclaimer.html" data-role="button" data-rel="dialog">Disclaimer</a>
</div>
</div> <!-- Footer -->
</div> <!-- Page -->
</body>
</html>