Giter Club home page Giter Club logo

comic_selectors's Introduction

What is this?

This is the backend selector handling for the PageFlip comic reader app on Android: https://play.google.com/store/apps/details?id=com.printandpixel.pageflip2&hl=en_US

The app uses css selectors to read and pull out comics and navigation links directly from the comic sites to provide them to the user in a mobile friendly universal format with browsing history, bookmarks and accessibility features

Adding comics

Supported sites use the following format:

{
  "url":"http://nedroid.com/",
  "title":"Nedroid",
  "imageUrl":"http://nedroid.com/comics/2009-02-12-beartato-cheerupface.jpg",
  "imageSelector":"div#comic > img",
  "imageIndex":"0",
  "firstSelector":".nav-first a",
  "firstIndex":"0",
  "prevSelector":"div.nav-previous > a",
  "prevIndex":"0",
  "randomSelector":"http://nedroid.com/?randomcomic=1",
  "randomIndex":"-1",
  "nextSelector":"div.nav-next > a",
  "nextIndex":"0",
  "lastSelector":".nav-last a",
  "lastIndex":"0",
  "donateUrl":"https://www.patreon.com/nedroid",
  "nsfw":true
},
  • url - url of the lastest comic for this site. This is where a new reader will start
  • title - plaintext title of the site. When searching in app, special characters like ',.|- will be ignored so don't worry about including them
  • imageUrl - featured image that will show up on the feed and to users browsing through list of comics
  • imageSelector - the css selector for getting the comic image
  • imageIndex - the index of the selected item you are using
  • firstSelector - the css selector for getting the first comic link
  • firstIndex - the index of the selected item you are using
  • prevSelector - the css selector for getting the previous comic link
  • prevIndex - the index of the selected item you are using
  • randomSelector - the css selector for getting the random comic link
  • randomIndex - the index of the selected item you are using
  • nextSelector - the css selector for getting the next comic link
  • nextIndex - the index of the selected item you are using
  • lastSelector - the css selector for getting the last comic link
  • lastIndex - the index of the selected item you are using
  • donateUrl - the donation page for the comic author if applicable. Patreon, paypal etc. Support the content
  • nsfw - (true/false) whether or not the comic contains nsfw content on ANY of its pages. Default is false.

Notes:

  • If you want to supply a direct link to the address use index "-1".
  • If a comic doesn't have one of the navigation options e.g. a random button, just leave out the two relevant entries; in this case "randomSelector" and "randomIndex"
  • Documentation about how to write the selectors can be found here https://jsoup.org/apidocs/org/jsoup/select/Selector.html

Testing your work

If you want to see how your added code will work:

  1. go to https://try.jsoup.org/
  2. copy paste the page source code for the comic into the input HTML section
  3. type in your CSS Query at the bottom of the page e.g. "div#comic > img"
  4. you will see an ordered list of results appear below. If you don't see any results, then your selector is invalid or could not find anything on this page.
  5. The number on the left of the result correponds to the index. Use this for the various index entries in the code above e.g "nextIndex". Most of the time you'll find you'll only need to use 0.
  6. Test that your version of the file is proper JSON. You can copy paste the whole content into a website like this to test (you'll see an error message if there's a syntax problem) http://json.parser.online.fr/

Need help?

If you have questions on how to do this, or have questions/suggestions about the app in general, feel free to open an issue on this project :)

comic_selectors's People

Contributors

actions-user avatar alemonwitheverythingtoprove avatar alijc avatar amicitas avatar blazsuhadolnik avatar comedytomedy avatar dj73 avatar dtrain avatar dustinluck avatar gatesl avatar joonaskoo avatar jvruyu avatar kc2cbd avatar kintukp avatar lggregory avatar logical-sh avatar lostinthenewreal avatar madebr avatar narcwis avatar nycmets avatar oseparovic avatar robot2015 avatar rohitr97 avatar shillen-commits avatar sm0xe avatar soulmerge avatar swapnilsarwe avatar tajnymag avatar trallen avatar zc2com avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

comic_selectors's Issues

PVP Online isn't working

I've tried to refresh and move around comics multiple times but nothing is loading for PVP Online.

Missing Preview Images

The following comics that I follow are missing the preview images:

Adam@Home
Andy Capp
B.C.
Betty
Calvin & Hobbes
Dilbert
Foxtrot
Herman
Peanuts
Pearls Before Swine
Pickles
Shoe
The Duplex
Ziggy

Blondie & Bloom Countie lead nowhere

This issue has been reported on Google Play Store on Jan 05, 2019.

It seems to be working as expected to me on PageFlip App - can someone confirm and close this issue?

And if anyone knows the owner - please comment on it for more details.

PageFlip App - allow custom .json file?

It'd be nice to be able to have (local on android filesystem, or remote on a server) a personal custom JSON file for adding additional comics. The format would be the same as supported_sites.json, and ideally the user-json file should overshadow the builtin one (to allow the 2nd use case below).

Use case: I find a new comic that isn't on the app, and can start reading it without needing the lengthy process of @oseparovic updating PageFlip
Use Case 2: updating broken selectors in existing comics, in case a website update makes a comic temporarily unusable.

In both cases, users should be encouraged to also report issues here on github.

โ™ฅ

