KLPF (Ku-LMS Plugin Framework)

⚠️ これは KLPF の Fork 版です。 デフォルトの develop ブランチには破壊的な変更や動作が不安定になる可能性のあるコードが含まれています。安定版を利用する場合はオリジナルのKLPFを使用するか、main ブランチを使用してください。TOTP実装などの一部のコード生成にAIを利用しています。

工学院大学での生活を少し怠惰にできる拡張機能。

CoursePowerからKu-LMSへの移行に伴い、従来のKALIはその多くの機能が利用できなくなりました。
KLPFは、新しいKu-LMSに対応するために開発された後継の拡張機能です。

ホームページ

導入方法

導入解説動画（画像クリックでYouTubeに飛びます）

導入方法詳細（※ KALIはKLPFの旧名称です。文中のKALIはKLPFを指します。）

ここから最新版のKLPFの ZIP ファイルをダウンロードします。
ダウンロードした ZIP ファイルをクリックした後に右クリックをして、任意の場所(おすすめはドキュメントフォルダー直下)に展開します。
Chrome の拡張機能ページchrome://extensions/にアクセスし、右上の 「デベロッパーモード」 を有効にします。
「パッケージ化されていない拡張機能を読み込む」 をクリックし、先ほど解凍したフォルダー内にある KLPF フォルダー を選択します。
拡張機能「KLPF」が表示されたら、導入終了です。

設定の開き方

Chrome を開きます。
任意の画面でツールバー以外の任意の場所を右クリックします。
「[KLPF] 設定を開く」 をクリックしたら設定画面が開きます。

余談

ユーザー名とパスワードを入力する際は、chrome://password-manager/passwords/kogakuin.ac.jpにアクセスすると素早く統合認証ユーザー名とパスワードを取得できます。

機能🎉

自動ログイン

　→Ku-LMS もしくは ku-port を開くと自動でログインされます。使用する場合は統合認証ユーザー名とパスワードを入力してください。

Basic認証自動入力

　→www.cc.kogakuin.ac.jp へのBasic認証ダイアログに、自動ログインの認証情報を自動入力します。

自動ログアウト無効

　→Ku-LMSで自動ログアウトされるのを無効化します。Ku-LMSを開いて放置している場合のみ無効化できます。

課題リストアップ

　→未提出課題、未実施テストなどをまとめてKu-LMSホーム画面に表示します。更新には10秒ほどかかります。Googleカレンダー連携にも対応しています。

Meetミュート参加

　→Meet を開くと自動でカメラとマイクをオフにして参加します。

[β] 自動出席

　→クォーター、曜日、時間を選択し、Ku-LMSを開いておくと3分前に自動で出席ボタンを押しmeetに参加します。使用する際は自動ログアウト無効化機能もONにすることをオススメします。

ホーム出席表示

　→Ku-LMSホーム画面で、出席ボタンが存在する授業カードに出席バッジを表示します。

教材一括開封

　→教材ページで教材リンクの隣に一括開封ボタンを追加します。リンク先の教材をまとめて開き、参照済みにできます。

履修中科目のみ表示

　→Ku-LMSで講義絞り込み機能の設定を記憶して自動で適用します。自動で履修中科目のみ表示するチェックボックスが追加されます。

[β] 教材一括開封

　→教材ページで教材リンクの隣に一括開封のボタンを配置します。クリックするとそのリンクの中にある教材を自動で開き、参照済みにします。

D&D課題提出

　→課題提出ページにドラッグ＆ドロップでファイルをセットできるドロップゾーンを追加します。複数ファイルに対応しています。

本日の授業ハイライト

　→教材ページで授業実施日が本日のフォルダを青枠と「本日」バッジでハイライト表示します。

KP枠外簡易閉

　→ku-port の掲示板やシラバスなどのポップアップで、枠外クリックを閉じるボタンと同じ挙動にします。

授業時間表示

　→Ku-LMS で右上に現在時刻と、授業開始もしくは終了までの時間が表示されます。

