An online manga reader created for use in manga and anime pages. Using jQuery can load faster the required images for a better reading and reducing bandwidth. The UI uses Bootstrap 3's theme as base.
Normally a reader is a server-side page that loads the manga's page as an image. Hovewer, to change the image, it sends a request to the same page with the required image id, recreating (and reloading) everything just to change an image, consuming unnecesary bandwidth and server resources. This reader only changes the image url in the dom, maintaining the rest of page intact.
-
Put the files in any path in your directory.
-
Create a js file named
url.js
in the same level tomanga_reader.html
. -
In
url.js
you must add two global variables:coreUrl
andbackUrl
:- The first contains the url that returns a JSON with the information of the manga to load, following this structure:
{ "t_":"series_title", "ch_":"chapter_title, if no title you can use an generic title", "pages_":[ ... All urls to the pages (images) ... ], "n_":1 // number of pages, "exit_":"the url to back (generally to chapters list)", "host_":"Page's name", "hostIndex_":"Page's url" }
I recommend generate this in server-side.
- The second variable has the same value as
exit_
in JSON.
-
To load the manga, redirect to
manga_reader.html
adding two "get" parameters:manga
: the internal id of the book.serverParam
: The internal name id in the server.
Assuming you have a database, the url should look like this:
http://manga.com/read/manga_reader.html?manga=1&serverParam=manga_book
, this calls the url incoreUrl
and send the information in a GET request, like this:http://manga.com/core/book?manga_book=1
.
You can add custom styles or importing stylesheets using the file custom.css
.
In the future, I want to rebuild this project using new technologies (particularly using React) so this project will remain as a legacy version. But, by now, this is the current project.
- 06/05/2019 - Rewrite
buttonSwitch()
inswitches.js
. Added utility module. Some minor fixes. - 28/04/2019 - Fix english locale, change
locale.json
url. Fixed styles inskin.css
. - 25/04/2019 - First public version (beta).
- The project as is still unstable. Consider this a beta version until first release.
- Slots for ads unavailable (yet).
- Support only for two languages: English (default) and Spanish (Español). You can add new locales modifying the file
locale.json
in the "resources" folder. - Untested on Chrome, Edge/IE, Safari.
- Demo unavailable (yet).
MIT