-
Notifications
You must be signed in to change notification settings - Fork 6
/
Copy pathindex.html
138 lines (130 loc) · 8.03 KB
/
index.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
<!--
Sliders.html, a simple javascript equation parser that creats dynamic sliders based on the equation
based on original work by Hunter Davis, 2010
Copyright Discursive Labs, LLC
We still need to decided on a license for our internal tools we share with the community
So if you'd like this to be gpl, send us an email
hunter or mark at discursivelabs.com
-->
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>QuickGrapher</title>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="stylesheet" media="all" href="http://www.hunterdavis.com/quickgrapher/css/less-style.css" type="text/css" />
<link rel="stylesheet" media="all" href="http://www.hunterdavis.com/quickgrapher/css/jquery-ui-1.8.9.custom.css" type="text/css" />
<meta name="viewport" content="width=device-width; initial-scale=1"/>
<!-- Add "maximum-scale=1" to fix the Mobile Safari auto-zoom bug on orientation changes,
but keep in mind that it will disable user-zooming completely. Bad for accessibility. -->
<script type="text/javascript" src="http://www.hunterdavis.com/quickgrapher/js/jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="http://www.hunterdavis.com/quickgrapher/js/jquery-ui-1.8.9.custom.min.js"></script>
<script type="text/javascript" src="http://www.hunterdavis.com/quickgrapher/js/modernizr-1.6.min.js"></script>
<script src="http://www.hunterdavis.com/quickgrapher/js/obfs.js" type="text/javascript" charset="utf-8"></script>
<script src="http://www.hunterdavis.com/quickgrapher/js/plain/override_obfuscated_functions.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div id="container">
<div id="inner">
<span style="width: 100%;">
<a href="http://www.hunterdavis.com/quickgrapher/">
<img class="logo" src="http://www.hunterdavis.com/quickgrapher/images/logo_1.png"></img>
</a>
</span>
<h2>Instructions</h2>
<div class="instructions">
<ol>
<li>Enter an equation into the box below</li>
<li>Click the "Graph!" button</li>
<li>Admire your equation!</li>
</ol>
<br/>
For each variable in your equation, a line will be added to the graph. To adjust the variables, change the min / max / step values and sliders in the list below the graph. You can also choose to hide any variables by unchecking the box next to that variable.
<br/><br/>
For more help, try one of the examples or check out:
<ul style="list-style-type: none;">
<li><a href="quickgrapher-faq.html">Frequently Asked Questions</a></li>
<li><a href="quickgrapher-tutorials.html">Video Tutorials</a></li>
<li><a href="quickgrapher-walkthrough.html">Annotated Walkthrough</a></li>
<li><a href="quick-graph-embed-demo.html">QuickGrapher Embedding Demo</a></li>
</ul>
</div>
<h2>Try It! <div class="examples" style="display: none;">» <span class="link" onclick="toggle('examples')">examples</span></div></h2>
<!--div class="bar" style="width: 617px; margin-left: 22px;">
<h2 style="display: inline;">Try It!</h2>
</div-->
<div class="menu">
<div class="examples">» <span class="link" onclick="toggle('examples')">examples</span></div>
<div class="functions_list">» <span class="link" onclick="toggle('functions')">functions</span></div>
</div>
<div id="examples" class="example_box menu_item">
<span style="width: 100%;">
<ul id="examplelist" class="example_list">
<li>No examples!</li>
</ul>
</span>
<div id="prevExamples" class="link" style="float: left; display: none; margin-top: -15px;" onclick="prevExamples()">previous <font style="color: rgb(0,0,0); text-decoration: none;">«</font></div>
<div id="nextExamples" class="link" style="float: right; display: none; margin-top: -15px;" onclick="nextExamples()"><font style="color: rgb(0,0,0); text-decoration: none;">»</font> more</div>
</div>
<div id="functions" class="function_box menu_item">
<span style="width: 100%;">
<ul id="functionlist" class="function_list">
<li>No implemented functions!</li>
</ul>
</span>
</div>
<span id="equation" class="equation">
<input type="text" id="equationName" class="input" value="Function"/><font style="font-weight: bold; font-size: 12pt; margin: 0px 20px 0px 20px;">=</font><input type="text" id="mainEquation" class="equation_input input"/>
<input id="graphBtn" type="button" value="Graph!" onclick="clearAndParse()"/><span class="cancel_icon" onclick="clearEqAndScreen()"></span><span class="screenshot_icon" onclick="convertToPNG()"></span>
<span id="legendTitle" style="color: rgb(164, 157, 143); width: 60px; margin-left: 24px; margin-top: 13px; font-weight: bold;display: none;">Legend</span><br/>
</span>
<div id="graph_container" class="graph_container" style="position: relative; float: left;">
</div>
<div id="legend" style="display: none;">
</div>
<div id="graph_break" style="clear: both;"></div>
<div id="result" style="display: none;">
<div id="solution_column" class="solution_column">
<div class="bar" style="margin-left: 0px; width: 100%;">
<h2 style="display: inline;">Solution</h2>
</div>
<span id="function_name" style="font-weight: bold;">Fxn</span> ( <span id="variable_list">0</span> )<br/>
<font style="font-weight: bold; margin-left: 10px;">=</font> <div id="formula" style="overflow: hidden; padding-left: 15px;">0</div>
<font style="font-weight: bold; margin-left: 10px;">=</font> <span id="solution">0</span>
</div>
<div id="variables_column" class="variables_column">
<div class="bar" style="margin-left: 0px; width: 100%;">
<h2 style="display: inline;">Variables</h2>
<input id="resolve_btn" type="button" value="Re-Solve" onclick="solve()" style="margin: 0px 0px 0px 50px;"/>
<div id="dynamic_label">
<input id="dynamic_update" type="checkbox" onclick="solve()" checked/>
Realtime Updating<span style="font-size: 7pt; margin: 3px; font-weight: normal;">[may cause browser to lag!]</span>
</div>
</div>
<table id="variables" class="variable_table">
<tr class="variable_label">
<!--td class="show">Show?</td-->
<td class="value"></td>
<td class="minimum">Minimum</td>
<td class="step">Step</td>
<td class="maximum">Maximum</td>
</tr>
</table>
</div>
</div>
<br/>
<br/>
</div>
<div id="beta_box" style="position:absolute; top: 0px; right: 0px; padding: 4px; font-weight: bold; font-size: 13pt; color: rgb(195,220,235); background-color: rgb(164,157,143); width: 120px; text-align: right; border: 1px solid rgb(144,136,125);">
<div style="text-align: center;">I love feedback & suggestions!</div><br/><br/>
<font style="font-size: 10pt;">Let me know your thoughts in an email to</font>
<div style="text-align: left; color: rgb(53, 52, 49); margin-bottom: -5px; padding-bottom: 10px; border-bottom: 1px solid black"><br/>hunter <font style="color: rgb(255,255,255);">@</font><br/><font style="font-size: 10pt;">hunterdavis.com</font></div>
</div>
</div>
<div id="fullscreen_container" style="position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; display: none; overflow: hidden; background: rgb(241,241,241) url('images/logo_1.png') no-repeat right top;">
</div>
<div id="fullscreen_toggle" onclick="toggleFullscreen()">Fullscreen</div>
</body>
</html>