Skip to content

feat: contest extension #52

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Jun 27, 2022
Merged

feat: contest extension #52

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
ebe7753
chore: upgrade dep `leetcode-query`
JacobLinCool Jun 27, 2022
794ed45
fix: activity extension line width
JacobLinCool Jun 27, 2022
2a17ae0
feat: add contest extension
JacobLinCool Jun 27, 2022
4c542b1
feat: support contest extension on cf worker
JacobLinCool Jun 27, 2022
97e2331
docs: add document of contest extension
JacobLinCool Jun 27, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 26 additions & 4 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,18 +133,26 @@ Hide elements on the card, it is a comma-separated list of element ids.

Extension, it is a comma-separated list of extension names.

Now there is only a notable extension: `activity`.
Now there is only two notable extension: `activity` and `contest`.

NOTICE: You can only use one of `activity` and `contest` at a time now, maybe they can be used together in the future.

> But actually animation, font, theme, and external stylesheet are all implemented by extensions and enabled by default.

Want to contribute a `contest` or `nyan-cat` extension? PR is welcome!
Want to contribute a `nyan-cat` extension? PR is welcome!

```md
![](https://leetcard.jacoblin.cool/jacoblincool?ext=activity)
```

[![](https://leetcard.jacoblin.cool/jacoblincool?ext=activity)](https://leetcard.jacoblin.cool/jacoblincool?ext=activity)

```md
![](https://leetcard.jacoblin.cool/lapor?ext=contest)
```

[![](https://leetcard.jacoblin.cool/lapor?ext=contest)](https://leetcard.jacoblin.cool/lapor?ext=contest)

#### `cache` (default: `60`)

Cache time in seconds.
Expand Down Expand Up @@ -263,11 +271,15 @@ Some examples:

### Extensions

Now there is only a notable extension: `activity`.
Extension, it is a comma-separated list of extension names.

Now there is only two notable extension: `activity` and `contest`.

NOTICE: You can only use one of `activity` and `contest` at a time now, maybe they can be used together in the future.

> But actually animation, font, theme, and external stylesheet are all implemented by extensions and enabled by default.

Want to contribute a `contest` or `nyan-cat` extension? PR is welcome!
Want to contribute a `nyan-cat` extension? PR is welcome!

#### `activity`

Expand All @@ -278,3 +290,13 @@ Show your recent submissions.
```

[![Leetcode Stats](https://leetcard.jacoblin.cool/JacobLinCool?ext=activity)](https://leetcard.jacoblin.cool/JacobLinCool?ext=activity)

#### `contest`

Show your contest rating history.

```md
![Leetcode Stats](https://leetcard.jacoblin.cool/lapor?ext=contest)
```

[![Leetcode Stats](https://leetcard.jacoblin.cool/lapor?ext=contest)](https://leetcard.jacoblin.cool/lapor?ext=contest)
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@
},
"dependencies": {
"itty-router": "2.6.1",
"leetcode-query": "0.2.1",
"leetcode-query": "0.2.2",
"nano-font": "0.3.1"
},
"devDependencies": {
Expand Down
8 changes: 4 additions & 4 deletions pnpm-lock.yaml
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions src/cloudflare-worker/demo/demo.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ <h1>LeetCode Stats Card</h1>
<select id="extension">
<option value="" selected>No Extension</option>
<option value="activity">Activity</option>
<option value="contest">Contest</option>
</select>
<div>
<button onclick="preview()">Preview</button>
Expand Down
3 changes: 3 additions & 0 deletions src/cloudflare-worker/sanitize.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import {
ActivityExtension,
AnimationExtension,
Config,
ContestExtension,
FontExtension,
RemoteStyleExtension,
ThemeExtension,
Expand Down Expand Up @@ -69,6 +70,8 @@ export function sanitize(config: Record<string, string>): Config {

if (config.ext === "activity" || config.extension === "activity") {
sanitized.extensions.push(ActivityExtension);
} else if (config.ext === "contest" || config.extension === "contest") {
sanitized.extensions.push(ContestExtension);
}

if (config.border) {
Expand Down
2 changes: 1 addition & 1 deletion src/core/exts/activity.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ export function ActivityExtension(generator: Generator): Extension {
style: { transform: `translate(0px, 200px)` },
children: [
new Item("line", {
attr: { x1: 10, y1: 0, x2: generator.config.width - 20, y2: 0 },
attr: { x1: 10, y1: 0, x2: generator.config.width - 10, y2: 0 },
style: { stroke: "var(--bg-1)", "stroke-width": 1 },
}),
new Item("text", {
Expand Down
214 changes: 214 additions & 0 deletions src/core/exts/contest.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,214 @@
import { ContestInfo, ContestRanking, LeetCode, UserContestInfo } from "leetcode-query";
import { Generator } from "../card";
import { Gradient } from "../elements";
import { Item } from "../item";
import { Extension } from "../types";

export function ContestExtension(generator: Generator): Extension {
const pre_result = new Promise<null | { ranking: ContestRanking; history: ContestInfo[] }>(
(resolve) => {
const lc = new LeetCode();
lc.once("receive-graphql", async (res) => {
try {
const { data } = (await res.json()) as { data: UserContestInfo };
const history = data.userContestRankingHistory.filter((x) => x.attended);

if (history.length === 0) {
resolve(null);
return;
}

resolve({ ranking: data.userContestRanking, history });
} catch (e) {
resolve(null);
}
});
lc.user_contest_info(generator.config.username).catch(() => resolve(null));
},
);

return async function Contest(generator, data, body, styles) {
const result = await pre_result;

if (result) {
if (generator.config.height < 400) {
generator.config.height = 400;
}

const start_time = result.history[0].contest.startTime;
const end_time = result.history[result.history.length - 1].contest.startTime;
const [min_rating, max_rating] = result.history.reduce(
([min, max], { rating }) => [Math.min(min, rating), Math.max(max, rating)],
[Infinity, -Infinity],
);

const width = generator.config.width - 90;
const height = 100;
const x_scale = width / (end_time - start_time);
const y_scale = height / (max_rating - min_rating);

const points = result.history.map((d) => {
const { rating } = d;
const time = d.contest.startTime;
const x = (time - start_time) * x_scale;
const y = (max_rating - rating) * y_scale;
return [x, y];
});

const extension = new Item("g", {
id: "ext-contest",
style: { transform: `translate(0px, 200px)` },
children: [
new Item("line", {
attr: { x1: 10, y1: 0, x2: generator.config.width - 10, y2: 0 },
style: { stroke: "var(--bg-1)", "stroke-width": 1 },
}),
new Item("text", {
content: "Contest Rating",
id: "ext-contest-rating-title",
style: {
transform: `translate(20px, 20px)`,
fill: "var(--text-1)",
"font-size": "0.8rem",
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
}),
new Item("text", {
content: result.ranking.rating.toFixed(0),
id: "ext-contest-rating",
style: {
transform: `translate(20px, 50px)`,
fill: "var(--text-0)",
"font-size": "2rem",
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
}),
new Item("text", {
content: "Highest Rating",
id: "ext-contest-highest-rating-title",
style: {
transform: `translate(160px, 20px)`,
fill: "var(--text-1)",
"font-size": "0.8rem",
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
}),
new Item("text", {
content: max_rating.toFixed(0),
id: "ext-contest-highest-rating",
style: {
transform: `translate(160px, 50px)`,
fill: "var(--text-0)",
"font-size": "2rem",
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
}),
new Item("text", {
content:
result.ranking.globalRanking + " / " + result.ranking.totalParticipants,
id: "ext-contest-ranking",
style: {
transform: `translate(${generator.config.width - 20}px, 20px)`,
"text-anchor": "end",
fill: "var(--text-1)",
"font-size": "0.8rem",
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
}),
new Item("text", {
content: result.ranking.topPercentage.toFixed(2) + "%",
id: "ext-contest-percentage",
style: {
transform: `translate(${generator.config.width - 20}px, 50px)`,
"text-anchor": "end",
fill: "var(--text-0)",
"font-size": "2rem",
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
}),
],
});

for (let i = Math.ceil(min_rating / 100) * 100; i < max_rating; i += 100) {
const y = (max_rating - i) * y_scale;
const text = new Item("text", {
content: i.toFixed(0),
id: "ext-contest-rating-label-" + i,
style: {
transform: `translate(45px, ${y + 73.5}px)`,
"text-anchor": "end",
fill: "var(--text-2)",
"font-size": "0.7rem",
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
});
const line = new Item("line", {
attr: { x1: 0, y1: y, x2: width + 20, y2: y },
style: {
stroke: "var(--bg-1)",
"stroke-width": 1,
transform: `translate(50px, 70px)`,
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
});
extension.children?.push(text, line);
}

extension.children?.push(
new Item("polyline", {
id: "ext-contest-polyline",
attr: {
points: points.map(([x, y]) => `${x},${y}`).join(" "),
},
style: {
transform: `translate(60px, 70px)`,
stroke: "var(--color-0)",
"stroke-width": 2,
"stroke-linecap": "round",
"stroke-linejoin": "round",
fill: "none",
opacity: generator.config.animation !== false ? 0 : 1,
animation:
generator.config.animation !== false
? "fade_in 1 0.3s 1.7s forwards"
: "",
},
}),
);

body["ext-contest"] = () => extension;
}
};
}
2 changes: 2 additions & 0 deletions src/core/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ import { MemoryCache } from "./cache";
import { Generator } from "./card";
import { ActivityExtension } from "./exts/activity";
import { AnimationExtension } from "./exts/animation";
import { ContestExtension } from "./exts/contest";
import { FontExtension } from "./exts/font";
import { RemoteStyleExtension } from "./exts/remote-style";
import { ThemeExtension } from "./exts/theme";
Expand Down Expand Up @@ -40,6 +41,7 @@ export {
Config,
ActivityExtension,
AnimationExtension,
ContestExtension,
FontExtension,
ThemeExtension,
RemoteStyleExtension,
Expand Down