save and load prefs correctly by creating a sync variant to deal with them (via init...
[mandelbrot-web.git] / index.html
CommitLineData
d0244cd3
RK
1<!-- This Source Code Form is subject to the terms of the Mozilla Public
2 - License, v. 2.0. If a copy of the MPL was not distributed with this file,
3 - You can obtain one at http://mozilla.org/MPL/2.0/. -->
95d05599 4
6a7aa57d
RK
5<!DOCTYPE html>
6<html manifest="manifest.appcache">
7<head>
8 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
6aba4673 9 <!-- try to counts default scaling on mobile, see
51442fd4
RK
10 https://developer.mozilla.org/en/Mobile/Viewport_meta_tag -->
11 <meta name="viewport" content="width=device-width, height=device-height, initial-scale=.6667, maximum-scale=.6667">
6a7aa57d
RK
12 <title>KaiRo.at Mandelbrot Web</title>
13 <script src="js/mandelbrot.js"></script>
14 <link rel="stylesheet" href="style/mandelbrot.css">
eb5900e3 15 <link rel="shortcut icon" href="style/mandelbrotIcon16.png" type="image/png">
6a7aa57d 16</head>
becdac35 17<body onload="Startup();">
6a7aa57d
RK
18<h1>KaiRo.at Mandelbrot Web</h1>
19
20<div id="overlayArea">
21<input type="button" id="drawButton" value="Draw Image"
22 onclick="drawImage();">
becdac35 23<input type="button" id="backButton" value="Back"
95d05599 24 onclick="goBack();" disabled="true">
6a7aa57d
RK
25<input type="button" id="settingsButton" value="Settings"
26 onclick="toggleSettings();">
ca6b14b6
RK
27<label for="bookmarks">Bookmarks:</label>
28<select id="bookmarks" onclick="callBookmark(event.target);">
29<option id="bookmarkOverview" value="-1">Overview</option>
30</select>
31
6a7aa57d
RK
32<fieldset id="settings"><legend>Image data</legend>
33Image coordinates:
34<br>Real:
6aba4673 35<br><label for="Cr_min">Min:</label>
5d56a513
RK
36<input id="Cr_min" value="-2.0" maxlength="10" size="10" type="text"
37 onchange="checkISValue(this, 'coord'); recalcCoord('Cr', 'scale');">
6aba4673 38<label for="Cr_max">Max:</label>
5d56a513
RK
39<input id="Cr_max" value="1.0" maxlength="10" size="10" type="text"
40 onchange="checkISValue(this, 'coord'); recalcCoord('Cr', 'scale');">
6aba4673 41<label for="Cr_scale">Scale:</label>
5d56a513
RK
42<input id="Cr_scale" value="3.0" maxlength="10" size="10" type="text"
43 onchange="checkISValue(this, 'coord'); recalcCoord('Cr', 'max');">
6a7aa57d 44<br>Imag:
6aba4673 45<br><label for="Ci_min">Min:</label>
5d56a513
RK
46<input id="Ci_min" value="-1.5" maxlength="10" size="10" type="text"
47 onchange="checkISValue(this, 'coord'); recalcCoord('Ci', 'scale');">
6aba4673 48<label for="Ci_max">Max:</label>
5d56a513
RK
49<input id="Ci_max" value="1.5" maxlength="10" size="10" type="text"
50 onchange="checkISValue(this, 'coord'); recalcCoord('Ci', 'scale');">
6aba4673 51<label for="Ci_scale">Scale:</label>
5d56a513
RK
52<input id="Ci_scale" value="3.0" maxlength="10" size="10" type="text"
53 onchange="checkISValue(this, 'coord'); recalcCoord('Ci', 'max');">
6a7aa57d 54
5d56a513 55<br><br>Image size:
6aba4673 56<br><label for="image_width">Width:</label>
5d56a513
RK
57<input id="image_width" value="300" maxlength="4" size="4" type="number"
58 onchange="checkISValue(this, 'dim'); recalcCoord('Ci', 'scale');">
6aba4673 59<label for="image_height">Height:</label>
5d56a513
RK
60<input id="image_height" value="300" maxlength="4" size="4" type="number"
61 onchange="checkISValue(this, 'dim'); recalcCoord('Cr', 'scale');">
b27a1f72
RK
62<input type="checkbox" id="proportional" checked="true"
63 onchange="checkProportions();">
5d56a513
RK
64<label for="proportional">proportional</label>
65
6aba4673 66<br><br><label for="iterMax">Maximum of iterations:</label>
ca6b14b6 67<select id="iterMax" onchange="setIter();">
6a7aa57d
RK
68<option value="50">50</option>
69<option value="100">100</option>
70<option value="500" selected="selected">500</option>
71<option value="1000">1000</option>
72<option value="5000">5000</option>
73</select>
ca6b14b6 74<input type="hidden" id="algorithm" value="numeric">
6a7aa57d 75
6aba4673 76<br><label for="palette">Color palette:</label>
ca6b14b6 77<select id="palette" onchange="setPalette();">
6a7aa57d
RK
78<option value="bw">Black &amp; White</option>
79<option value="kairo" selected="selected">KaiRo default</option>
80<option value="rainbow-linear1">Rainbow-linear 1</option>
becdac35
RK
81<option value="rainbow-squared1">Rainbow 1 Squared</option>
82<option value="rainbow-linear2">Rainbow 2 Linear</option>
83<option value="rainbow-squared2">Rainbow 2 Squared</option>
6a7aa57d
RK
84</select>
85</fieldset>
86</div>
87
88<div id="mainArea">
95d05599
RK
89<canvas id="mbrotImage" width="300" height="300"
90 onclick="drawIfEmpty();"></canvas>
6a7aa57d
RK
91</div>
92
ca6b14b6
RK
93<p id="action">
94Time taken for calculation: <span id="calcTime">none yet</span>
95</p>
6a7aa57d
RK
96
97</body></html>