From 8c70fa721a3209d211948a91ad2af160b5b5a863 Mon Sep 17 00:00:00 2001 From: Michael Orlitzky Date: Thu, 2 Nov 2023 17:21:05 -0400 Subject: [PATCH] index.html.in: begin writing a function to resize the ticket The BaltimoreLink, Commuter Bus, and MARC Train tickets are all different sizes and have their service/zone names laid out a little bit differently. This commit adds a function, resize_ticket(), that will eventually handle that. --- index.html.in | 37 +++++++++++++++++++++++++++++++++++++ 1 file changed, 37 insertions(+) diff --git a/index.html.in b/index.html.in index 5618215..4e6c5f2 100644 --- a/index.html.in +++ b/index.html.in @@ -435,6 +435,40 @@ /* Otherwise, leave it at "BaltimoreLink" */ } + /***********************************************************/ + /* Resize the ticket background based on the service name */ + /***********************************************************/ + + function resize_ticket() { + /* Get the "servicename" from the querystring if it's there */ + const params = new URLSearchParams(document.location.search); + if (params.get("servicename") == "Commuter Bus") { + const tbg = document.getElementById("ticketbg"); + const t = document.getElementById("ticket"); + const sn = document.getElementById("servicename"); + + /* The top of the background is initially at y=246.859, and + * we scale it by a factor of 1.12 to y=276.482 for a change + * of 29.623. So after we scale it, we translate it upwards + * by that amount to put it back where it started. */ + tbg.setAttribute("transform", "translate(0 -29.623) scale(1 1.12)"); + + /* Now translate the entire ticket up by the magic amount, 1/5 + * of the size change we made to the background. */ + t.setAttribute("transform", "translate(0 -9.33)"); + + /* More magic numbers discovered by comparing the two + * tickets overlayed in inkscape */ + sn.setAttribute("transform", "translate(0 64.28)"); + } + else if (params.get("servicename") == "MARC Train") { + /* hi */ + } + + /* Otherwise, leave it alone. The SVG was designed with the + * BaltimoreLink ticket in mind */ + } + /****************************************/ /* Set and reposition the security code */ /****************************************/ @@ -677,6 +711,9 @@ /* Set the service name when the page has loaded */ window.addEventListener("load", set_service_name); + /* Resize the ticket background if necessary */ + window.addEventListener("load", resize_ticket); + /* Set the security code text when the page has loaded */ window.addEventListener("load", set_code); -- 2.44.2