[β] ダークモード

　→Ku-LMSにダークモードのテーマを適用します。

開発者向け構成

全体の階層

KLPF/
├─ manifest.json
├─ background.js
├─ scripts.config.js
├─ features/
│  ├─ modules/
│  ├─ pageWorld/
│  ├─ AutoLogin.js
│  ├─ attend.js
│  ├─ homeAttendance.js
│  ├─ homework.js
│  ├─ kuportDialogClose.js
│  ├─ kyozaiopen.js
│  ├─ LMSlogoutblock.js
│  ├─ meet.js
│  ├─ subject.js
│  └─ time.js
├─ setting/
│  ├─ main.js
│  ├─ options.html
│  ├─ options.css
│  └─ modules/
│     ├─ backup.js
│     ├─ settings.js
│     ├─ ui.js
│     └─ updatecheck.js
├─ gas/
├─ icon/
├─ docs/
└─ README.md

主要ファイルの役割

`manifest.json`

拡張機能の入口です。権限、バックグラウンドスクリプト、オプションページ、web_accessible_resources を定義します。
features/pageWorld/ 配下のような page world 用スクリプトをページへ注入するときも、ここで公開設定が必要です。

`background.js`

拡張機能全体の制御役です。scripts.config.js を読み、各機能の有効/無効に応じて content script を動的登録します。
初回インストール時のデフォルト設定保存、右クリックメニュー、GAS 送信、設定変更時の再登録もここが担当します。

`scripts.config.js`

機能一覧の定義ファイルです。
各機能について

storageKey
読み込む JS
どの URL に注入するか
デフォルトで ON か
オプション画面のどのパネルに対応するか

をまとめています。新機能を追加するときは、まずここに登録するのが入口です。

`features/` フォルダ

Ku-LMS / ku-port / Meet 上で動く実装本体です。基本的には「1機能1ファイル」で、scripts.config.js から動的に注入されます。

主なファイルは次のとおりです。

AutoLogin.js 自動ログイン処理。
LMSlogoutblock.js Ku-LMS のセッション切れ対策。
homework.js ホーム画面の課題集約表示と Webhook 連携。
subject.js ホーム画面の講義フィルタ保存と自動適用。
homeAttendance.js ホーム画面の出席判定、出席バッジ表示、出席ポップアップ起動の content script 側本体。
attend.js β機能の自動出席。
meet.js Meet 参加前のミュート制御。
kyozaiopen.js 教材一括開封。
kuportDialogClose.js ku-port のポップアップを枠外クリックで閉じやすくする機能。
time.js 授業時間表示。
darkmode.js ダークモード。

`features/modules/` フォルダ

複数機能で使う共通部品です。

constants.js LMS URL、ストレージキー、時間割定義などの共通定数。
dom-utils.js waitForElement、safeQuerySelector などの DOM ユーティリティ。
totp.js 自動ログインで使う TOTP 関連処理。

新しい機能を書くときに、複数ファイルで同じ DOM 待機や定数が必要ならここへ寄せます。

`features/pageWorld/` フォルダ

ページ自身の JavaScript と同じ world で動かす補助スクリプトです。
content script からは直接触れないページ関数を呼ぶときに使います。

現状は次があります。

homeAttendance.js features/homeAttendance.js から渡されたイベントを受けて、LMS ページ側の dispIframe() や Postprocess に合わせて出席ポップアップを開閉します。

つまり、

features/homeAttendance.js = 拡張側の UI / 通信
features/pageWorld/homeAttendance.js = LMS ページ関数との橋渡し

という分担です。

`setting/` フォルダ

オプション画面です。

options.html 設定画面の構造。
options.css 設定画面のスタイル。
main.js 設定画面の起動入口。
modules/settings.js 設定の読み書き、デフォルト値反映、トグル状態管理。
modules/ui.js 並び替えや表示更新など UI 制御。
modules/backup.js 設定のインポート / エクスポート。
modules/updatecheck.js 更新確認。

