diff options
Diffstat (limited to 'html/index.html')
| -rw-r--r-- | html/index.html | 23 |
1 files changed, 21 insertions, 2 deletions
diff --git a/html/index.html b/html/index.html index 6bb87ff..dc265a6 100644 --- a/html/index.html +++ b/html/index.html @@ -68,6 +68,8 @@ <input id="the_svg" type="text" value="" placeholder="Paste SVG path 'd' field here..."> <input id="the_rainbow" name = "textgradient" type="checkbox" value="Rainbow"> <input id="the_lines" name = "pathlines" type="checkbox" value="Lines"> + <a href="" id=link_href>link</a> + <a href="https://git.jpnc.info/calligram.me/about/">src</a> <div id="svg-target"></div> <script> // @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt @@ -144,14 +146,28 @@ animateRTL.setAttributeNS(null, 'fill', 'freeze'); /* envelope icon by Amelia from https://thenounproject.com/icon/envelope-1526185/ under CC-BY-3.0 */ - updateSVG("M82,20.3H18a13,13,0,0,0-13,13V66.7a13,13,0,0,0,13,13H82a13,13,0,0,0,13-13V33.3A13,13,0,0,0,82,20.3Zm-2.2,8L52.1,45.5a4,4,0,0,1-4.2,0L20.2,28.3ZM87,66.7a5,5,0,0,1-5,5H18a5,5,0,0,1-5-5V33.3h0L43.7,52.3a11.9,11.9,0,0,0,12.6,0L87,33.2h0Z"); + const _default_svg = "M82,20.3H18a13,13,0,0,0-13,13V66.7a13,13,0,0,0,13,13H82a13,13,0,0,0,13-13V33.3A13,13,0,0,0,82,20.3Zm-2.2,8L52.1,45.5a4,4,0,0,1-4.2,0L20.2,28.3ZM87,66.7a5,5,0,0,1-5,5H18a5,5,0,0,1-5-5V33.3h0L43.7,52.3a11.9,11.9,0,0,0,12.6,0L87,33.2h0Z"; + updateSVG(_default_svg); textPath.appendChild(animateRTL); textPath.appendChild(animateLTR); + + // output current setup as URL for sharing/bookmarking + function updateLink () { + let _generated_url = + ( window.location.origin != "null" ? window.location.origin : "" ) + + window.location.pathname + + "?lines=" + ( lines_input.checked ? 1 : 0 ) + + "&rainbow=" + ( rainbow_input.checked ? 1 : 0 ) + + "&d=" + ( encodeURIComponent(svgPath.getAttribute('d')) ) + + "&text=" + ( encodeURIComponent(textPath.textContent) ); + document.getElementById('link_href').setAttribute('href', _generated_url); + } var input = document.getElementById('the_text'); input.addEventListener("input", function () { updateValue(input.value); + updateLink(); } ); @@ -169,6 +185,7 @@ svg_input.addEventListener("input", function () { updateSVG(svg_input.value); + updateLink(); } ); @@ -205,6 +222,7 @@ } else { moving_text.style.removeProperty("fill"); } + updateLink(); } ); @@ -216,6 +234,7 @@ } else { svgpath.style.removeProperty("stroke"); } + updateLink(); } ); @@ -239,8 +258,8 @@ lines_input.click(); }; + updateLink(); // @license-end </script> - <a href="https://git.jpnc.info/calligram.me/about/">src</a> </body> </html> |