chore: Optimize the Github svg style

Author: kingcanfish

.github/workflows/run_data_sync.yml

@@ -204,10 +204,15 @@ jobs:
       - name: Make svg GitHub profile
         if: env.RUN_TYPE != 'pass'
         run: |
-          python run_page/gen_svg.py --from-db --title "${{ env.TITLE }}" --type github --athlete "${{ env.ATHLETE }}" --special-distance 10 --special-distance2 20 --special-color yellow --special-color2 red --output assets/github.svg --use-localtime --min-distance 0.5
+          python run_page/gen_svg.py --from-db --title "${{ env.TITLE }}" --type github --github-style align-firstday --athlete "${{ env.ATHLETE }}" --special-distance 10 --special-distance2 20 --special-color yellow --special-color2 red --output assets/github.svg --use-localtime --min-distance 0.5
+        # if you want use the style:the start day of each year always aligns with Monday. please use the following script:
+        #  python run_page/gen_svg.py --from-db --title "${{ env.TITLE }}" --type github --github-style align-monday --athlete "${{ env.ATHLETE }}" --special-distance 10 --special-distance2 20 --special-color yellow --special-color2 red --output assets/github.svg --use-localtime --min-distance 0.5
           python run_page/gen_svg.py --from-db --title "${{ env.TITLE_GRID }}" --type grid --athlete "${{ env.ATHLETE }}" --output assets/grid.svg --special-color yellow --special-color2 red --special-distance 20 --special-distance2 40 --use-localtime --min-distance "${{ env.MIN_GRID_DISTANCE }}"
           python run_page/gen_svg.py --from-db --type circular --use-localtime
-          python run_page/gen_svg.py --from-db --year $(date +"%Y")  --language zh_CN --title "$(date +"%Y") Running" --type github --athlete "${{ env.ATHLETE }}" --special-distance 10 --special-distance2 20 --special-color yellow --special-color2 red --output assets/github_$(date +"%Y").svg --use-localtime --min-distance 0.5
+          python run_page/gen_svg.py --from-db --year $(date +"%Y")  --language zh_CN --title "$(date +"%Y") Running" --type github --github-style align-firstday --athlete "${{ env.ATHLETE }}" --special-distance 10 --special-distance2 20 --special-color yellow --special-color2 red --output assets/github_$(date +"%Y").svg --use-localtime --min-distance 0.5
+        # if you want use the style:the start day of each year always aligns with Monday. please use the following script:
+        # python run_page/gen_svg.py --from-db --year $(date +"%Y")  --language zh_CN --title "$(date +"%Y") Running" --type github --github-style align-monday --athlete "${{ env.ATHLETE }}" --special-distance 10 --special-distance2 20 --special-color yellow --special-color2 red --output assets/github_$(date +"%Y").svg --use-localtime --min-distance 0.5
+
 
       - name: Save data to parqent
         if: env.SAVE_TO_PARQENT == 'true'

run_page/gen_svg.py

@@ -180,6 +180,15 @@ def main():
         help="activities db file",
     )
 
+    args_parser.add_argument(
+        "--github-style",
+        dest="github_style",
+        metavar="GITHUB_STYLE",
+        type=str,
+        default="align-firstday",
+        help='github svg style; "align-firstday", "align-monday" (default: "align-firstday").',
+    )
+
     for _, drawer in drawers.items():
         drawer.create_args(args_parser)
 
@@ -244,6 +253,7 @@ def main():
     p.drawer_type = "plain" if is_circular else "title"
     if args.type == "github":
         p.height = 55 + p.years.real_year * 43
+    p.github_style = args.github_style
     # for special circular
     if is_circular:
         years = p.years.all()[:]

run_page/gpxtrackposter/github_drawer.py

@@ -25,16 +25,26 @@ def draw(self, dr: svgwrite.Drawing, size: XY, offset: XY):
         year_length_style = f"font-size:{110 * 3.0 / 80.0}px; font-family:Arial;"
         month_names_style = f"font-size:2.5px; font-family:Arial"
         total_length_year_dict = self.poster.total_length_year_dict
+
+        is_align_monday = self.poster.github_style == "align-monday"
         for year in range(self.poster.years.from_year, self.poster.years.to_year + 1)[
             ::-1
         ]:
             start_date_weekday, _ = calendar.monthrange(year, 1)
             github_rect_first_day = datetime.date(year, 1, 1)
-            # Github profile the first day start from the last Monday of the last year or the first Monday of this year
-            # It depands on if the first day of this year is Monday or not.
-            github_rect_day = github_rect_first_day + datetime.timedelta(
-                -start_date_weekday
-            )
+
+            # default GitHub svg style:  the start day of each year always aligns with first day.
+            github_rect_day = github_rect_first_day
+            first_day_weekday = github_rect_first_day.weekday()
+
+            if is_align_monday:
+                # This is an earlier GitHub style: the start day of each year always aligns with Monday.
+                # If you want to use this, please add the command-line argument "--github-style align-monday" .
+                github_rect_day = github_rect_first_day + datetime.timedelta(
+                    -start_date_weekday
+                )
+                first_day_weekday = 0
+
             year_length = total_length_year_dict.get(year, 0)
             year_length = format_float(self.poster.m2u(year_length))
 
@@ -110,10 +120,19 @@ def draw(self, dr: svgwrite.Drawing, size: XY, offset: XY):
 
             rect_x = 10.0
             dom = (2.6, 2.6)
+
             # add every day of this year for 53 weeks and per week has 7 days
             for i in range(54):
-                rect_y = offset.y + year_size + 2
-                for j in range(7):
+                # the first day of the first week of the year may not Monday
+                # so we need to skip some empty spaces
+                if i == 0:
+                    rect_y = offset.y + year_size + 2 + 3.5 * first_day_weekday
+                else:
+                    # the first day of the n week (n >1) must be  Monday
+                    # so set first_day_weekday = 0
+                    first_day_weekday = 0
+                    rect_y = offset.y + year_size + 2
+                for j in range(7 - first_day_weekday):
                     if int(github_rect_day.year) > year:
                         break
                     rect_y += 3.5

run_page/gpxtrackposter/poster.py

@@ -60,6 +60,7 @@ def __init__(self):
         self.trans = None
         self.set_language(None)
         self.tc_offset = datetime.now(pytz.timezone("Asia/Shanghai")).utcoffset()
+        self.github_style = "align-firstday"
 
     def set_language(self, language):
         if language: