-
-
Notifications
You must be signed in to change notification settings - Fork 3
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
1 changed file
with
50 additions
and
25 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,36 +1,61 @@ | ||
# Skribbl-Typo | ||
An extension for chromium-based and firefox which adds many extra features to skribbl.io. | ||
Stable versions are submitted to the [Chrome Store](https://chrome.google.com/webstore/detail/bpcilmjlpebjklinlbdjhfkkgmmfghfj). | ||
Get infos on the [Website](https://chrome.google.com/webstore/detail/bpcilmjlpebjklinlbdjhfkkgmmfghfj). | ||
|
||
Bugs or requests: @Discord tobeh#7437 | ||
[![part of Typo ecosystem](https://img.shields.io/badge/Typo%20ecosystem-Ithil-blue?style=flat&logo=data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAYAAADDPmHLAAACV0lEQVR4nO3dPUrDYByA8UQ8g15AI+gsOOnmrufoIBT0DAUFB+/R3bFTobOCwQvoJSouNcObhHyZ9n2eHwiirW3Th79J2iaJJEmSJEmSJIC06iGu1+vgz9M0Df9CY6t8PkP2fMrYDADOAOAMAM4A4OrWGl3bj0Pp8+wEgDMAuP2uD//w7I6+DEf19fbc6eadAHAGAGcAcAYAZwBwnbcCTrIj+jL8Fx/55yA34wSAMwA4A4AzADgDgDMAOAOAMwC4zjuCzi+uN9+fZgeNrvuefw+69FfL10H/fgycAHAGAGcAcAYAZwBwnbcCioZeq2+quIVS5NbBHycAnAHARffRsOksr71Ml38Bi/mk9XVH5EfDFGYAcHVbAWWjw08NbyePEaRmDADOAOAMAM4A4Fq9FjCd5cG1zaeHrPeleXnzsvl+MZ802vooe4fSatn9ftUILp/iYxlCm51UTgA4A4Dr9eXgsv3wtJdfhx71fXICwBkAXGUAv+cLCH0pHk4AOAOAMwA4A4AzALhedwRpXBVneSu9X04AOAOAMwA4A4AzADgDgDMAOAOAMwA4A4AzADgDgDMAOAOAMwA4A4AzALio3xG0bUcu3UZOADgDgDMAOAOAMwC4qLcCRjxG0M5wAsAZAJwBwBkAnAHAGQCcAcAZAJwBwBkAnAHA+Y4gOCcAnAHAGQCcAcAZAFyrrYDH++NGl7+6ZZ0yZpc4AeAMAC66HUFDnLwyZk4AOAOAKz+QfMXx58dScdz7se5o8A7t0HJzAtAZAJwBwBkAnAFIkiRJkiRJUtySJPkBweNXgRaWkYQAAAAASUVORK5CYII=)](https://github.com/topics/skribbl-typo) | ||
|
||
Skribbl Typo is an extension for various browsers which adds many extra features to skribbl.io. | ||
Details about features & functionality can be found on the [Website](https://chrome.google.com/webstore/detail/bpcilmjlpebjklinlbdjhfkkgmmfghfj). | ||
|
||
## 🌍 Browser availability | ||
Typo is available for all major browsers in one or another way. | ||
- For chrome and all chromium based browsers, you can get it from the chrome store or use the zip in the releases section. | ||
- For firefox, use the "add typo" link on the website or use the signed xpi file from the releases section. | ||
- For all other browsers (including safari on iOS and iPadOS), you can use the userscript in the repo root with a userscript manager of your choice. | ||
|
||
## 🔀 Contribution & Code Quality | ||
> First a disclaimer: This extension emerged from a pretty bad codebase (which i am responsible for), and although it had some minor refactors the architecture and code quality is not that great. | ||
**Contributions are welcome!** | ||
Just fork the repo and create a pull request into develop when you're done. | ||
Finished & tested versions will be merged from develop to master. | ||
|
||
However, if you want to contribute or have some feedback, it is a good idea to message me fist on discord @tobeh. | ||
|
||
If you want to report some bugs, feel free to open an issue. | ||
|
||
## 🧩 Structure | ||
To get an idea what code is run at which point, have a brief look at the manifest. | ||
|
||
## Structure | ||
**patcher.js** modifies DOM during load, eg replacing the game JS or adding instantly visible elements. | ||
**content.js** loads all features procedurally. | ||
**content.js** initiates all features procedurally. | ||
Features are located in the **features** directory and are objects, each object has an init function to initialize the feature. | ||
|
||
**color.js** simplifies color conversions, **commands.js** toggles features based on commands from the popup. | ||
**errors.js** provides a way to log js errors and send them via a Discord webhook. | ||
**gamePatch.js** is the patched game.js from skribbl. | ||
|
||
## 🎚️ Patching the game.js | ||
Since typo is using advanced features to modify the behavior of skribbl, the original client-code of skribbl is being patched. | ||
Typo utilizes the tool [patchEx](https://github.com/toobeeh/patchEx) written for specifically this issue. | ||
|
||
Instead of manually patching the source code, it allows adding rules and inserting code & templates automatically. | ||
The patch configuration can be found in `patch.json` in the repo root. Whenever a new skribbl version is published, it is necessary to update the patched game.js. | ||
It may be needed to adjust the patch config since the client-code is minified. | ||
|
||
## 🧿 Involved repos | ||
To view all involved repos, click the badge at the top of the readme. | ||
Similar as with this repo, the codebase grew from an absolute beginner-level and is being refactored step by step. | ||
Here is an overview of new & legacy repositories which are in use to some extent. | ||
|
||
### Frontend | ||
- *typo.rip* is the currently active website and user dashboard written in vanilla JS as SPA. | ||
- *Tirith (frontend)* is an angular application which aims to replace the current website and feature an admin dashboard (which is already in use). | ||
|
||
### Backend / API | ||
- *Orthanc* is a collection of PHP scripts which provides API-ish access to some data like available sprites, themes and scraped emojis. | ||
- *Tirith (backend)* is a NEST application which aims to replace Orthanc in the near future. Used also by the Tirith frontend. | ||
- *typo-agent-scraper* is a microservice to provide image sources for the image agent. | ||
- *Palantir* is a discord bot that integrates skribbltypo to discord and lets user manage their account in a social and interactive way. | ||
|
||
## Involved repos | ||
##### typo.rip | ||
* Website for all the stuff together | ||
|
||
##### Palantir | ||
* Gets skribbl lobby data from typo | ||
* Shows these in Discord | ||
* Manages bubbles, drops, sprites and events to be shown on skribbl | ||
|
||
##### Ithil | ||
* A socket.io server | ||
* Establishes a real-time connection between the palantir server & typo client | ||
* Used for authentification, lobby data loading, drop cathing, sprites etc | ||
* Some features of the original Orthanc API are still not implemented | ||
|
||
##### Orthanc (private repo, OUTDATED) | ||
* PHP webdirectory which provides an interface between the database and web-access | ||
* Secure authorization via login token | ||
* Json based | ||
### Deployment | ||
- *typo-compose* is a git repository which features a setup of various docker-composes to establish an easy-to-deploy ecosystem. This is currently used on the vps where all containers are hosted. | ||
- *typo-static-files* is a repository which serves as collection of all static assets (sprites, drops, awards, scenes). |