☰

Eza's Pixiv Fixiv

Loads Pixiv "manga" pages without having to scroll down and wait

目前为 2014-10-06 提交的版本。查看 最新版本。

  1. // ==UserScript==
  2. // @name        Eza's Pixiv Fixiv
  3. // @namespace   https://inkbunny.net/ezalias
  4. // @description Loads Pixiv "manga" pages without having to scroll down and wait
  5. // @include     http://www.pixiv.net/member_illust.php?mode=manga&illust_id=*
  6. // @version     1.4
  7. // ==/UserScript==
  8.  
  9.  
  10.  
  11. // On manga pages, load all images without having to manually scroll to each one. 
  12. // Pixiv is terribly designed. Maybe it's a cultural Japanese thing, where they still expect single-page click-and-wait browsing like it's still 1998. The site is just openly hostile to users' time and enjoyment. 
  13. // To wit, I recommend Eza's Image Glutton, which directs from the "medium" landing pages to either the full-size single image or the manga page. Tedium is for robots. 
  14.  
  15. // Ideally we'd trigger whatever mechanism tells the page to load each image. 
  16. //		Three problems with that: I'm an HTML/JS amateur, the coders didn't speak much English, and - crucially - we'd still be loading medium-size images.
  17. // So instead we're going to scrape the page for URLs, build our own no-bullshit HTML, and replace the entire Body of the page.
  18. // Pixiv's super-paranoid anti-hotlinking mechanisms will not trigger because it only sees one of its own pages requesting these images. We don't have to worry about 403s.
  19.  
  20. // mmmaybe replace the custom click-to-advance page with a thumbnail page that instead links to the full-size images? less scrolling through meh, less looking at full-size squick, but more clicking and ctrl+w'ing. 
  21.  
  22. // can I just 'touch' all the pages and force them to load within pixiv's own source? I mean, I'm essentially recreating their page now. 
  23. // I could also just regex document.body.innerHTML for big images. I think the 'small' mode scales them instead of loading some smaller file. 
  24. // <script>pixiv.context.images[1] = 'http://i2.pixiv.net/img108/img/ukaban/29548141_p1.jpg';pixiv.context.thumbnailImages[1] = 'http://i2.pixiv.net/img108/img/ukaban/mobile/29548141_128x128_p1.jpg';</script></div><div class="item-container"><script>pixiv.context.pages[1] = [2];</script><a href="/member_illust.php?mode=manga_big&amp;illust_id=29548141&amp;page=1" target="_blank" class="full-size-container ui-tooltip" data-tooltip="オリジナルサイズを表示"><i class="_icon sprites-full-size"></i></a><img src="http://source.pixiv.net/www/images/common/transparent.gif" class="image ui-scroll-view" data-filter="manga-image" data-src="http://i2.pixiv.net/img108/img/ukaban/29548141_p1.jpg" data-index="1">
  25.  
  26. // With 'data-filter="manga-image"' I could potentially loop through, grab every image without determining total page count, and then add _big to each one individually. 
  27. 	// Dunno if that's desirable. Looping introduces the potential for infinite loops, while here, we just look for two things. 
  28. 	// Are two-pages-at-once mangas still broken? If not, don't. 
  29.  
  30. // Images could be scaled to "height=100%", and apparently that means window height and not the original height of the image. JS is fuckin' weird. Leaning toward "no" for the sake of tall comics. Width=100% for super-large images sounds good, though. 
  31.  
  32.  
  33.  
  34.  
  35.  
  36.  
  37.  
  38.  
  39. var html_dump = document.getElementsByTagName('html')[0].innerHTML;		// read full page HTML as string - admittedly overkill, but it's kilobytes, so who really cares? (Could be a reference if it matters.) 
  40.  
  41. var new_html = "";
  42. var thumbnail_html = "";
  43.  
  44. 	// All images here use the same base URL, so grab that and we'll append p0, p1, p2, etc. later
  45. var image_url = html_dump.substring( html_dump.indexOf( 'data-filter="manga-image"' ) );		// skip to where the first page is defined
  46. image_url = image_url.substring( image_url.indexOf( "http:" ) );		// grab that image's URL
  47. image_url = image_url.substring( 0, image_url.indexOf( '"' ) ); 		// (doublequote inside singlequotes) 
  48. image_url = image_url.replace( '_p0', '_p' ); 		// remove page number so we can add our own later
  49. // e.g. http://i2.pixiv.net/img06/img/nekopuchi/33798018_p0.jpg
  50.  
  51. 	// Figure out how many pages there are, based on the page text
  52. var page_count = html_dump.substring( html_dump.indexOf( '<span class="total">' ) );		// skip to where the page declares itself a manga submission
  53. page_count = page_count.substring( page_count.indexOf( ">" )+1, page_count.indexOf( "</" ) );		// extract the latter number from where the page reads e.g. "2 / 2"
  54. page_count = parseInt( page_count );		// cast as integer 
  55.  
  56. 	// Build a simplified version of the manga page, using high-res images. Clicking an image jumps to the next one. (Keyboard controls not implemented.) 
  57. for( var page_number = 0; page_number < page_count; page_number++ ) {
  58. 	var page_url = image_url.replace( "_p", "_big_p" + page_number ); 		// We'll assume "big" pages exist for every image, then fix it if we're wrong. 
  59.  
  60. 		// Display thumbnails for an overview of this manga's contents (and easy links to each page) 
  61. 	thumbnail_html = thumbnail_html + "<a href='#" + page_number + "'>";		// link thumbnail to the relevant page anchor
  62. 	thumbnail_html = thumbnail_html + "<img src='" + page_url + "' height='100' width='auto' onerror='this.src = this.src.replace(\"_big_p\", \"_p\");'></a> ";
  63. 		// display thumbnail at fixed height - browser should maintain aspect ratio
  64. 		// onError function replaces "big" page with normal-size page, if "big" page turns out not to exist. 
  65.  
  66. 		// Display pages centered, each linked to the next, kind of like Pixiv does
  67. 	new_html = new_html + "<a id='" + page_number + "'>"; 		// Anchor for thumbnails and previous page to link to
  68. 	new_html = new_html + "<a href='#" + (1.0+page_number) + "'>"; 		// Link this image to the next image's anchor
  69. 	new_html = new_html + "<img src='" + page_url + "' onerror='this.src = this.src.replace(\"_big_p\", \"_p\");getElementById(\""+page_number+"link\").href=this.src;'></a></br>";
  70. 		// onError function replaces "big" page with normal, but also finds the image link by its ID and makes it link to the correct source image. Sorry this is a clusterfuck. 
  71. 	new_html = new_html + "<a id='" + page_number + "link' href='" + page_url + "'>Image link</a>"; 		// Link to the image, so it's easy to open a particular page in tabs
  72. 	new_html = new_html + "<br><br>"; 
  73. }
  74.  
  75. 	// Replace page with our custom HTML. 
  76. new_html = new_html + "<br><br><br><a id = '" + page_count + "'></a>";		// add one last anchor tag, so clicking the last image brings you to the end of the page 
  77. new_html = thumbnail_html + "<center><br><br><br>" + new_html;		// thumbnails first, then main images
  78. document.body.innerHTML = new_html;		// replace the HTML body with new_html, which should now contain a long list of <img>s that load in a sensible manner 
  79.  
  80.  
  81.  
  82.  
  83.  
  84.  
  85.  
  86.  
  87.  
  88.  
  89.  
  90.  
  91.  
  92.