Merge pull request #517 from manaba-enhanced-for-tsukuba/main

v3.3.0

Makefile

@@ -2,6 +2,7 @@ eslint = yarn run eslint --ignore-path .gitignore
 prettier = yarn run prettier --ignore-path .gitignore
 stylelint = yarn run stylelint --ignore-path .gitignore
 typecheck = yarn run tsc --noEmit
+web-ext = yarn run web-ext -s dist
 
 node_modules: package.json yarn.lock
 ifeq ($(MAKE_YARN_FROZEN_LOCKFILE), 1)
@@ -60,12 +61,13 @@ build.chrome: node_modules clear
 build.firefox: node_modules clear
 	NODE_ENV=production BROWSER_ENV=firefox yarn run webpack
 
-.PHONY: build.all
-build.all: build.chrome build.firefox
+.PHONY: lint.web-ext
+lint.web-ext: node_modules
+	$(web-ext) lint --self-hosted
 
 .PHONY: sign.firefox
 sign.firefox: node_modules
-	yarn run web-ext sign -s dist --channel unlisted --api-key=${AMO_JWT_ISSUER} --api-secret=${AMO_JWT_SECRET}
+	$(web-ext) sign --channel unlisted --api-key=${AMO_JWT_ISSUER} --api-secret=${AMO_JWT_SECRET}
 
 .PHONY: publish.firefox
 publish.firefox: build.firefox sign.firefox

README.md

@@ -1,13 +1,19 @@
+<div align="center">
+
 # manaba Enhanced for Tsukuba
 
