aniskip / aniskip-extension Goto Github PK

View Code? Open in Web Editor NEW

65.0 2.0 10.0 174.02 MB

Web browser extension to skip anime openings and endings

License: MIT License

JavaScript 5.65% TypeScript 90.96% HTML 0.31% SCSS 3.08%

chrome-extension firefox-addon chrome firefox opera anime intro outro opening ending

aniskip-extension's Introduction

typescript-aniskip-extension

Web browser extension to skip anime openings and endings

Discord

We are now on Discord! Want to contribute, need help or just want to ask questions?

Join the Aniskip Discord.

Getting started

Building and running the extension

Prerequisites

You will need to have installed:

Node.js v16.0.0 or greater
Yarn v2.4.1 or greater

Running for development

Clone the repo

git clone https://github.com/lexesjan/typescript-aniskip-extension

Navigate into the cloned GitHub repository
```
cd typescript-aniskip-extension
```
Run the install and start script
```
yarn install
yarn start:dev:chrome
```

This will start a chromium browser with the built extension loaded. This script will reload the extension on file change. You can replace chrome with firefox to build for firefox.

Building for production

Clone the repo

git clone https://github.com/lexesjan/typescript-aniskip-extension

Navigate into the cloned GitHub repository
```
cd typescript-aniskip-extension
```
Run the install and start script
```
yarn install
yarn build:prod:chrome
```

This will build a zipped extension in the web-ext-artifacts folder. You can replace chrome with firefox to build for firefox.

aniskip-extension's People

Contributors

Stargazers

Watchers

Forkers

this-is-not-a-backup idonotknowwhoiam kunihir0 mulverinex sacstanxiang redtrillix antonydp sarudesu amacedop piskndar

aniskip-extension's Issues

Options page and functionality

Global:

Default skip setting
Add skip time indicator colour
Keybinds
Default op/ed length (90s)

Anime specific:

Add skip setting per anime

Make opening / ending skip time fetching more scalable

Currently each opening and ending is fetched with one API call for each opening and ending. This can be done using one.

Malsync API integration

https://api.malsync.moe/page/<Provider_Id>/<Provider_Anime_Id>

Provider Id

Aniwatch: Aniwatch
Gogoanime: Gogoanime
9anime: 9anime

Open settings options page on install

Fix time auto formatting to support hours

Currently it supports minutes and seconds only

Add keybinds for moving the current time forwards and backwards by one frame like on YouTube. The default keybinds are , and .. We can also add keybinds to manually skip an opening / ending (+-90s to the current time).

Add `zoro` page support

Website: https://zoro.to/
Player: Plyr, JW
Language: English

Vote menu timestamp bug

When the timestamp is close to 60 seconds, the toFixed function will cause 59 seconds to round up to 60 seconds

Implement submit UI

Complete the following:

Add skip type selector
Add integration with back end
Add start time / end time helper buttons
Add preview functionality / button
Add start time / end time user input error checking
Add start time / end time time formatting
Add skip times submit form close button

Refactor code to use Redux

"Redux is a predictable state container for JavaScript apps." Redux will be used to make the code cleaner and more readable, both state management wise, removes the nesting of props passing and can also reduce the need for our current (and somewhat unreliable) messaging system of the background script acting as a relay to pass messages between parts of the player-script.

Movie episode parsing bug

Some supported websites do not correctly set the episode number when parsing an anime movie

Submitting a skip time auto plays the video if it is paused

Repro steps:

Pause video
Submit skip time

Integration with backend

Local

Add notifications system

Notify user when:

An op/ed has been auto-skipped
An op/ed started during a manual skip

Add current skip time selection to seek bar

When creating a skip time, the current start and end time should appear in the seek bar of the video player.

Auto skip times will be skipped even if the video is paused

When using auto skip times and the video is paused, the skip time is skipped regardless.

Skip mechanism

Popup page

Add popup page

Move player script functions into player class

Currently the player script is handling all the player functions, we should move them into the player object

Vote menu timestamp bug

If the vote menu has a timestamp which is close to 0 and the offset is negative, the timestamp shows undefined behaviour

Add voting

Add ability to vote on a skip time

Vote menu times do not have offsets

Rename to Aniskip

Rename repo
Update package json

Skip Button

Allows users to manually skip if it is enabled

Support anime-relations

https://github.com/erengy/anime-relations

Add player url metadata

Add Crunchyroll episode offset

Crunchyroll does not use the seasonal episode number. This will not allow Crunchyroll users to retrieve opening and ending times from other providers

Fix crunchyroll mobile responsiveness

The extension does not inject the menus and buttons properly when watching on a phone

Add new skip types

More skip types should be supported such as recap, mixed opening, mixed ending. Currently we have opening and endings hard coded, we should allow any number of new types to be added with ease.

Add user README page

Why
With more features and (hopefully) more users, we best document the basic and advances feature, be sad if the feature that took 30 development hours are overlook and people kept asking for it right?

What to do
Create a README for

Basic Usage (Lurkers)
Key Rebinding
Basic Submission
Advance Submission (Power Contributors)

Be cool if there's a GIF, or before/after for each of the feature (if applicable).