Image not found

Comics are not loading, including For Better Or For Worse, Garfield and Peanuts.

Fixed VG Cats, Maximumble. New Swords, Ozy and Millie

Hi, 4 issues here.

VG Cats changed its file names and stopped working. My fix:

{
"url": "http://www.vgcats.com/comics/",
"title": "VG Cats",
"imageUrl": "https://www.vgcats.com/comics/images/170403.jpg",
"imageSelector": "img[width=692]",
"imageIndex": "0",
"firstSelector": "a:has([src='first.png'])",
"firstIndex": "0",
"prevSelector": "a:has([src='back.png'])",
"prevIndex": "0",
"nextSelector": "a:has([src='next.png'])",
"nextIndex": "0",
"lastSelector": "http://www.vgcats.com/comics/?",
"lastIndex": "-1",
"donateUrl":"https://www.patreon.com/VGCats",
"nsfw":false
},

Maximumble changed DOM. My fix:

{
"url": "http://maximumble.thebookofbiff.com/",
"title": "Maximumble",
"imageUrl": "http://maximumble.thebookofbiff.com/comics/2016-10-18-1427.png",
"imageSelector": "#comic > a > img",

//OR
//"imageSelector": "#comic > img",

"imageIndex": "0",
"firstSelector": "#comic-nav-wrapper > tbody > tr > td:nth-child(1) > a",
"firstIndex": "0",
"prevSelector": "#comic-nav-wrapper > tbody > tr > td:nth-child(2) > a",
"prevIndex": "0",
"randomSelector": "#comic-nav-wrapper > tbody > tr > td:nth-child(4) > a",
"randomIndex": "0",
"nextSelector": "#comic-nav-wrapper > tbody > tr > td:nth-child(5) > a",
"nextIndex": "0",
"lastSelector": "#comic-nav-wrapper > tbody > tr > td:nth-child(6) > a",
"lastIndex": "0",
"donateUrl":"https://www.patreon.com/chrishallbeck",
"nsfw":false
},

Important! The last comic's image is not a link, so its selector is "#comic > img" instead of "#comic > a > img". I don't know if maybe "#comic" would suffice.

Swords is not supported. My selectors:

{
"url":"https://swordscomic.com/comic/",
"title":"Swords",
"imageUrl":"https://swordscomic.com/media/cover_13o10so.png",
"imageSelector":"#comic-image",
"imageIndex":"0",
"firstSelector":"#navigation-first",
"firstIndex":"0",
"prevSelector":"#navigation-previous",
"prevIndex":"0",
"randomSelector":"#navigation-archive",
"randomIndex":"0",
"nextSelector":"#navigation-next",
"nextIndex":"0",
"lastSelector":"#navigation-last",
"lastIndex":"0",
"donateUrl":"https://www.patreon.com/swordscomic",
"nsfw":false
},

Ozy and Millie is not supported. My selectors:

{
"url":"https://ozyandmillie.org/comic/",
"title":"Ozy and Millie",
"imageUrl":"https://ozyandmillie.org/wp-content/uploads/2011/09/ozyandmillieteal.jpg",
"imageSelector":"#comic > a > img",
"imageIndex":"0",
"firstSelector":"#comic-nav-wrapper > tbody > tr > td:nth-child(1) > a",
"firstIndex":"0",
"prevSelector":"#comic-nav-wrapper > tbody > tr > td:nth-child(2) > a",
"prevIndex":"0",
"randomSelector":"#comic-nav-wrapper > tbody > tr > td:nth-child(4) > a",
"randomIndex":"0",
"nextSelector":"#comic-nav-wrapper > tbody > tr > td:nth-child(5) > a",
"nextIndex":"0",
"lastSelector":"#comic-nav-wrapper > tbody > tr > td:nth-child(6) > a",
"lastIndex":"0",
"donateUrl":"https://ozyandmillie.org/original-artwork-information/",
"nsfw":false
}

Comic 'Blindsprings' not working

The issue reported on 11th December on [https://play.google.com/store/apps/details?id=com.printandpixel.pageflip2&hl=en&showAllReviews=true] (Google Play Store)

I did notice that Blindsprings doesn't work (the app can only fetch page 1).

Look into whether these comics still work

While trawling through JSON data, I found a few with outdated URLs. I haven't checked them in the app (and don't have time right now), but I suspect these 3 may be broken:

  • Menage a 3: is this still available?
  • The Property of Hate: seems to have been printed and taken offline?
  • Dresden Codak: may need updating, I think the website changed

Comic images with transparency render poorly in-app

I noticed that some Achewood pages use transparency instead of white for parts of the image. On the webpage, the background is white, so it doesn't make a difference -- but in the app, the background is a dark grey, and the image becomes illegible.

Ultimately it's the comic's "fault", but, it would be cool if pageflip accommodated.

Solutions could include:

  • Option to change color of the app's background
  • Putting a white image behind the comic display (assuming that most comics with this issue are using transparency as white)
  • Putting an image behind the comic display, with the color ripped from the individual comic's site (and/or the supported_sites config)

Example: http://achewood.com/index.php?date=10022002
Pageflip Screenshot: https://imgur.com/a/etuzhxN

Also, is pageflip itself open-source? Or just the comic data?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.