機能の ON/OFF や資格情報の保存はここから chrome.storage.sync / chrome.storage.local に書かれ、background.js がそれを読んで各 script 登録に反映します。

`gas/` フォルダ

Google Apps Script 連携用です。
主に課題通知やセットアップ補助で使います。

`docs/` フォルダ

GitHub Pages / 紹介サイトです。拡張本体ではなく、配布ページやドキュメント側のコードが入っています。

`icon/` フォルダ

拡張機能アイコンです。manifest.json から参照されます。

`templates/` フォルダ

OSS コントリビュータ向けの追加テンプレートです。
「新しい機能を最短で追加する」ことだけに絞った雛形を置いています。

templates/feature/contentScript.template.js content script の最小テンプレート。
templates/feature/pageWorld.template.js page world が必要な場合のテンプレート。
templates/feature/scripts.config.template.txt scripts.config.js に貼る登録雛形。

仕組みの流れ

基本フロー

Chrome が manifest.json を読む
background.js が起動する
background.js が scripts.config.js を見て、有効な content script を登録する
対象 URL を開くと features/ 配下のスクリプトが注入される
必要に応じて chrome.storage.sync/local を読み、各機能が動く

例: ホーム出席表示

scripts.config.js で homeAttendance.js が Ku-LMS ホームに登録される
features/homeAttendance.js がホームカードを集める
linkKougi を順に叩いて、出席ボタンが存在する授業だけバッジを付ける
バッジ押下時は page world 側の features/pageWorld/homeAttendance.js に event を送る
page world 側が dispIframe('#iframeCosa') 相当を実行して、出席ポップアップを開く

ストレージの使い分け

chrome.storage.sync ユーザー設定、機能 ON/OFF、認証情報など同期したいもの
chrome.storage.local ローカル専用設定や一部キャッシュ
sessionStorage homeAttendance.js のようなページ内だけで十分な短時間キャッシュ
ページ側 localStorage attend.js の一時状態管理など、特定機能がページ上で使う一時データ

どこから読めばいいか

機能追加の入口を知りたい
→ scripts.config.js
機能の登録や初期化の流れを知りたい
→ background.js
設定画面を触りたい
→ setting/options.html と setting/modules/settings.js
Ku-LMS ホーム系の実装を見たい
→ features/homework.js, features/subject.js, features/homeAttendance.js
page world が絡む実装を見たい
→ features/homeAttendance.js と features/pageWorld/homeAttendance.js

OSS向け新機能追加テンプレート

最短手順

templates/feature/contentScript.template.js を features/YourFeature.js にコピー
scripts.config.js の「新機能追加テンプレート」コメントをコピーして有効化
id, storageKey, TodoFeature.js, matches, optionsPanelId を自分の機能名に置換
features/YourFeature.js の TODO を埋める
設定画面が必要なら setting/options.html と setting/modules/settings.js に項目を追加
page world が必要なら templates/feature/pageWorld.template.js を features/pageWorld/YourFeature.js にコピーし、manifest.json の web_accessible_resources に追加

追加パターンの目安

普通の DOM 改変だけで完結する → contentScript.template.js だけで十分
ページの関数を直接呼びたい例: dispIframe(), closeIframe(), ページのグローバル変数 → pageWorld.template.js も使う
設定 UI を増やしたい → setting/options.html と setting/modules/settings.js を合わせて編集する

`scripts.config.js` の登録テンプレート

scripts.config.js には、配列末尾にそのまま使えるコメントテンプレートを入れてあります。
コメントアウトを外して名前を置き換えれば登録できます。

{
    id: 'TodoFeatureScript',
    storageKey: 'todoFeature',
    js: [MODULES.CONSTANTS, MODULES.DOM_UTILS, `${PATHS.FEATURES}TodoFeature.js`],
    matches: [URLS.KOGAKUIN_LMS],
    runAt: 'document_end',
    enabledByDefault: false,
    optionsPanelId: 'todo-feature-options',
},