Add suggested timestamps

This will add suggested timestamps from external timestamp sources such as https://github.com/jonbarrow/open-anime-timestamps/. These timestamps will be distinguished (such as different indicator colour) from the timestamps that the users submit and will be prioritized lower than the user submitted ones. The user should be able to submit these timestamps and edit them if there are slight inaccuracies.

ADD NEKO-SAMA.IO with pstream.net player

Hi, can you add neko-sama a very popular french streaming site with very big catalog
website: https://neko-sama.io/
player: https://pstream.net
language: French

THX !!

Use mutation observers to inject the submit button to crunchyroll

Add changelog notification

Add changelog notification whenever there's a new update. This can be placed on the bottom of the options page

Add netflix-style skip notice

Have the skip button animate into view when a skip region is currently playing so the user is reminded that its available, and if the user doesn't move their mouse (or moves it then stops) wait for a short-timer to animate it away.

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Rate-Limited

These updates are currently rate-limited. Click on a checkbox below to force their creation now.

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

Detected dependencies

github-actions

.github/workflows/ci.yml

actions/checkout v3

actions/checkout v3

.github/workflows/release.yml

actions/checkout v3

actions/upload-release-asset v1

actions/checkout v3

actions/upload-release-asset v1

npm

package.json

@babel/runtime ^7.23.2

@headlessui/react ^1.7.17

@redux-devtools/remote ^0.8.2

@reduxjs/toolkit ^1.9.7

entities ^4.5.0

glob-to-regexp ^0.4.1

ky ^0.33.3

lodash ^4.17.21

qs ^6.11.2

react ^18.2.0

react-color ^2.19.3

react-device-detect ^2.2.3

react-dom ^18.2.0

react-icons ^4.12.0

react-redux ^8.1.3

redux ^4.2.1

sprintf-js ^1.1.3

string-similarity ^4.0.4

tailwindcss ^3.3.5

type-fest ^4.8.3

uuid ^9.0.1

webextension-polyfill-ts ^0.26.0

@babel/core ^7.23.2

@babel/plugin-transform-runtime ^7.23.2

@babel/preset-env ^7.23.2

@babel/preset-react ^7.23.3

@babel/preset-typescript ^7.23.3

@mantiquillal/web-ext-plugin ^1.5.1

@redux-devtools/cli ^3.0.2

@types/chrome ^0.0.253

@types/glob-to-regexp ^0.4.4

@types/react ^18.2.17

@types/react-color ^3.0.10

@types/react-dom ^18.2.7

@types/sprintf-js ^1.1.4

@types/string-similarity ^4.0.2

@types/tailwindcss ^3.0.11

@types/uuid ^9.0.7

@types/webpack ^5.28.5

@typescript-eslint/eslint-plugin ^6.13.1

@typescript-eslint/parser ^6.13.1

autoprefixer ^10.4.16

babel-loader ^9.1.3

babel-plugin-lodash ^3.3.4

chrome-webstore-upload-cli ^2.2.2

clean-webpack-plugin ^4.0.0

concurrently ^8.2.2

copy-webpack-plugin ^11.0.0

cross-env ^7.0.3

css-loader ^6.8.1

css-minimizer-webpack-plugin ^5.0.1

eslint ^8.55.0

eslint-config-airbnb ^19.0.4

eslint-config-airbnb-typescript ^17.1.0

eslint-config-prettier ^9.1.0

eslint-import-resolver-node ^0.3.9

eslint-plugin-import ^2.29.0

eslint-plugin-jsx-a11y ^6.7.1

eslint-plugin-prettier ^4.2.1

eslint-plugin-react ^7.33.2

eslint-plugin-react-hooks ^4.6.0

fork-ts-checker-webpack-plugin ^9.0.2

html-webpack-plugin ^5.5.3

lodash-webpack-plugin ^0.11.6

mini-css-extract-plugin ^2.7.6

postcss ^8.4.32

postcss-import ^15.1.0

postcss-loader ^7.3.3

prettier ^2.8.8

rimraf ^5.0.5

sass ^1.69.5

sass-loader ^13.3.2

schema-utils ^4.2.0

style-loader ^3.3.3

to-string-loader ^1.2.0

typescript ^5.3.2

wait-on ^7.2.0

web-ext ^7.8.0

web-ext-submit ^7.8.0

webpack ^5.89.0

webpack-bundle-analyzer ^4.10.1

webpack-cli ^5.1.4

webpack-copy-plugin ^0.0.4

webpack-merge ^5.10.0

yarn 3.7.0

Check this box to trigger a request for Renovate to run again on this repository

[Suggestion] Create & post a Discord Server

It would be useful to have a discord server to discuss the extension on, because not everything falls into the realm of github issues.

Add extension packing

Automatically pack the extension for release for extension webstores

Add other sources for title search fallback

We currently use anilist to search for title synonyms. This has some edge cases such as "86 2nd Season" where it does not match any synonms. We should allow the user to manually input the show they would like to watch. We can also add other APIs (such as myanimelist) which has a search functionality.

Add more error checking for user input
Add more error checking on seek buttons