CarmiCoven/BookBar
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Actual Initial Upload...

Browse Source 
Simple bare-bones book progress bar with a test animation running.

Changes:
- Migrated to a new repo because the whole project was in the wrong local directory.. oops
- Removed remaining unrelated timer files and code.

TODO:
- Remove IMGUR hotlink
- Update book art
- Proper input value testing
- Get websocket connected and tested
This commit is contained in:
RolimirKal
2026-07-28 05:13:12 -04:00
parent 36332867e6
commit b656d02547
8 changed files with 10 additions and 287 deletions
Download Patch File Download Diff File Expand all files Collapse all files
timer.css → BookBar.css
View File
timer.js → BookBar.js
View File
README.md
+1 -1
View File
@@ -1,2 +1,2 @@
# PPPPBar
# BookBar
Partner Plus Push Progress Bar
bar.html
-25
View File
@@ -1,25 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&family=Cutive+Mono&display=swap" rel="stylesheet">
<link rel="stylesheet" href="timer.css" />
<script src="timer.js"></script>
<title>Lilac BookBar</title>
</head>
<body>
<main>
<div class='widgetContainer'>
<div id='progressBar' class="layoutContainer">
<div id='barBack' class='barFlashHelper'></div>
<div id='barFront' class='barFlashHelper'>
<div id='paperOverlay'>
</div>
</div>
</div>
</div>
</main>
</body>
</html>
index.html
+9 -117
View File
@@ -4,128 +4,20 @@
<meta charset="utf-8" />
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Silkscreen:wght@400;700&family=VT323&display=swap" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Inter' rel='stylesheet'>
<link rel="stylesheet" href="timer.css" />
<script src="timer.js"></script>
<title>Lilac Timer</title>
<link href="https://fonts.googleapis.com/css2?family=Courier+Prime:ital,wght@0,400;0,700;1,400;1,700&family=Cutive+Mono&display=swap" rel="stylesheet">
<link rel="stylesheet" href="BookBar.css" />
<script src="BookBar.js"></script>
<title>Lilac BookBar</title>
</head>
<body>
<main>
<div class='contentContainer'>
<img class='mainHeart' src='src/youvegotmail.webp'>
<div class='infoWrap'>
<div class='infoGroup'>
<div class='infoBox' id='InfoBox3'>
<p id='TopUsers'>
Leaderboard:
</p>
<div class='rightFadeWrap' id='RightFadeWrapInfoBox3'>
<div class='giftUserWrap' id='GiftUserWrap'>
<div class='giftUserRow' id='GiftUserRow1'>
<p class='giftUserNum' id='GiftUserNum1'>
1
</p>
<div class='scrollWrap' id='ScrollWrapName1'>
<div class='scrollWrapW' id='ScrollWrapNameW1'>
<p class='giftUserName'id='GiftUserName1'>
Usernamethatisverylong
</p>
<p class='giftUserNameDupe'id='GiftUserNameDupe1'>
Usernamethatisverylong
</p>
<div class='widgetContainer'>
<div id='progressBar' class="layoutContainer">
<div id='barBack' class='barFlashHelper'></div>
<div id='barFront' class='barFlashHelper'>
<div id='paperOverlay'>
</div>
</div>
<p class='giftUserScore' id='GiftUserScore1'>
0000
</p>
</div>
<div class='giftUserRow' id='GiftUserRow2'>
<p class='giftUserNum' id='GiftUserNum2'>
2
</p>
<div class='scrollWrap' id='ScrollWrapName2'>
<div class='scrollWrapW' id='ScrollWrapNameW2'>
<p class='giftUserName'id='GiftUserName2'>
Usernamethatisverylong
</p>
<p class='giftUserNameDupe'id='GiftUserNameDupe2'>
Usernamethatisverylong
</p>
</div>
</div>
<p class='giftUserScore' id='GiftUserScore2'>
25
</p>
</div>
<div class='giftUserRow' id='GiftUserRow3'>
<p class='giftUserNum' id='GiftUserNum3'>
3
</p>
<div class='scrollWrap' id='ScrollWrapName3'>
<div class='scrollWrapW' id='ScrollWrapNameW3'>
<p class='giftUserName'id='GiftUserName3'>
Usernamethatisverylong
</p>
<p class='giftUserNameDupe'id='GiftUserNameDupe3'>
Usernamethatisverylong
</p>
</div>
</div>
<p class='giftUserScore' id='GiftUserScore3'>
1
</p>
</div>
</div>
</div>
</div>
<img class='mainHeart' id='SecondHeart' src='src/youvegotmail.webp'>
<div class='infoBox' id='InfoBox1'>
<h1 id='Timer'>
00:00
</h1>
<p id='TimerInfo'>
!subathon for details
</p>
</div>
<div class='infoBox' id='InfoBox2'>
<p id='GoalLabel'>
Next Goal:
</p>
<div class='rightFadeWrap' id='RightFadeWrapInfoBox2'>
<div class='scrollWrap' id='ScrollWrapGoal'>
<div class='scrollWrapW' id='ScrollWrapGoalW'>
<p id='GoalName'>
Discord Watch Party + Puzzles
</p>
<p id='GoalNameDupe'>
Discord Watch Party + Puzzles
</p>
</div>
</div>
</div>
<div id='GoalProgressWrap'>
<div id='GoalProgressBar'>
<p id='GoalProgressTransparent' style='color: transparent;'>
1234/5678
</p>
</div>
<p id='GoalProgress'>
1234/5678
</p>
</div>
</div>
</div>
</div>
</div>
</main>
sample-payload.json
-144
View File
@@ -1,144 +0,0 @@
{
"type": "DO",
"method": "setTimer",
"args": {
"name": "Subathon",
"end_at": "2025-10-30T19:34:05.867637+00:00",
"is_running": false,
"score_table": {
"bit_score": 0.1,
"t1_score": 5.0,
"t2_score": 10.0,
"t3_score": 20.0,
"score_time": 10
},
"total_contribution": 120.0,
"total_subpoints": 24,
"total_bits": 0,
"goals_met": 4,
"goals_total": 16,
"last_goal": {
"required": 100.0,
"name": "reveal new sub and bit badges"
},
"next_goal": {
"required": 150.0,
"name": "discord watch party + puzzles"
},
"goals": [
{
"required": 25.0,
"name": "merch reveal! (drops on nov 6 anniversary)"
},
{
"required": 50.0,
"name": "chat picks my pfp for a week"
},
{
"required": 75.0,
"name": "make subathon magma board"
},
{
"required": 100.0,
"name": "reveal new sub and bit badges"
},
{
"required": 150.0,
"name": "discord watch party + puzzles"
},
{
"required": 200.0,
"name": "new emotes reveal (static)"
},
{
"required": 300.0,
"name": "karaoke time"
},
{
"required": 400.0,
"name": "voicemod on for an hour"
},
{
"required": 500.0,
"name": "new emotes reveal (animated)"
},
{
"required": 750.0,
"name": "chat picks a skeb to get"
},
{
"required": 1000.0,
"name": "chat picks new emote i will draw"
},
{
"required": 1250.0,
"name": "play peak with mods"
},
{
"required": 1500.0,
"name": "read voicelines/copypastas/memes that chat picks"
},
{
"required": 1750.0,
"name": "add bald merch to merch drop"
},
{
"required": 2000.0,
"name": "play horror game on stream (chat picks)"
},
{
"required": 3000.0,
"name": "upload a song cover to youtube"
}
],
"last_contribution": {
"user_name": null,
"user_id": null,
"amount": 25.0,
"seconds_added": 250,
"timestamp": "2025-10-30T22:43:53.786952+10:00"
},
"leaderboard": [
{
"user_name": "Unknown",
"user_id": 4,
"amount": 25.0
},
{
"user_name": "Maza1862",
"user_id": 5,
"amount": 25.0
},
{
"user_name": "Unknown",
"user_id": 6,
"amount": 25.0
},
{
"user_name": "lalzan",
"user_id": 9,
"amount": 25.0
},
{
"user_name": "DesmondGTX1",
"user_id": 10,
"amount": 5.0
},
{
"user_name": "SokuReload2",
"user_id": 11,
"amount": 5.0
},
{
"user_name": "Unknown",
"user_id": 12,
"amount": 5.0
},
{
"user_name": "Sum1wiserthanu",
"user_id": 13,
"amount": 5.0
}
]
}
}
src/Paper_v5.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 757 KiB

src/Paper_v6.png
BIN
View File
Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 782 KiB