新機能を追加するときの命名ルール

id Background から見た script の一意名。TodoFeatureScript のように Script を付けると分かりやすいです。
storageKey 機能 ON/OFF を保存するキー。todoFeature のように lowerCamelCase を使います。
optionsPanelId オプション画面の対応パネル ID。todo-feature-options のように kebab-case を使います。
features/ 配下のファイル名 TodoFeature.js のように機能名ベースで揃えると追いやすいです。

最小実装の考え方

最初から複雑にしない方が保守しやすいです。基本は次の順番で追加します。

features/YourFeature.js を 1 本作る
scripts.config.js に登録する
動作確認する
必要なら設定 UI を足す
必要なら features/modules/ や features/pageWorld/ に分離する

つまり、最初は「コメントアウトを戻す」「名前を置換する」「JS の中身を書く」の 3 ステップで始められる状態にしています。

ヘッダーリンク

　→Ku-LMSのヘッダーにカスタムリンクを表示します。設定からリンクを追加・削除できます。デフォルトでKUPORTへのリンクが含まれています。

カスタムテーマ

　→Ku-LMSに設定ページと同じパーティクルエフェクトと虹色カスタムカーソルを適用します。

お知らせウィジェット

　→お知らせとトピックを右下の小さなフローティングウィジェットとして表示します。クリックで折りたたみ可能です。

時間割表示

　→KUPORTの「学生時間割表」を開くと自動的に時間割データを保存し、Ku-LMSのヘッダーから時間割をモーダルで確認できます。今日の曜日列と現在の時限がハイライトされます。

ユーザースクリプト版

userscript/ ディレクトリには、KLPFの一部機能をTampermonkey / Violentmonkey等で利用できるユーザースクリプトとして提供しています。
これらはKLPFの拡張機能版コードを基に、AIによってユーザースクリプト向けに書き直したものです。スマートフォンやタブレット端末での実行を想定しています。

スクリプト	元機能	備考
`AutoLogin.user.js`	自動ログイン	ユーザーID・パスワード・TOTP秘密鍵をスクリプトに直接埋め込む方式
`SubjectFilter.user.js`	履修中科目のみ表示	フィルター設定の保存に GM API または localStorage を使用

更新方法

　前バージョンを削除してファイルを置き換えるか、上書き保存してください。

バージョン管理について

　セマンティックバージョニングに基づいてバージョンアップを行っています。

OSS License

　The source code is licensed MIT. The website content is licensed CC BY 4.0,see LICENSE.

Name		Name	Last commit message	Last commit date
Latest commit History 68 Commits
.github/workflows		.github/workflows
docs		docs
features		features
gas		gas
icon		icon
setting		setting
templates/feature		templates/feature
userscript		userscript
LICENSE		LICENSE
README.md		README.md
background.js		background.js
google982777efd3c2f890.html		google982777efd3c2f890.html
manifest.json		manifest.json
scripts.config.js		scripts.config.js

Folders and files

Latest commit

History

Repository files navigation

KLPF (Ku-LMS Plugin Framework)

ホームページ

導入方法

導入解説動画（画像クリックでYouTubeに飛びます）

導入方法詳細（※ KALIはKLPFの旧名称です。文中のKALIはKLPFを指します。）

設定の開き方

余談

機能🎉

自動ログイン

Basic認証 自動入力

自動ログアウト無効

課題リストアップ

Meetミュート参加

[β] 自動出席

ホーム出席表示

教材一括開封

履修中科目のみ表示

[β] 教材一括開封

D&D課題提出

本日の授業ハイライト

KP枠外簡易閉

授業時間表示

[β] ダークモード

開発者向け構成

全体の階層

主要ファイルの役割

manifest.json

background.js

scripts.config.js

features/ フォルダ

features/modules/ フォルダ

features/pageWorld/ フォルダ

setting/ フォルダ

gas/ フォルダ

docs/ フォルダ

icon/ フォルダ

templates/ フォルダ