From ec5dd1348007c0ebf1bf0009cde35b716e7d2147 Mon Sep 17 00:00:00 2001 From: james pannacciulli Date: Thu, 29 Jun 2023 17:45:17 -0400 Subject: allow query params 'text', 'd', 'rainbow', and 'lines' to set respective inputs --- html/index.html | 31 ++++++++++++++++++++++++++++--- 1 file changed, 28 insertions(+), 3 deletions(-) diff --git a/html/index.html b/html/index.html index fcb4b4b..413fac3 100644 --- a/html/index.html +++ b/html/index.html @@ -148,10 +148,14 @@ textPath.appendChild(animateRTL); var input = document.getElementById('the_text'); - input.addEventListener("input", updateValue); + input.addEventListener("input", + function () { + updateValue(input.value); + } + ); - function updateValue(e) { - textPath.textContent = (e.target.value); + function updateValue(_text) { + textPath.textContent = (_text); updateAnim( (window.getComputedStyle(textPath, null).getPropertyValue('font-size').slice(0,-2)) * (100/(window.screen.width)) @@ -213,6 +217,27 @@ } } ); + + // allow inputs to be specified in query params + const _queryparam_d = new URL(location.href).searchParams.get("d"); + const _queryparam_text = new URL(location.href).searchParams.get("text"); + const _queryparam_rainbow = new URL(location.href).searchParams.get("rainbow"); + const _queryparam_lines = new URL(location.href).searchParams.get("lines"); + if (_queryparam_d) { + svg_input.setAttribute("value", _queryparam_d); + updateSVG(_queryparam_d); + }; + if (_queryparam_text) { + input.setAttribute("value", _queryparam_text); + updateValue(_queryparam_text); + }; + if (_queryparam_rainbow == 1) { + rainbow_input.click(); + }; + if (_queryparam_lines == 1) { + lines_input.click(); + }; + // @license-end src -- cgit v1.2.3