-<a href="https://codeclimate.com/github/mkobayashime/manaba-enhanced/maintainability"><img src="https://api.codeclimate.com/v1/badges/ca9e30f13ce1f3f96754/maintainability" /></a>
+![Chrome Web Store](https://img.shields.io/chrome-web-store/users/fldngcbchlbfgbccilklplmhljilhfch)
+![Chrome Web Store](https://img.shields.io/chrome-web-store/stars/fldngcbchlbfgbccilklplmhljilhfch)
+<a href="https://codeclimate.com/github/manaba-enhanced-for-tsukuba/manaba-enhanced/maintainability"><img src="https://api.codeclimate.com/v1/badges/f8747aeeec34ea931430/maintainability" /></a>
 
 Make your manaba a little bit more comfortable.
 
-Get it via [Chrome Web Store](https://chrome.google.com/webstore/detail/manaba-enhanced-for-tsuku/fldngcbchlbfgbccilklplmhljilhfch).
+[Chrome](https://chrome.google.com/webstore/detail/manaba-enhanced-for-tsuku/fldngcbchlbfgbccilklplmhljilhfch) / [Firefox](https://github.com/manaba-enhanced-for-tsukuba/dist-firefox)
 
 **For students of University of Tsukuba.**
 
+</div>
+
 ![Screenshot](./img/dist/thumbnail1.png)
 
 ## Supported Univ. / 対応大学
@@ -28,6 +34,8 @@ If you want to use it in your univ., please follow the [instruction](https://git
 
 1. Highlight the publication deadline of course news and course contents
 
+1. Display the relative position of the grades in the courses
+
 1. Filter courses in mypage by terms/modules
 
 1. Generate $\LaTeX$ template for reports
@@ -50,6 +58,8 @@ If you want to use it in your univ., please follow the [instruction](https://git
 
 1. コースニュースやコンテンツの公開期限を強調表示
 
+1. 成績の位置を百分率で表示
+
 1. コースのモジュール別フィルタリング
 
 1. レポートの $\LaTeX$ テンプレートを生成

bin/publishFirefoxVersion.sh

@@ -1,5 +1,10 @@
 #!/usr/bin/env bash
 
+if ! command -v jq &> /dev/null; then
+  echo "jq must be installed." 1>&2
+  exit 1
+fi
+
 version=$(jq -r '.version' package.json)
 
 if [[ -z "$version" ]]; then

package.json

@@ -1,31 +1,31 @@
 {
   "name": "manaba-enhanced-for-tsukuba",
-  "version": "3.2.1",
+  "version": "3.3.0",
   "description": "Make your manaba a little bit more comfortable",
   "private": true,
   "devDependencies": {
     "@swc/core": "^1.3.14",
     "@swc/jest": "^0.2.23",
     "@tsconfig/recommended": "1.0.1",
-    "@types/chrome": "0.0.202",
+    "@types/chrome": "0.0.203",
     "@types/jest": "^29.2.1",
     "@types/lodash-es": "4.17.6",
     "@types/node": "18.11.9",
-    "@typescript-eslint/eslint-plugin": "5.43.0",
-    "@typescript-eslint/parser": "5.43.0",
+    "@typescript-eslint/eslint-plugin": "5.44.0",
+    "@typescript-eslint/parser": "5.44.0",
     "copy-webpack-plugin": "11.0.0",
     "css-loader": "6.7.1",
     "dayjs": "1.11.5",
-    "eslint": "8.27.0",
+    "eslint": "8.28.0",
     "eslint-config-prettier": "8.5.0",
     "eslint-plugin-import": "2.26.0",
     "file-loader": "6.2.0",
     "husky": "8.0.1",
     "jest": "^29.2.2",
     "lint-staged": "13.0.3",
     "lodash-es": "4.17.21",
-    "mini-css-extract-plugin": "2.6.0",
-    "prettier": "2.7.1",
+    "mini-css-extract-plugin": "2.7.0",
+    "prettier": "2.8.0",
     "rimraf": "3.0.2",
     "sass": "1.56.0",
     "sass-loader": "13.2.0",
@@ -34,10 +34,10 @@
     "stylelint-config-standard": "^29.0.0",
     "stylelint-config-standard-scss": "^6.0.0",
     "ts-loader": "9.4.1",
-    "typescript": "4.8.4",
-    "web-ext": "7.3.1",
+    "typescript": "4.9.3",
+    "web-ext": "7.4.0",
     "webpack": "5.75.0",
-    "webpack-cli": "4.10.0",
+    "webpack-cli": "5.0.0",
     "zip-webpack-plugin": "4.0.1"
   },
   "scripts": {

public/options.html

@@ -208,12 +208,26 @@ <h2>Enabled Features</h2>
               <div class="checkbox-style" />
             </div>
           </li>
+          <li>
+            <label class="checkboxLabel" for="featuresRelativeGradesPosition">
+              Display the relative position of the grades in courses
+            </label>
+            <div class="checkbox">
+              <input
+                type="checkbox"
+                checked
+                id="featuresRelativeGradesPosition"
+                class="checkbox-features"
+              />
+              <div class="checkbox-style" />
+            </div>
+          </li>
         </ul>
       </section>
       <section class="section-keys">
         <h2>Shortcuts</h2>
         <p>
-          Shortcuts are customizable from
+          Shortcuts are customizable
           <a href="" id="link-to-shortcuts-settings">here</a>
         </p>
       </section>
@@ -268,6 +282,9 @@ <h2>Disclaimer</h2>
         </p>
       </section>
       <section class="section-release-note">
+        <h2>3.3.0</h2>
+        <p>Display the relative position of the grades in the courses</p>
+        <p>Shortcut key for opening assignments page can be set</p>
         <h2>3.2.0</h2>
         <p>Customizable report template</p>
         <p>Publish Firefox version officially</p>

src/background.ts

@@ -80,6 +80,8 @@ chrome.runtime.onInstalled.addListener((details) => {
           featuresReportTemplate: storage.featuresReportTemplate ?? true,
           featuresDisableForceFileSaving:
             storage.featuresDisableForceFileSaving ?? true,
+          featuresRelativeGradesPosition:
+            storage.featuresRelativeGradesPosition ?? false,
         },
       })
 
@@ -122,6 +124,14 @@ chrome.commands.onCommand.addListener((cmd: string, tab: chrome.tabs.Tab) => {
       if (tab.id) chrome.tabs.sendMessage(tab.id, { kind: "open-in-respon" })
       break
     }
+    case "manaba-enhanced:open-assignments-page": {
+      chrome.tabs.create({
+        active: true,
+        index: tab.index + 1,
+        url: "https://manaba.tsukuba.ac.jp/ct/home_library_query",
+      })
+      break
+    }
   }
 })
 

src/contentScript/showRelativeGradesPosition.ts

@@ -0,0 +1,10 @@
+import { showRelativeGradesPosition } from "../methods/showRelativeGradesPosition"
+import { getStorage } from "../network/storage"
+
+getStorage({
+  kind: "sync",
+  keys: "featuresRelativeGradesPosition",
+  callback: ({ featuresRelativeGradesPosition }) => {
+    if (featuresRelativeGradesPosition) showRelativeGradesPosition()
+  },
+})

src/manifest.ts

@@ -47,6 +47,11 @@ const generateManifest = () => {
           include_globs: ["https://manaba.tsukuba.ac.jp/ct/course_*_report_*"],
           js: ["contentScript/reportTemplate.js"],
         },
+        {
+          matches: ["https://manaba.tsukuba.ac.jp/*"],
+          include_globs: ["https://manaba.tsukuba.ac.jp/ct/course_*_grade"],
+          js: ["contentScript/showRelativeGradesPosition.js"],
+        },
       ],
       commands: {
         "manaba-enhanced:open-in-respon": {
@@ -55,6 +60,9 @@ const generateManifest = () => {
           },
           description: "Open selected Respon code in Respon",
         },
+        "manaba-enhanced:open-assignments-page": {
+          description: "Open unsubmitted assignments page",
+        },
       },
       default_locale: "ja",
       ...(browserEnv === "firefox"

src/methods/filterCourses.ts

@@ -7,6 +7,19 @@ import { checkLang } from "./checkLang"
 
 let lang: checkLang.langCode
 
+const translations = {
+  ja: {
+    spring: "春",
+    autumn: "秋",
+    allModules: "すべてのモジュール",
+  },
+  en: {
+    spring: "Spring",
+    autumn: "Autumn",
+    allModules: "All modules",
+  },
+}
+
 export const filterCourses = (): void => {
   lang = checkLang()
 
@@ -56,28 +69,8 @@ const parseModuleCode = (
  * @param {string} seasonCode "spring" or "autumn"
  * @return {string} "春", "Spring", etc...
  */
-const seasonCodeToText = (seasonCode: SeasonCode) => {
-  switch (seasonCode) {
-    case "spring": {
-      if (lang === "ja") {
-        return "春"
-      } else if (lang === "en") {
-        return "Spring"
-      } else {
-        return ""
-      }
-    }
-    case "autumn": {
-      if (lang === "ja") {
-        return "秋"
-      } else if (lang === "en") {
-        return "Autumn"
-      } else {
-        return ""
-      }
-    }
-  }
-}
+const seasonCodeToText = (lang: checkLang.langCode, seasonCode: SeasonCode) =>
+  translations[lang][seasonCode]
 
 const createModuleSelector = () => {
   const selectorsContainer = document.querySelector(
@@ -98,17 +91,10 @@ const createModuleSelector = () => {
   ]
 
   const moduleCodeToText = (moduleCode: ModuleCode) => {
-    if (moduleCode === "all") {
-      if (lang === "ja") {
-        return "すべてのモジュール"
-      } else if (lang === "en") {
-        return "All modules"
-      }
-    }
+    if (moduleCode === "all") return translations[lang].allModules
 
     const parsedModuleCode = parseModuleCode(moduleCode)
-
-    const season = seasonCodeToText(parsedModuleCode.season)
+    const season = seasonCodeToText(lang, parsedModuleCode.season)
 
     return `${season}${parsedModuleCode.module.toUpperCase()}`
   }
@@ -135,27 +121,18 @@ const createModuleSelector = () => {
 }
 
 const applyFilter = (moduleCode: ModuleCode): void => {
-  let viewMode: "list" | "thumbnail"
-  let courses: HTMLElement[]
-
-  const coursesListContainer = document.querySelector(".courselist tbody")
-  const coursesThumbnailContainer = document.querySelector(
+  const coursesListContainer =
+    document.querySelector<HTMLElement>(".courselist tbody")
+  const coursesThumbnailContainer = document.querySelector<HTMLElement>(
     ".mycourses-body .section"
   )
+  const coursesContainer = coursesListContainer ?? coursesThumbnailContainer
 
-  if (coursesListContainer) {
-    viewMode = "list"
-
-    courses = Array.from(coursesListContainer.children) as HTMLElement[]
-    courses.shift()
-  } else if (coursesThumbnailContainer) {
-    viewMode = "thumbnail"
+  if (!coursesContainer || (coursesListContainer && coursesThumbnailContainer))
+    return
 
-    courses = Array.from(coursesThumbnailContainer.children) as HTMLElement[]
-    courses.pop()
-  } else {
-    throw "invalid viewMode"
-  }
+  const viewMode = coursesListContainer ? "list" : "thumbnail"
+  const courses = getCourses(coursesContainer, viewMode)
 
   /**
    * Parse course info string on the UI
@@ -282,3 +259,13 @@ const applyFilter = (moduleCode: ModuleCode): void => {
     })
   }
 }
+
+const getCourses = (coursesContainer: HTMLElement, viewMode: string) =>
+  (Array.from(coursesContainer.children) as HTMLElement[]).filter(
+    (_, i) =>
+      i !==
+      rowIndexToBeExcluded(viewMode, coursesContainer.childElementCount - 1)
+  )
+
+const rowIndexToBeExcluded = (viewMode: string, lastIndex: number) =>
+  viewMode === "list" ? 0 : lastIndex

src/methods/showRelativeGradesPosition.ts

@@ -0,0 +1,14 @@
+const showRelativeGradesPosition = () =>
+  document.querySelectorAll<HTMLElement>(".gradebar").forEach((gradebar) => {
+    const barWidth = gradebar.getAttribute("width")
+    const barSpanElement = gradebar.querySelector<HTMLElement>("span")
+    const siblingBarWidth = gradebar.nextElementSibling?.getAttribute("width")
+    if (!barWidth || !barSpanElement) return
+
+    const floorRate = siblingBarWidth ? parseInt(siblingBarWidth) : 0
+    const rate = parseInt(barWidth)
+
+    barSpanElement.textContent = `${floorRate} - ${floorRate + rate}%`
+  })
+
+export { showRelativeGradesPosition }

src/options.ts

@@ -56,6 +56,7 @@ window.onload = () => {
       | "featuresFilterCourses"
       | "featuresDragAndDrop"
       | "featuresReportTemplate"
+      | "featuresRelativeGradesPosition"
     >
 
     getStorage({

src/types/storage.ts

@@ -11,6 +11,7 @@ export type StorageSync = Readonly<{
   featuresDragAndDrop: boolean
   featuresReportTemplate: boolean
   featuresDisableForceFileSaving?: boolean
+  featuresRelativeGradesPosition?: boolean
   filterConfigForModule?: ModuleCode
   reportTemplate?: string
   reportFilename?: string

webpack.config.js

@@ -33,6 +33,12 @@ module.exports = {
       "contentScript",
       "reportTemplate.ts"
     ),
+    "contentScript/showRelativeGradesPosition": path.resolve(
+      __dirname,
+      "src",
+      "contentScript",
+      "showRelativeGradesPosition.ts"
+    ),
     background: path.resolve(__dirname, "src", "background.ts"),
     options: path.resolve(__dirname, "src", "options.ts"),
   },