forked from Shinao/PathToPoints
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
116 lines (105 loc) · 14.4 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
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>PathToPoints</title>
<link rel="stylesheet" href="dropzone/dropzone.min.css">
<link rel="stylesheet" href="dropzone/basic.min.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/bellows.min.css">
<link rel="stylesheet" href="css/bellows-theme.min.css">
<link rel="stylesheet" href="css/HoldOn.min.css">
<script src="js/jquery-2.2.1.min.js"></script>
<script src="js/opentype.min.js"></script>
<script src="js/plugin.min.js"></script>
<script src="js/velocity.min.js"></script>
<script src="js/velocity.ui.min.js"></script>
<script src="js/bellows.min.js"></script>
<script src="js/randomColor.js"></script>
<script src="dropzone/dropzone.min.js"></script>
<script src="js/raphael.min.js"></script>
<script src="js/pathtopoints.js"></script>
<script src="js/notify.min.js"></script>
<script src="js/HoldOn.min.js"></script>
</head>
<body>
<img id="title" src="img/TitlePathToPoints.svg" alt="PathToPoints"/>
<div id="dropzone" class="needsclick dz-clickable">
<div class="dz-message needsclick">
Drop SVG file here or click the box to upload.<br>
<span class="note needsclick">Only the path attribute is taken into account, everything else is ignored. The preview can be a bit strange because of that.</span>
<span class="note needsclick" style="font-weight: 900;">Please note! This version was modified to output coordinates in a format suitable for <code>R</code>.</span>
</div>
</div>
<div id="settings">
Point every x length
<input type="text" id="step_point"/>
<button type="text" id="btn-apply">Apply</button>
<button type="text" id="btn-text">Generate from text</button>
</div>
<div class="bellows">
<div class="bellows__item">
<div class="bellows__header">Ok
</div>
<div class="bellows__content">dsadasd
</div>
</div>
<div class="bellows__item">
<div class="bellows__header">
<h3>Header</h3>
</div>
<div class="bellows__content">
<p>Content</p>
</div>
</div>
<div class="bellows__item">
<div class="bellows__header">
<h3>Header</h3>
</div>
<div class="bellows__content">
<p>Content</p>
</div>
</div>
</div>
<div id="canvas"></div>
<svg id="svgTitle" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" version="1.1" id="svg2" height="85" width="484"> <metadata id="metadata21"> <rdf:RDF> <cc:Work rdf:about=""> <dc:format>image/svg+xml</dc:format> <dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/> </cc:Work> </rdf:RDF> </metadata> <defs id="defs19"/> <g id="g4"> <title id="title6">background</title> <g style="display:none;overflow:visible" id="canvasGrid" width="100%" height="100%" x="0" y="0" overflow="visible" display="none"> </g> </g> <g id="g12"> <title id="title14">Layer 1</title> <g id="svg_1" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0"> <path id="path26" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 5.5292969,69 0,-54.402344 17.6269531,0 q 10.019531,0 13.0625,0.816407 4.675781,1.224609 7.830078,5.343749 3.154297,4.082032 3.154297,10.576172 0,5.009766 -1.818359,8.423828 -1.81836,3.414063 -4.638672,5.38086 -2.783203,1.929687 -5.677735,2.560547 -3.933593,0.779297 -11.392578,0.779297 l -7.162109,0 0,20.521484 -10.9843751,0 z m 10.9843751,-45.199219 0,15.4375 6.011719,0 q 6.49414,0 8.683593,-0.853515 2.189453,-0.853516 3.414063,-2.671875 1.261719,-1.81836 1.261719,-4.230469 0,-2.96875 -1.744141,-4.898438 -1.744141,-1.929687 -4.416016,-2.412109 -1.966797,-0.371094 -7.904297,-0.371094 l -5.30664,0 z"/> <path id="path28" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="M 64.013672,41.613281 54.550781,39.90625 q 1.595703,-5.714844 5.492188,-8.460938 3.896484,-2.746093 11.578125,-2.746093 6.976562,0 10.390625,1.669922 3.414062,1.632812 4.787109,4.193359 1.410156,2.523437 1.410156,9.314453 l -0.111328,12.171875 q 0,5.195313 0.482422,7.681641 Q 89.099609,66.179687 90.472656,69 L 80.15625,69 q -0.408203,-1.039063 -1.001953,-3.080078 -0.259766,-0.927735 -0.371094,-1.22461 -2.671875,2.597657 -5.714844,3.896485 -3.042968,1.298828 -6.49414,1.298828 -6.085938,0 -9.611328,-3.302734 -3.488282,-3.302735 -3.488282,-8.34961 0,-3.339844 1.595703,-5.9375 1.595704,-2.634765 4.453125,-4.007812 2.894532,-1.410157 8.3125,-2.449219 7.310547,-1.373047 10.13086,-2.560547 l 0,-1.039062 q 0,-3.00586 -1.484375,-4.267579 -1.484375,-1.298828 -5.603516,-1.298828 -2.783203,0 -4.341797,1.113282 -1.558593,1.076171 -2.523437,3.822265 z m 13.953125,8.460938 q -2.003906,0.667968 -6.345703,1.595703 -4.341797,0.927734 -5.677735,1.818359 -2.041015,1.447266 -2.041015,3.673828 0,2.189453 1.632812,3.785157 1.632813,1.595703 4.15625,1.595703 2.820313,0 5.38086,-1.855469 1.892578,-1.410156 2.486328,-3.451172 0.408203,-1.335937 0.408203,-5.083984 l 0,-2.078125 z"/> <path id="path30" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 116.59766,29.589844 0,8.3125 -7.125,0 0,15.882812 q 0,4.824219 0.18554,5.640625 0.22266,0.779297 0.92774,1.298828 0.74219,0.519532 1.78125,0.519532 1.44726,0 4.19336,-1.001954 l 0.89062,8.089844 q -3.63672,1.558594 -8.23828,1.558594 -2.82031,0 -5.08398,-0.927734 -2.26368,-0.964844 -3.33985,-2.449219 -1.03906,-1.521485 -1.447263,-4.082031 -0.333985,-1.81836 -0.333985,-7.347657 l 0,-17.18164 -4.787109,0 0,-8.3125 4.787109,0 0,-7.830078 10.464848,-6.085938 0,13.916016 7.125,0 z"/> <path id="path32" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 134.29883,14.597656 0,20.001953 q 5.04687,-5.90039 12.06054,-5.90039 3.59961,0 6.49415,1.335937 2.89453,1.335938 4.34179,3.414063 1.48438,2.078125 2.00391,4.601562 0.55664,2.523438 0.55664,7.830078 l 0,23.119141 -10.42774,0 0,-20.818359 q 0,-6.197266 -0.59375,-7.867188 -0.59375,-1.669922 -2.11523,-2.634766 -1.48437,-1.001953 -3.74805,-1.001953 -2.59765,0 -4.63867,1.261719 -2.04101,1.261719 -3.00586,3.822266 -0.92773,2.523437 -0.92773,7.496093 l 0,19.742188 -10.42774,0 0,-54.402344 10.42774,0 z"/> <path id="path34" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 182.68945,69 0,-45.199219 -16.14258,0 0,-9.203125 43.23243,0 0,9.203125 -16.10547,0 0,45.199219 -10.98438,0 z"/> <path id="path36" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 208.62891,48.738281 q 0,-5.195312 2.56054,-10.05664 2.56055,-4.861329 7.23633,-7.421875 4.71289,-2.560547 10.50195,-2.560547 8.94336,0 14.65821,5.826172 5.71484,5.789062 5.71484,14.658203 0,8.943359 -5.78906,14.84375 -5.75195,5.863281 -14.50977,5.863281 -5.41797,0 -10.35351,-2.449219 -4.89844,-2.449219 -7.45899,-7.162109 -2.56054,-4.75 -2.56054,-11.541016 z m 10.6875,0.556641 q 0,5.863281 2.7832,8.980469 2.7832,3.117187 6.86523,3.117187 4.08203,0 6.82813,-3.117187 2.7832,-3.117188 2.7832,-9.054688 0,-5.789062 -2.7832,-8.90625 -2.7461,-3.117187 -6.82813,-3.117187 -4.08203,0 -6.86523,3.117187 -2.7832,3.117188 -2.7832,8.980469 z"/> <path id="path38" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 257.57617,69 0,-54.402344 17.62695,0 q 10.01954,0 13.0625,0.816407 4.67579,1.224609 7.83008,5.343749 3.1543,4.082032 3.1543,10.576172 0,5.009766 -1.81836,8.423828 -1.81836,3.414063 -4.63867,5.38086 -2.7832,1.929687 -5.67774,2.560547 -3.93359,0.779297 -11.39257,0.779297 l -7.16211,0 0,20.521484 -10.98438,0 z m 10.98438,-45.199219 0,15.4375 6.01172,0 q 6.49414,0 8.68359,-0.853515 2.18945,-0.853516 3.41406,-2.671875 1.26172,-1.81836 1.26172,-4.230469 0,-2.96875 -1.74414,-4.898438 -1.74414,-1.929687 -4.41602,-2.412109 -1.96679,-0.371094 -7.90429,-0.371094 l -5.30664,0 z"/> <path id="path40" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 305.85547,48.738281 q 0,-5.195312 2.56055,-10.05664 2.56054,-4.861329 7.23632,-7.421875 4.71289,-2.560547 10.50196,-2.560547 8.94336,0 14.6582,5.826172 5.71484,5.789062 5.71484,14.658203 0,8.943359 -5.78906,14.84375 -5.75195,5.863281 -14.50976,5.863281 -5.41797,0 -10.35352,-2.449219 -4.89844,-2.449219 -7.45898,-7.162109 -2.56055,-4.75 -2.56055,-11.541016 z m 10.6875,0.556641 q 0,5.863281 2.7832,8.980469 2.7832,3.117187 6.86524,3.117187 4.08203,0 6.82812,-3.117187 2.7832,-3.117188 2.7832,-9.054688 0,-5.789062 -2.7832,-8.90625 -2.74609,-3.117187 -6.82812,-3.117187 -4.08204,0 -6.86524,3.117187 -2.7832,3.117188 -2.7832,8.980469 z"/> <path id="path42" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 354.72852,24.246094 0,-9.648438 10.42773,0 0,9.648438 -10.42773,0 z m 0,44.753906 0,-39.410156 10.42773,0 0,39.410156 -10.42773,0 z"/> <path id="path44" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 411.6543,69 -10.42774,0 0,-20.113281 q 0,-6.382813 -0.66797,-8.238282 -0.66797,-1.892578 -2.18945,-2.93164 -1.48437,-1.039063 -3.59961,-1.039063 -2.70898,0 -4.86133,1.484375 -2.15234,1.484375 -2.96875,3.933594 -0.77929,2.449219 -0.77929,9.054688 l 0,17.849609 -10.42774,0 0,-39.410156 9.68555,0 0,5.789062 q 5.1582,-6.679687 12.98828,-6.679687 3.45117,0 6.30859,1.261718 2.85743,1.22461 4.30469,3.154297 1.48438,1.929688 2.04102,4.378907 0.59375,2.449218 0.59375,7.013671 l 0,24.492188 z"/> <path id="path46" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 440.33984,29.589844 0,8.3125 -7.125,0 0,15.882812 q 0,4.824219 0.18555,5.640625 0.22266,0.779297 0.92773,1.298828 0.74219,0.519532 1.78125,0.519532 1.44727,0 4.19336,-1.001954 l 0.89063,8.089844 q -3.63672,1.558594 -8.23828,1.558594 -2.82031,0 -5.08399,-0.927734 -2.26367,-0.964844 -3.33984,-2.449219 -1.03906,-1.521485 -1.44727,-4.082031 Q 422.75,60.613281 422.75,55.083984 l 0,-17.18164 -4.78711,0 0,-8.3125 4.78711,0 0,-7.830078 10.46484,-6.085938 0,13.916016 7.125,0 z"/> <path id="path48" style="font-style:normal;font-weight:bold;font-size:76px;font-family:Helvetica, Arial, sans-serif;text-anchor:start;fill:#3e3e3e;stroke:#000000;stroke-width:0" d="m 443.97656,57.755859 10.46485,-1.595703 q 0.66796,3.042969 2.70898,4.638672 2.04102,1.558594 5.71484,1.558594 4.04493,0 6.08594,-1.484375 1.37305,-1.039063 1.37305,-2.783203 0,-1.1875 -0.74219,-1.966797 -0.7793,-0.742188 -3.48828,-1.373047 -12.61719,-2.783203 -15.99414,-5.083984 -4.67578,-3.191407 -4.67578,-8.869141 0,-5.121094 4.04492,-8.609375 4.04492,-3.488281 12.54297,-3.488281 8.08984,0 12.02344,2.634765 3.93359,2.634766 5.41796,7.792969 l -9.83398,1.818359 q -0.63086,-2.300781 -2.41211,-3.52539 -1.74414,-1.22461 -5.00976,-1.22461 -4.11915,0 -5.9004,1.150391 -1.1875,0.816406 -1.1875,2.115234 0,1.113282 1.03907,1.892579 1.41015,1.039062 9.72265,2.93164 8.34961,1.892578 11.65235,4.638672 3.26562,2.783203 3.26562,7.755859 0,5.417969 -4.52734,9.314454 -4.52735,3.896484 -13.39649,3.896484 -8.05273,0 -12.76562,-3.265625 -4.67578,-3.265625 -6.12305,-8.869141 z"/> </g> </g></svg>
<div class="dialog" id="dialog-generate-from-text" title="Generate from text">
<label for="fonts">Select font</label>
<br/>
<select id="fonts" name="fonts">
<option value="Pokemon Hollow.ttf">Pokemon Hollow</option>
<option value="Champagne & Limousines.ttf">Champagne & Limousines</option>
<option value="Marcsc___.ttf">Marcsc</option>
<option value="Roboto-Regular.ttf">Roboto</option>
<option value="Starjedi.ttf">Starjedi</option>
<option value="njnaruto.ttf">Ninja Naruto</option>
<option value="varsity_regular.ttf">Varsity regular</option>
<option value="BebasNeue.otf">BebasNeue</option>
<option value="CHERI___.TTF">CHERI</option>
<option value="ChopinScript.otf">ChopinScript</option>
<option value="SCRIPTIN.ttf">SCRIPTIN</option>
<option value="evanescent.ttf">Evanescent</option>
<option value="riesling.ttf">Riesling</option>
<option value="waltographUI.ttf">waltographUI</option>
<option value="HARRYP__.TTF">HARRYP</option>
<option value="akka.ttf">Akka</option>
<option value="All Star Resort.ttf">All Star Resort</option>
</select>
<br/><br/>
<label for="url_font">Or use an url (ttf, otf, woff)</label>
<br/>
<input class="text ui-widget-content ui-corner-all" id="url_font" type="text" name="url_font" value=""/>
<br/><br/>
<label for="font_size">Font size</label>
<input class="text ui-widget-content ui-corner-all" id="font_size" type="text" name="font_size" value="75"/>
<br/><br/>
<label for="text_svg">Text</label>
<br/>
<input class="text ui-widget-content ui-corner-all" id="text_svg" type="text" name="text_svg" value=""/>
</div>
</body>
<link rel="stylesheet" href="jquery-ui/jquery-ui.min.css">
<link rel="stylesheet" href="jquery-ui/jquery-ui.structure.min.css">
<link rel="stylesheet" href="jquery-ui/jquery-ui.theme.min.css">
<script src="jquery-ui/jquery-ui.min.js"></script>
</html>