Merge pull request #31 from nguyenank/dec-2024

Dec 2024

Author: nguyenank

CHANGELOG.md

@@ -7,6 +7,26 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.1.0/),
 and this project adheres to the spirit of [Semantic Versioning](https://semver.org/spec/v2.0.0.html) as best it can without a proper API.
 
+## [2.3.0] - 2024-12-26
+
+### Added
+
+#### New Playing Areas
+
+-   Football Net (IFAB)
+-   Soccer Net (NCAA)
+-   Indoor Lacrosse (NLL customizable in feet)
+
+### Fixed
+
+-   Bandage fix for ghost dots not appearing promptly by disabling the size appearance transition for ghost dots.
+-   Fix sizing for default Soccer (NCAA) playing area.
+-   Fix dot transformation when changing dimensions on customizable dimension playing areas.
+
+### Changed
+
+-   Adjusted Ice Hockey (IIHF) playing area to allow customization of width and corner radius.
+
 ## [2.2.0] - 2024-06-26
 
 ### Added
@@ -22,7 +42,7 @@ and this project adheres to the spirit of [Semantic Versioning](https://semver.o
 
 ### Changed
 
--   Adjusted Football (NCAA) playing area to also allow customization of field height and width.
+-   Adjusted Soccer (NCAA) playing area to also allow customization of field height and width.
 
 ## [2.1.0] - 2023-09-30
 
@@ -259,7 +279,8 @@ and this project adheres to the spirit of [Semantic Versioning](https://semver.o
 -   Ability to click on rink to create dot and add row to table with the current details.
 -   Ability to download and upload table.
 
-[2.1.0]: https://github.com/nguyenank/shot-plotter/releases/tag/v2.2.0
+[2.3.0]: https://github.com/nguyenank/shot-plotter/releases/tag/v2.3.0
+[2.2.0]: https://github.com/nguyenank/shot-plotter/releases/tag/v2.2.0
 [2.1.0]: https://github.com/nguyenank/shot-plotter/releases/tag/v2.1.0
 [2.0.1]: https://github.com/nguyenank/shot-plotter/releases/tag/v2.0.1
 [2.0.0]: https://github.com/nguyenank/shot-plotter/releases/tag/v2.0.0

README.md

@@ -4,9 +4,9 @@
 
 A [web application](https://shot-plotter.netlify.app/) for plotting events on a sport's playing area with a single click, while keeping track of any other details. The application supports download and upload of .csv files to retrieve that plotted data.
 
-Currently 28 different playing areas across 19 different sports are supported:
+Currently 31 different playing areas across 20 different sports are supported:
 
--   ice hockey (NHL, IIHF) and ice hockey net (NHL)
+-   ice hockey (NHL, IIHF customizable) and ice hockey net (NHL)
 -   floorball (IFF)
 -   handball (IHF) and handball net (IHF)
 -   volleyball (NCAA)
@@ -19,9 +19,10 @@ Currently 28 different playing areas across 19 different sports are supported:
 -   men's lacrosse (NCAA)
 -   women's lacrosse (NCAA)
 -   field hockey (FIH)
+-   indoor lacrosse (NLL customizable)
 -   American football (NFL, NCAA)
 -   Canadian football (CFL, CFL pre-2022 & Amateur)
--   soccer (NCAA customizable, IFAB customizable in meters, IFAB customizable in yards)
+-   soccer (NCAA customizable, IFAB customizable in meters, IFAB customizable in yards) and soccer net (IFAB, NCAA)
 -   Australian rules football (AFL)
 -   rugby union (World Rugby)
 -   hurling and Gaelic football (GAA)

html/ice-hockey-iihf.html

@@ -115,7 +115,7 @@ <h1>Shot-Plotter</h1>
                     <div id="playing-area">
                         <!-- inject:playingarea -->
                         <svg id="ice-hockey-iihf-svg" xmlns="http://www.w3.org/2000/svg" width="100%" viewBox=" -1 -1 62 32">
-  <g id="transformations">
+  <g id="transformations" clip-path="url(#iceClipBorder)">
     <clipPath id="clipBorder">
       <path
         d="
@@ -130,6 +130,20 @@ <h1>Shot-Plotter</h1>
             L 0 8.5"
             />
     </clipPath>
+    <clipPath id="iceClipBorder">
+        <path
+          d="
+              M 0 8.5
+              A 8.5 8.5 0 0 1 8.5 0
+              L 51.5 0
+              A 8.5 8.5 0 0 1 60 8.5
+              L 60 21.5
+              A 8.5 8.5 0 0 1 51.5 30
+              L 8.5 30
+              A 8.5 8.5 0 0 1 0 21.5
+              L 0 8.5"
+              />
+    </clipPath>
     <path
       id="background"
       d="M 0 8.5
@@ -233,10 +247,10 @@ <h1>Shot-Plotter</h1>
       </g>
     </g>
     <g id="goal-lines">
-      <path id="left-goal-line" d="M 4 1.25
-            L 4 28.75" stroke="#BE352A" stroke-width="0.05"/>
-      <path id="right-goal-line" d="M 56 1.25
-            L 56 28.75" stroke="#BE352A" stroke-width="0.05"/>
+      <path id="left-goal-line" d="M 4 0
+            L 4 30" stroke="#BE352A" stroke-width="0.05"/>
+      <path id="right-goal-line" d="M 56 0
+            L 56 30" stroke="#BE352A" stroke-width="0.05"/>
     </g>
     <g id="blue-lines">
       <path id="left-blue-line" d="M 22.5 0
@@ -246,28 +260,28 @@ <h1>Shot-Plotter</h1>
     </g>
 
     <g id="faceoff-dots">
-      <g transform="translate(24, 8)">
+      <g id="top-left-dot" transform="translate(24, 8)">
         <circle cx="0" cy="0" r="0.3" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
         <rect x="-0.175" y="-0.275" width="0.35" height="0.55" fill="#BE352A"/>
       </g>
 
-      <g transform="translate(36, 8)">
+      <g id="top-right-dot" transform="translate(36, 8)">
         <circle cx="0" cy="0" r="0.3" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
         <rect x="-0.175" y="-0.275" width="0.35" height="0.55" fill="#BE352A"/>
       </g>
-      <g transform="translate(24, 22)">
+      <g id="bottom-left-dot" transform="translate(24, 22)">
         <circle cx="0" cy="0" r="0.3" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
         <rect x="-0.175" y="-0.275" width="0.35" height="0.55" fill="#BE352A"/>
       </g>
 
-      <g transform="translate(36, 22)">
+      <g id="bottom-right-dot" transform="translate(36, 22)">
         <circle cx="0" cy="0" r="0.3" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
         <rect x="-0.175" y="-0.275" width="0.35" height="0.55" fill="#BE352A"/>
       </g>
     </g>
 
     <g id="faceoff-circles">
-      <g transform="translate(10, 8)">
+      <g id="top-left-circle" transform="translate(10, 8)">
         <circle cx="0" cy="0" r="0.3" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
         <rect x="-0.175" y="-0.275" width="0.35" height="0.55" fill="#BE352A"/>
         <circle cx="0" cy="0" r="4.5" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
@@ -303,7 +317,7 @@ <h1>Shot-Plotter</h1>
           L -1.8 -0.225
         "/>
       </g>
-      <g transform="translate(50, 8)">
+      <g id="top-right-circle" transform="translate(50, 8)">
         <circle cx="0" cy="0" r="0.3" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
         <rect x="-0.175" y="-0.275" width="0.35" height="0.55" fill="#BE352A"/>
         <circle cx="0" cy="0" r="4.5" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
@@ -339,7 +353,7 @@ <h1>Shot-Plotter</h1>
           L -1.8 -0.225
         "/>
       </g>
-      <g transform="translate(10, 22)">
+      <g id="bottom-left-circle" transform="translate(10, 22)">
         <circle cx="0" cy="0" r="0.3" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
         <rect x="-0.175" y="-0.275" width="0.35" height="0.55" fill="#BE352A"/>
         <circle cx="0" cy="0" r="4.5" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
@@ -375,7 +389,7 @@ <h1>Shot-Plotter</h1>
           L -1.8 -0.225
         "/>
       </g>
-      <g transform="translate(50, 22)">
+      <g id="bottom-right-circle" transform="translate(50, 22)">
         <circle cx="0" cy="0" r="0.3" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>
         <rect x="-0.175" y="-0.275" width="0.35" height="0.55" fill="#BE352A"/>
         <circle cx="0" cy="0" r="4.5" stroke="#BE352A" stroke-width="0.05" fill="transparent"/>